// ==UserScript==
// @name         在视频信息区显示视频 av 号
// @namespace    im.outv.userscripts.bilibili.avid
// @version      0.1.0
// @description  Display avid on video information header.
// @author       You
// @match        https://www.bilibili.com/video/*
// @match        https://*.bilibili.com/video/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=bilibili.com
// @license      MIT
// @grant        none
// @downloadURL none
// ==/UserScript==

(function() {
    'use strict';

    let avidElement;

    function createAvidElement() {
        const div = document.createElement("div")
        document.querySelector('.video-info-detail-list').appendChild(div)
        return div
    }

    function updateAvidDisplay(aid, bvid) {
        if (!aid) return
        if (!avidElement || !avidElement.isConnected) {
            avidElement = createAvidElement()
        }

        avidElement.innerText = `${bvid} av${aid}`
        console.log("Updated", aid, bvid, avidElement)
    }

    function onStateUpdate(value) {
        console.log("State updated", value)
        updateAvidDisplay(window.__INITIAL_STATE__.aid, window.__INITIAL_STATE__.bvid)

    }

    if (typeof window.__INITIAL_STATE__ === "undefined") {
      window.__INITIAL_STATE__ = {};
    }
    window.__INITIAL_STATE__ = new Proxy(window.__INITIAL_STATE__, {
        set(target, prop, value) {
            target[prop] = value;
            onStateUpdate(value);
            return true;
        }
  });
})();