✨ 添加第三方chat服務 crisp

_config.yml

@@ -360,6 +360,12 @@ gitter:
   enable: false
   room:
 
+# crisp
+# https://crisp.chat/en/
+crisp:
+  enable: false
+  website_id:
+
 # Footer Settings
 # --------------------------------------
 
@@ -393,6 +399,7 @@ tencent_analytics:
 # Google Adsense (谷歌廣告)
 google_adsense:
   enable: false
+  auto_ads: true
   js: https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js
   client:
   enable_page_level_ads: true
@@ -635,7 +642,7 @@ runtimeshow:
 
 # Conversion between Traditional and Simplified Chinese (簡繁轉換)
 translate:
-  enable: true
+  enable: false
   # The text of a button
   default: 繁
   # the language of website (1 - Traditional Chinese/ 2 - Simplified Chinese）

layout/includes/additional-js.pug

@@ -60,8 +60,6 @@ div
   if theme.preloader
     !=partial('includes/loading/loading-js', {}, {cache:theme.fragment_cache})
 
-  !=partial('includes/chat/index', {}, {cache:theme.fragment_cache})
-
   .js-pjax
     if is_home() && theme.subtitle.enable
       include ./third-party/subtitle.pug
@@ -90,6 +88,7 @@ div
       include ./head/aplayer.pug
 
   !=fragment_cache('injectBottom', function(){return injectHtml(theme.inject.bottom)})
+  !=partial('includes/chat/index', {}, {cache:theme.fragment_cache})
 
   if theme.pjax
     !=partial('includes/third-party/pjax', {}, {cache:theme.fragment_cache})

layout/includes/chat/chatra.pug

@@ -11,8 +11,6 @@ script.
       if (d.head) d.head.appendChild(s);
   })(document, window, 'Chatra');
 
-
-
   if (!{theme.chat_btn}) {
     var chatBtnFn = () => {
       var chatBtn = document.getElementById("chat_btn")

layout/includes/chat/crisp.pug

@@ -0,0 +1,36 @@
+script.
+  window.$crisp = [];
+  window.CRISP_WEBSITE_ID = "!{theme.crisp.website_id}";
+  (function () {
+    d = document;
+    s = d.createElement("script");
+    s.src = "https://client.crisp.chat/l.js";
+    s.async = 1;
+    d.getElementsByTagName("head")[0].appendChild(s);
+  })();
+  $crisp.push(["safe", true])
+
+  if (!{theme.chat_btn}) {
+    $crisp.push(["do", "chat:hide"])
+    $crisp.push(["on", "chat:closed", function() {
+      $crisp.push(["do", "chat:hide"])
+    }])
+    var chatBtnFn = () => {
+      var chatBtn = document.getElementById("chat_btn")
+      chatBtn.addEventListener("click", function(){
+        $crisp.push(["do", "chat:show"])
+        $crisp.push(["do", "chat:open"])
+
+      });
+    }
+    chatBtnFn()
+  } else {
+    if (!{theme.chat_hide_show}) {
+      function chatBtnHide () {
+        $crisp.push(["do", "chat:hide"])
+      }
+      function chatBtnShow () {
+        $crisp.push(["do", "chat:show"])
+      }
+    }
+  }

layout/includes/chat/gitter.pug

@@ -1,12 +1,29 @@
 if theme.chat_btn
   script.
     ((window.gitter = {}).chat = {}).options = {
+      disableDefaultChat: true,
+    };
+    document.addEventListener('gitter-sidecar-ready', (e) => {
+      const GitterChat = e.detail.Chat
+      let chat
+
+      function initGitter () {
+        chat = new GitterChat({
           room: '#{theme.gitter.room}',
           activationElement: '#chat_btn'
-    };
+        });
+      }
 
-  script(src="https://sidecar.gitter.im/dist/sidecar.v1.js" async defer)
+      initGitter()
 
+      if (!{theme.pjax}) {
+        document.addEventListener('pjax:complete', () => {
+          chat.destroy()
+          initGitter()
+        })
+      }
+
+    })
 else
   script.
     ((window.gitter = {}).chat = {}).options = {
@@ -22,4 +39,5 @@ else
         document.getElementsByClassName('gitter-open-chat-button')[0].style.display= 'block'
       }
     }
-  script(src="https://sidecar.gitter.im/dist/sidecar.v1.js" async defer)
+
+script(src="https://sidecar.gitter.im/dist/sidecar.v1.js" async defer)

layout/includes/chat/index.pug

@@ -6,3 +6,5 @@ else if theme.daovoice && theme.daovoice.enable
   include ./daovoice.pug
 else if theme.gitter && theme.gitter.enable
   include ./gitter.pug
+else if theme.crisp && theme.crisp.enable
+  include ./crisp.pug

layout/includes/head/google_adsense.pug

@@ -1,5 +1,5 @@
 if (theme.google_adsense && theme.google_adsense.enable)
-  script(async src=theme.google_adsense.js)
+  script(async src=theme.google_adsense.js data-pjax)
 
   if theme.google_adsense.auto_ads
     script.

layout/includes/rightside.pug

@@ -22,7 +22,7 @@ section#rightside
     if showToc
       button#mobile-toc-button.close(type="button" title=_p("rightside.toc"))
         i.fas.fa-list-ul
-    if theme.chat_btn && (theme.chatra.enable || theme.tidio.enable || theme.daovoice.enable || theme.gitter.enable)
+    if theme.chat_btn
       button#chat_btn(type="button" title=_p("rightside.chat_btn"))
         i.fas.fa-sms
 

layout/includes/third-party/pjax.pug

@@ -1,12 +1,14 @@
 script(src=url_for(theme.CDN.pjax))
 script.
+  $(function () {
     var pjax = new Pjax({
       selectors: [
         'title',
         'meta[name=description]',
         '#config_change',
         '#body-wrap',
-      '#rightside',
+        '#rightside-config-hide',
+        '#rightside-config-show',
         '.js-pjax'
       ],
       cacheBust: false,
@@ -29,7 +31,7 @@ script.
       }
 
       if (document.getElementsByClassName('aplayer').length){
-      loadMeting()
+        typeof loadMeting === 'function' && loadMeting()
       }
     })
 
@@ -52,4 +54,5 @@ script.
       //reset font-size
       $('body').css('font-size') !== originFontSize && $('body').css('font-size', parseFloat(originFontSize))
     })
+  })
 

source/js/main.js

@@ -196,7 +196,6 @@ const sidebarFn = () => {
 /**
  * 首頁top_img底下的箭頭
  */
-
 const indexScrollDown = () => {
   $('#scroll_down').on('click', function () {
     scrollToDest('#content-inner')
@@ -423,16 +422,6 @@ const scrollFn = function () {
   }
 }
 
-/**
- * 點擊滾回頂部
- */
-
-const backToTop = function () {
-  $('#go-up').on('click', function () {
-    scrollToDest('body')
-  })
-}
-
 /**
  *  toc
  */
@@ -542,34 +531,61 @@ const tocFn = function () {
 }
 
 /**
- * 閲讀模式
+ * Rightside
  */
-const readModeToggle = function () {
-  $('#readmode').on('click', function () {
+
+let $rightsideEle = $('#rightside')
+
+// read-mode
+$rightsideEle.on('click', '#readmode', function () {
   $('body').toggleClass('read-mode')
-  })
-}
-
-/**
- * 字體調整
- */
+})
 
+// font change
 const originFontSize = $('body').css('font-size')
-const fontChange = function () {
-  $('#font_plus').click(function () {
+$rightsideEle.on('click', '#font_plus', () => {
   const nowFontSize = parseFloat($('body').css('font-size'))
   if (nowFontSize < 20) {
     $('body').css('font-size', nowFontSize + 1)
   }
-  })
-  $('#font_minus').click(function () {
+})
+
+$rightsideEle.on('click', '#font_minus', () => {
   const nowFontSize = parseFloat($('body').css('font-size'))
   if (nowFontSize > 10) {
     $('body').css('font-size', nowFontSize - 1)
   }
+})
+
+// Switch Between Light And Dark Mode
+if ($('#darkmode').length) {
+  const switchReadMode = function () {
+    const nowMode = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light'
+    if (nowMode === 'light') {
+      activateDarkMode()
+      Cookies.set('theme', 'dark', 2)
+      GLOBAL_CONFIG.Snackbar !== undefined && snackbarShow(GLOBAL_CONFIG.Snackbar.day_to_night)
+    } else {
+      activateLightMode()
+      Cookies.set('theme', 'light', 2)
+      GLOBAL_CONFIG.Snackbar !== undefined && snackbarShow(GLOBAL_CONFIG.Snackbar.night_to_day)
+    }
+  }
+
+  $rightsideEle.on('click', '#darkmode', () => {
+    switchReadMode()
+    typeof utterancesTheme === 'function' && utterancesTheme()
+    typeof FB === 'object' && window.loadFBComment()
+    window.DISQUS && $('#disqus_thread').children().length && setTimeout(() => window.disqusReset(), 200)
   })
 }
 
+// rightside 點擊設置 按鈕 展開
+$rightsideEle.on('click', '#rightside_config', () => $('#rightside-config-hide').toggleClass('show'))
+
+// Back to top
+$rightsideEle.on('click', '#go-up', () => scrollToDest('body'))
+
 /**
  * menu
  * 側邊欄sub-menu 展開/收縮
@@ -589,15 +605,6 @@ const subMenuFn = function () {
   })
 }
 
-/**
- * rightside 點擊設置 按鈕 展開
- */
-const rightsideConfigClick = function () {
-  $('#rightside_config').on('click', function () {
-    $('#rightside-config-hide').toggleClass('show')
-  })
-}
-
 /**
  * 複製時加上版權信息
  */
@@ -624,34 +631,6 @@ const addCopyright = function () {
   }
 }
 
-/**
- * Darkmode
- */
-const switchDarkmode = function () {
-  const $darkModeButton = $('#darkmode')
-  if ($darkModeButton.length) {
-    const switchReadMode = function () {
-      const nowMode = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light'
-      if (nowMode === 'light') {
-        activateDarkMode()
-        Cookies.set('theme', 'dark', 2)
-        GLOBAL_CONFIG.Snackbar !== undefined && snackbarShow(GLOBAL_CONFIG.Snackbar.day_to_night)
-      } else {
-        activateLightMode()
-        Cookies.set('theme', 'light', 2)
-        GLOBAL_CONFIG.Snackbar !== undefined && snackbarShow(GLOBAL_CONFIG.Snackbar.night_to_day)
-      }
-    }
-
-    $darkModeButton.click(function () {
-      switchReadMode()
-      typeof utterancesTheme === 'function' && utterancesTheme()
-      typeof FB === 'object' && window.loadFBComment()
-      window.DISQUS && $('#disqus_thread').children().length && setTimeout(() => window.disqusReset(), 200)
-    })
-  }
-}
-
 /**
  * 網頁運行時間
  */
@@ -813,8 +792,6 @@ const refreshFn = function () {
     sidebarAutoOpen()
     toggleSidebarFn()
     GLOBAL_CONFIG_SITE.isSidebar && tocFn()
-    fontChange()
-    readModeToggle()
     GLOBAL_CONFIG.noticeOutdate !== undefined && postNoticeUpdate()
   }
 
@@ -825,9 +802,6 @@ const refreshFn = function () {
   justifiedGalleryRun()
   lightBox()
   scrollFn()
-  backToTop()
-  rightsideConfigClick()
-  switchDarkmode()
   GLOBAL_CONFIG.runtime && runtimeShow()
   addTableWrap()
   tagHideClick()

source/js/tw_cn.js

@@ -1,7 +1,6 @@
 (function () {
   const translate = GLOBAL_CONFIG.translate
   const snackbarData = GLOBAL_CONFIG.Snackbar
-
   const defaultEncoding = translate.defaultEncoding // 網站默認語言，1: 繁體中文, 2: 簡體中文
   const translateDelay = translate.translateDelay // 延遲時間,若不在前, 要設定延遲翻譯時間, 如100表示100ms,默認為0
   const msgToTraditionalChinese = translate.msgToTraditionalChinese // 此處可以更改為你想要顯示的文字