Add voting system

themes/red/assets/js/voting.js

@@ -0,0 +1,18 @@
+function refresh(slug) {
+        fetch('https://voting.redstrate.com/votes/view/' + slug)
+        .then(function(response) {
+                return response.json();
+        })
+        .then(function(data) {
+                console.log(data)
+                document.getElementById("num-votes").innerHTML = data["votes"] + " votes";
+        });
+}
+
+function addVote(slug) {
+        const request = new Request("https://voting.redstrate.com/votes/submit/" + slug, {
+                method: "POST"
+        });
+        fetch(request)
+        .then((response) => { refresh(slug) });
+}

themes/red/layouts/_default/art-detail.html

@@ -4,7 +4,7 @@
     <hr>
 
     {{ with resources.Get .Params.filename }}
-        <img class="article-img" alt="{{ $.Params.alt_text }}" title="{{ $.Params.alt_text }}" src="{{ .RelPermalink }}"/>
+        <img class="article-img" style="display: block; max-height: 1000px; margin-left: auto; margin-right: auto;" alt="{{ $.Params.alt_text }}" title="{{ $.Params.alt_text }}" src="{{ .RelPermalink }}"/>
     {{ end }}
 
     <table>
@@ -78,6 +78,7 @@
         </tr>
     {{ end }}
 
+    {{ partial "voting" . }}
 
     </table>
 

themes/red/layouts/partials/voting.html

@@ -0,0 +1,16 @@
+<div style="width: 100px; margin-top: 20px; margin-bottom: 20px; margin-left: auto; margin-right: auto">
+        <button style="display: block; margin-left: auto; margin-right: auto" onClick="addVote({{ .Slug }})">Cool!</button>
+
+        <p style="text-align: center" id="num-votes">...</p>
+</div>
+
+{{ $site := resources.Get "js/voting.js" }}
+{{ if hugo.IsProduction }}
+    {{ $site = $site | minify | fingerprint | resources.PostProcess }}
+{{ end }}
+<script src="{{ $site.RelPermalink }}" integrity="{{ $site.Data.Integrity }}"></script>
+
+
+<script type="text/javascript">
+        refresh({{ .Slug }})
+</script>