Volantis魔改教程

var binft = function (r) {
    var isTransparent = true;
    function getRandomColor() {
        if(isTransparent){
            isTransparent = false;
            //此处修改字体颜色,最后的 0 和 1 不要改
            return "rgba(255,255,255,0)"
        }else{
            isTransparent = true;
            return "rgba(255,255,255,1)"
        }
    }  
    function n(r) {
        for (var n = document.createDocumentFragment(), i = 0; r > i; i++) {
            var oneword = document.createElement("span");
            oneword.textContent = "_"; // 此处是末尾字符,如果想用光标样式可以改为"|"
            oneword.style.color = getRandomColor();
            n.appendChild(oneword);
        }
        return n
    }
    function i() {
        var t = wordList[c.skillI];
        c.step ? c.step-- : (c.step = refreshDelayTime, c.prefixP < l.length ? (c.prefixP >= 0 && (c.text += l[c.prefixP]), c.prefixP++) : "forward" === c.direction ? c.skillP < t.length ? (c.text += t[c.skillP], c.skillP++) : c.delay ? c.delay-- : (c.direction = "backward", c.delay = showTotalWordDelayTime) : c.skillP > 0 ? (c.text = c.text.slice(0, -1), c.skillP--) : (c.skillI = (c.skillI + 1) % wordList.length, c.direction = "forward")), r.textContent = c.text, r.appendChild(n(c.prefixP < l.length ? Math.min(maxLength, maxLength + c.prefixP) : Math.min(maxLength, t.length - c.skillP))), setTimeout(i, d)
    }
    var l = "",
    //此处改成你自己的诗词
    wordList = [ 
            "有花堪折直需折,莫待无花空折枝.",
            "闲居少邻并,草径入荒园.鸟宿池边树,僧敲月下门.",
            "侯门一入深如海,从此萧郎是路人.",
            "才见岭头云似盖,已惊岩下雪如尘.",
            "人间万事消磨尽,只有清香似旧时.",
            "日暮酒醒人已远,满天风雨下西楼.",
            "落灯花,棋未收,叹新丰逆旅淹留.",
            "软风吹过窗纱,心期便隔天涯.",
            "迷惑失故路,薄暮无宿栖.",
            "不见白头相携老,只许与君共天明.",
            "晓迎秋露一枝新,不占园中最上春.",
            "荷尽已无擎雨盖,菊残犹有傲霜枝.",
            "春未绿,鬓先丝.人间别久不成悲.",
            "江东子弟多才俊,卷土重来未可知.",
            "莫听穿林打叶声,何妨吟啸且徐行.",
            "在天愿作比翼鸟,在地愿为连理枝.",
        ].map(function (r) {
    return r + ""
    }),
    showTotalWordDelayTime = 2,
    refreshDelayTime = 1,
    maxLength = 1,
    d = 75,
    c = {
        text: "",
        prefixP: -maxLength,
        skillI: 0,
        skillP: 0,
        direction: "forward",
        delay: showTotalWordDelayTime,
        step: refreshDelayTime
    };
    i()
};
binft(document.getElementById('binft'));

let aplayer = document.querySelectorAll("meting-js")[0].aplayer;

// 注意：live2d_path 参数应使用绝对路径
//const live2d_path = "https://gcore.jsdelivr.net/gh/stevenjoezhang/live2d-widget@latest/";
const live2d_path = "/live2d-widget/";

// 加载 waifu.css live2d.min.js waifu-tips.js
if (screen.width >= 768) {
	Promise.all([
		loadExternalResource(live2d_path + "waifu.css", "css"),
		loadExternalResource(live2d_path + "live2d.min.js", "js"),
		loadExternalResource(live2d_path + "waifu-tips.js", "js")
	]).then(() => {
		initWidget({
			waifuPath: live2d_path + "waifu-tips.json",
			//apiPath: "https://live2d.fghrsh.net/api/",
			cdnPath: "/live2d_api/"
		});
	});
}

// 看板娘与APlayer
window.addEventListener('load', function () {
    let interval = setInterval(()=>{
        let aplayer = document.querySelectorAll("meting-js")[0].aplayer;
        if(!aplayer){
            return;
        }
        //播放
        aplayer.on("play", ()=>{
            music_index = aplayer.list.index;
            music_name = aplayer.list.audios[music_index].title;
            music_artist = aplayer.list.audios[music_index].artist;
            if(say){
                say(randomSeek(message_play));
            }
        });
        //暂停
        aplayer.on("pause", ()=>{
            if(say){
                say(randomSeek(message_pause));
            }
        });
        //快进
        aplayer.on("seeked", ()=>{
            if(say){
                say(randomSeek(message_seeked));
            }
        });
        clearInterval(interval)

        function randomSeek(list){
            return list[Math.floor(Math.random() * list.length)]
                .replaceAll("{name}", `<span>${music_name || "未知歌曲"}</span>`)
                .replaceAll("{artist}", `<span>${music_artist || "未知作者"}</span>`);
        }
    }, 300)

    let music_index;
    let music_name;
    let music_artist;

    const message_play = [
        '开始播放{name}',];
    const message_pause = [
        '{name}已暂停',];
    const message_seeked = [
        '快进',];
});

var OriginTitle = document.title;
document.addEventListener('visibilitychange', function () {
    if (document.hidden) {
        document.title = '╭(°A°`)╮ 你去哪了? 快回来!!!';
    }else {
        document.title = '(ฅ>ω<*ฅ) 你终于回来了 ~';
        setTimeout(function () {
            if(!document.hidden){
                document.title = OriginTitle;
            }
        }, 2000);
    }
});

<% if (item.title || item.subtitle || item.jinrishici) { %>
    <div class='text'>
    <% if (item.title){ %>
        <h2><%- item.title %></h2>
    <% } %>
    <% if (item.subtitle){ %>
        <%- markdown(item.subtitle) %>
    <% } %>
    <% if (item.jinrishici){ %>
        <p><span id="jinrishici-sentence"><%- item.jinrishici != true ? item.jinrishici : config.title %></span></p>
        <script src="https://sdk.jinrishici.com/v2/browser/jinrishici.js" charset="utf-8"></script>
    <% } %>
    
    <% if (item.customword){ %>
        <p><%- item.customword %></p>
    <% } %>

    </div>
<% } %>

<%
let aplayer = theme.plugins.aplayer;
%>
<% if (theme.plugins.aplayer.enable == true) { %>
  <% if (aplayer.localMusic.enable == true) { // 采用本地音乐 %> 
    <% 
      let audio = aplayer.localMusic.audio; // 获取本地歌曲数组
      let template = aplayer.localMusic.template; // 获取模板
      // 使用模板补充缺少的信息
      audio.forEach((item) => {
        let name = item.name;
        if(!item.artist) item.artist = template.artist.replaceAll("{name}", name);
        if(!item.title) item.title = template.title.replaceAll("{name}", name);
        if(!item.url) item.url = template.root + template.url.replaceAll("{name}", name);
        if(!item.lrc) item.lrc = template.root + template.lrc.replaceAll("{name}", name);
        if(!item.cover) item.cover = template.root + template.cover.replaceAll("{name}", name);
      });
    %> 
    <script>
      const MetingPlusAudio = <%- JSON.stringify(audio) %>;
    </script>
    <meting-js
      theme='<%- aplayer.theme %>'
      autoplay='<%- aplayer.autoplay %>'
      volume='<%- aplayer.volume %>'
      loop='<%- aplayer.loop %>'
      order='<%- aplayer.order %>'
      fixed='<%- aplayer.fixed %>'
      list-max-height='<%- aplayer.list_max_height %>'
      server='<%- aplayer.server %>'
      type='<%- aplayer.type %>'
      id='<%- aplayer.id %>'
      list-folded='<%- aplayer.list_folded %>'
      audio='MetingPlusAudio'
      >
      </meting-js>
    <% } else { %>
      <% if (post && post.music) { %>
        <meting-js
          mini='true'
          volume='<%- post.music.volume || aplayer.volume %>'
          loop='<%- post.music.loop || aplayer.loop %>'
          order='<%- post.music.order || aplayer.order %>'
          server='<%- post.music.server || aplayer.server %>'
          type='<%- post.music.type || aplayer.type %>'
          id='<%- post.music.id || aplayer.id %>'>
        </meting-js>
      <% } else { %>
        <meting-js
          theme='<%- aplayer.theme %>'
          autoplay='<%- aplayer.autoplay %>'
          volume='<%- aplayer.volume %>'
          loop='<%- aplayer.loop %>'
          order='<%- aplayer.order %>'
          fixed='<%- aplayer.fixed %>'
          list-max-height='<%- aplayer.list_max_height %>'
          server='<%- aplayer.server %>'
          type='<%- aplayer.type %>'
          id='<%- aplayer.id %>'
          list-folded='<%- aplayer.list_folded %>'>
        </meting-js>
      <% } %>
    <% } %>
<% } %> 

class MetingJSElement extends HTMLElement {

  connectedCallback() {
    if (window.APlayer && window.fetch) {
      this._init()
      this._parse()
    }
  }

  disconnectedCallback() {
    if (!this.lock) {
      this.aplayer.destroy()
    }
  }

  _camelize(str) {
    return str
      .replace(/^[_.\- ]+/, '')
      .toLowerCase()
      .replace(/[_.\- ]+(\w|$)/g, (m, p1) => p1.toUpperCase())
  }

  _init() {
    let config = {}
    for (let i = 0; i < this.attributes.length; i += 1) {
      config[this._camelize(this.attributes[i].name)] = this.attributes[i].value
    }
    let keys = [
      'server', 'type', 'id', 'api', 'auth',
      'auto', 'lock',
      'name', 'title', 'artist', 'author', 'url', 'cover', 'pic', 'lyric', 'lrc',
      'audio',
    ]
    this.meta = {}
    for (let key of keys) {
      this.meta[key] = config[key]
      delete config[key]
    }
    this.config = config

    this.api = this.meta.api || window.meting_api || 'https://api.i-meto.com/meting/api?server=:server&type=:type&id=:id&r=:r'
    if (this.meta.auto) this._parse_link()
  }

  _parse_link() {
    let rules = [
      ['music.163.com.*song.*id=(\\d+)', 'netease', 'song'],
      ['music.163.com.*album.*id=(\\d+)', 'netease', 'album'],
      ['music.163.com.*artist.*id=(\\d+)', 'netease', 'artist'],
      ['music.163.com.*playlist.*id=(\\d+)', 'netease', 'playlist'],
      ['music.163.com.*discover/toplist.*id=(\\d+)', 'netease', 'playlist'],
      ['y.qq.com.*song/(\\w+).html', 'tencent', 'song'],
      ['y.qq.com.*album/(\\w+).html', 'tencent', 'album'],
      ['y.qq.com.*singer/(\\w+).html', 'tencent', 'artist'],
      ['y.qq.com.*playsquare/(\\w+).html', 'tencent', 'playlist'],
      ['y.qq.com.*playlist/(\\w+).html', 'tencent', 'playlist'],
      ['xiami.com.*song/(\\w+)', 'xiami', 'song'],
      ['xiami.com.*album/(\\w+)', 'xiami', 'album'],
      ['xiami.com.*artist/(\\w+)', 'xiami', 'artist'],
      ['xiami.com.*collect/(\\w+)', 'xiami', 'playlist'],
    ]

    for (let rule of rules) {
      let patt = new RegExp(rule[0])
      let res = patt.exec(this.meta.auto)
      if (res !== null) {
        this.meta.server = rule[1]
        this.meta.type = rule[2]
        this.meta.id = res[1]
        return
      }
    }
  }

  _parse() {
    if (this.meta.audio) {
      let audioList
      if(this.meta.audio.trim().startsWith("%5B")){ // 以中括号开头,认为是数组
        audioList = JSON.parse(decodeURI(this.meta.audio))
      }else{
        audioList = eval(this.meta.audio)
      }
      this._loadPlayer(audioList)
      return
    }
    if (this.meta.url) {
      let result = {
        name: this.meta.name || this.meta.title || 'Audio name',
        artist: this.meta.artist || this.meta.author || 'Audio artist',
        url: this.meta.url,
        cover: this.meta.cover || this.meta.pic,
        lrc: this.meta.lrc || this.meta.lyric || '',
        type: this.meta.type || 'auto',
      }
      if (!result.lrc) {
        this.meta.lrcType = 0
      }
      if (this.innerText) {
        result.lrc = this.innerText
        this.meta.lrcType = 2
      }
      this._loadPlayer([result])
      return
    }

    let url = this.api
      .replace(':server', this.meta.server)
      .replace(':type', this.meta.type)
      .replace(':id', this.meta.id)
      .replace(':auth', this.meta.auth)
      .replace(':r', Math.random())

    fetch(url)
      .then(res => res.json())
      .then(result => this._loadPlayer(result))
  }

  _loadPlayer(data) {

    let defaultOption = {
      audio: data,
      mutex: true,
      lrcType: this.meta.lrcType || 3,
      storageName: 'metingjs'
    }

    if (!data.length) return

    let options = {
      ...defaultOption,
      ...this.config,
    }
    for (let optkey in options) {
      if (options[optkey] === 'true' || options[optkey] === 'false') {
        options[optkey] = (options[optkey] === 'true')
      }
    }

    let div = document.createElement('div')
    options.container = div
    this.appendChild(div)

    this.aplayer = new APlayer(options)
  }

}

if (window.customElements && !window.customElements.get('meting-js')) {
  window.MetingJSElement = MetingJSElement
  window.customElements.define('meting-js', MetingJSElement)
}