chore: refactor scripts code style

1 files changed, 72 insertions, 63 deletions

diff --git a/layouts/partials/comment.html b/layouts/partials/comment.html
index a6812a3..ff41275 100644
--- a/layouts/partials/comment.html
+++ b/layouts/partials/comment.html
@@ -1,84 +1,94 @@
-{{- if eq (getenv "HUGO_ENV") "production" | and .IsPage | and (ne .Params.comment false) -}}
+{{- if .Scratch.Get "production" | and .IsPage | and (ne .Params.comment false) -}}
+    {{- $CDN := .Scratch.Get "CDN" -}}
+
     {{- /* Disqus Comment System */ -}}
     {{- with .Site.Params.disqus.shortname -}}
         <div id="disqus_thread"></div>
-        <script src="https://{{ . }}.disqus.com/embed.js"></script>
-        <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
+        {{- $script := printf `<script src="https://%s.disqus.com/embed.js"></script>` . -}}
+        {{- slice $script | $.Scratch.Add "scriptCDN" -}}
+        <noscript>
+            Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a>
+        </noscript>
     {{- end -}}
 
     {{- /* Gitalk Comment System */ -}}
     {{- if .Site.Params.gitalk.owner -}}
         <div id="gitalk_container"></div>
-        {{- if .Site.Params.cdn.gitalk_css -}}
-            {{- .Site.Params.cdn.gitalk_css | safeHTML -}}
+        {{- with $CDN.gitalk_css -}}
+            {{- slice . | $.Scratch.Add "linkCDN" -}}
         {{- else -}}
-            {{- $res := resources.Get "css/lib/gitalk/gitalk.css" | minify -}}
-            <link rel="stylesheet" href="{{ $res.RelPermalink }}">
+            {{- slice "css/lib/gitalk/gitalk.css" | .Scratch.Add "linkLocal" -}}
         {{- end -}}
-        {{- if .Site.Params.cdn.gitalk_js -}}
-            {{ .Site.Params.cdn.gitalk_js | safeHTML -}}
+        {{- with $CDN.gitalk_js -}}
+            {{- slice . | $.Scratch.Add "scriptCDN" -}}
         {{- else -}}
-            {{- $res := resources.Get "js/lib/gitalk/gitalk.min.js" -}}
-            <script src="{{ $res.RelPermalink }}"></script>
+            {{- slice "css/lib/gitalk/gitalk.min.js" | .Scratch.Add "scriptLocal" -}}
         {{- end -}}
         <script>
-            var gitalk = new Gitalk({
-                id: '{{ .Date }}',
-                title: '{{ .Title }}',
-                clientID: '{{ .Site.Params.gitalk.clientId }}',
-                clientSecret: '{{ .Site.Params.gitalk.clientSecret }}',
-                repo: '{{ .Site.Params.gitalk.repo }}',
-                owner: '{{ .Site.Params.gitalk.owner }}',
-                admin: ['{{ .Site.Params.gitalk.owner }}'],
-                body: decodeURI(location.href),
+            document.addEventListener("DOMContentLoaded", function(event) {
+                var gitalk = new Gitalk({
+                    id: '{{ .Date }}',
+                    title: '{{ .Title }}',
+                    clientID: '{{ .Site.Params.gitalk.clientId }}',
+                    clientSecret: '{{ .Site.Params.gitalk.clientSecret }}',
+                    repo: '{{ .Site.Params.gitalk.repo }}',
+                    owner: '{{ .Site.Params.gitalk.owner }}',
+                    admin: ['{{ .Site.Params.gitalk.owner }}'],
+                    body: decodeURI(location.href),
+                });
+                gitalk.render('gitalk_container');
             });
-            gitalk.render('gitalk_container');
         </script>
-        <noscript>Please enable JavaScript to view the <a href="https://github.com/gitalk/gitalk">comments powered by Gitalk.</a></noscript>
+        <noscript>
+            Please enable JavaScript to view the <a href="https://github.com/gitalk/gitalk">comments powered by Gitalk.</a>
+        </noscript>
     {{- end -}}
 
     {{- /* Valine Comment System */ -}}
     {{- if .Site.Params.valine.enable -}}
         <div id="valine_container"></div>
-        {{- if .Site.Params.cdn.valine_js -}}
-            {{- .Site.Params.cdn.valine_js | safeHTML -}}
+        {{- with $CDN.valine_js -}}
+            {{- slice . | $.Scratch.Add "scriptCDN" -}}
         {{- else -}}
-            {{- $res := resources.Get "js/lib/valine/Valine.min.js" -}}
-            <script src="{{ $res.RelPermalink }}"></script>
+            {{- slice "js/lib/valine/Valine.min.js" | .Scratch.Add "scriptLocal" -}}
         {{- end -}}
         <script>
-            new Valine({
-                el: '#valine_container',
-                appId: '{{ .Site.Params.valine.appId }}',
-                appKey: '{{ .Site.Params.valine.appKey }}',
-                {{- with .Site.Params.valine.placeholder -}}
-                    placeholder: '{{ . }}',
-                {{- end -}}
-                {{- if .Site.Params.valine.notify -}}
-                    notify: true,
-                {{- end -}}
-                {{- if .Site.Params.valine.verify -}}
-                    verify: true,
-                {{- end -}}
-                {{- with .Site.Params.valine.avatar -}}
-                    avatar: '{{ . }}',
-                {{- end -}}
-                {{- with .Site.Params.valine.meta -}}
-                    meta: {{ . | safeJS }},
-                {{- end -}}
-                {{- with .Site.Params.valine.pageSize -}}
-                    pageSize: {{ . | safeJS }},
-                {{- end -}}
-                lang: '{{ T "valineLang" }}',
-                {{- if .Site.Params.valine.visitor -}}
-                    visitor: true,
-                {{- end -}}
-                {{- if .Site.Params.valine.recordIP -}}
-                    recordIP: true,
-                {{- end -}}
+            document.addEventListener("DOMContentLoaded", function(event) {
+                new Valine({
+                    el: '#valine_container',
+                    appId: '{{ .Site.Params.valine.appId }}',
+                    appKey: '{{ .Site.Params.valine.appKey }}',
+                    {{- with .Site.Params.valine.placeholder -}}
+                        placeholder: '{{ . }}',
+                    {{- end -}}
+                    {{- if .Site.Params.valine.notify -}}
+                        notify: true,
+                    {{- end -}}
+                    {{- if .Site.Params.valine.verify -}}
+                        verify: true,
+                    {{- end -}}
+                    {{- with .Site.Params.valine.avatar -}}
+                        avatar: '{{ . }}',
+                    {{- end -}}
+                    {{- with .Site.Params.valine.meta -}}
+                        meta: {{ . | safeJS }},
+                    {{- end -}}
+                    {{- with .Site.Params.valine.pageSize -}}
+                        pageSize: {{ . | safeJS }},
+                    {{- end -}}
+                    lang: '{{ T "valineLang" }}',
+                    {{- if .Site.Params.valine.visitor -}}
+                        visitor: true,
+                    {{- end -}}
+                    {{- if .Site.Params.valine.recordIP -}}
+                        recordIP: true,
+                    {{- end -}}
+                });
             });
         </script>
-        <noscript>Please enable JavaScript to view the <a href="https://valine.js.org/">comments powered by Valine.</a></noscript>
+        <noscript>
+            Please enable JavaScript to view the <a href="https://valine.js.org/">comments powered by Valine.</a>
+        </noscript>
     {{- end -}}
 
     {{- /* Facebook Comment System */ -}}
@@ -90,12 +100,11 @@
             data-width="{{ .Site.Params.facebook.width }}"
             data-numposts="{{ .Site.Params.facebook.numPosts }}"
         ></div>
-        <script
-            async
-            defer
-            crossorigin="anonymous"
-            src="https://connect.facebook.net/{{ .Site.Params.facebook.languageCode }}/sdk.js#xfbml=1&version=v5.0&appId={{ .Site.Params.facebook.appId }}&autoLogAppEvents=1"
-        ></script>
-        <noscript>Please enable JavaScript to view the <a href="https://developers.facebook.com/docs/plugins/comments/">comments powered by Facebook.</a></noscript>
+        {{- $script := `<script src="https://connect.facebook.net/%s/sdk.js#xfbml=1&version=v5.0&appId=%s&autoLogAppEvents=1" crossorigin="anonymous"></script>` -}}
+        {{- $script = printf $script .Site.Params.facebook.languageCode .Site.Params.facebook.appId -}}
+        {{- slice $script | .Scratch.Add "scriptCDN" -}}
+        <noscript>
+            Please enable JavaScript to view the <a href="https://developers.facebook.com/docs/plugins/comments/">comments powered by Facebook.</a>
+        </noscript>
     {{- end -}}
 {{- end -}}