Make sure fonts are deterministic.

September Update.

.drone.yml

@@ -1,8 +0,0 @@
-kind: pipeline
-name: default
-
-steps:
-- name: build
-  image: golang
-  commands:
-  - make build

.gitignore

@@ -11,7 +11,11 @@ dist/
 # CDN link
 cdn/
 cdn
+cdn_/
+cdn_
 
 # Config Link
 cnf/
 cnf
+cnf_/
+cnf_

.idea/misc.xml

@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="SwUserDefinedSpecifications">
-    <option name="specTypeByUrl">
-      <map />
-    </option>
-  </component>
-</project>

.woodpecker/build.yml

@@ -0,0 +1,12 @@
+platform: linux/amd64
+
+pipeline:
+  format:
+    image: golang
+    commands:
+      - files=$(gofmt -l .) && echo "$files" && [ -z "$files" ]
+  build:
+    image: golang
+    commands:
+      - make build
+  

Makefile

@@ -1,6 +1,7 @@
 SHELL := /bin/bash
 PRODUCT_NAME := wappcityuni
 BIN := dist/${PRODUCT_NAME}
+DNAME := ${PRODUCT_NAME}_
 ENTRY_POINT := ./cmd/${PRODUCT_NAME}
 HASH := $(shell git rev-parse --short HEAD)
 COMMIT_DATE := $(shell git show -s --format=%ci ${HASH})
@@ -11,9 +12,10 @@ COMP_BIN := go
 
 ifeq ($(OS),Windows_NT)
 	BIN := $(BIN).exe
+	DNAME := $(DNAME).exe
 endif
 
-.PHONY: build dev test clean deploy
+.PHONY: build dev test clean deploy d
 
 build:
 	mkdir -p dist/
@@ -39,3 +41,12 @@ deploy: build
 	sudo cp *.css cdn
 	sudo cp *.js cdn
 	sudo systemctl start wappcityuni
+
+d: build
+	sudo systemctl stop wappcityuni_
+	sudo cp "${BIN}" "/usr/local/bin/${DNAME}"
+	sudo cp *.go.html cnf_
+	sudo cp *.go.yml cnf_
+	sudo cp *.css cdn_
+	sudo cp *.js cdn_
+	sudo systemctl start wappcityuni_

README.md

@@ -1,11 +1,13 @@
 # Captain ALM Cityuni subdomain WebServer
 
-[![Build Status](https://ci.mrmelon54.xyz/api/badges/alfred/cityuni-webserver/status.svg)](https://ci.mrmelon54.xyz/alfred/cityuni-webserver)
+[![Build Status](https://ci.mrmelon54.com/api/badges/alfred/cityuni-webserver/status.svg)](https://ci.mrmelon54.com/alfred/cityuni-webserver)
 
 This provides my template and cache supporting web / application server for my city university portfolio subdomain.
 
+[Production Server](https://cityuni.captainalm.com/)
+
 Maintainer: 
-[Captain ALM](https://code.mrmelon54.xyz/alfred)
+[Captain ALM](https://code.mrmelon54.com/alfred)
 
 License: 
-[BSD 3-Clause](https://code.mrmelon54.xyz/alfred/GOPackageHeaderServer/src/branch/master/LICENSE)
+[BSD 3-Clause](https://code.mrmelon54.com/alfred/cityuni-webserver/src/branch/master/LICENSE)

base.css

@@ -1,10 +1,24 @@
+/*
+This file is (C) Captain ALM
+Under the Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International License
+*/
 *{
     margin: 0;
     padding: 0;
     box-sizing: border-box;
+    font-family: "Times New Roman", Times, serif;
+}
+#st{
+    position: absolute;
+    left: -1080px;
+    top: -1080px;
+    font-size: 1em;
+    visibility: hidden;
+    white-space: nowrap;
 }
 main{
-	padding-top: 90px;
+    display: block;
+	padding-top: 70px;
 	padding-left: 6px;
 }
 .no-dec{
@@ -16,10 +30,12 @@ main{
 .centered{
     text-align: center;
 }
-.content > p{
+.content, .content > *{
     word-break: break-word;
     -ms-word-wrap: break-word;
     word-wrap: break-word;
+}
+.content > p, .content > h1, .content > h2, .content > h3, .content > h4, .content > h5, .content > h6{
     margin-top: 0.5em;
     margin-bottom: 0.5em;
 }
@@ -27,11 +43,14 @@ main{
     position: fixed;
     top: 0;
     width: 100%;
+    z-index: 100;
+    border-style: solid;
+    border-width: 0 0 2px;
 }
 .home-button, .sort-button{
     display: inline-block;
-    width: 64px;
+    width: 84px;
-    height: 82px;
+    height: 66px;
     overflow: hidden;
     text-align: center;
 }
@@ -40,7 +59,7 @@ main{
 }
 .home-button > div, .sort-button > div{
     display: inline;
-    font-size: 60px;
+    font-size: 48px;
     padding: 10px;
     vertical-align: middle;
 }
@@ -50,33 +69,86 @@ main{
     overflow: hidden;
 	max-height: 0;
 }
+.vnav{
+    max-height: none;
+    top: 0;
+    position: relative;
+    float: right;
+    width: auto;
+    height: 100%;
+    overflow: hidden;
+}
 .so-pane{
     display: none;
     overflow: hidden;
     position: fixed;
     max-height: 0;
 }
-.so-pane > *{
+.so-pane > form > div{
+    display: table-row;
+    background-color: transparent;
+    box-sizing: inherit;
+    max-width: 100%;
+    width: 100%;
+}
+.so-pane > form > div > div, .so-pane > form > div > span{
+    background-color: transparent;
+    box-sizing: inherit;
+    padding: 2px;
+    text-align: center;
+    vertical-align: middle;
+}
+.so-pane > form > div > div{
+    display: table-cell;
+    max-width: 50%;
+    width: 50%;
+}
+.so-pane > form > div > span{
+    display: block;
+    max-width: 100%;
+    width: 100%;
+}
+.so-pane-full{
+    display: table-caption !important;
+    caption-side: bottom;
+}
+.so-pane > form > div > * > *{
+    max-width: 100%;
+    width: 100%;
     vertical-align: middle;
     font-size: 16px;
+    -webkit-border-radius: 5px;
+    -moz-border-radius: 5px;
+    border-radius: 5px;
+}
+.so-pane > form > div > div > *{
     text-align: left;
-    padding: 2px;
 }
-.so-pane > label{
+.so-pane > form > div > div > label{
     background-color: transparent;
+    text-align: center;
 }
-.nav-menu, .sort-menu, .data-hold{
+.nav-menu, .sort-menu{
 	display: none;
 }
-.menu a{
+.menu a, .vmenu a{
     display: block;
-    padding: 32px 18px;
+}
+.menu a, .vmenu a, #st{
+    padding: 24px 16px;
+    font-weight: bold;
+}
+.vmenu li{
+    float: left;
+}
+.vmenu a:hover{
+    background-color: transparent;
 }
 .hmb{
     cursor: pointer;
     float: right;
 	background-color: transparent;
-    padding: 40px 20px;
+    padding: 32px 20px;
 }
 .hmb-line{
     display: block;
@@ -98,34 +170,63 @@ main{
 .hmb-line::after{
     top: -5px;
 }
-.nav-menu:checked ~ nav{
+.nav-menu:checked ~ #nav, .nav-open{
     max-height: 100%;
 }
-.nav-menu:checked ~ .hmb .hmb-line{
+.nav-menu:checked ~ .hmb .hmb-line, .nav-open-hmb .hmb-line{
     background: transparent;
 }
-.nav-menu:checked ~ .hmb .hmb-line::before{
+.nav-menu:checked ~ .hmb .hmb-line::before, .nav-open-hmb .hmb-line::before{
     transform: rotate(-45deg);
     top:0;
 }
-.nav-menu:checked ~ .hmb .hmb-line::after{
+.nav-menu:checked ~ .hmb .hmb-line::after, .nav-open-hmb .hmb-line::after{
     transform: rotate(45deg);
     top:0;
 }
-.sort-menu:checked ~ .so-pane{
+.sort-menu:checked ~ .so-pane, .so-pane-open{
     display: block;
+    z-index: 101;
     box-sizing: content-box;
     position: fixed;
-    top: 85px;
-    max-height: 100%;
-    width: auto;
-    height: auto;
-    padding: 4px;
     text-align: center;
+    top: 70px;
+    left: 20px;
+    max-height: 100%;
+    width: 230px;
+    height: auto;
+    -webkit-border-bottom-left-radius: 8px;
+    -webkit-border-bottom-right-radius: 8px;
+    -moz-border-radius-bottomleft: 8px;
+    -moz-border-radius-bottomright: 8px;
+    border-bottom-left-radius: 8px;
+    border-bottom-right-radius: 8px;
+    padding: 4px;
     border-style: solid;
-    border-width: 2px;
+    border-width: 0 2px 2px;
+    overflow: hidden;
 }
-.main-box{
+.sort-menu:checked ~ .so-pane > form, .so-pane-open > form{
+    display: table;
+    box-sizing: inherit;
+}
+.main-box > div, footer{
+    max-width: 100%;
+    margin: 3px 0;
+    padding: 2px;
+    box-sizing: content-box;
+}
+.item-table{
+    display: table;
+    box-sizing: content-box;
+    background-color: transparent;
+    -webkit-border-radius: 32px;
+    -moz-border-radius: 32px;
+    border-radius: 32px;
+    border-width: 1px;
+    border-style: solid;
+}
+.flex-col{
     display: -webkit-box;
     display: -moz-box;
     display: -ms-flexbox;
@@ -140,46 +241,17 @@ main{
     flex-direction: column;
     -webkit-align-content: center;
     align-content: center;
+    max-width: 100%;
     width: 100%;
-}
+    overflow: hidden;
-.main-box > div, footer > p{
-    margin: 3px 0;
-    padding: 2px;
-    box-sizing: content-box;
-}
-.item-table{
-    display: table;
-    width: 100%;
-    box-sizing: content-box;
-    background-color: transparent;
 }
 .item-table > div{
     display: table-row;
-    background-color: transparent;
     box-sizing: inherit;
-}
+    max-width: 100%;
-.item-table > div > div > div{
-    padding: 2px;
-}
-.item-table-caption{
-    display: table-caption !important;
-    caption-side: bottom;
-}
-.item-table-full, .item-table-360, .item-table-caption{
-    border-style: solid;
-    border-width: 1px;
-    background-color: transparent;
-    box-sizing: inherit;
-}
-.item-table-full{
-    display: table-cell;
-    vertical-align: top;
     width: 100%;
 }
-.item-table-360{
+.flex-row, .item-table > div{
-    display: none;
-}
-.image-box{
     display: -webkit-box;
     display: -moz-box;
     display: -ms-flexbox;
@@ -197,31 +269,65 @@ main{
     flex-wrap: wrap;
     -webkit-justify-content: center;
     justify-content: center;
+    max-width: 100%;
+    width: 100%;
+    overflow: hidden;
+}
+.item-table > div > div > div{
+    padding: 4px;
+}
+.item-table-caption, .so-pane-caption{
+    display: table-caption !important;
+    caption-side: bottom;
+}
+.item-table-full, .item-table-360, .item-table-caption, .so-pane-caption{
+    background-color: transparent;
+    box-sizing: inherit;
+}
+.item-table-full{
+    display: table-cell;
+    vertical-align: top;
+    width: 100%;
+}
+.item-table-360{
+    display: table-cell;
+    vertical-align: middle;
+    max-width: 360px;
+    width: 360px;
+    overflow: hidden;
+    text-align: center;
 }
 .image-box > a{
     border-style: solid;
     border-width: 1px;
 	margin: 2px;
 }
-@media (min-width: 560px){
+@media (min-width: 600px){
-    .main-box > div, footer > p{
+    .main-box > div{
-        margin: 5px;
+        padding: 12px;
     }
-    .item-table-360{
+    footer{
-        display: table-cell;
+        padding: 4px;
-        vertical-align: middle;
+    }
-        width: 360px;
+    .item-table > div{
-        overflow: hidden;
+        -ms-flex-wrap: nowrap;
+        -webkit-flex-wrap: nowrap;
+        flex-wrap: nowrap;
+    }
+    .item-table-full{
+        max-width: -webkit-calc(100% - 361px);
+        max-width: -moz-calc(100% - 361px);
+        max-width: calc(100% - 361px);
+        width: -webkit-calc(100% - 361px);
+        width: -moz-calc(100% - 361px);
+        width: calc(100% - 361px);
     }
 	.image-box > a{
         border-width: 4px;
 	    margin: 10px;
     }
-    .small-only-row{
-        display: none !important;
-    }
 }
-@media (min-width: 640px){
+@media (min-width: 680px){
     .nav{
         max-height: none;
         top: 0;
@@ -229,6 +335,9 @@ main{
         float: right;
         width: auto;
     }
+    .vnav{
+        display: none;
+    }
     .menu li{
         float: left;
     }
@@ -239,3 +348,11 @@ main{
         display: none;
     }
 }
+@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
+    .item-table-full, .item-table-360 {
+        display: block !important;
+    }
+    .item-table-caption{
+        display: block !important;
+    }
+}

conf/page.go

@@ -0,0 +1,19 @@
+package conf
+
+import "strings"
+
+type PageYaml struct {
+	PageName string `yaml:"pageName"`
+	PagePath string `yaml:"pagePath"`
+}
+
+func (py PageYaml) GetPagePath() string {
+	toReturn := py.PagePath
+	if !strings.HasSuffix(toReturn, ".go") {
+		toReturn += ".go"
+	}
+	if !strings.HasPrefix(toReturn, "/") {
+		toReturn = "/" + toReturn
+	}
+	return toReturn
+}

conf/serve.go

@@ -9,10 +9,13 @@ import (
 
 type ServeYaml struct {
 	DataStorage      string            `yaml:"dataStorage"`
+	TemplateStorage  string            `yaml:"templateStorage"`
 	Domains          []string          `yaml:"domains"`
 	RangeSupported   bool              `yaml:"rangeSupported"`
 	EnableGoInfoPage bool              `yaml:"enableGoInfoPage"`
 	CacheSettings    CacheSettingsYaml `yaml:"cacheSettings"`
+	PageSettings     []PageYaml        `yaml:"pageSettings"`
+	YmlDataFallback  bool              `yaml:"ymlDataFallback"`
 }
 
 func (sy ServeYaml) GetDomainString() string {
@@ -39,3 +42,20 @@ func (sy ServeYaml) GetDataStoragePath() string {
 		return sy.DataStorage
 	}
 }
+
+func (sy ServeYaml) GetTemplateStoragePath() string {
+	if sy.TemplateStorage == "" || !filepath.IsAbs(sy.TemplateStorage) {
+		wd, err := os.Getwd()
+		if err != nil {
+			return ""
+		} else {
+			if sy.TemplateStorage == "" {
+				return wd
+			} else {
+				return path.Join(wd, sy.TemplateStorage)
+			}
+		}
+	} else {
+		return sy.TemplateStorage
+	}
+}

config.example.yml

@@ -4,9 +4,13 @@ listen:
   webMethod: "http"
   identify: true
 serve:
+  dataStorage: ""
+  domains: []
   rangeSupported: true
   enableGoInfoPage: true
   cacheSettings:
+    enableTemplateCaching: false
+    enableTemplateCachePurge: false
     enableContentsCaching: true
     enableContentsCachePurge: true
     maxAge: 3600

dark.css

@@ -1,3 +1,7 @@
+/*
+This file is (C) Captain ALM
+Under the Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International License
+*/
 body{
 	color: #f9f9f9;
 	background-color: #050506;
@@ -6,13 +10,13 @@ body{
 a{
 	color: #b0b0f0;
 }
-.header, .nav, footer, .so-pane{
+.header, nav, footer, .so-pane{
 	background-color: #1d1d1e;
 }
-.home-button > div, .sort-button > div, .menu a, .so-pane > *{
+.home-button > div, .sort-button > div, .menu a, .vmenu a, .so-pane > form > div > * > *{
 	color: #e0e0e0;
 }
-.home-button:hover, .menu a:hover, .hmb:hover, .sort-button:hover, .sort-menu:checked ~ .sort-button, .so-pane > input, .so-pane > select{
+.home-button:hover, .menu a:hover, .vmenu a:hover, .hmb:hover, .sort-button:hover, .sort-menu:checked ~ .sort-button, .sort-button-active, .so-pane > form > div > span > input, .so-pane > form > div > div > select{
 	background-color: #606061;
 }
 .hmb-line, .hmb-line::before, .hmb-line::after{
@@ -23,14 +27,12 @@ a{
 }
 .item-table{
 	background-color: #3f3f3f;
-}
-.so-pane{
-	border-color: #3f3f3f;
-}
-.item-table > div > div, .item-table-caption{
 	border-color: #f5deb3;
 }
-.image-box{
+.so-pane, .header{
+	border-color: #6f6f6f;
+}
+.image-box, .item-heading{
 	background-color: #4f4f4f;
 }
 .image-box > a{

goinfo.go.html

@@ -67,6 +67,10 @@
     <tr>
         <th>Product Description</th>
         <td>{{ .ProductDescription }}</td>
+    </tr>
+	<tr>
+        <th>Product License</th>
+        <td>BSD 3-Clause License</td>
     </tr>
     <tr>
         <th>Product Location</th>
@@ -146,6 +150,10 @@
         <th>Memory Page Size</th>
         <td>{{ .PageSize }}</td>
     </tr>
+    <tr>
+        <th>System Time</th>
+        <td>{{ .CurrentTime }}</td>
+    </tr>
 </table>
 </p>
 <p>

index.go.html

@@ -4,37 +4,49 @@
     <meta charset="UTF-8"/>
     <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
     <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <meta name="description" content="Captain ALM's City University Portfolio">
+    <meta name="keywords" content="CaptainALM Captain_ALM Captain ALM portfolio Alfred Manville projects programming hacking cracking city uni cityuni cuol City University of London mycityuni">
     <title>City University Portfolio</title>
     <link rel="stylesheet" href="{{ .Data.CSSBaseURL }}"/>
     {{ if .Light }}
-    <link rel="stylesheet" href="{{ .Data.CSSLightURL }}"/>
+    <link id="style-theme" rel="stylesheet" href="{{ .Data.CSSLightURL }}"/>
     {{ else }}
-    <link rel="stylesheet" href="{{ .Data.CSSDarkURL }}"/>
+    <link id="style-theme" rel="stylesheet" href="{{ .Data.CSSDarkURL }}"/>
     {{ end }}
-    <script src="{{ .Data.JScriptURL }}"></script>
+    <script type="application/javascript">
+        var TheParameters = "{{ .Parameters }}"
+        var CssLightURL = "{{ .Data.CSSLightURL }}"
+        var CssDarkURL = "{{ .Data.CSSDarkURL }}"
+        var SunImageURL = "{{ .Data.SunImageLocation }}"
+        var MoonImageURL = "{{ .Data.MoonImageLocation }}"
+        var PlayImageURL = "{{ .Data.PlayVideoImageLocation }}"
+    </script>
+    <script type="application/javascript" src="{{ .Data.JScriptURL }}"></script>
 </head>
 <body>
 <header class="header">
     {{ if .Light }}
     <a href="?light" class="home-button no-dec" title="Home" id="logo"><div><img src="{{ .Data.LogoImageLocation }}" width="64px" alt="&#8962;"></div></a>
-    <a href="?{{ .Parameters }}" class="home-button no-dec" title="Switch to Dark Mode" id="theme"><div><img src="{{ .Data.MoonImageLocation }}" width="64px" alt='{{ "{" }}'></div></a>
+    <a href="?{{ .Parameters }}" class="home-button no-dec" title="Switch to Dark Mode" id="theme"><div><img id="theme-img" src="{{ .Data.MoonImageLocation }}" width="64px" alt='{{ "{" }}'></div></a>
     {{ else }}
     <a href="?" class="home-button no-dec" title="Home" id="logo"><div><img src="{{ .Data.LogoImageLocation }}" width="64px" alt="&#8962;"></div></a>
     {{ if eq .Parameters "" }}
-    <a href="?light" class="home-button no-dec" title="Switch to Light Mode" id="theme"><div><img src="{{ .Data.SunImageLocation }}" width="64px" alt='()'></div></a>
+    <a href="?light" class="home-button no-dec" title="Switch to Light Mode" id="theme"><div><img id="theme-img" src="{{ .Data.SunImageLocation }}" width="64px" alt='()'></div></a>
     {{ else }}
-    <a href="?light&{{ .Parameters }}" class="home-button no-dec" title="Switch to Light Mode" id="theme"><div><img src="{{ .Data.SunImageLocation }}" width="64px" alt='()'></div></a>
+    <a href="?light&{{ .Parameters }}" class="home-button no-dec" title="Switch to Light Mode" id="theme"><div><img id="theme-img" src="{{ .Data.SunImageLocation }}" width="64px" alt='()'></div></a>
     {{ end }}
     {{ end }}
     <input class="sort-menu" type="checkbox" id="sort-menu"/>
-    <label class="sort-button no-dec" for="sort-menu" title="Order and Sort Options"><div><img src="{{ .Data.SortImageLocation }}" width="64px" alt='&#8595;'></div></label>
+    <label class="sort-button no-dec" for="sort-menu" id="sort-menu-button" title="Order and Sort Options"><div><img src="{{ .Data.SortImageLocation }}" width="64px" alt='&#8595;'></div></label>
-    <form class="so-pane" action="?" method="get" id="so-form">
+    <div class="so-pane" id="so-pane">
+    <form action="?" method="get" id="so-form">
         {{ if .Light }}
         <input id="so-theme" type="hidden" name="light" />
         {{ end }}
+        <div>
         {{ $sort := 0 }}
-        <label class="no-dec" for="so-order">Order by:</label>
+            <div><label class="no-dec" for="so-order">Order by:</label></div>
-        <select name="order" id="so-order">
+            <div><select name="order" id="so-order">
             {{ if eq .OrderStartDate 0 }}
             <option value="start">Start Date</option>
             {{ else }}
@@ -59,9 +71,11 @@
             <option value="duration" selected>Duration</option>
             {{ $sort = .OrderDuration }}
             {{ end }}
-        </select>
+            </select></div>
-        <label class="no-dec" for="so-sort">Sort:</label>
+        </div>
-        <select name="sort" id="so-sort">
+        <div>
+            <div><label class="no-dec" for="so-sort">Sort:</label></div>
+            <div><select name="sort" id="so-sort">
             {{ if gt $sort 0 }}
             <option value="asc" selected>Ascending</option>
             {{ else }}
@@ -72,23 +86,31 @@
             {{ else }}
             <option value="desc">Descending</option>
             {{ end }}
-        </select>
+            </select></div>
-        <input id="so-submit" type="submit" value="Commit">
+        </div>
+        <div class="so-pane-full">
+        <span><input id="so-submit" type="submit" value="Commit"></span>
+        </div>
     </form>
+    </div>
     <input class="nav-menu" type="checkbox" id="nav-menu"/>
     <label class="hmb" for="nav-menu" title="Navigation Links"><span class="hmb-line"></span></label>
+    <nav class="vnav" id="vnav">
+        <ul class="vmenu no-lst-style" id="vmenu">
+        </ul>
+    </nav>
     <nav class="nav" id="nav">
-        <ul class="menu no-lst-style">
+        <ul class="menu no-lst-style" id="menu">
             {{ range .Data.GetHeaderLabels }}
-            <li><b><a href="{{ $.Data.GetHeaderLink . }}" class="no-dec" title="{{ . }}">{{ . }}</a></b></li>
+            <li><a href="{{ $.Data.GetHeaderLink . }}" class="no-dec" title="{{ . }}">{{ . }}</a></li>
             {{ end }}
         </ul>
     </nav>
 </header>
-<main class="main-box">
+<main class="main-box flex-col">
-    <div>
+    <div id="about">
-        <div class="item-table">
+        <div class="item-table flex-col">
-            <div>
+            <div class="item-heading">
                 <div class="item-table-full">
                     <div class="centered"><h1>{{ .Data.About.Title }}</h1></div>
                 </div>
@@ -96,11 +118,6 @@
                     <div class="centered"><h4>Email: <a href="mailto:{{ .Data.About.ContactEmail }}">{{ .Data.About.ContactEmail }}</a></h4></div>
                 </div>
             </div>
-            <div class="small-only-row">
-                <div class="item-table-full">
-                    <div class="centered"><h4>Email: <a href="mailto:{{ .Data.About.ContactEmail }}">{{ .Data.About.ContactEmail }}</a></h4></div>
-                </div>
-            </div>
             <div>
                 <div class="item-table-full">
                     <div class="content">{{ .Data.About.GetContent }}</div>
@@ -109,17 +126,17 @@
                     <div><a href="{{ .Data.About.ImageLocation }}"><img src="{{ .Data.About.ThumbnailLocation }}" alt="{{ .Data.About.ImageAltText }}" title="{{ .Data.About.ImageAltText }}" width="360px"></a></div>
                 </div>
             </div>
-            <div class="small-only-row">
-                <div class="item-table-full">
-                    <div class="centered"><a href="{{ .Data.About.ImageLocation }}"><img src="{{ .Data.About.ThumbnailLocation }}" alt="{{ .Data.About.ImageAltText }}" title="{{ .Data.About.ImageAltText }}" width="360px"></a></div>
-                </div>
-            </div>
         </div>
     </div>
+    {{ $c := 0 }}
     {{ range .GetEntries }}
-    <div>
+    {{ $c = $.CounterPlusPlus }}
-        <div class="item-table">
+    <div id="entry-{{ $c }}">
-            <div>
+        <script type="application/javascript">
+            CreateEntry({{ $c }}, "{{ .Name }}", "{{ .VideoLocation }}", "{{ .VideoContentType }}", "{{ .GetStartDateHTML }}", "{{ .GetEndDateHTML }}", {{ .GetInt64Duration }})
+        </script>
+        <div class="item-table flex-col">
+            <div class="item-heading">
                 <div class="item-table-full">
                     <div class="centered"><h1>{{ .Name }}</h1></div>
                 </div>
@@ -131,49 +148,37 @@
                     {{ end }}
                 </div>
             </div>
-            <div class="small-only-row">
-                <div class="item-table-full">
-                    {{ if eq .GetStartDate .GetEndDate }}
-                    <div class="centered"><h4>{{ .GetStartDate }}</h4></div>
-                    {{ else }}
-                    <div class="centered"><h4>{{ .GetStartDate }} - {{ .GetEndDate }}</h4></div>
-                    {{ end }}
-                </div>
-            </div>
             <div>
                 <div class="item-table-full">
                     <div class="content">{{ .GetContent }}</div>
                 </div>
                 <div class="item-table-360">
-                    <div>
+                    <div id="video-{{ $c }}">
                     {{ if eq .VideoLocation "" }}
-                        <img src="{{ $.Data.NoVideoImageLocation }}" alt="No Video" width="360px">
+                        <img src="{{ .GetVideoThumbnail $.Data.NoVideoImageLocation }}" alt="No Video" width="360px">
                     {{ else }}
-                        <video controls width="360px">
+                        {{ if .IsVideoLink }}
-                            <source src="{{ .VideoLocation }}" type="{{ .VideoContentType }}">
+                        <a href="{{ .VideoLocation }}">
-                            <a href="{{ .VideoLocation }}">The Video</a>
+                            <img src="{{ .GetVideoThumbnail $.Data.PlayVideoImageLocation }}" alt="Play Video" title="Play" width="360px">
-                        </video>
+                        </a>
-                    {{ end }}
-                    </div>
-                </div>
-            </div>
-            <div class="small-only-row">
-                <div class="item-table-full">
-                    <div class="centered">
-                        {{ if eq .VideoLocation "" }}
-                        <img src="{{ $.Data.NoVideoImageLocation }}" alt="No Video" width="360px">
                         {{ else }}
-                        <video controls width="360px">
+                        <script type="application/javascript">
-                            <source src="{{ .VideoLocation }}" type="{{ .VideoContentType }}">
+                            CreateVideoPlaceholder({{ $c }}, "{{ .GetVideoThumbnail $.Data.PlayVideoImageLocation }}")
-                            <a href="{{ .VideoLocation }}">The Video</a>
+                        </script>
-                        </video>
+                        <noscript>
+                            <video controls width="360px">
+                                <source src="{{ .VideoLocation }}" type="{{ .VideoContentType }}">
+                                <a href="{{ .VideoLocation }}">The Video</a>
+                            </video>
+                        </noscript>
                         {{ end }}
+                    {{ end }}
                     </div>
                 </div>
             </div>
             {{ if not (eq .GetImageCount 0) }}
             <div class="item-table-caption">
-                <div class="image-box">
+                <div class="image-box flex-row">
                     {{ range .GetImages }}
                     <a href="{{ .ImageLocation }}"><img src="{{ .ThumbnailLocation }}" alt="{{ .ImageAltText }}" title="{{ .ImageAltText }}" width="240px"></a>
                     {{ end }}
@@ -181,16 +186,21 @@
             </div>
             {{ end }}
         </div>
-        <div class="data-hold">{{ .GetInt64Duration }}</div>
-        <div class="data-hold">{{ .GetStartDateHTML }}</div>
-        <div class="data-hold">{{ .GetEndDateHTML }}</div>
     </div>
     {{ end }}
 </main>
+<script type="application/javascript">
+    SetupJS()
+</script>
 <footer>
     <p>
         Looking for the old static HTML page, here's the <a href="index.html">link</a>.
     </p>
+	<p>
+	    This page's content is licensed under Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International <a href="https://creativecommons.org/licenses/by-nc-nd/4.0/">
+        <img src="https://mirrors.creativecommons.org/presskit/buttons/80x15/png/by-nc-nd.png" alt="License" title="License" height="16"></a>.
+	</p>
 </footer>
+<div id="st"></div>
 </body>
 </html>

index.go.yml

@@ -1,33 +1,39 @@
 #This file is (C) Captain ALM
 #Under the Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International License
-cssBaseURL: "https://cityuni.captainalm.com/resources/assets/base.css"
+cssBaseURL: "resources/assets/base.css"
-cssDarkURL: "https://cityuni.captainalm.com/resources/assets/dark.css"
+cssDarkURL: "resources/assets/dark.css"
-cssLightURL: "https://cityuni.captainalm.com/resources/assets/light.css"
+cssLightURL: "resources/assets/light.css"
-jScriptURL: "https://cityuni.captainalm.com/resources/assets/index.js"
+jScriptURL: "resources/assets/index.js"
-noVideoImageLocation: "https://cityuni.captainalm.com/resources/assets/novideo.png"
+noVideoImageLocation: "resources/assets/novideo.png"
-logoImageLocation: "https://cityuni.captainalm.com/resources/assets/logo.png"
+playVideoImageLocation: "resources/assets/video.png"
-moonImageLocation: "https://cityuni.captainalm.com/resources/assets/moon.png"
+logoImageLocation: "resources/assets/logo.png"
-sunImageLocation: "https://cityuni.captainalm.com/resources/assets/sun.png"
+moonImageLocation: "resources/assets/moon.png"
-sortImageLocation: "https://cityuni.captainalm.com/resources/assets/sort.png"
+sunImageLocation: "resources/assets/sun.png"
+sortImageLocation: "resources/assets/sort.png"
 headerLinks:
   Main Portfolio: "https://portfolio.captainalm.com/"
   Root Site Home: "https://www.captainalm.com/"
-  Github: "https://github.com/Captain-ALM/"
+  LinkedIn: "https://www.linkedin.com/in/alfred-manville/"
 about:
   title: "Alfred Manville (Captain ALM)"
   content: >
     <p>
-    Hello, I'm Alfred Manville (#age# Years Old).
+    Hello, I'm Alfred Manville (#age# Years Old) and a third year student at City, University of London.
     I'm a free and open-source developer who enjoys networking my laptops together,
     writes network software to communicate between them and then tries to break said software.
     I also have a <a href="https://youtube.com/c/CaptainALM">Youtube Channel</a> which is in the process of being resumed from a hiatus.
     </p>
     <p>
-    On the programming side, I know Visual Basic .net, C# .net, C, Java, Go, Javascript (Circa. 2000), Processing and Microsoft Smallbasic
+    On the programming side, I know Visual Basic .net, C# .net, C, Java, Go, Javascript, C++, Python, Bash,
-    (I have also dabbled in C++, Python and Bash/Batch).
+    Haskell, Processing and Microsoft Smallbasic (I have also dabbled in Batch).
-    I am currently in the progress of writing infrastructure software in Go, in the past, I wrote a command console in VB .net for my own
+    I am currently in the progress of writing infrastructure software in Go, in the past, I wrote a <a href="https://github.com/Captain-ALM/CALM-Console">command console</a>
-    pluggable libraries (I created a CMD emulator to get past the school disabling interactive CMD) and some network communication applications
+    in VB .net for my own pluggable libraries (I created a CMD emulator to get past the school disabling interactive CMD) and some <a href="https://github.com/Captain-ALM/CALMNetLibSamples">
-    (Including a peer-to-peer VOIP client using NAudio as the audio library and my own network wrapper library).
+    network communication applications</a> (Including a peer-to-peer <a href="https://github.com/Captain-ALM/C-ALM-VOIP">VOIP client</a>
+    using NAudio as the audio library and my own network wrapper library, however, it is in need of bug-fixing at the moment).
+    </p>
+    <p>
+    My github username is <a href="https://github.com/Captain-ALM">Captain-ALM</a> and has half my public programming projects,
+    the other half is located at: <a href="https://code.mrmelon54.com/alfred">https://code.mrmelon54.com/alfred</a>
     </p>
     <p>
     On the cracking / hacking side, I've used virtual machines a lot (Mainly infrastructure testing
@@ -35,19 +41,25 @@ about:
     I've also used VMs to pull perform a PXE boot off a network and analyse the partially deployed image
     (And this is why the deployment servers should be switched off when unneeded, especially since PXE
     auto-domain-join would store its credentials in the image).
-    I also played around with accessing the RDP servers when I was in secondary school (Turns out remote apps
+    I also played around with <a href="https://github.com/Captain-ALM/rdpccgs-ccgsrdp-">accessing the RDP servers</a>
-    is just a glorified application auto-launcher with window size detection).
+    when I was in secondary school (Turns out remote apps is just a glorified application auto-launcher with window size detection).
+    Here is <a href="https://github.com/Captain-ALM/op_ctrl">Operation Control</a> (Stylized: op_ctrl) used for same-computer exploiting
+    by wrapping target applications run by other users (Such as via RDP Remote Apps) and then starting a master server to send arbitrary
+    .net DLLs to execute on the target slaved client.
     </p>
     <p>
-    I also <a href="https://subsection.captainalm.com/">bake bread</a> although this sub-site is still under construction (Mostly learnt from my grandma).
+    I also <a href="https://subsection.captainalm.com/">bake bread</a> (Mostly learnt from my grandma); although this sub-site is still under construction.
-    I also play video-games and am an expert at using lower-end hardware.
+    I also play video-games (Check my Youtube Channel or my <a href="https://www.gog.com/u/Captain_ALM">GOG Profile</a>) and am an expert at using lower-end hardware.
     </p>
     <p>
     I used to do Karate (Kyokushin Brown Belt) and I wish I could still fit my bike.
-    My <a href="https://cdn.captainalm.com/download/keys/alfred@captainalm.com.asc">GPG Key</a> for my email address.
+    Here is my <a href="https://cdn.captainalm.com/download/keys/alfred@captainalm.com.asc">GPG Key</a> for my email address.
     </p>
-  thumbnailLocation: "https://cityuni.captainalm.com/resources/assets/imageofyou_t.jpg"
+    <p>
-  imageLocation: "https://cityuni.captainalm.com/resources/assets/imageofyou.jpg"
+    My CV is available in the following formats: ( <a href="https://cdn.captainalm.com/download/cvs/AlfredManvilleCV-2024.docx">DOCX</a> | <a href="https://cdn.captainalm.com/download/cvs/AlfredManvilleCV-2024.pdf">PDF</a> )
+    </p>
+  thumbnailLocation: "resources/assets/imageofyou_t.jpg"
+  imageLocation: "resources/assets/imageofyou.jpg"
   imageAltText: "Image of me."
   birthYear: 2002
   contactEmail: "alfred@captainalm.com"
@@ -70,22 +82,35 @@ entries:
       <p>
       Here is the repo: <a href="https://github.com/Captain-ALM/Ninjaformer-Processing">https://github.com/Captain-ALM/Ninjaformer-Processing</a>
       </p>
+      <p>
+      The original video is available here: <a href="resources/stream/vid1.mp4">resources/stream/vid1.mp4</a>
+      </p>
     startDate: "01/10/2021"
     endDate: "31/10/2021"
-    videoLocation: "https://cityuni.captainalm.com/resources/stream/vid1.mp4"
+    videoLocation: "resources/stream/vid-bootcamp.mp4"
     videoContentType: "video/mp4"
+    videoThumbnailLocation: "resources/assets/bootcamp-vid.png"
     thumbnailLocations:
-      - "https://cityuni.captainalm.com/resources/assets/pic1_t.png"
+      - "resources/assets/pic1_t.jpg"
-      - "https://cityuni.captainalm.com/resources/assets/pic2_t.png"
+      - "resources/assets/pic2_t.jpg"
-      - "https://cityuni.captainalm.com/resources/assets/pic3_t.png"
+      - "resources/assets/pic3_t.jpg"
+      - "resources/assets/bootcamp-1_t.jpg"
+      - "resources/assets/bootcamp-2_t.jpg"
+      - "resources/assets/bootcamp-3_t.jpg"
     imageLocations:
-      - "https://cityuni.captainalm.com/resources/assets/pic1.png"
+      - "resources/assets/pic1.jpg"
-      - "https://cityuni.captainalm.com/resources/assets/pic2.png"
+      - "resources/assets/pic2.jpg"
-      - "https://cityuni.captainalm.com/resources/assets/pic3.png"
+      - "resources/assets/pic3.jpg"
+      - "resources/assets/bootcamp-1.jpg"
+      - "resources/assets/bootcamp-2.jpg"
+      - "resources/assets/bootcamp-3.jpg"
     imageAltTexts:
       - "Level select screen."
       - "Empty content interface (Gameplay)."
       - "Level editor screen."
+      - "Ninjagame source code."
+      - "Button image source code."
+      - "Sprite world source code."
   - name: "City Game Project 2022: Ninjaformer (Alpha, Beta)"
     content: >
       <p>
@@ -109,24 +134,43 @@ entries:
       The final level allows the ninja to "complete" the game while exploring a set of caves.
       </p>
       <p>
+      The game contains a mechanism system allowing for the unlocking of portals (Doors) for the character to progress within and between levels.
+      The character contains a set of different stamina types, core stamina which if depleted causes a death, leg stamina which is a multiplier for
+      doing any action that uses legs and arm stamina which is a multiplier for doing any action that uses arms. The game contains a weapon system of
+      throwing stars, swords and throwable liquids.
+      </p>
+      <p>
       Here is the repo: <a href="https://github.com/cityteaching/citygame2122-Captain-ALM"><strike><del>Not public due to university anti-plagiarism policy.</del></strike></a>
       </p>
+      <p>
+      The original video is available here: <a href="resources/stream/vid2.mp4">resources/stream/vid2.mp4</a>
+      </p>
     startDate: "25/02/2022"
     endDate: "08/05/2022"
-    videoLocation: "https://cityuni.captainalm.com/resources/stream/vid2.mp4"
+    videoLocation: "resources/stream/vid-ninjaformer-2022.mp4"
     videoContentType: "video/mp4"
+    videoThumbnailLocation: "resources/assets/ninjaformer-vid.png"
     thumbnailLocations:
-      - "https://cityuni.captainalm.com/resources/assets/pic4_t.png"
+      - "resources/assets/pic4_t.jpg"
-      - "https://cityuni.captainalm.com/resources/assets/pic5_t.png"
+      - "resources/assets/pic5_t.jpg"
-      - "https://cityuni.captainalm.com/resources/assets/pic6_t.png"
+      - "resources/assets/pic6_t.jpg"
+      - "resources/assets/ninjaformer-1_t.jpg"
+      - "resources/assets/ninjaformer-2_t.jpg"
+      - "resources/assets/ninjaformer-3_t.jpg"
     imageLocations:
-      - "https://cityuni.captainalm.com/resources/assets/pic4.png"
+      - "resources/assets/pic4.jpg"
-      - "https://cityuni.captainalm.com/resources/assets/pic5.png"
+      - "resources/assets/pic5.jpg"
-      - "https://cityuni.captainalm.com/resources/assets/pic6.png"
+      - "resources/assets/pic6.jpg"
+      - "resources/assets/ninjaformer-1.jpg"
+      - "resources/assets/ninjaformer-2.jpg"
+      - "resources/assets/ninjaformer-3.jpg"
     imageAltTexts:
       - "Cave level."
       - "Tutorial level."
-      - "Training level."
+      - "Training level (Editor mode)."
+      - "Main Menu screen."
+      - "Pause Menu screen."
+      - "Audio Settings screen."
   - name: "Global Game Jam January 2022 : Shadow work"
     content: >
       <p>
@@ -137,12 +181,37 @@ entries:
       Read about and get the game files from: <a href="https://globalgamejam.org/2022/games/shadow-work-8">https://globalgamejam.org/2022/games/shadow-work-8</a>
       </p>
       <p>
-      Download the windows executable from: <a href="https://cdn.captainalm.com/download/ShadowWorkExecutable.zip">https://cdn.captainalm.com/download/ShadowWorkExecutable.zip</a>
+      Download the windows executable from: <a href="https://cdn.captainalm.com/download/game/dist/ShadowWorkExecutable.zip">https://cdn.captainalm.com/download/game/dist/ShadowWorkExecutable.zip</a>
+      </p>
+      <p>
+      The Design Document is available here: <a href="https://cdn.captainalm.com/download/game/design/Shadow-WIP-Story-Info.pdf">https://cdn.captainalm.com/download/game/design/Shadow-WIP-Story-Info.pdf</a>
       </p>
     startDate: "20/01/2022"
     endDate: "30/01/2022"
-    #videoLocation: "https://cityuni.captainalm.com/resources/stream/vid3.mp4"
+    videoLocation: "resources/stream/vid-shadowwork.mp4"
-    #videoContentType: "video/mp4"
+    videoContentType: "video/mp4"
+    videoThumbnailLocation: "resources/assets/shadowwork-vid.png"
+    thumbnailLocations:
+      - "resources/assets/shadowwork-2_t.jpg"
+      - "resources/assets/shadowwork-3_t.jpg"
+      - "resources/assets/shadowwork-4_t.jpg"
+      - "resources/assets/shadowwork-5_t.jpg"
+      - "resources/assets/shadowwork-6_t.jpg"
+      - "resources/assets/shadowwork-1_t.jpg"
+    imageLocations:
+      - "resources/assets/shadowwork-2.jpg"
+      - "resources/assets/shadowwork-3.jpg"
+      - "resources/assets/shadowwork-4.jpg"
+      - "resources/assets/shadowwork-5.jpg"
+      - "resources/assets/shadowwork-6.jpg"
+      - "resources/assets/shadowwork-1.jpg"
+    imageAltTexts:
+      - "Main Menu screen."
+      - "Controls screen."
+      - "Bedroom (Beginning game area)."
+      - "First Puzzle, duality keys."
+      - "Visualisation of in-game character split."
+      - "End of the game area."
   - name: "City-University Portfolio"
     content: >
       <p>
@@ -151,10 +220,151 @@ entries:
       </p>
       <p>
       This project is under the BSD-3-Clause License, so if reusing, you must scrub references to me, the yml file this is written in is under
-      Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International <a href="https://creativecommons.org/licenses/by-nc-nd/4.0/">
+      Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International License.
-      <img src="https://mirrors.creativecommons.org/presskit/buttons/88x31/png/by-nc-nd.png" alt="License" height="16"></a>.
       </p>
       <p>
-      Find the source code here: <a href="https://code.mrmelon54.xyz/alfred/cityuni-webserver">https://code.mrmelon54.xyz/alfred/cityuni-webserver</a>
+      Find the source code here: <a href="https://code.mrmelon54.com/alfred/cityuni-webserver">https://code.mrmelon54.com/alfred/cityuni-webserver</a>
       </p>
     startDate: "13/07/2022"
+  - name: "Python Communicator"
+    content: >
+      <p>
+      After learning python for my portfolio development option, I wanted to showcase what I knew in python.
+      I usually make a network application in each of the new programming languages that I learn.
+      For the repo showing me learning python please go to: <a href="https://code.mrmelon54.com/alfred/LearningPy">https://code.mrmelon54.com/alfred/LearningPy</a>
+      </p>
+      <p>
+      This project is a message based network communicator written in python and has a module for networking.
+      The project allows the sending of text messages and files over a network.
+      It also comes with a nice twist, in that if you select the pickle protocol, you can inject code into another client by sending a specially crafted message!
+      </p>
+      <p>
+      Find the source code here: <a href="https://github.com/Captain-ALM/CALMPyNetworker">https://github.com/Captain-ALM/CALMPyNetworker</a>
+      </p>
+    startDate: "10/12/2022"
+    endDate: "10/12/2022"
+    videoLocation: "resources/stream/vid-pycom.mp4"
+    videoContentType: "video/mp4"
+    videoThumbnailLocation: "resources/assets/pycom-vid.png"
+    thumbnailLocations:
+      - "resources/assets/pycom-1_t.jpg"
+      - "resources/assets/pycom-2_t.jpg"
+      - "resources/assets/pycom-3_t.jpg"
+      - "resources/assets/pycom-4_t.jpg"
+    imageLocations:
+      - "resources/assets/pycom-1.jpg"
+      - "resources/assets/pycom-2.jpg"
+      - "resources/assets/pycom-3.jpg"
+      - "resources/assets/pycom-4.jpg"
+    imageAltTexts:
+      - "Text Messaging."
+      - "File Messaging."
+      - "Exploit Testing."
+      - "Failed Exploit Testing."
+  - name: "Group Project - AirVia ATS (AirTicket Sales)"
+    content: >
+      <p>
+      This group project was creating a Ticket Sales system for the fictional company AirVia LTD, for this the group had to both design the implementation and then write the code for it.
+      Unfortunately, the project was not finished to a state where all the required features were added in and while all of the backend functionality except for the reports existed,
+      the GUIs to view and control those backends was not available.
+      Examples of this include: Sales, Transactions, Discounts and Reports where no GUIs were created or finished for any of these components.
+      The design of the program was followed with a lot of adaptations (Rather than not being followed at all) and it architecturally made sense with the use of facade implementations;
+      The use of facade allowed for other people to code against an interface while waiting for a controller to be finished which extended the interface.
+      </p>
+      <p>
+      The database system was handled via an abstraction layer I designed and wrote myself which supports 'locking' a record for keeping consistency when multiple instances of the program are running.
+      This system uses an auxiliary table that has only the primary key column, a record is locked if it does not exist in the auxiliary table (Cannot delete) and is not locked if it does (Cannot insert);
+      This allows for atomic locking and unlocking of the record.
+      The implementation requires the record locked for safe access (Loading, Storing).
+      The abstraction layer makes use of two base classes, one for a single record and one for a table; with tha table one allowing the creation and deletion of the extending table via a schema and name being provided (As seen in the source code).
+      I also developed a backup system for the database that supports any table with the specifically supported data types used in the tables defined in the schema - removing the need to use third-party programs like SQLDump.
+      </p>
+      <p>
+      In the end, the following features were implemented: Login, Help / Error / Status Bar, Account System + GUI, Blank Types + GUI, Blanks + GUI, Customers + GUI, Discounts, Flexible Discounts, Sales, Transactions, Refunds, Dashboard + Notifications, Database Interfacing + Backup and Rates + GUI.
+      </p>
+      <p>
+      Find the source code here: <a href="https://github.com/karansambee/IN2018-Team-Project/tree/master">https://github.com/karansambee/IN2018-Team-Project/tree/master</a>
+      </p>
+    startDate: "01/02/2023"
+    endDate: "30/04/2023"
+    videoLocation: "resources/stream/vid-groupproject-2023.mp4"
+    videoContentType: "video/mp4"
+    videoThumbnailLocation: "resources/assets/groupproject-vid.png"
+    thumbnailLocations:
+      - "resources/assets/groupproject-1_t.jpg"
+      - "resources/assets/groupproject-2_t.jpg"
+      - "resources/assets/groupproject-3_t.jpg"
+      - "resources/assets/groupproject-4_t.jpg"
+      - "resources/assets/groupproject-5_t.jpg"
+      - "resources/assets/groupproject-6_t.jpg"
+      - "resources/assets/groupproject-7_t.jpg"
+      - "resources/assets/groupproject-8_t.jpg"
+      - "resources/assets/groupproject-9_t.jpg"
+      - "resources/assets/groupproject-10_t.jpg"
+    imageLocations:
+      - "resources/assets/groupproject-1.png"
+      - "resources/assets/groupproject-2.png"
+      - "resources/assets/groupproject-3.png"
+      - "resources/assets/groupproject-4.png"
+      - "resources/assets/groupproject-5.png"
+      - "resources/assets/groupproject-6.png"
+      - "resources/assets/groupproject-7.png"
+      - "resources/assets/groupproject-8.png"
+      - "resources/assets/groupproject-9.png"
+      - "resources/assets/groupproject-10.png"
+    imageAltTexts:
+      - "Logon Interface."
+      - "Administrator Dashboard Interface."
+      - "Blank Modifier."
+      - "Customer Creator."
+      - "Disabling an Account."
+      - "Rate Creator."
+      - "Blank Type Editor."
+      - "Help on Force Unlocking (Database Manager Interface)."
+      - "Account Editor on a Manager within The Dashboard Interface."
+      - "Part of the Main.java source code Screenshot."
+  - name: "City-University Promotional Video"
+    content: >
+      <p>
+      Here, I star in an interview for City, University of London's Promotional Marketing Campaign. Join <a href="https://www.city.ac.uk/">City</a>!
+      </p>
+      <p>
+      Find the video here: <a href="https://www.youtube.com/watch?v=tOccImgskec">https://www.youtube.com/watch?v=tOccImgskec</a>
+      </p>
+      <p>
+      Find the general School of Science and Technology video here: <a href="https://www.youtube.com/watch?v=pkTCf4CWFSY">https://www.youtube.com/watch?v=pkTCf4CWFSY</a>
+      </p>
+    startDate: "05/06/2023"
+    endDate: "05/06/2023"
+    videoLocation: "https://www.youtube.com/watch?v=tOccImgskec"
+    videoContentType: "text/uri-list"
+    videoThumbnailLocation: "resources/assets/citypromo-vid.png"
+  - name: "Decide Quiz - GCloud City"
+    content: >
+      <p>
+      This project was <a href="https://cdn.captainalm.com/download/gcloudcity/CloudApplicationSpecification-AlfredManville-MohammadMasood.docx">designed</a> <a href="https://cdn.captainalm.com/download/gcloudcity/CloudPresentation-AlfredManville-MohammadMasood.pptx">to</a> operate as a Kahoot clone although the front-end never got completed by the other member of the pair (This was written in React).
+      </p>
+      <p>
+      This was created in a pair as part of the Cloud Computing module at City, University of London. It was built for use using google cloud and therefore
+      uses many Google Cloud Platform Technologies which are listed and shown off in the video.
+      </p>
+      <p>
+      The communication protocol uses JSON packets passed either through a WebSocket connection or a REST based protocol that polls the server for data while sending the queued packets.
+      The REST connection is used as a fallback system where WebSockets do not work; in addition, a REST connection is made to the master server to first work out which app server has
+      the least load, once found, this is sent back to the client where the client will then attempt a WebSocket connection and, on failure, a REST session is created (A key is returned
+      which is then used as a parameter in subsequent communications). In the event there is no more capacity, a service unavailable error is sent and a new VM will be spun up, in the case
+      that any are left. The source code for this library can be found at <a href="https://github.com/Captain-ALM/gc-c-com">https://github.com/Captain-ALM/gc-c-com</a> and the master server source
+      code can be found at <a href="https://github.com/Captain-ALM/gc-c-master-srv">https://github.com/Captain-ALM/gc-c-master-srv</a>.
+      </p>
+      <p>
+      The main game loop was supposed to allow user generated quizzes once logged in along-side allowing for public quizzes that could be used and copied by other users.
+      Only logged in users could start games where any user - both logged in or not - could join and answer questions within a set amount of time, with the person answering
+      the fastest getting more points than people who answer later. The system would also have a leaderboard shown at the end of each question; it was also designed to recover
+      from crashes and resume from the last question executed. The source code for the app server can be found at <a href="https://github.com/Captain-ALM/gc-c-app-srv">
+      https://github.com/Captain-ALM/gc-c-app-srv</a> where all this functionality does exist in the backend; the database source code can be found at <a href="https://github.com/Captain-ALM/gc-c-db">https://github.com/Captain-ALM/gc-c-db</a>.
+      </p>
+    startDate: "27/11/2023"
+    endDate: "14/01/2024"
+    videoLocation: "resources/stream/vid-gc-c-v2.mp4"
+    videoContentType: "video/mp4"
+    videoThumbnailLocation: "resources/assets/vid-gc-c-v2.png"

index.js

@@ -0,0 +1,369 @@
+/*
+This file is (C) Captain ALM
+Under the Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International License
+*/
+var EntryData = []
+var EntryIndices = []
+var SortOrderStateI = true
+var SortOrderBStateI = true
+var SortOrderEnabled = false
+var SortValue = ""
+var OrderValue = ""
+function SetupJS() {
+    SetupIndexArray()
+    SetupJSTheme()
+    SetupJSHSO()
+    SetupJSSOI()
+    SetupJSRSN()
+}
+function CreateEntry(id, name, videourl, videotype, start, end, duration) {
+    EntryData[id] = {
+        name: name,
+        videourl: videourl,
+        videotype: videotype,
+        start: Date.parse(start),
+        end: Date.parse(end),
+        duration : parseInt(duration, 10)
+    };
+}
+function CreateVideoPlaceholder(id,phImageURL) {
+    var imgPH = document.createElement("img")
+    imgPH.src = phImageURL
+    imgPH.id = "play-"+id
+    imgPH.alt = "Play Video"
+    imgPH.title = "Play"
+    imgPH.width = 360
+    imgPH.style.cursor = "pointer"
+    if (document.addEventListener) {
+        imgPH.addEventListener("click", function () {ActivateVideo(id);})
+    } else {
+        imgPH.setAttribute("onclick", "ActivateVideo("+id+");")
+        imgPH.onclick = function () {ActivateVideo(id);}
+    }
+    document.getElementById("video-" + id).appendChild(imgPH)
+}
+function ActivateVideo(id) {
+    var holder = document.getElementById("video-" + id)
+    holder.removeChild(document.getElementById("play-"+id))
+    var vid = document.createElement("video")
+    vid.controls = true
+    vid.width = 360
+    var vids = document.createElement("source")
+    vids.src = EntryData[id].videourl
+    vids.type = EntryData[id].videotype
+    var vida = document.createElement("a")
+    vida.href = EntryData[id].videourl
+    vida.innerText = "The Video"
+    vid.appendChild(vids)
+    vid.appendChild(vida)
+    holder.appendChild(vid)
+    if (vid.play) {vid.play();}
+}
+function SetupIndexArray() {
+    for (var i = 0; i < EntryData.length; i++) {
+        EntryIndices[i] = i
+    }
+}
+function SetupJSTheme() {
+    var th = document.getElementById("theme")
+    th.href = "#"
+    new Image().src = MoonImageURL //Preload I hope
+    if (document.addEventListener) {
+        th.addEventListener("click", ToggleTheme)
+    } else {
+        th.setAttribute("onclick", "ToggleTheme();")
+        th.onclick = ToggleTheme
+    }
+}
+function ReplaceHistory(url) {
+    var s = true
+    if (window.history) {
+        if (window.history.replaceState) {
+            window.history.replaceState({}, "", url)
+            s = false
+        }
+    }
+    if (s) {
+        document.location.href = url
+    }
+}
+function ToggleTheme() {
+    var th = document.getElementById("theme")
+    var thimg = document.getElementById("theme-img")
+    var thsty = document.getElementById("style-theme")
+    var logo = document.getElementById("logo")
+    var url = document.location.href
+    url = url.split("#", 1)[0].split('?', 1)[0]
+    if (document.getElementById("so-theme")) {
+        thimg.src = SunImageURL
+        thimg.alt = "()"
+        th.title = "Switch to Light Mode"
+        document.getElementById("so-form").removeChild(document.getElementById("so-theme"))
+        logo.href = "?"
+        ReplaceHistory(url+"?"+TheParameters+"#")
+        thsty.href = CssDarkURL
+    } else {
+        thimg.src = MoonImageURL
+        thimg.alt = "{"
+        th.title = "Switch to Dark Mode"
+        var thi = document.createElement("input")
+        thi.name = "light"
+        thi.type = "hidden"
+        thi.id = "so-theme"
+        document.getElementById("so-form").appendChild(thi)
+        logo.href = "?light"
+        if (TheParameters === "") {
+            ReplaceHistory(url+"?light#")
+        } else {
+            ReplaceHistory(url+"?light&"+TheParameters+"#")
+        }
+        thsty.href = CssLightURL
+    }
+}
+function SetupJSHSO() {
+    var pb = document.getElementById("sort-menu-button")
+    var pane = document.getElementById("so-pane")
+    if (document.addEventListener) {
+        document.addEventListener("click", HandleGlobalClick)
+        pb.addEventListener("mouseover", HandleSortOrderBEnter)
+        pb.addEventListener("mouseout", HandleSortOrderBLeave)
+        pane.addEventListener("mouseover", HandleSortOrderEnter)
+        pane.addEventListener("mouseout", HandleSortOrderLeave)
+    } else {
+        document.parentElement.setAttribute("onclick", "HandleGlobalClick();")
+        pb.setAttribute("onmouseover", "HandleSortOrderBEnter();")
+        pb.setAttribute("onmouseout", "HandleSortOrderBLeave();")
+        pane.setAttribute("onmouseover", "HandleSortOrderEnter();")
+        pane.setAttribute("onmouseout", "HandleSortOrderLeave();")
+        document.parentElement.onclick = HandleGlobalClick
+        pb.onmouseover = HandleSortOrderBEnter
+        pb.onmouseout = HandleSortOrderBLeave
+        pane.onmouseover = HandleSortOrderEnter
+        pane.onmouseout = HandleSortOrderLeave
+    }
+}
+function HandleGlobalClick() {
+    if (SortOrderStateI && SortOrderBStateI) {document.getElementById("sort-menu").checked = false;}
+}
+function HandleSortOrderBEnter() {
+    SortOrderBStateI = false
+}
+function HandleSortOrderBLeave(){
+    SortOrderBStateI = true
+}
+function HandleSortOrderEnter() {
+    SortOrderStateI = false
+}
+function HandleSortOrderLeave(){
+    SortOrderStateI = true
+}
+function SetupJSSOI() {
+    var submit = document.getElementById("so-submit")
+    if (submit.parentNode) {submit.parentNode.removeChild(submit);}
+    var oc = document.getElementById("so-order")
+    OrderValue = oc.value
+    var sc = document.getElementById("so-sort")
+    SortValue = sc.value
+    if (document.addEventListener) {
+        oc.addEventListener("change", HandleSortOrderChange)
+        sc.addEventListener("change", HandleSortOrderChange)
+    } else {
+        oc.setAttribute("onchange", "HandleSortOrderChange();")
+        sc.setAttribute("onchange", "HandleSortOrderChange();")
+        oc.onchange = HandleSortOrderChange
+        sc.onchange = HandleSortOrderChange
+    }
+    SortOrderEnabled = true
+}
+function HandleSortOrderChange() {
+    if (SortOrderEnabled) {EntrySort(document.getElementById("so-order").value, document.getElementById("so-sort").value);}
+}
+function EntrySort(o, s) {
+    var ts = s.toString().toLowerCase()
+    var chg = false
+    if (SortValue !== s) {
+        chg = true
+        SortValue = s
+    }
+    if (chg || OrderValue !== o) {
+        if (ts === "asc" || ts === "ascending") {
+            ts = 1
+        } else {
+            ts = -1
+        }
+        var to = o.toString().toLowerCase()
+        if (to === "start") {
+            if (ts < 0) {
+                EntryIndices = EntryIndices.sort(SortStartD)
+            } else {
+                EntryIndices = EntryIndices.sort(SortStartA)
+            }
+        } else if (to === "end") {
+            if (ts < 0) {
+                EntryIndices = EntryIndices.sort(SortEndD)
+            } else {
+                EntryIndices = EntryIndices.sort(SortEndA)
+            }
+        } else if (to === "name") {
+            if (ts < 0) {
+                EntryIndices = EntryIndices.sort(SortNameD)
+            } else {
+                EntryIndices = EntryIndices.sort(SortNameA)
+            }
+        } else if (to === "duration") {
+            if (ts < 0) {
+                EntryIndices = EntryIndices.sort(SortDurationD)
+            } else {
+                EntryIndices = EntryIndices.sort(SortDurationA)
+            }
+        }
+        chg = true
+        OrderValue = o
+    }
+    if (chg) {
+        TheParameters = "order="+OrderValue+"&sort="+SortValue
+        var url = document.location.href
+        url = url.split("#", 1)[0].split('?', 1)[0]
+        if (document.getElementById("so-theme")) {
+            ReplaceHistory(url+"?light&"+TheParameters)
+        } else {
+            ReplaceHistory(url+"?"+TheParameters)
+        }
+        for (var i = 0; i < EntryIndices.length; i++) {
+            var tNode = document.getElementById("entry-"+EntryIndices[i])
+            var pNode = tNode.parentNode
+            tNode = pNode.removeChild(tNode)
+            pNode.appendChild(tNode)
+        }
+    }
+}
+function SortStartA(a, b) {
+    if (EntryData[a].start < EntryData[b].start) {
+        return -1
+    } else {
+        return  1
+    }
+}
+function SortStartD(a, b) {
+    if (EntryData[a].start > EntryData[b].start) {
+        return -1
+    } else {
+        return  1
+    }
+}
+function SortEndA(a, b) {
+    if (EntryData[a].end < EntryData[b].end) {
+        return -1
+    } else {
+        return  1
+    }
+}
+function SortEndD(a, b) {
+    if (EntryData[a].end > EntryData[b].end) {
+        return -1
+    } else {
+        return  1
+    }
+}
+function SortNameA(a, b) {
+    if (EntryData[a].name < EntryData[b].name) {
+        return -1
+    } else {
+        return  1
+    }
+}
+function SortNameD(a, b) {
+    if (EntryData[a].name > EntryData[b].name) {
+        return -1
+    } else {
+        return  1
+    }
+}
+function SortDurationA(a, b) {
+    if (EntryData[a].duration < EntryData[b].duration) {
+        return -1
+    } else {
+        return  1
+    }
+}
+function SortDurationD(a, b) {
+    if (EntryData[a].duration > EntryData[b].duration) {
+        return -1
+    } else {
+        return  1
+    }
+}
+function SetupJSRSN() {
+    if (window.addEventListener) {
+        window.addEventListener("resize", PerformNavResize)
+    } else {
+        window.setAttribute("onresize", "PerformNavResize();")
+        window.onresize = PerformNavResize
+    }
+    PerformNavResize()
+}
+function PerformNavResize() {
+    var ww = 0
+    if (window.innerWidth && window.innerWidth !== 10) {
+        ww = window.innerWidth
+    } else {
+        var ht = document.getElementsByTagName("html")
+        if (ht && ht.length > 0) {ww = ht[0].clientWidth;}
+    }
+    if (ww > 0) {
+        var maxbarsz = ww - 342;
+        var men = document.getElementById("menu")
+        var vmen = document.getElementById("vmenu")
+        if (men && vmen) {
+            if (ww > 679) {
+                while (vmen.childNodes.length > 0) {InsertBefore(men, vmen.removeChild(vmen.childNodes[vmen.childNodes.length - 1]));}
+            } else {
+                var vmeni
+                var mensz = 0
+                var menc = []
+                var imenc = 0
+                for (vmeni = 0; vmeni < vmen.childNodes.length; vmeni++) {
+                    if (vmen.childNodes[vmeni].nodeType === Node.ELEMENT_NODE) {
+                        if (mensz+vmen.childNodes[vmeni].clientWidth > maxbarsz) {menc[imenc] = vmen.childNodes[vmeni]; imenc++;}
+                        mensz += vmen.childNodes[vmeni].clientWidth
+                    }
+                }
+                if (menc.length > 0) {
+                    for (vmeni = 0; vmeni < menc.length; vmeni++) {vmen.removeChild(menc[vmeni]);}
+                    for (vmeni = menc.length - 1; vmeni >= 0; vmeni--) {InsertBefore(men, menc[vmeni]);}
+                } else {
+                    for (vmeni = 0; vmeni < men.childNodes.length; vmeni++) {
+                        if (men.childNodes[vmeni].nodeType === Node.ELEMENT_NODE) {
+                            var mena = GetFirstSubElement(men.childNodes[vmeni], 0)
+                            var menaw = GetNavTextWidth(mena.textContent)
+                            if (mensz+menaw <= maxbarsz) {menc[imenc] = men.childNodes[vmeni]; imenc++;}
+                            mensz += menaw
+                        }
+                    }
+                    for (vmeni = 0; vmeni < menc.length; vmeni++) {vmen.appendChild(men.removeChild(menc[vmeni]));}
+                }
+            }
+        }
+    }
+}
+function GetFirstSubElement(t,r) {
+    for (var gfsei = 0; gfsei < t.childNodes.length; gfsei++) {
+        if (t.childNodes[gfsei].nodeType === Node.ELEMENT_NODE) {
+            if (r < 1) {return t.childNodes[gfsei];} else {return GetFirstSubElement(t.childNodes[gfsei], r - 1);}
+        }
+    }
+    return t
+}
+function InsertBefore(p,c) {
+    if (p.childNodes.length > 0) {p.insertBefore(c, p.childNodes[0]);} else {p.appendChild(c);}
+}
+function GetNavTextWidth(s) {
+    var st = document.getElementById("st")
+    if (st) {
+        st.textContent = s
+        var trw = st.clientWidth
+        st.textContent = ""
+        return trw
+    }
+    return 8 * s.length + 32
+}

light.css

@@ -1,3 +1,7 @@
+/*
+This file is (C) Captain ALM
+Under the Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International License
+*/
 body{
     color: #060606;
     background-color: #fafaf9;
@@ -6,13 +10,13 @@ body{
 a{
     color: #4f4fff;
 }
-.header, .nav, footer, .so-pane{
+.header, nav, footer, .so-pane{
     background-color: #e2e2e1;
 }
-.home-button > div, .sort-button > div, .menu a, .so-pane > *{
+.home-button > div, .sort-button > div, .menu a, .vmenu a, .so-pane > form > div > * > *{
     color: #1f1f1f;
 }
-.home-button:hover, .menu a:hover, .hmb:hover, .sort-button:hover, .sort-menu:checked ~ .sort-button, .so-pane > input, .so-pane > select{
+.home-button:hover, .menu a:hover, .vmenu a:hover, .hmb:hover, .sort-button:hover, .sort-menu:checked ~ .sort-button, .sort-button-active, .so-pane > form > div > span > input, .so-pane > form > div > div > select{
     background-color: #9f9f9e;
 }
 .hmb-line, .hmb-line::before, .hmb-line::after{
@@ -23,14 +27,12 @@ a{
 }
 .item-table{
     background-color: #c0c0c0;
-}
-.so-pane{
-    border-color: #c0c0c0;
-}
-.item-table > div > div, .item-table-caption{
     border-color: #0a214c;
 }
-.image-box{
+.so-pane, .header{
+    border-color: #909090;
+}
+.image-box, .item-heading{
     background-color: #b0b0b0;
 }
 .image-box > a{

pageHandler/go-info-page.go

@@ -45,6 +45,7 @@ func (gipg *goInfoPage) GetCacheIDExtension(urlParameters url.Values) string {
 
 type goInfoTemplateMarshal struct {
 	FullOutput         bool
+	CurrentTime        time.Time
 	RegisteredPages    []string
 	CachedPages        []string
 	ProcessID          int
@@ -98,6 +99,7 @@ func (gipg *goInfoPage) GetContents(urlParameters url.Values) (contentType strin
 	theBuffer := &io.BufferedWriter{}
 	err = theTemplate.ExecuteTemplate(theBuffer, templateName, &goInfoTemplateMarshal{
 		FullOutput:         urlParameters.Has("full"),
+		CurrentTime:        time.Now(),
 		RegisteredPages:    regPages,
 		CachedPages:        cacPages,
 		ProcessID:          os.Getpid(),

pageHandler/page-handler.go

@@ -43,9 +43,9 @@ func NewPageHandler(config conf.ServeYaml) *PageHandler {
 		CacheSettings:            config.CacheSettings,
 	}
 	if config.EnableGoInfoPage {
-		toReturn.PageProviders = GetProviders(config.CacheSettings.EnableTemplateCaching, config.DataStorage, toReturn)
+		toReturn.PageProviders = GetProviders(config.CacheSettings.EnableTemplateCaching, config.GetDataStoragePath(), toReturn, config.GetTemplateStoragePath(), config.PageSettings, config.YmlDataFallback)
 	} else {
-		toReturn.PageProviders = GetProviders(config.CacheSettings.EnableTemplateCaching, config.DataStorage, nil)
+		toReturn.PageProviders = GetProviders(config.CacheSettings.EnableTemplateCaching, config.GetDataStoragePath(), nil, config.GetTemplateStoragePath(), config.PageSettings, config.YmlDataFallback)
 	}
 	return toReturn
 }
@@ -286,6 +286,9 @@ func (ph *PageHandler) GetRegisteredPages() []string {
 }
 
 func (ph *PageHandler) GetCachedPages() []string {
+	if ph.pageContentsCacheRWMutex == nil {
+		return make([]string, 0)
+	}
 	ph.pageContentsCacheRWMutex.RLock()
 	defer ph.pageContentsCacheRWMutex.RUnlock()
 	pages := make([]string, len(ph.PageContentsCache))
@@ -298,6 +301,9 @@ func (ph *PageHandler) GetCachedPages() []string {
 }
 
 func (ph *PageHandler) GetNumberOfCachedPages() int {
+	if ph.pageContentsCacheRWMutex == nil {
+		return 0
+	}
 	ph.pageContentsCacheRWMutex.RLock()
 	defer ph.pageContentsCacheRWMutex.RUnlock()
 	return len(ph.PageContentsCache)

pageHandler/pages.go

@@ -1,18 +1,26 @@
 package pageHandler
 
-import "golang.captainalm.com/cityuni-webserver/pageHandler/pages/index"
+import (
+	"golang.captainalm.com/cityuni-webserver/conf"
+	"golang.captainalm.com/cityuni-webserver/pageHandler/pages/index"
+	"strings"
+)
 
 var providers map[string]PageProvider
 
-func GetProviders(cacheTemplates bool, dataStorage string, pageHandler *PageHandler) map[string]PageProvider {
+func GetProviders(cacheTemplates bool, dataStorage string, pageHandler *PageHandler, templateStorage string, pageSettings []conf.PageYaml, ymlDataFallback bool) map[string]PageProvider {
 	if providers == nil {
 		providers = make(map[string]PageProvider)
 		if pageHandler != nil {
 			infoPage := newGoInfoPage(pageHandler, dataStorage, cacheTemplates)
 			providers[infoPage.GetPath()] = infoPage //Go Information Page
 		}
-		indexPage := index.NewPage(dataStorage, cacheTemplates)
+		for _, cpg := range pageSettings { //Register pages
-		providers[indexPage.GetPath()] = indexPage
+			if strings.EqualFold(cpg.PageName, index.PageName) {
+				indexPage := index.NewPage(dataStorage, cacheTemplates, templateStorage, cpg.GetPagePath(), ymlDataFallback)
+				providers[indexPage.GetPath()] = indexPage
+			}
+		}
 	}
 	return providers
 }

pageHandler/pages/index/data.go

@@ -3,18 +3,19 @@ package index
 import "html/template"
 
 type DataYaml struct {
-	HeaderLinks          map[string]template.URL `yaml:"headerLinks"`
+	HeaderLinks            map[string]template.URL `yaml:"headerLinks"`
-	CSSBaseURL           template.URL            `yaml:"cssBaseURL"`
+	CSSBaseURL             template.URL            `yaml:"cssBaseURL"`
-	CSSLightURL          template.URL            `yaml:"cssLightURL"`
+	CSSLightURL            template.URL            `yaml:"cssLightURL"`
-	CSSDarkURL           template.URL            `yaml:"cssDarkURL"`
+	CSSDarkURL             template.URL            `yaml:"cssDarkURL"`
-	JScriptURL           template.URL            `yaml:"jScriptURL"`
+	JScriptURL             template.URL            `yaml:"jScriptURL"`
-	NoVideoImageLocation template.URL            `yaml:"noVideoImageLocation"`
+	PlayVideoImageLocation template.URL            `yaml:"playVideoImageLocation"`
-	LogoImageLocation    template.URL            `yaml:"logoImageLocation"`
+	NoVideoImageLocation   template.URL            `yaml:"noVideoImageLocation"`
-	SunImageLocation     template.URL            `yaml:"sunImageLocation"`
+	LogoImageLocation      template.URL            `yaml:"logoImageLocation"`
-	MoonImageLocation    template.URL            `yaml:"moonImageLocation"`
+	SunImageLocation       template.URL            `yaml:"sunImageLocation"`
-	SortImageLocation    template.URL            `yaml:"sortImageLocation"`
+	MoonImageLocation      template.URL            `yaml:"moonImageLocation"`
-	About                AboutYaml               `yaml:"about"`
+	SortImageLocation      template.URL            `yaml:"sortImageLocation"`
-	Entries              []EntryYaml             `yaml:"entries"`
+	About                  AboutYaml               `yaml:"about"`
+	Entries                []EntryYaml             `yaml:"entries"`
 }
 
 func (dy DataYaml) GetHeaderLabels() []string {

pageHandler/pages/index/entry.go

@@ -5,21 +5,23 @@ import (
 	"html/template"
 	"math"
 	"net/http"
+	"strings"
 	"time"
 )
 
 const dateFormat = "01/2006"
 
 type EntryYaml struct {
-	Name               string         `yaml:"name"`
+	Name                   string         `yaml:"name"`
-	Content            string         `yaml:"content"`
+	Content                string         `yaml:"content"`
-	StartDate          yaml.DateType  `yaml:"startDate"`
+	StartDate              yaml.DateType  `yaml:"startDate"`
-	EndDate            yaml.DateType  `yaml:"endDate"`
+	EndDate                yaml.DateType  `yaml:"endDate"`
-	VideoLocation      template.URL   `yaml:"videoLocation"`
+	VideoLocation          template.URL   `yaml:"videoLocation"`
-	VideoContentType   string         `yaml:"videoContentType"`
+	VideoContentType       string         `yaml:"videoContentType"`
-	ThumbnailLocations []template.URL `yaml:"thumbnailLocations"`
+	ThumbnailLocations     []template.URL `yaml:"thumbnailLocations"`
-	ImageLocations     []template.URL `yaml:"imageLocations"`
+	ImageLocations         []template.URL `yaml:"imageLocations"`
-	ImageAltTexts      []string       `yaml:"imageAltTexts"`
+	ImageAltTexts          []string       `yaml:"imageAltTexts"`
+	VideoThumbnailLocation template.URL   `yaml:"videoThumbnailLocation"`
 }
 
 type ImageReference struct {
@@ -28,6 +30,18 @@ type ImageReference struct {
 	ImageAltText      string
 }
 
+func (ey EntryYaml) GetVideoThumbnail(usual template.URL) template.URL {
+	if ey.VideoThumbnailLocation == "" {
+		return usual
+	} else {
+		return ey.VideoThumbnailLocation
+	}
+}
+
+func (ey EntryYaml) IsVideoLink() bool {
+	return strings.EqualFold(ey.VideoContentType, "text/uri-list")
+}
+
 func (ey EntryYaml) GetStartDate() string {
 	return ey.StartDate.Format(dateFormat)
 }

pageHandler/pages/index/index-page.go

@@ -1,6 +1,7 @@
 package index
 
 import (
+	"errors"
 	"golang.captainalm.com/cityuni-webserver/utils/io"
 	"gopkg.in/yaml.v3"
 	"html/template"
@@ -12,10 +13,10 @@ import (
 	"time"
 )
 
+const PageName = "index"
 const templateName = "index.go.html"
-const yamlName = "index.go.yml"
 
-func NewPage(dataStore string, cacheTemplates bool) *Page {
+func NewPage(dataStore string, cacheTemplates bool, templateStore string, pagePath string, ymlDataFallback bool) *Page {
 	var ptm *sync.Mutex
 	var sdm *sync.Mutex
 	if cacheTemplates {
@@ -23,7 +24,10 @@ func NewPage(dataStore string, cacheTemplates bool) *Page {
 		sdm = &sync.Mutex{}
 	}
 	pageToReturn := &Page{
-		DataStore:         dataStore,
+		YMLDataFallback:   ymlDataFallback,
+		PagePath:          pagePath,
+		DataPath:          path.Join(dataStore, pagePath),
+		TemplatePath:      path.Join(templateStore, templateName),
 		StoredDataMutex:   sdm,
 		PageTemplateMutex: ptm,
 	}
@@ -31,7 +35,10 @@ func NewPage(dataStore string, cacheTemplates bool) *Page {
 }
 
 type Page struct {
-	DataStore            string
+	YMLDataFallback      bool
+	PagePath             string
+	DataPath             string
+	TemplatePath         string
 	StoredDataMutex      *sync.Mutex
 	StoredData           *DataYaml
 	LastModifiedData     time.Time
@@ -41,7 +48,7 @@ type Page struct {
 }
 
 func (p *Page) GetPath() string {
-	return "/index.go"
+	return p.PagePath
 }
 
 func (p *Page) GetLastModified() time.Time {
@@ -129,16 +136,12 @@ func (p *Page) getPageTemplate() (*template.Template, error) {
 		defer p.PageTemplateMutex.Unlock()
 	}
 	if p.PageTemplate == nil {
-		thePath := templateName
+		stat, err := os.Stat(p.TemplatePath)
-		if p.DataStore != "" {
-			thePath = path.Join(p.DataStore, thePath)
-		}
-		stat, err := os.Stat(thePath)
 		if err != nil {
 			return nil, err
 		}
 		p.LastModifiedTemplate = stat.ModTime()
-		loadedData, err := os.ReadFile(thePath)
+		loadedData, err := os.ReadFile(p.TemplatePath)
 		if err != nil {
 			return nil, err
 		}
@@ -161,13 +164,18 @@ func (p *Page) getPageData() (*DataYaml, error) {
 		defer p.StoredDataMutex.Unlock()
 	}
 	if p.StoredData == nil {
-		thePath := yamlName
+		thePath := p.DataPath
-		if p.DataStore != "" {
-			thePath = path.Join(p.DataStore, thePath)
-		}
 		stat, err := os.Stat(thePath)
 		if err != nil {
-			return nil, err
+			if p.YMLDataFallback && errors.Is(err, os.ErrNotExist) {
+				thePath += ".yml"
+				stat, err = os.Stat(thePath)
+				if err != nil {
+					return nil, err
+				}
+			} else {
+				return nil, err
+			}
 		}
 		p.LastModifiedData = stat.ModTime()
 		fileHandle, err := os.Open(thePath)
@@ -189,15 +197,16 @@ func (p *Page) getPageData() (*DataYaml, error) {
 			p.StoredData = dataYaml
 		}
 		return dataYaml, nil
+
 	} else {
 		return p.StoredData, nil
 	}
 }
 
 func getSortValue(toCheckIn string) int8 {
-	if toCheckIn == "desc" || toCheckIn == "descending" {
+	if toCheckIn == "asc" || toCheckIn == "ascending" {
-		return -1
-	} else {
 		return 1
+	} else {
+		return -1
 	}
 }

pageHandler/pages/index/template-marshal.go

@@ -13,9 +13,10 @@ type Marshal struct {
 	OrderName      int8
 	OrderDuration  int8
 	Light          bool
+	Counter        int
 }
 
-func (m Marshal) GetEntries() (toReturn []EntryYaml) {
+func (m *Marshal) GetEntries() (toReturn []EntryYaml) {
 	toReturn = m.Data.Entries
 	if m.OrderStartDate > 0 {
 		sort.Slice(toReturn, func(i, j int) bool {
@@ -59,3 +60,9 @@ func (m Marshal) GetEntries() (toReturn []EntryYaml) {
 	}
 	return toReturn
 }
+
+func (m *Marshal) CounterPlusPlus() int {
+	toret := m.Counter
+	m.Counter++
+	return toret
+}