blog/public/js/main.js

// 判断是否为移动端
function isMobile() {
  if (window.navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)) {
    return true; // 移动端
  } else {
    return false; // PC端
  }
}

// 文章图片灯箱
window.ViewImage && ViewImage.init('#writing_content img');

//memos图片灯箱
window.ViewImage && ViewImage.init('.text img , .memos-photo img , .gallery-thumbnail img');

// 激活返回顶部插件 
$(function () {
  $.scrollUp({
    animation: 'fade',
    scrollImg: true
  });
});

// loader定时器
$(document).ready(function () {
  setTimeout(function () {
    $("#loader").addClass("hide");
  }, 30000);
});
// 点击进入按钮
$("#closeloader").click(function () {
  $("#loader").addClass("hide");
});
// nav栏样式调整
$('#libabys').first().attr("style", "margin-left: -5px");

$('#libabys').eq(1).attr("style", "margin-left: -5px");
// 友链列表版样式调整
$('.itp-index:odd').attr("style", "float: right;width:48%;");

//文章图片懒加载
lazyLoadInit({
  coverColor: "white",
  coverDiv: "<div style='display: flex; justify-content: center; align-items: center; height: 200px;color: #000000;'><span>优世界·一个记录生活点滴的小站</span></div>",
  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);
          }
      }
  });
}


// 获取最近一年的文章数据
{{ $pages := where .Site.RegularPages "Date" ">" (now.AddDate -1 0 0) }}
{{ $pages := $pages.Reverse }}
var blogInfo = {
    "pages": [
        {{ range $index, $element := $pages }}
            {
                "title": "{{ replace (replace .Title "《" "〈") "》" "〉" }}",
                "date": "{{ .Date.Format "2006-01-02" }}",
                "year": "{{ .Date.Format "2006" }}",
                "month": "{{ .Date.Format "01" }}",
                "day": "{{ .Date.Format "02" }}",
                "word_count": "{{ .WordCount }}"
            }{{ if ne (add $index 1) (len $pages) }},{{ end }}
            {{ end }}
    ]
};
// console.log(blogInfo)

let currentDate = new Date();
currentDate.setFullYear(currentDate.getFullYear() - 1);

let startDate;

let monthDiv = document.querySelector('.month');
let monthNames = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];

if (window.innerWidth < 768) {
    numMonths = 6;
} else {
    numMonths = 12;
}

let startMonthIndex = (currentDate.getMonth() - (numMonths - 1) + 12) % 12;
for (let i = startMonthIndex; i < startMonthIndex + numMonths; i++) {
    let monthSpan = document.createElement('span');
    let monthIndex = i % 12;
    monthSpan.textContent = monthNames[monthIndex];
    monthDiv.appendChild(monthSpan);
}

function getStartDate() {
    const today = new Date();

    if (window.innerWidth < 768) {
        numMonths = 6;
    } else {
        numMonths = 12;
    }

    const startDate = new Date(today.getFullYear(), today.getMonth() - numMonths + 1, 1, today.getHours(), today.getMinutes(), today.getSeconds());

    while (startDate.getDay() !== 1) {
        startDate.setDate(startDate.getDate() + 1);
    }

    return startDate;
}

function getWeekDay(date) {
    const day = date.getDay();
    return day === 0 ? 6 : day - 1;
}

function createDay(date, title, count, post) {
    const day = document.createElement("div");

    day.className = "heatmap_day";

    day.setAttribute("data-title", title);
    day.setAttribute("data-count", count);
    day.setAttribute("data-post", post);
    day.setAttribute("data-date", date);

    day.addEventListener("mouseenter", function () {
        const tooltip = document.createElement("div");
        tooltip.className = "heatmap_tooltip";

        let tooltipContent = "";

        if (post && parseInt(post, 10) !== 0) {
            tooltipContent += '<span class="heatmap_tooltip_post">' + '共 ' + post + ' 篇' + '</span>';
        }

        if (count && parseInt(count, 10) !== 0) {
            tooltipContent += '<span class="heatmap_tooltip_count">' + ' ' + count + ' 字；' + '</span>';
        }

        if (title && parseInt(title, 10) !== 0) {
            tooltipContent += '<span class="heatmap_tooltip_title">' + title + '</span>';
        }

        if (date) {
            tooltipContent += '<span class="heatmap_tooltip_date">' + date + '</span>';
        }

        tooltip.innerHTML = tooltipContent;
        day.appendChild(tooltip);
    });

    day.addEventListener("mouseleave", function () {
        const tooltip = day.querySelector(".heatmap_tooltip");
        if (tooltip) {
            day.removeChild(tooltip);
        }
    });

    if (count == 0 ) {
        day.classList.add("heatmap_day_level_0");
    } else if (count > 0 && count < 1000) {
        day.classList.add("heatmap_day_level_1");
    } else if (count >= 1000 && count < 2000) {
        day.classList.add("heatmap_day_level_2");
    } else if (count >= 2000 && count < 3000) {
        day.classList.add("heatmap_day_level_3");
    } else {
        day.classList.add("heatmap_day_level_4");
    }

    return day;
}

function createWeek() {
    const week = document.createElement('div');
    week.className = 'heatmap_week';
    return week;
}

function createHeatmap() {
    const container = document.getElementById('heatmap');
    const startDate = getStartDate();
    const endDate = new Date();
    const weekDay = getWeekDay(startDate);

    let currentWeek = createWeek();
    container.appendChild(currentWeek);

    let currentDate = startDate;
    let i = 0;

    while (currentDate <= endDate) {
        if (i % 7 === 0 && i !== 0) {
            currentWeek = createWeek();
            container.appendChild(currentWeek);
        }

        const dateString = `${currentDate.getFullYear()}-${("0" + (currentDate.getMonth()+1)).slice(-2)}-${("0" + (currentDate.getDate())).slice(-2)}`;

        const articleDataList = blogInfo.pages.filter(page => page.date === dateString);

        if (articleDataList.length > 0) {
            const titles = articleDataList.map(data => data.title);
            const title = titles.map(t => `《${t}》`).join('<br />');

            let count = 0;
            let post = articleDataList.length;

            articleDataList.forEach(data => {
                count += parseInt(data.word_count, 10);
            });

            const formattedDate = formatDate(currentDate);
            const day = createDay(formattedDate, title, count, post);
            currentWeek.appendChild(day);
        } else {
            const formattedDate = formatDate(currentDate);
            const day = createDay(formattedDate, '', '0', '0');
            currentWeek.appendChild(day);
        }

        i++;
        currentDate.setDate(currentDate.getDate() + 1);
    }
}

function formatDate(date) {
    const options = { month: 'short', day: 'numeric', year: 'numeric' };
    return date.toLocaleDateString('en-US', options);
}

createHeatmap();