From fa50013a4743f1cf0c014baf7f7ee93ca2efe04d Mon Sep 17 00:00:00 2001
From: Jimmy Cai <jimmehcai@gmail.com>
Date: Sat, 13 Feb 2021 11:04:37 +0100
Subject: [PATCH] style(comments): clean remark42 integration code

---
 exampleSite/config.yaml                       | 10 +--
 .../partials/comments/provider/remark42.html  | 71 ++++++-------------
 2 files changed, 28 insertions(+), 53 deletions(-)

diff --git a/exampleSite/config.yaml b/exampleSite/config.yaml
index d46e84d..b55925f 100644
--- a/exampleSite/config.yaml
+++ b/exampleSite/config.yaml
@@ -49,16 +49,16 @@ params:
     comments:
         enabled: true
         provider: disqus
-        
+
         utterances:
             repo:
             issueTerm: pathname
             label:
-            
+
         remark42:
-            host: # remark42服务端地址
-            site: # remark site id参数
-            locale: zh # en zh 语言
+            host:
+            site:
+            locale:
 
     widgets:
         enabled:
diff --git a/layouts/partials/comments/provider/remark42.html b/layouts/partials/comments/provider/remark42.html
index 6141010..9928825 100644
--- a/layouts/partials/comments/provider/remark42.html
+++ b/layouts/partials/comments/provider/remark42.html
@@ -1,54 +1,29 @@
+{{- with .Site.Params.comments.remark42 -}}
 <div id="remark42"></div>
 <script>
     var remark_config = {
-      host: "{{ .Site.Params.comments.remark42.host }}", // hostname of remark server, same as REMARK_URL in backend config, e.g. "https://demo.remark42.com"
-      site_id: '{{ .Site.Params.comments.remark42.site }}',
-      components: ['embed'], // optional param; which components to load. default to ["embed"]
-                             // to load all components define components as ['embed', 'last-comments', 'counter']
-                             // available component are:
-                             //     - 'embed': basic comments widget
-                             //     - 'last-comments': last comments widget, see `Last Comments` section below
-                             //     - 'counter': counter widget, see `Counter` section below
-    //   url: 'PAGE_URL', // optional param; if it isn't defined
-                       // `window.location.origin + window.location.pathname` will be used,
-                       //
-                       // Note that if you use query parameters as significant part of url
-                       // (the one that actually changes content on page)
-                       // you will have to configure url manually to keep query params, as
-                       // `window.location.origin + window.location.pathname` doesn't contain query params and
-                       // hash. For example default url for `https://example/com/example-post?id=1#hash`
-                       // would be `https://example/com/example-post`.
-                       //
-                       // The problem with query params is that they often contain useless params added by
-                       // various trackers (utm params) and doesn't have defined order, so Remark treats differently
-                       // all this examples:
-                       // https://example.com/?postid=1&date=2007-02-11
-                       // https://example.com/?date=2007-02-11&postid=1
-                       // https://example.com/?date=2007-02-11&postid=1&utm_source=google
-                       //
-                       // If you deal with query parameters make sure you pass only significant part of it
-                       // in well defined order
-      max_shown_comments: 10, // optional param; if it isn't defined default value (15) will be used
-      theme: document.body.dataset.scheme, // optional param; if it isn't defined default value ('light') will be used
-    //   page_title: 'Moving to Remark42', // optional param; if it isn't defined `document.title` will be used
-      locale: '{{ .Site.Params.comments.remark42.locale }}', // set up locale and language, if it isn't defined default value ('en') will be used
-      show_email_subscription: true // optional param; by default it is `true` and you can see email subscription feature
-                                     // in interface when enable it from backend side
-                                     // if you set this param in `false` you will get notifications email notifications as admin
-                                     // but your users won't have interface for subscription
+        host: "{{ .host }}",
+        site_id: '{{ .site }}',
+        components: ['embed'],
+        url: "{{ $.Permalink }}",
+        max_shown_comments: {{ default 15 .max_shown_comments }},
+        theme: document.body.dataset.scheme,
+        page_title: '{{ $.Title }}',
+        locale: '{{ default "en" .locale }}',
+        show_email_subscription: {{ default true .show_email_subscription }}
     };
-  
-    (function(c) {
-      for(var i = 0; i < c.length; i++){
-        var d = document, s = d.createElement('script');
-        s.src = remark_config.host + '/web/' +c[i] +'.js';
-        s.defer = true;
-        (d.head || d.body).appendChild(s);
-      }
+
+    (function (c) {
+        for (var i = 0; i < c.length; i++) {
+            var d = document, s = d.createElement('script');
+            s.src = remark_config.host + '/web/' + c[i] + '.js';
+            s.defer = true;
+            (d.head || d.body).appendChild(s);
+        }
     })(remark_config.components || ['embed']);
+
+    window.addEventListener('onColorSchemeChange', (e) => {
+        window.REMARK42.changeTheme(e.detail);
+    })
 </script>
-<script>
-  window.addEventListener('onColorSchemeChange', (e) => {
-    window.REMARK42.changeTheme(document.body.dataset.scheme);
-  })
-</script>
\ No newline at end of file
+{{- end -}}
\ No newline at end of file