feat: add Gitalk comments support (#324)

6 files changed, 102 insertions, 0 deletions

diff --git a/config-examples/en/config.toml b/config-examples/en/config.toml
index 920a199..60a9f21 100644
--- a/config-examples/en/config.toml
+++ b/config-examples/en/config.toml
@@ -640,6 +640,23 @@ uglyURLs = false
     #       `comments` in post’s Front Matter
     #       has a higher priority than here
 
+    ## Gitalk
+    enableGitalk = false
+    gitalkClientID = "your_client_id"
+    gitalkClientSecret = "your_client_secret"
+    gitalkRepo = "your_repository"
+    gitalkOwner = "your_gitalk_owner"
+    gitalkAdmin = ["your_gitalk_admin"]
+    gitalkLable = ["Gitalk"]
+    gitalkDistractionFreeMode = false
+    gitalkPerPage = 10
+    gitalkLanguage = "en"
+    gitalkPagerDirection = "last"
+    gitalkCreateIssueManually = false
+    gitalkProxy = "https://cors-anywhere.azm.workers.dev/https://github.com/login/oauth/access_token"
+    gitalkEnableHotKey = true
+    # Note: https://github.com/gitalk/gitalk
+
     ## Disqus
     enableDisqus = false
     disqusShortname = ""
diff --git a/config-examples/zh-cn/config.toml b/config-examples/zh-cn/config.toml
index 4fa864b..ebc5251 100644
--- a/config-examples/zh-cn/config.toml
+++ b/config-examples/zh-cn/config.toml
@@ -588,6 +588,23 @@ uglyURLs = false
     # 说明：文章的 Front Matter 中的 `comments`
     #      的优先级高于此处
 
+    ## Gitalk
+    enableGitalk = false
+    gitalkClientID = "your_client_id"
+    gitalkClientSecret = "your_client_secret"
+    gitalkRepo = "your_repository"
+    gitalkOwner = "your_gitalk_owner"
+    gitalkAdmin = ["your_gitalk_admin"]
+    gitalkLable = ["Gitalk"]
+    gitalkDistractionFreeMode = false
+    gitalkPerPage = 10
+    gitalkLanguage = "en"
+    gitalkPagerDirection = "last"
+    gitalkCreateIssueManually = false
+    gitalkProxy = "https://cors-anywhere.azm.workers.dev/https://github.com/login/oauth/access_token"
+    gitalkEnableHotKey = true
+    # 说明：https://github.com/gitalk/gitalk
+
     ## Disqus
     enableDisqus = false
     disqusShortname = ""
diff --git a/config-examples/zh-tw/config.toml b/config-examples/zh-tw/config.toml
index cb5405b..f5ce2fe 100644
--- a/config-examples/zh-tw/config.toml
+++ b/config-examples/zh-tw/config.toml
@@ -588,6 +588,23 @@ uglyURLs = false
     # 說明：文章的 Front Matter 中的 `comments`
     #      的優先順序高於此處
 
+    ## Gitalk
+    enableGitalk = false
+    gitalkClientID = "your_client_id"
+    gitalkClientSecret = "your_client_secret"
+    gitalkRepo = "your_repository"
+    gitalkOwner = "your_gitalk_owner"
+    gitalkAdmin = ["your_gitalk_admin"]
+    gitalkLable = ["Gitalk"]
+    gitalkDistractionFreeMode = false
+    gitalkPerPage = 10
+    gitalkLanguage = "en"
+    gitalkPagerDirection = "last"
+    gitalkCreateIssueManually = false
+    gitalkProxy = "https://cors-anywhere.azm.workers.dev/https://github.com/login/oauth/access_token"
+    gitalkEnableHotKey = true
+    # 說明：https://github.com/gitalk/gitalk
+
     ## Disqus
     enableDisqus = false
     disqusShortname = ""
diff --git a/layouts/partials/components/comments.html b/layouts/partials/components/comments.html
index f7806d1..c074df2 100644
--- a/layouts/partials/components/comments.html
+++ b/layouts/partials/components/comments.html
@@ -17,5 +17,8 @@
             <div id="utterances"></div>
         {{ end }}
 
+        {{ if .Site.Params.enableGitalk }}
+            <div id="gitalk-container"></div>
+        {{ end }}
     {{ end }}
 {{ end }}
diff --git a/layouts/partials/third-party/gitalk.html b/layouts/partials/third-party/gitalk.html
new file mode 100644
index 0000000..fca8c89
--- /dev/null
+++ b/layouts/partials/third-party/gitalk.html
@@ -0,0 +1,44 @@
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.css">
+<script>
+    function loadComments() {
+        if (typeof Gitalk === 'undefined') {
+            var getScript = (options) => {
+                var script = document.createElement('script');
+                script.defer = true;
+                script.crossOrigin = 'anonymous';
+                Object.keys(options).forEach((key) => {
+                    script[key] = options[key];
+                });
+                document.body.appendChild(script);
+            };
+            getScript({
+                src: 'https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js',
+                onload: () => {
+                    newGitalk();
+                }
+            });
+        } else {
+            newGitalk();
+        }
+    }
+    function newGitalk() {
+        const gitalk = new Gitalk({
+            clientID: {{ .Site.Params.gitalkClientID }},
+            clientSecret: {{ .Site.Params.gitalkClientSecret }},
+            repo: {{ .Site.Params.gitalkRepo }},
+            owner: {{ .Site.Params.gitalkOwner }},
+            admin: {{ .Site.Params.gitalkAdmin }},
+            labels: {{ .Site.Params.gitalkLable }},
+            distractionFreeMode: {{ .Site.Params.gitalkDistractionFreeMode }}, 
+            perPage: {{ .Site.Params.gitalkPerPage }},
+            language: {{ .Site.Params.gitalkLanguage }},
+            pagerDirection: {{ .Site.Params.gitalkPagerDirection }},
+            createIssueManually: {{ .Site.Params.gitalkDistractionFreeMode }},
+            proxy: {{ .Site.Params.gitalkProxy }},
+            enableHotKey: {{ .Site.Params.gitalkEnableHotKey }},
+            id:  location.pathname
+        })
+
+        gitalk.render('gitalk-container')
+    }
+</script>
\ No newline at end of file
diff --git a/layouts/partials/third-party/script.html b/layouts/partials/third-party/script.html
index 9123c21..e36be6f 100644
--- a/layouts/partials/third-party/script.html
+++ b/layouts/partials/third-party/script.html
@@ -25,6 +25,10 @@
             {{ partial "third-party/utterances.html" . }}
         {{ end }}
 
+        {{ if .Site.Params.enableGitalk }}
+            {{ partial "third-party/gitalk.html" . }}
+        {{ end }}
+
     {{ end }}
 {{ end }}