Add gitalk comment system

_config.yml

@@ -556,6 +556,18 @@ gitment:
   proxy_gateway: # Address of api proxy, See: https://github.com/aimingoo/intersect
   redirect_protocol: # Protocol of redirect_uri with force_redirect_protocol when mint enabled
 
+# Gitalk 
+# Demo: https://gitalk.github.io
+# Reference: https://asdfv1929.github.io/2018/01/20/gitalk/, https://liujunzhou.cn/2018/8/10/gitalk-error/#more
+gitalk:
+  enable: false
+  github_id:  # Github repo owner
+  repo:  # Repository name to store issues.
+  client_id:  # Github Application Client ID
+  client_secret:  # Github Application Client Secret
+  admin_user:  # GitHub repo owner and collaborators, only these guys can initialize github issues
+  distraction_free_mode: true # Facebook-like distraction free mode
+
 # Baidu Share
 # Available value:
 #    button | slide
@@ -1031,6 +1043,19 @@ vendors:
   # valine: //cdnjs.cloudflare.com/ajax/libs/valine/1.3.3/Valine.min.js
   valine:
 
+  # Internal version: 1.4.0
+  # See: https://github.com/gitalk/gitalk
+  # Examples:
+  # gitalk_js: https://cdn.jsdelivr.net/npm/gitalk@1.4.0/dist/gitalk.min.js
+  # gitalk_css: https://cdn.jsdelivr.net/npm/gitalk@1.4.0/dist/gitalk.css
+  gitalk_js:
+  gitalk_css:
+
+  # Internal version: 0.7.3
+  # See: https://github.com/emn178/js-md5/
+  # Example: 
+  # md5: https://cdn.jsdelivr.net/npm/js-md5@0.7.3/src/md5.min.js
+  md5:
 
 # Assets
 css: css

layout/_partials/comments.swig

@@ -47,6 +47,11 @@
   {% elseif theme.valine.enable and theme.valine.appid and theme.valine.appkey %}
     <div class="comments" id="comments">
     </div>
+
+  {% elseif theme.gitalk.enable %}
+    <div id="gitalk-container">
+    </div>
+
   {% endif %}
 
 {% endif %}

layout/_third-party/comments/gitalk.swig

@@ -0,0 +1,33 @@
+{% if page.comments && theme.gitalk.enable %}
+
+  {% set gitalk_js_url = "//cdn.jsdelivr.net/npm/gitalk@1.4.0/dist/gitalk.min.js" %}
+  {% if theme.vendors.gitalk_js %}
+    {% set gitalk_js_url = theme.vendors.gitalk_js %}
+  {% endif %}
+  <script type="text/javascript" src="{{ gitalk_js_url }}"></script>
+
+  {% set gitalk_css_url = "//cdn.jsdelivr.net/npm/gitalk@1.4.0/dist/gitalk.css" %}
+  {% if theme.vendors.gitalk_css %}
+    {% set gitalk_css_url = theme.vendors.gitalk_css %}
+  {% endif %}
+  <link rel="stylesheet" href="{{ gitalk_css_url }}">
+
+  {% set md5_url = "//cdn.jsdelivr.net/npm/js-md5@0.7.3/src/md5.min.js" %}
+  {% if theme.vendors.md5 %}
+    {% set md5_url = theme.vendors.md5 %}
+  {% endif %}
+  <script type="text/javascript" src="{{ md5_url }}"></script>
+
+   <script type="text/javascript">
+        var gitalk = new Gitalk({
+          clientID: '{{ theme.gitalk.client_id }}',
+          clientSecret: '{{ theme.gitalk.client_secret }}',
+          repo: '{{ theme.gitalk.repo }}',
+          owner: '{{ theme.gitalk.github_id }}',
+          admin: ['{{ theme.gitalk.admin_user }}'],
+          id: md5(location.pathname),
+          distractionFreeMode: '{{ theme.gitalk.distraction_free_mode }}'
+        })
+        gitalk.render('gitalk-container')           
+       </script>
+{% endif %}

layout/_third-party/comments/index.swig

@@ -3,3 +3,4 @@
 {% include 'changyan.swig' %}
 {% include 'gitment.swig' %}
 {% include 'valine.swig' %}
+{% include 'gitalk.swig' %}

source/css/_common/components/third-party/gitalk.styl

@@ -0,0 +1,4 @@
+.gt-header a, .gt-comments a, .gt-popup a
+  border-bottom: none;
+.gt-container .gt-popup .gt-action.is--active:before
+  top: 0.7em;

source/css/_common/components/third-party/third-party.styl

@@ -5,3 +5,4 @@
 @import "algolia-search" if hexo-config('algolia_search.enable');
 @import "needsharebutton" if hexo-config('needmoreshare2.enable');
 @import "related-posts" if hexo-config('related_posts.enable');
+@import "gitalk" if hexo-config('gitalk.enable');