breaking changes: 移除博天api

breaking changes: 移除 waline 的 avatar 和 avatar cdn 配置
feat: anchor 不再限制 post 頁開啟，可以在任何頁面開啟
feat: 文章標題支持點擊跳轉到此標題開始閲讀 closed #653
feat: toc可以設置全部展開 closed #709
feat: 增加 新的評論系統 giscus
feat: 支持新的評論名寫法，主題會處理評論名字大小寫，舊的會兼容
feat: 友情鏈接列表增加 fetch url 獲取
improvement: 鼠標移到最新評論內容，增加 title 顯示
fix: 修復 rightside 遮擋內容，導致內容無法點擊的 bug
fix: 修復 mermaid 在某些頁面（有元素 id 為 mermaid 時） 會無法加載的 bug
fix: 修復 搜索框不會自動 focus 的 bug

layout/includes/head/config.pug

@@ -119,5 +119,5 @@ script.
     },
     isPhotoFigcaption: !{theme.photofigcaption},
     islazyload: !{theme.lazyload.enable},
-    isanchor: !{theme.anchor}
+    isAnchor: !{theme.anchor}
   }

layout/includes/page/flink.pug

@@ -1,18 +1,57 @@
 #article-container
   .flink
-    if site.data.link
-      each i in site.data.link
-        if i.class_name
-          h2!= i.class_name
-        if i.class_desc
-          .flink-desc!=i.class_desc
-        .flink-list
-          each item in i.link_list
-            .flink-list-item
-              a(href=url_for(item.link)  title=item.name target="_blank")
-                .flink-item-icon
-                  img.no-lightbox(src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt=item.name )
-                .flink-item-name= item.name 
-                .flink-item-desc(title=item.descr)= item.descr
+    if page.flink_url
+      script.
+        (()=>{
+          const replaceSymbol = (str) => {
+            return str.replace(/[\p{P}\p{S}]/gu, '-')
+          }
+
+          let result = ''
+          fetch('!{url_for(page.flink_url)}')
+            .then(response => response.json())
+            .then(str => {
+              for(let i = 0; i < str.length; i++){
+                const replaceClassName = replaceSymbol(str[i].class_name)
+                const className = str[i].class_name ? `<h2 id='${replaceClassName}'><a href="#${replaceClassName}" class="headerlink" title="${str[i].class_name}"></a>${str[i].class_name}</h2>` : ''
+                const classDesc = str[i].class_desc ? `<div class='flink-desc'>${str[i].class_desc}</div>` : ''
+                
+                let listResult = ''
+                const lists = str[i].link_list
+                for(let j = 0; j < lists.length; j++){
+                  listResult += `
+                    <div class="flink-list-item">
+                      <a href='${lists[j].link}' title='${lists[j].name}' target='_blank'>
+                        <div class='flink-item-icon'>
+                          <img class='no-lightbox' src='${lists[j].avatar}' onerror='this.onerror=null;this.src="!{url_for(theme.error_img.flink)}"' alt='${lists[j].name}' />
+                        </div>
+                        <div class='flink-item-name'>${lists[j].name}</div> 
+                        <div class='flink-item-desc' title='${lists[j].descr}'>${lists[j].descr}</div>
+                      </a>
+                    </div>`
+                }
+
+                result += `${className}${classDesc} <div class='flink-list'>${listResult}</div>`
+              }
+
+              document.querySelector('.flink').insertAdjacentHTML('afterbegin', result)
+            })
+        })()
+
+    else
+      if site.data.link
+        each i in site.data.link
+          if i.class_name
+            !=markdown(`## ${i.class_name}`)
+          if i.class_desc
+            .flink-desc!=i.class_desc
+          .flink-list
+            each item in i.link_list
+              .flink-list-item
+                a(href=url_for(item.link)  title=item.name target="_blank")
+                  .flink-item-icon
+                    img.no-lightbox(src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt=item.name )
+                  .flink-item-name= item.name 
+                  .flink-item-desc(title=item.descr)= item.descr
     != page.content
 

layout/includes/third-party/comments/giscus.pug

@@ -0,0 +1,49 @@
+- const { repo, repo_id, category_id, option } = theme.giscus
+- const themes = theme.giscus.theme
+script.
+  function loadGiscus () {
+    let nowTheme = document.documentElement.getAttribute('data-theme') === 'dark' ? '!{themes.dark}' : '!{themes.light}'
+
+    const config = Object.assign({
+      src: '!{theme.CDN.giscus}',
+      'data-repo': '!{repo}',
+      'data-repo-id': '!{repo_id}',
+      'data-category-id': '!{category_id}',
+      'data-mapping': 'pathname',
+      'data-theme': nowTheme,
+      'data-reactions-enabled': '1',
+      crossorigin: 'anonymous',
+      async: true
+    },!{JSON.stringify(option)})
+
+    let ele = document.createElement('script')
+    for (let key in config) {
+      ele.setAttribute(key, config[key])
+    }
+    document.getElementById('giscus-wrap').insertAdjacentElement('afterbegin',ele)
+  }
+
+  function changeGiscusTheme () {
+    const theme = document.documentElement.getAttribute('data-theme') === 'dark' ? '!{themes.dark}' : '!{themes.light}'
+
+    function sendMessage(message) {
+      const iframe = document.querySelector('iframe.giscus-frame');
+      if (!iframe) return;
+      iframe.contentWindow.postMessage({ giscus: message }, 'https://giscus.app');
+    }
+
+    sendMessage({
+      setConfig: {
+        theme: theme
+      }
+    });
+  }
+
+  if ('!{theme.comments.use[0]}' === 'Giscus' || !!{theme.comments.lazyload}) {
+    if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('giscus-wrap'), loadGiscus)
+    else loadGiscus()
+  } else {
+    function loadOtherComment () {
+      loadGiscus()
+    }
+  }