17.10

themes/Ying/layouts/_default/says.html

@@ -9,5 +9,12 @@
         - 图标：https://usj.cc/favicon.ico
         </div>
     </div>
+
+    <div id="comments" class="comments-area">
+      <!-- 评论区内容 -->
+      <div id="waline"></div>
+  </div>
+  
+
   </div>
   {{ end }}

themes/Ying/layouts/_default/single.html

@@ -22,60 +22,24 @@
         <!-- 评论区内容 -->
         <div id="waline"></div>
     </div>
-
+    {{/*  文章页面评论弹幕  */}}
     <script type="text/javascript">
-        $(document).ready(function() {
+        $(document).ready(function () {
             // 获取当前页面的路径
             var currentPath = "{{ .RelPermalink }}";
-    
-            // 动态获取评论并发布弹幕
-            $.ajaxSettings.async = true;
-            $.getJSON('https://waline.usj.cc/api/comment?path=' + encodeURIComponent(currentPath), function(response) {
-                var data = response.data.data;
-                console.log(data);
-                // 每条弹幕发送间隔
-                var looper_time = 3 * 1000;
-                var items = data;
-                // 弹幕总数
-                var total = items.length;
-                // 是否首次执行
-                var run_once = true;
-                // 弹幕索引
-                var index = 0;
-                // 先执行一次
-                barrager();
-    
-                function barrager() {
-                    if (run_once) {
-                        // 如果是首次执行, 则设置一个定时器, 并且把首次执行置为 false
-                        looper = setInterval(barrager, looper_time);
-                        run_once = false;
-                    }
-                  
-                    // 转换数据为弹幕所需的格式
-                    var item = {
-                        img: items[index].avatar || 'static/default-avatar.png', // 头像
-                        info: items[index].orig || 'No comment', // 评论内容
-                        href: items[index].link || '#', // 用户链接
-                        close: true, // 显示关闭按钮
-                        speed: 6, // 延迟,单位秒,默认6
-                        color: '#fff', // 颜色,默认白色
-                        old_ie_color: '#000000' // ie低版兼容色,不能与网页背景相同,默认黑色
-                    };
-                  
-                    // 发布一个弹幕
-                    $('body').barrager(item);
-                    // 索引自增
-                    index++;
-                    // 所有弹幕发布完毕，清除计时器
-                    if (index == total) {
-                        clearInterval(looper);
-                        return false;
-                    }
-                }
+
+            // 调用封装的函数
+            fetchCommentsAndCreateBarrager(currentPath, {
+                looper_time: 3000,                // 每条弹幕的发送间隔，单位毫秒
+                defaultAvatar: 'static/default-avatar.png', // 默认头像
+                defaultInfo: 'No comment',      // 默认评论内容
+                defaultLink: '#',               // 默认用户链接
+                close: true,                    // 显示关闭按钮
+                speed: 6,                       // 弹幕速度，单位秒
+                color: '#fff',                 // 弹幕颜色
+                old_ie_color: '#000000'       // IE低版兼容色
             });
         });
     </script>
-
 </div>
 {{ end }}

themes/Ying/layouts/partials/footer.html

@@ -21,13 +21,14 @@
 <script src="/js/main.js"></script>
 <script src="/js/mypjax.js"></script>
 <script src="/js/nprogress.js"></script>
+<script>var currentPath = "{{ .RelPermalink }}";</script>
 <!-- 加载 Waline 和 PJAX -->
 <script type="module">
     import { init as walineInit } from 'https://unpkg.com/@waline/client@v3/dist/waline.js';
 
     // 将 walineInit 赋值给全局变量
     window.walineInit = walineInit;
-
+    
     // 定义全局的 initWaline 函数
     window.initWaline = function() {
         walineInit({

themes/Ying/static/js/main.js

@@ -45,4 +45,44 @@ lazyLoadInit({
   offsetBottom: 0,
   offsetTopm: 0,
   showTime: 1100
-});
+});
+
+// 封装的函数：获取评论数据并发布弹幕
+function fetchCommentsAndCreateBarrager(path, options) {
+  $.getJSON('https://waline.usj.cc/api/comment?path=' + encodeURIComponent(path), function(response) {
+      var data = response.data.data;
+      console.log(data);
+      
+      // 每条弹幕发送间隔
+      var looper_time = options.looper_time || 3000; // 默认间隔3秒
+      var items = data;
+      // 弹幕总数
+      var total = items.length;
+      // 弹幕索引
+      var index = 0;
+      // 先执行一次
+      createBarrager();
+
+      function createBarrager() {
+          // 转换数据为弹幕所需的格式
+          var item = {
+              img: items[index].avatar || options.defaultAvatar || 'static/default-avatar.png', // 头像
+              info: items[index].orig || options.defaultInfo || 'No comment', // 评论内容
+              href: items[index].link || options.defaultLink || '#', // 用户链接
+              close: options.close || true, // 显示关闭按钮
+              speed: options.speed || 6, // 延迟,单位秒,默认6
+              color: options.color || '#fff', // 颜色,默认白色
+              old_ie_color: options.old_ie_color || '#000000' // ie低版兼容色,不能与网页背景相同,默认黑色
+          };
+
+          // 发布一个弹幕
+          $('body').barrager(item);
+          // 索引自增
+          index++;
+          // 所有弹幕发布完毕，清除计时器
+          if (index < total) {
+              setTimeout(createBarrager, looper_time);
+          }
+      }
+  });
+}

themes/Ying/static/js/mypjax.js

@@ -183,5 +183,7 @@
                 });
             });
             // pjax完成后加载 waline
-            initWaline();
+            if (currentPath.includes("/post/") || currentPath.includes("/says/")) {
+                initWaline();
+            }
         });