MCBBS Wiki

微件:TimeDiff：修订间差异

微件 讨论

微件:TimeDiff (查看源代码)

2022年10月4日 (二) 19:02的版本

添加1,592字节 、​ 2022年10月4日 (星期二)
小
添加简化输出模式
可视化wikitext
（模板搬运）
 
小 （添加简化输出模式）
 
（未显示同一用户的2个中间版本）
第1行： 第1行：
<includeonly><script>
<includeonly><script>
// time: 2020-10-29
"use strict";
// author: Salt_lovely
(() => {
// func: 计算时间差，格式<!-- <span class="salt-time-diff （实时更新则额外加上real-time——结束时间会强制改为当前时间）">{起始时间}|{结束时间}|{指令（d-天，h-小时，m-分钟，s-秒，M-毫秒）}</span> -->
  // src/utils/utils.ts
if (typeof saltTimeDiffMark_noConflictSign == 'undefined') { var saltTimeDiffMark_noConflictSign = false } // 如果一个页面中有多个此脚本，则不启用
  function docReady(fn) {
window.addEventListener('load', () => {
    if (document.readyState === "loading") {
    'use strict';
      window.addEventListener("DOMContentLoaded", fn);
    if (saltTimeDiffMark_noConflictSign) { return } else { saltTimeDiffMark_noConflictSign = true } // 如果一个页面中有多个此脚本，则不启用
    } else {
    timediffHandle()    // 开始计算
      fn();
    timediffRealtime() // 实时更新
    // 函数部分
    function timediffHandle() {
        var elems = document.querySelectorAll('.salt-time-diff')
        for (let i = 0; i < elems.length; i++) {
            var el = elems[i]
            // txt: [0]起始时间 [1]结束时间，默认为当前时间 [2]
            var txt = el.textContent.replace(/[年月日]/g, '/').replace(/[；：]/g, ':').split('SPLIT')
            var time1 = new Date(txt[0]), time2, time3, outtxt
            if (!time1.getTime() || time1.getTime() == NaN) { time1 = new Date() }      // 预防无效输入
            if (txt.length < 2) {
                time2 = new Date()
            } else {
                time2 = new Date(txt[1])
                if (!time2.getTime() || time2.getTime() == NaN) { time2 = new Date() }  // 预防无效输入
            }
            time3 = Math.abs(time1.getTime() - time2.getTime())
            // 送入timediff函数
            if (txt.length > 2) {
                txt[2] = txt[2].replace('天', 'd').replace('时', 'h').replace('分', 'm').replace('毫秒', 'M').replace('秒', 's')
                outtxt = timediff(time3, txt[2])
                el.setAttribute('timeDiff-command', txt[2])
            } else {
                outtxt = timediff(time3)
                el.setAttribute('timeDiff-command', 'd')
            }
            el.textContent = outtxt
            // 后续处理
            el.classList.remove('salt-time-diff')
            el.classList.add('salt-time-diff-done')
            el.setAttribute('startTime', time1.toString())
            el.setAttribute('endTime', time2.toString())
        }
     }
     }
    function timediffRealtime() {
  }
        var elems = document.querySelectorAll('.salt-time-diff-done.real-time')
 
        setInterval(() => { // 主要过程: 每0.25秒更新一次
  // widget/SaltTimeDiff/widget.ts
            for (let i = 0; i < elems.length; i++) {
  //! <span class="salt-time-diff
                setTimeout(() => { // 异步, 避免卡顿
  //! 实时更新则额外加上 real-time ——结束时间会强制改为当前时间
                    var el = elems[i]
  //! 更复杂的显示请额外加上 complex ——可以用CSS修改渲染样式
                    var time1 = new Date(el.getAttribute('startTime'))
  //! 如果时间是UTC请额外加上 utc
                        , time2 = new Date()
  //! 简化输出请额外加上 simple
                        , cmd = el.getAttribute('timeDiff-command')
  //! ">{起始时间}SPLIT{结束时间}SPLIT{指令（d-天，h-小时，m-分钟，s-秒，M-毫秒）}</span>
                    if (!time1.getTime() || time1.getTime() == NaN) { // 预防无效输入
  var UTCOffset = new Date().getTimezoneOffset() * 60 * 1e3;
                        time1 = new Date()
  var cmdAttr = "data-salt-time-diff-command";
                        el.setAttribute('startTime', time1.toString())
  var startAttr = "data-salt-time-diff-start";
                    }
  var endAttr = "data-salt-time-diff-end";
                    var time3 = Math.abs(time1.getTime() - time2.getTime())
  var i18n = {
                    // 送入timediff函数
    year: "年",
                    var t = timediff(time3, cmd)
    month: "个月",
                    if (el.textContent != t) { el.textContent = t } // 避免闪烁
    day: "天",
                }, 0)
    hour: "小时",
            }
    minute: "分钟",
        }, 250)
    second: "秒",
        setInterval(() => { // 检查是否有漏网之鱼: 每5秒更新一次
    ms: "毫秒"
            if (document.querySelectorAll('.salt-time-diff').length > 0) { timediffHandle() }
  };
            elems = document.querySelectorAll('.salt-time-diff-done.real-time')
  function getDate(time, utc = false) {
        }, 5000)
    if (!time)
      return new Date();
    if (/^\d+$/.test(time.trim())) {
      const d2 = new Date(+time);
      if (!isNaN(d2.valueOf())) {
        if (utc)
          d2.setTime(d2.getTime() + UTCOffset);
        return d2;
      } else
        return new Date();
    }
    const d = new Date(time);
    if (!isNaN(d.valueOf()))
      return d;
    else
      return new Date();
  }
  function timeDiff({
    t1,
    t2,
    cmd = "d",
    cpx = false,
    simple = false
  }) {
    const _ms = t1.valueOf() - t2.valueOf();
    const isBefore = t1.valueOf() - t2.valueOf() > 0;
    const d1 = new Date(isBefore ? t2 : t1);
    const d2 = new Date(isBefore ? t1 : t2);
    let ms = Math.abs(_ms);
    const diff = { isBefore };
    if (cmd.indexOf("y") != -1) {
      let years = d2.getFullYear() - d1.getFullYear();
      d1.setFullYear(d2.getFullYear());
      if (d1.getTime() > d2.getTime()) {
        years -= 1;
        d1.setFullYear(d1.getFullYear() - 1);
      }
      ms = d2.getTime() - d1.getTime();
      if (!simple || years)
        diff.year = years;
    }
    if (cmd.indexOf("o") != -1) {
      let years = d2.getFullYear() - d1.getFullYear();
      d1.setFullYear(d2.getFullYear());
      if (d1.getTime() > d2.getTime()) {
        years -= 1;
        d1.setFullYear(d1.getFullYear() - 1);
      }
      let months = d2.getMonth() - d1.getMonth();
      if (d2.getFullYear() - d1.getFullYear())
        months += 12;
      d1.setFullYear(d2.getFullYear());
      d1.setMonth(d2.getMonth());
      if (d1.getTime() > d2.getTime()) {
        months -= 1;
        d1.setMonth(d1.getMonth() - 1);
      }
      ms = d2.getTime() - d1.getTime();
      if (!simple || months || "year" in diff)
        diff.month = years * 12 + months;
    }
    if (cmd.indexOf("d") != -1) {
      let days = Math.floor(ms / (24 * 3600 * 1e3));
      ms = ms % (24 * 3600 * 1e3);
      if (!simple || days || "year" in diff || "month" in diff)
        diff.day = days;
    }
    if (cmd.indexOf("h") != -1) {
      let hours = Math.floor(ms / (3600 * 1e3));
      ms = ms % (3600 * 1e3);
      if (!simple || hours || "day" in diff)
        diff.hour = hours;
    }
    if (cmd.indexOf("m") != -1) {
      let minutes = Math.floor(ms / (60 * 1e3));
      ms = ms % (60 * 1e3);
      if (!simple || minutes || "hour" in diff)
        diff.minute = minutes;
    }
    if (cmd.indexOf("s") != -1) {
      let seconds = Math.floor(ms / 1e3);
      ms = ms % 1e3;
      if (!simple || seconds || "minute" in diff)
        diff.second = seconds;
    }
    if (cmd.indexOf("M") != -1 || ms === Math.abs(_ms)) {
      diff.ms = ms;
    }
    return readableTimeTxt(diff, cpx);
  }
  function readableTimeTxt(timeObj, cpx = false) {
    let res = cpx ? timeObj.isBefore ? '<span class="salt-time-diff-txt salt-time-diff-before">还有</span>' : '<span class="salt-time-diff-txt salt-time-diff-after">已过去</span>' : "";
    const loop = [
      "year",
      "month",
      "day",
      "hour",
      "minute",
      "second",
      "ms"
    ];
    for (let i = 0; i < loop.length; i++) {
      const t = loop[i];
      if (t in timeObj) {
        res += cpx ? `<span class="salt-time-diff-res salt-time-diff-res-${t}">${timeObj[t]}</span><span class="salt-time-diff-txt salt-time-diff-txt-${t}">${i18n[t]}</span>` : `${timeObj[t]}${i18n[t]}`;
      }
    }
    return res;
  }
  function timeDiffHandler() {
    let elems = document.querySelectorAll(".salt-time-diff");
    for (let i = 0; i < elems.length; i++) {
      let el = elems[i];
      const utc = el.classList.contains("utc");
      let txt = (el.textContent || "").split("SPLIT");
      const t1 = getDate(txt[0].replace(/[年月日]/g, "/").replace(/[；：]/g, ":"), utc);
      const t2 = getDate(txt[1].replace(/[年月日]/g, "/").replace(/[；：]/g, ":"), utc);
      let cmd = "d";
      if (txt.length > 2) {
        cmd = txt[2].replace(/年份?/, "y").replace(/月份?/, "o").replace(/[天日]/, "d").replace(/小?时/, "h").replace(/分钟?/, "m").replace("毫秒", "M").replace("秒", "s");
      }
      el.classList.remove("salt-time-diff");
      el.classList.add("salt-time-diff-done");
      el.setAttribute(cmdAttr, cmd);
      el.setAttribute(startAttr, t1.toString());
      el.setAttribute(endAttr, t2.toString());
      handleElement(el);
     }
     }
    function timediff(ms = 0, cmd = 'd') { // 默认：没有时间差，只输出日期
  }
        var finaltxt = ''
  function handleElement(el) {
        if (cmd.indexOf('d') != -1) {
    const t1 = getDate(el.getAttribute(startAttr));
            let days = Math.floor(ms / (24 * 3600 * 1000))
    const t2 = getDate();
            ms = ms % (24 * 3600 * 1000)         // 除去天数后剩余的毫秒数
    const cmd = el.getAttribute(cmdAttr) || "d";
            finaltxt += days + '天'
    const simple = el.classList.contains("simple");
        }
    const cpx = el.classList.contains("complex");
        if (cmd.indexOf('h') != -1) {
    const t = timeDiff({ t1, t2, cmd, cpx, simple });
            let hours = Math.floor(ms / (3600 * 1000))
    if (!cpx) {
            ms = ms % (3600 * 1000)             // 除去小时后剩余的毫秒数
      if (el.textContent != t)
            finaltxt += hours + '小时'
        el.textContent = t;
        }
    } else {
        if (cmd.indexOf('m') != -1) {
      if (el.innerHTML != t)
            let hours = Math.floor(ms / (60 * 1000))
        el.innerHTML = t;
            ms = ms % (60 * 1000)              // 除去分钟后剩余的毫秒数
            finaltxt += hours + '分钟'
        }
        if (cmd.indexOf('s') != -1) {
            let hours = Math.floor(ms / (1000))
            ms = ms % (1000)                    // 除去秒数后剩余的毫秒数
            finaltxt += hours + '秒'
        }
        if (cmd.indexOf('M') != -1 || finaltxt.length < 1) { // 保险：若指令输入为空，则输出毫秒数
            finaltxt += ms + '毫秒'            // 剩余的毫秒数
        }
        return finaltxt
     }
     }
})
  }
  docReady(() => {
    if (window.saltTimeDiffNoConflictSign)
      return;
    else
      window.saltTimeDiffNoConflictSign = true;
    timeDiffHandler();
    let elems = document.querySelectorAll(".salt-time-diff-done.real-time");
    const update = () => {
      for (let i = 0; i < elems.length; i++) {
        handleElement(elems[i]);
      }
    };
    setInterval(() => {
      window.requestAnimationFrame ? window.requestAnimationFrame(update) : update();
    }, 50);
    setInterval(() => {
      if (document.querySelectorAll(".salt-time-diff").length) {
        timeDiffHandler();
      }
      elems = document.querySelectorAll(".salt-time-diff-done.real-time");
    }, 5e3);
  });
})();
</script></includeonly><noinclude>请使用模板{{tl|时间差}}。
</script></includeonly><noinclude>请使用模板{{tl|时间差}}。


搬运自[https://wiki.biligame.com/mcplayer/Widget:TimeDiff 我的世界玩家社区Wiki]，原作者：Salt_lovely（原作者即搬运者）。</noinclude>
原微件搬运自[https://wiki.biligame.com/mcplayer/Widget:TimeDiff 我的世界玩家社区Wiki]，原作者：Salt_lovely（原作者即搬运者）。</noinclude>
取自“https://mcbbs.wiki/wiki/特殊:移动版差异/27103...39102”