From f286ee632094e74ac5f7ef39cd30bfa2ece1f19d Mon Sep 17 00:00:00 2001
From: liushuyu <liushuyu011@gmail.com>
Date: Sat, 7 May 2022 16:09:06 -0600
Subject: [PATCH 1/9] layouts: use new Hugo context syntax

---
 layouts/_default/baseof.html            | 4 ++--
 layouts/partials/layout/pagination.html | 6 +++---
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index ae71fb3..4bb1213 100755
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -7,14 +7,14 @@
     <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
     <meta name="theme-color" content="#404040">
 
-    <meta property="og:title" content="{{ if ne .URL " / " }}{{ .Title }} &middot; {{ end }}{{ .Site.Title }}" />
+    <meta property="og:title" content="{{ if ne .RelPermalink " / " }}{{ .Title }} &middot; {{ end }}{{ .Site.Title }}" />
     <meta property="og:site_name" content="{{ .Site.Title }}" />
     <meta property="og:url" content="{{ .Permalink }}" />
     {{ .Render "meta" }}
 
     <link rel="icon" href="{{ .Site.BaseURL }}/favicon.ico" />
     <link rel="shortcut icon" href="{{ .Site.BaseURL }}/favicon.ico" type="image/x-icon" />
-    <link rel="canonical" href="{{ .Permalink }}"> {{ if .RSSLink }}
+    <link rel="canonical" href="{{ .Permalink }}"> {{ if .OutputFormats.Get "RSS" }}
     <link href="{{ .Site.BaseURL }}/index.xml" rel="alternate" type="application/rss+xml" title="{{ .Site.Title }}" />
     <link href="{{ .Site.BaseURL }}/index.xml" rel="feed" type="application/rss+xml" title="{{ .Site.Title }}" /> {{ end }}
 
diff --git a/layouts/partials/layout/pagination.html b/layouts/partials/layout/pagination.html
index 90ee66c..fca1063 100755
--- a/layouts/partials/layout/pagination.html
+++ b/layouts/partials/layout/pagination.html
@@ -7,17 +7,17 @@
     <nav class="pagination is-right" role="navigation" aria-label="pagination">
 
       {{ if $paginator.HasPrev }}
-        <a class="pagination-previous" href="{{ $paginator.Prev.URL }}">Previous Page</a>
+        <a class="pagination-previous" href="{{ $paginator.Prev.RelPermalink }}">Previous Page</a>
       {{ end }}
       
       {{ if $paginator.HasNext }}
-        <a class="pagination-next" href="{{ $paginator.Next.URL }}">Next Page</a>
+        <a class="pagination-next" href="{{ $paginator.Next.RelPermalink }}">Next Page</a>
       {{ end }}
 
       <ul class="pagination-list">
         {{ range $paginator.Pagers }}
         <li>
-          <a class="pagination-link" aria-label="Goto page {{ .PageNumber}}" href="{{ .URL }}">{{ .PageNumber }}</a>
+          <a class="pagination-link" aria-label="Goto page {{ .PageNumber}}" href="{{ .RelPermalink }}">{{ .PageNumber }}</a>
         </li>
         {{ end }}
       </ul>

From 95be508e279684da66a6dc089563c5492c579ef6 Mon Sep 17 00:00:00 2001
From: liushuyu <liushuyu011@gmail.com>
Date: Sat, 7 May 2022 16:44:24 -0600
Subject: [PATCH 2/9] layout/default: use Hugo to bundle the JS files

---
 layouts/_default/baseof.html | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 4bb1213..b6c1303 100755
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -101,7 +101,8 @@
         </footer>
     </div>
 
-    <script src="{{ .Site.BaseURL }}/js/script.js"></script>
+    {{ $mainJs := resources.Match "js/**.js" | resources.Concat "js/script.js" | minify | fingerprint }}
+    <script src="{{ $mainJs.Permalink }}" integrity="{{ $mainJs.Data.Integrity }}"></script>
     {{- block "scripts" . }}{{- end }}
 
     {{- if eq (getenv "HUGO_ENV") "PRD" }}

From 3fd2b76d9276e547ce79b8a4f37b7d50b688eeda Mon Sep 17 00:00:00 2001
From: liushuyu <liushuyu011@gmail.com>
Date: Fri, 13 May 2022 16:28:20 -0600
Subject: [PATCH 3/9] layouts: add CORS policy to the script tag

---
 layouts/_default/baseof.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index b6c1303..76bb84a 100755
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -102,7 +102,7 @@
     </div>
 
     {{ $mainJs := resources.Match "js/**.js" | resources.Concat "js/script.js" | minify | fingerprint }}
-    <script src="{{ $mainJs.Permalink }}" integrity="{{ $mainJs.Data.Integrity }}"></script>
+    <script src="{{ $mainJs.Permalink }}" integrity="{{ $mainJs.Data.Integrity }}" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
     {{- block "scripts" . }}{{- end }}
 
     {{- if eq (getenv "HUGO_ENV") "PRD" }}

From 703e0549721ddc594dd0e20c192eebc412ba3a7f Mon Sep 17 00:00:00 2001
From: liushuyu <liushuyu011@gmail.com>
Date: Fri, 13 May 2022 16:52:28 -0600
Subject: [PATCH 4/9] layouts: disable SRI fingerprinting ...

... since CORS policy is not possible to set in GitHub Pages
---
 layouts/_default/baseof.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 76bb84a..ce4f9e3 100755
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -101,8 +101,8 @@
         </footer>
     </div>
 
-    {{ $mainJs := resources.Match "js/**.js" | resources.Concat "js/script.js" | minify | fingerprint }}
-    <script src="{{ $mainJs.Permalink }}" integrity="{{ $mainJs.Data.Integrity }}" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+    {{ $mainJs := resources.Match "js/**.js" | resources.Concat "js/script.js" | minify }}
+    <script src="{{ $mainJs.Permalink }}"></script>
     {{- block "scripts" . }}{{- end }}
 
     {{- if eq (getenv "HUGO_ENV") "PRD" }}

From 0589bffbb1b63eb511d93355c78d5f23a6c01b7f Mon Sep 17 00:00:00 2001
From: FearlessTobi <thm.frey@gmail.com>
Date: Thu, 20 Oct 2022 01:16:05 +0200
Subject: [PATCH 5/9] game/list: Add pagination and a search bar

---
 layouts/game/list.html | 114 ++++++++++++++++++++++++++++++++++++++---
 1 file changed, 106 insertions(+), 8 deletions(-)

diff --git a/layouts/game/list.html b/layouts/game/list.html
index 31a5eb0..e3f65cc 100644
--- a/layouts/game/list.html
+++ b/layouts/game/list.html
@@ -24,19 +24,46 @@
 {{ end }}
 
 {{ define "main" }}
-<div class="section pt-xs">
-    <table class="table is-fullwidth">
-        <thead>
-            <tr>
-                <th>Game Title</th>
-                <th>Compatibility</th>
-                <th>Date Tested</th>
+    <div id="game-listing">
+	<div class="container1">
+			<div class="div1">
+		<ul class="pagination paginationTop is-pulled-left"></ul> 
+		</div>
+        <div>
+            <form>
+                <div class="form-group">
+                    <table>
+                        <tr>
+                            <td>
+                                <div class="input-group search-box div2">
+                                    <input type="text" class="search input is-rounded" id="search-box" placeholder="Search...">
+                                    <!-- <span class="clear-search input-group-addon">X</span> -->
+                                </div>
+                            </td>
+                        </tr>
+                    </table>
+                </div>
+            </form>
+        </div>
+		</div>
+ 
+ <div class="section pt-xs">
+        <table id="compatibility-list" class="table table-responsive is-fullwidth">
+            <thead>
+                <tr>
+                    <th></th>
+                    <th class="sort" data-sort="title">Game Title</th>
+                    <th class="sort" data-sort="compatibility">Compatibility</th>
+                    <th class="sort" data-sort="date-tested">Date Tested</th>
             </tr>
         </thead>
-        <tbody class="is-size-7">
+        <tbody class="list is-size-6">
             {{ range .Pages }}
             {{ $rating := index .Site.Data.compatibility .Params.compatibility }}
             <tr data-key="{{ .Params.section_id }}">
+			<td class="hidden listing-metadata">
+                            <span hidden>{{ .Params.title }} {{ $rating.name }}</span>
+                        </td>
                 <td data-title="{{ .Params.title }}">
                     <a href="{{ .Permalink }}">{{ .Params.title }}</a>
                 </td>
@@ -54,8 +81,79 @@
             {{ end }}
         </tbody>
     </table>
+        <ul class="pagination paginationBottom is-pulled-left"></ul>
+		</div>
 </div>
 {{ end }}
 
 {{ define "scripts" }}
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"
+                integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
+	<script src="https://cdnjs.cloudflare.com/ajax/libs/list.js/2.3.1/list.min.js"></script>
+
+<script type="text/javascript">
+    $(function() {
+        function getLastSorted(list){
+            var currentSorted = $(list.listContainer).find(".asc, .desc").attr("data-sort");
+            if ('undefined' !== typeof currentSorted)
+                list.lastSorted = currentSorted;
+            return list.lastSorted;
+        }
+ 
+        function filterTable(_) {
+            var rating = this.name;
+            var index = this.index;
+ 
+            $("#search-box").val(rating);
+            list.search(index, ['compatibility']);
+        }
+ 
+        function clearSearch() {
+            $("#search-box").val("");
+            list.search();
+        }
+ 
+        var options = {
+            valueNames: [
+                'listing-metadata',
+                { name: 'title', attr: 'data-title' },
+                { name: 'compatibility', attr: 'data-compatibility' },
+                { name: 'date-tested', attr: 'data-timestamp' }
+            ],
+            searchColumns: [ 'listing-metadata' ],
+            pagination: [
+                { paginationClass: "paginationTop" },
+                { paginationClass: "paginationBottom" }
+            ],
+            indexAsync: true,
+            page: 30
+        };
+ 
+        var list = new List('game-listing', options);
+ 
+        list.sort("title", {order: "asc"});
+ 
+        list.on("updated", function(list){
+            var $list = $(list.list);
+            var $items = $list.children();
+            $items.removeClass("key");
+            if ('title' == getLastSorted(list)){
+                $items.each(function(){
+                    var key = $(this).attr("data-key")
+                    if (
+                        $list
+                        .children("[data-key='" + key + "']")
+                        .first()
+                        .is( $(this) )
+                    ){
+                        $(this).addClass("key");
+                    }
+                })
+            }
+        });
+ 
+        $('#game-listing .clear-search').click(clearSearch);
+    });
+</script>
+
 {{ end }}

From de5fc54048747132aa767415f6e4245a031ca193 Mon Sep 17 00:00:00 2001
From: FearlessTobi <thm.frey@gmail.com>
Date: Thu, 20 Oct 2022 01:19:21 +0200
Subject: [PATCH 6/9] game/list: Reformat html

---
 layouts/game/list.html | 152 ++++++++++++++++++++---------------------
 1 file changed, 76 insertions(+), 76 deletions(-)

diff --git a/layouts/game/list.html b/layouts/game/list.html
index e3f65cc..27ebce4 100644
--- a/layouts/game/list.html
+++ b/layouts/game/list.html
@@ -1,95 +1,95 @@
 {{ define "header" }}
 <div class="container">
-    <div class="section pb-xs">
-        <h1 class="title">Game Compatibility List</h1>
-        <p class="content">
-            The compatibility list contains all the games we tested, sorted by how well they work on the emulator.
-        </p>
-        <table class="table is-fullwidth">
-            <tbody>
-                {{ range .Site.Data.compatibility }}
-                <tr>
-                    <td>
-                        <div class="is-square" style="background-color: {{ .color }}"></div> {{ .name }}
-                    </td>
-                    <td>{{ .description }}</td>
-                </tr>
-                {{ end }}
-            </tbody>
-        </table>
-
-        <!-- <div id="highchart-container" style="height: 100px; margin: 0 auto"></div> -->
-    </div>
+   <div class="section pb-xs">
+      <h1 class="title">Game Compatibility List</h1>
+      <p class="content">
+         The compatibility list contains all the games we tested, sorted by how well they work on the emulator.
+      </p>
+      <table class="table is-fullwidth">
+         <tbody>
+            {{ range .Site.Data.compatibility }}
+            <tr>
+               <td>
+                  <div class="is-square" style="background-color: {{ .color }}"></div>
+                  {{ .name }}
+               </td>
+               <td>{{ .description }}</td>
+            </tr>
+            {{ end }}
+         </tbody>
+      </table>
+      <!-- <div id="highchart-container" style="height: 100px; margin: 0 auto"></div> -->
+   </div>
 </div>
 {{ end }}
 
 {{ define "main" }}
-    <div id="game-listing">
-	<div class="container1">
-			<div class="div1">
-		<ul class="pagination paginationTop is-pulled-left"></ul> 
-		</div>
-        <div>
-            <form>
-                <div class="form-group">
-                    <table>
-                        <tr>
-                            <td>
-                                <div class="input-group search-box div2">
-                                    <input type="text" class="search input is-rounded" id="search-box" placeholder="Search...">
-                                    <!-- <span class="clear-search input-group-addon">X</span> -->
-                                </div>
-                            </td>
-                        </tr>
-                    </table>
-                </div>
-            </form>
-        </div>
-		</div>
- 
- <div class="section pt-xs">
-        <table id="compatibility-list" class="table table-responsive is-fullwidth">
-            <thead>
-                <tr>
-                    <th></th>
-                    <th class="sort" data-sort="title">Game Title</th>
-                    <th class="sort" data-sort="compatibility">Compatibility</th>
-                    <th class="sort" data-sort="date-tested">Date Tested</th>
+<div id="game-listing">
+   <div class="container1">
+      <div class="div1">
+         <ul class="pagination paginationTop is-pulled-left"></ul>
+      </div>
+      <div>
+         <form>
+            <div class="form-group">
+               <table>
+                  <tr>
+                     <td>
+                        <div class="input-group search-box div2">
+                           <input type="text" class="search input is-rounded" id="search-box" placeholder="Search...">
+                           <!-- <span class="clear-search input-group-addon">X</span> -->
+                        </div>
+                     </td>
+                  </tr>
+               </table>
+            </div>
+         </form>
+      </div>
+   </div>
+   <div class="section pt-xs">
+      <table id="compatibility-list" class="table table-responsive is-fullwidth">
+         <thead>
+            <tr>
+               <th></th>
+               <th class="sort" data-sort="title">Game Title</th>
+               <th class="sort" data-sort="compatibility">Compatibility</th>
+               <th class="sort" data-sort="date-tested">Date Tested</th>
             </tr>
-        </thead>
-        <tbody class="list is-size-6">
+         </thead>
+         <tbody class="list is-size-6">
             {{ range .Pages }}
             {{ $rating := index .Site.Data.compatibility .Params.compatibility }}
             <tr data-key="{{ .Params.section_id }}">
-			<td class="hidden listing-metadata">
-                            <span hidden>{{ .Params.title }} {{ $rating.name }}</span>
-                        </td>
-                <td data-title="{{ .Params.title }}">
-                    <a href="{{ .Permalink }}">{{ .Params.title }}</a>
-                </td>
-                <td data-compatibility="{{ $rating.key }}">
-                    <div class="is-square" style="background-color: {{ $rating.color }}"></div> <span>{{ $rating.name }}</span>
-                </td>
-                <td data-timestamp="{{ .Params.testcase_date }}">
-					{{ if .Params.testcase_date }}
-					<span>{{ dateFormat "January 2, 2006" .Params.testcase_date }}</span>
-					{{ else }}
-					<span></span>
-					{{ end }}
-                </td>
+               <td class="hidden listing-metadata">
+                  <span hidden>{{ .Params.title }} {{ $rating.name }}</span>
+               </td>
+               <td data-title="{{ .Params.title }}">
+                  <a href="{{ .Permalink }}">{{ .Params.title }}</a>
+               </td>
+               <td data-compatibility="{{ $rating.key }}">
+                  <div class="is-square" style="background-color: {{ $rating.color }}"></div>
+                  <span>{{ $rating.name }}</span>
+               </td>
+               <td data-timestamp="{{ .Params.testcase_date }}">
+                  {{ if .Params.testcase_date }}
+                  <span>{{ dateFormat "January 2, 2006" .Params.testcase_date }}</span>
+                  {{ else }}
+                  <span></span>
+                  {{ end }}
+               </td>
             </tr>
             {{ end }}
-        </tbody>
-    </table>
-        <ul class="pagination paginationBottom is-pulled-left"></ul>
-		</div>
+         </tbody>
+      </table>
+      <ul class="pagination paginationBottom is-pulled-left"></ul>
+   </div>
 </div>
 {{ end }}
 
 {{ define "scripts" }}
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"
-                integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
-	<script src="https://cdnjs.cloudflare.com/ajax/libs/list.js/2.3.1/list.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js" 
+        integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/list.js/2.3.1/list.min.js"></script>
 
 <script type="text/javascript">
     $(function() {

From 2e6d6cf398fab223e0cc2f33dda380840d9ddb77 Mon Sep 17 00:00:00 2001
From: FearlessTobi <thm.frey@gmail.com>
Date: Tue, 25 Oct 2022 10:30:42 +0200
Subject: [PATCH 7/9] game/list: Improve wording, use more descriptive variable
 names

---
 layouts/game/list.html | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/layouts/game/list.html b/layouts/game/list.html
index 27ebce4..1cb0e2c 100644
--- a/layouts/game/list.html
+++ b/layouts/game/list.html
@@ -3,7 +3,7 @@
    <div class="section pb-xs">
       <h1 class="title">Game Compatibility List</h1>
       <p class="content">
-         The compatibility list contains all the games we tested, sorted by how well they work on the emulator.
+         The compatibility list contains all the games that have been tested, sorted by how well they work on the emulator.
       </p>
       <table class="table is-fullwidth">
          <tbody>
@@ -25,8 +25,8 @@
 
 {{ define "main" }}
 <div id="game-listing">
-   <div class="container1">
-      <div class="div1">
+   <div class="pagination-search-container">
+      <div class="pagination-container">
          <ul class="pagination paginationTop is-pulled-left"></ul>
       </div>
       <div>
@@ -35,7 +35,7 @@
                <table>
                   <tr>
                      <td>
-                        <div class="input-group search-box div2">
+                        <div class="input-group search-box search-container">
                            <input type="text" class="search input is-rounded" id="search-box" placeholder="Search...">
                            <!-- <span class="clear-search input-group-addon">X</span> -->
                         </div>

From fd7df582bf498a366e00fcd6c80a9ab15e777b2d Mon Sep 17 00:00:00 2001
From: FearlessTobi <thm.frey@gmail.com>
Date: Tue, 25 Oct 2022 13:24:27 +0200
Subject: [PATCH 8/9] game/list: Add compatibility chart

---
 layouts/game/list.html | 59 +++++++++++++++++++++++++++++++++++-------
 1 file changed, 49 insertions(+), 10 deletions(-)

diff --git a/layouts/game/list.html b/layouts/game/list.html
index 1cb0e2c..2ec29dd 100644
--- a/layouts/game/list.html
+++ b/layouts/game/list.html
@@ -18,7 +18,7 @@
             {{ end }}
          </tbody>
       </table>
-      <!-- <div id="highchart-container" style="height: 100px; margin: 0 auto"></div> -->
+	  <canvas id="chartjs-container" style="width:100%;height:130px"></canvas>
    </div>
 </div>
 {{ end }}
@@ -63,14 +63,14 @@
                <td class="hidden listing-metadata">
                   <span hidden>{{ .Params.title }} {{ $rating.name }}</span>
                </td>
-               <td data-title="{{ .Params.title }}">
+               <td class="game-title" data-title="{{ .Params.title }}">
                   <a href="{{ .Permalink }}">{{ .Params.title }}</a>
                </td>
-               <td data-compatibility="{{ $rating.key }}">
+               <td class="compatibility" data-compatibility="{{ $rating.key }}">
                   <div class="is-square" style="background-color: {{ $rating.color }}"></div>
                   <span>{{ $rating.name }}</span>
                </td>
-               <td data-timestamp="{{ .Params.testcase_date }}">
+               <td class="date-tested" data-timestamp="{{ .Params.testcase_date }}">
                   {{ if .Params.testcase_date }}
                   <span>{{ dateFormat "January 2, 2006" .Params.testcase_date }}</span>
                   {{ else }}
@@ -90,6 +90,7 @@
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js" 
         integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/list.js/2.3.1/list.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.9.1/chart.min.js"></script>
 
 <script type="text/javascript">
     $(function() {
@@ -100,11 +101,8 @@
             return list.lastSorted;
         }
  
-        function filterTable(_) {
-            var rating = this.name;
-            var index = this.index;
- 
-            $("#search-box").val(rating);
+        function filterTable(index, name) {
+            $("#search-box").val(name);
             list.search(index, ['compatibility']);
         }
  
@@ -116,7 +114,7 @@
         var options = {
             valueNames: [
                 'listing-metadata',
-                { name: 'title', attr: 'data-title' },
+                { name: 'game-title', attr: 'data-title' },
                 { name: 'compatibility', attr: 'data-compatibility' },
                 { name: 'date-tested', attr: 'data-timestamp' }
             ],
@@ -153,6 +151,47 @@
         });
  
         $('#game-listing .clear-search').click(clearSearch);
+		
+        let dataset = [
+					{{- $dataPages := .Data.Pages }}
+					{{- range .Site.Data.compatibility }}
+					{{- $dataPagesFiltered := where $dataPages ".Params.compatibility" .key }}
+					{ axis: "y", "label": "{{ .name }}", "data": [ {{ len $dataPagesFiltered }} ], backgroundColor: "{{ .color }}" },
+					{{- end }}
+        ].reverse()
+
+		
+		var chart = new Chart("chartjs-container", {
+			type: 'bar',
+			data: {
+				labels: [""],
+				datasets: dataset
+			},
+			options: {
+				plugins: {
+					legend: {
+						display: false
+					}
+				},
+				responsive: true,
+				scales: {
+					x: { stacked: true },
+					y: { stacked: true },
+				},
+				indexAxis: 'y',
+				onClick: (e) => {
+					const points = chart.getElementsAtEventForMode(e, 'nearest', {
+						intersect: true
+					}, true);
+					
+					if(points.length) {
+					    // The index of compatibility ratings is reversed
+						filterTable(dataset.length - points[0].datasetIndex - 1, dataset[points[0].datasetIndex].label);
+					}
+				},
+			},
+		});
+
     });
 </script>
 

From 8e449ec43b8cbb00345b680f0f634b05924c8e62 Mon Sep 17 00:00:00 2001
From: FearlessTobi <thm.frey@gmail.com>
Date: Sun, 30 Oct 2022 13:55:00 +0100
Subject: [PATCH 9/9] game/list: Address feedback

---
 layouts/game/list.html | 23 ++++++++++-------------
 1 file changed, 10 insertions(+), 13 deletions(-)

diff --git a/layouts/game/list.html b/layouts/game/list.html
index 2ec29dd..cb5a2c1 100644
--- a/layouts/game/list.html
+++ b/layouts/game/list.html
@@ -37,7 +37,6 @@
                      <td>
                         <div class="input-group search-box search-container">
                            <input type="text" class="search input is-rounded" id="search-box" placeholder="Search...">
-                           <!-- <span class="clear-search input-group-addon">X</span> -->
                         </div>
                      </td>
                   </tr>
@@ -71,11 +70,7 @@
                   <span>{{ $rating.name }}</span>
                </td>
                <td class="date-tested" data-timestamp="{{ .Params.testcase_date }}">
-                  {{ if .Params.testcase_date }}
-                  <span>{{ dateFormat "January 2, 2006" .Params.testcase_date }}</span>
-                  {{ else }}
-                  <span></span>
-                  {{ end }}
+                  <span>{{ if .Params.testcase_date }}{{ dateFormat "January 2, 2006" .Params.testcase_date }}{{ end }}</span>
                </td>
             </tr>
             {{ end }}
@@ -87,16 +82,18 @@
 {{ end }}
 
 {{ define "scripts" }}
-<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js" 
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"
         integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/list.js/2.3.1/list.min.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.9.1/chart.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/list.js/2.3.1/list.min.js"
+        integrity="sha256-NEVvGNMGqFvs6adGLZjm5sLgcuX9rGTg1wlGtA1f7M8=" crossorigin="anonymous"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.9.1/chart.min.js"
+        integrity="sha256-+8RZJua0aEWg+QVVKg4LEzEEm/8RFez5Tb4JBNiV5xA=" crossorigin="anonymous"></script>
 
 <script type="text/javascript">
     $(function() {
         function getLastSorted(list){
             var currentSorted = $(list.listContainer).find(".asc, .desc").attr("data-sort");
-            if ('undefined' !== typeof currentSorted)
+            if (!currentSorted)
                 list.lastSorted = currentSorted;
             return list.lastSorted;
         }
@@ -135,7 +132,7 @@
             var $list = $(list.list);
             var $items = $list.children();
             $items.removeClass("key");
-            if ('title' == getLastSorted(list)){
+            if ('title' === getLastSorted(list)){
                 $items.each(function(){
                     var key = $(this).attr("data-key")
                     if (
@@ -152,7 +149,7 @@
  
         $('#game-listing .clear-search').click(clearSearch);
 		
-        let dataset = [
+        var dataset = [
 					{{- $dataPages := .Data.Pages }}
 					{{- range .Site.Data.compatibility }}
 					{{- $dataPagesFiltered := where $dataPages ".Params.compatibility" .key }}
@@ -180,7 +177,7 @@
 				},
 				indexAxis: 'y',
 				onClick: (e) => {
-					const points = chart.getElementsAtEventForMode(e, 'nearest', {
+					var points = chart.getElementsAtEventForMode(e, 'nearest', {
 						intersect: true
 					}, true);