// ==UserScript==
// @name         学人VIP
// @namespace    studyVIP.taozhiyu.gitee.io
// @version      0.1
// @description  解锁图文
// @author       涛之雨
// @match        *://gbr.businessreview.global/articles/view/*
// @icon         https://gbr.businessreview.global/img/GBR-logo_black_50x50.png
// @require      https://cdn.bootcdn.net/ajax/libs/hls.js/1.0.8-0.canary.7807/hls.min.js
// @antifeature  tracking ============================================>>>说明：我们仅会在经济学人文章阅读页面收集您使用本插件的情况，以帮助作者了解插件的用户数量。这个操作仅会收集您的IP地址信息，不包含您鼠标、键盘点击在内的所有操作，没有任何安全风险，不会产生性能损耗。为了保护您的知情权以及使用体验，特告知于您。本插件系开源脚本，所有代码均可查看源码，请您放心安装。 <<<============================================
// @grant        unsafeWindow
// @run-at       document-start
// ==/UserScript==
/*global Hls*/
(function() {
    'use strict';
    const path = location.pathname.split("/"),lang = path[4];

    // console.log("加载")
    fetch('https://api.hummingbird.businessreview.global/api/article?id=' + path[3]).then(a=>a.json()).then(tao=>{
        // console.log("获取到数据，开始渲染")
        var script = document.createElement("script");
        script.type = "text/javascript";
        script.src = "//js.users.51.la/21234891.js";
        document.body.appendChild(script);
        const Dom=document.querySelector(".maincontent");
        Dom.innerHTML=''//`<figure>${Dom.querySelector("figure").innerHTML}</figure>`
        document.querySelectorAll(".store_btns,.cover").forEach(a=>a.remove())
        tao.body.content.map(a=>{
            switch (a.type) {
                case "image":
                    for (const i of a.data) {
                        if (i.lang === lang) {
                            Dom.innerHTML+=`<figure><img src="https://businessreviewglobal-cdn.com/article_images/${path[3]}/${encodeURIComponent(i.image_path)}" alt="" class="img-responsive"><figcaption>&ZeroWidthSpace;</figcaption></figure>`;
                            break
                        }
                    }
                    break;
                case "paragraph":
                    for (const i of a.data) {
                        if (i.lang === lang) {
                            Dom.innerHTML+=`<p>${i.text}</p>`;
                            break
                        }
                    }
                    break
                case "subtitle":
                    //似乎没什么用？
                    break;
                case "video":
                    for (const i of a.data) {
                        if (i.lang === lang) {
                            const url=i.url
                            if(Hls.isSupported()) {
                                const vid=btoa((Math.random()+"").slice(2)).substr(0,10)
                                Dom.innerHTML+=`<video id=v_${vid} controls style="width: -webkit-fill-available;"></video>`;
                                var video = document.getElementById(`v_${vid}`);
                                var hls = new Hls();
                                var m3u8Url = decodeURIComponent(url)
                                hls.loadSource(m3u8Url);
                                // hls.on(Hls.Events.MANIFEST_PARSED,function() {
                                //     video.play();
                                // });
                                hls.attachMedia(video);
                            }else Dom.innerHTML+=`<br><p>不支持hls播放器</p><br>`;
                            break;
                        }
                    }
                    break;
                default:
                    console.log("未识别的类型",a)
            }
        })
        // console.log("渲染完成")
    })
    // Your code here...
})();