2024.7.30

themes/Ying/static/js/main.js

@@ -45,52 +45,67 @@ lazyLoadInit({
 });
 
 
-function fetchCommentsAndCreateBarrager(path, options) {
-  $.getJSON('https://waline.usj.cc/api/comment?path=' + encodeURIComponent(path), function(response) {
-      var data = response.data.data;
-      
-      // 每条弹幕发送间隔
-      var looper_time = options.looper_time || 3000; // 默认间隔3秒
-      var items = flattenComments(data);
-      // 弹幕总数
-      var total = items.length;
-      // 弹幕索引
-      var index = 0;
-      // 先执行一次
-      if (total != 0) {
+async function fetchCommentsAndCreateBarrager(path, options) {
+  try {
+      const response = await fetch('https://waline.usj.cc/api/comment?path=' + encodeURIComponent(path));
+      const data = await response.json();
+
+      if (!data.data || !data.data.data) {
+          console.error('评论数据获取失败');
+          return;
+      }
+
+      const commentsData = data.data.data;
+      const looperTime = options.looper_time || 3000;
+      const flattenedComments = flattenComments(commentsData);
+      const totalComments = flattenedComments.length;
+      let currentIndex = 0;
+
+      // 初始化弹幕插件
+      let barrage = new Barrage.default({
+          el: 'body',
+          backColor:"#000000b5",
+          fontSize:"14px",
+          isLeft:true,
+          speed:0,
+          height:"35px"
+      });
+
+      if (totalComments !== 0) {
           createBarrager();
       }
 
       function createBarrager() {
-          // 转换数据为弹幕所需的格式
-          var item = {
-              img: items[index].avatar || options.defaultAvatar || 'static/default-avatar.png', // 头像
-              info: stripHTML(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低版兼容色,不能与网页背景相同,默认黑色
+          const currentComment = flattenedComments[currentIndex];
+          const barragerItem = {
+              headImg: currentComment.avatar + "?s=24" || options.defaultAvatar,
+              content: stripHTML(currentComment.orig) || options.defaultInfo,
+              href: currentComment.link || options.defaultLink,
+              speed: options.speed || 10
           };
 
-          // 发布一个弹幕
-          $('body').barrager(item);
-          // 索引自增
-          index++;
-          // 所有弹幕发布完毕，清除计时器
-          if (index < total) {
-              setTimeout(createBarrager, looper_time);
+          console.log(barragerItem.content);
+
+          // 发送弹幕
+          barrage.start(barragerItem.content, {
+              speed: barragerItem.speed,
+              headImg: barragerItem.headImg,
+              speed:25
+          });
+
+          currentIndex++;
+
+          if (currentIndex < totalComments) {
+              setTimeout(createBarrager, looperTime);
           }
       }
 
-      // 过滤HTML标签的函数
       function stripHTML(html) {
           return html.replace(/<\/?[^>]+(>|$)/g, "");
       }
 
-      // 展平评论和子评论
       function flattenComments(comments) {
-          var result = [];
+          let result = [];
           comments.forEach(function(comment) {
               result.push(comment);
               if (comment.children && comment.children.length > 0) {
@@ -99,5 +114,8 @@ function fetchCommentsAndCreateBarrager(path, options) {
           });
           return result;
       }
-  });
+  } catch (error) {
+      console.error('无法获取评论数据', error);
+  }
 }
+