Ende Main
<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cn" lang="cn">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
        <meta charset="UTF-8">
 
        <style>
            @import url("https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap");
            @import url('https://scp-wiki-cn.wdfiles.com/local--code/fragment%3Aparallel/1');
            @import url("https://fontsapi.zeoseven.com/7/main/result.css");
 
            :root {
                font-size: 16px;
                --basalt-tertiary-color: 229, 229, 229;
                --main-content-width: 66rem;
 
                --sound-on: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 24.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0%29 --%3E%3Csvg version='1.1' id='图层_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 500 500' style='enable-background:new 0 0 500 500;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23231815;%7D%0A%3C/style%3E%3Cpath class='st0' d='M275.0019531,382.5c-1.9521484,0-3.8701172-0.7617188-5.3056641-2.1962891L196.8935547,307.5H125 c-4.1420898,0-7.5-3.3574219-7.5-7.5V200c0-4.1420898,3.3579102-7.5,7.5-7.5h71.8935547l72.8027344-72.8032227 c2.1464844-2.1445313,5.3701172-2.7875977,8.1738281-1.6259766C280.6728516,119.2319336,282.5,121.9663086,282.5,125v250 c0,3.0332031-1.8271484,5.7685547-4.6298828,6.9287109C276.9423828,382.3134766,275.9677734,382.5,275.0019531,382.5z M132.5,292.5 H200c1.9892578,0,3.8969727,0.7900391,5.3032227,2.1962891L267.5,356.8935547V143.1064453l-62.1967773,62.1967773 C203.8969727,206.7099609,201.9892578,207.5,200,207.5h-67.5V292.5z'/%3E%3Cpath class='st0' d='M346.2851563,325.6132813c-1.9189453,0-3.8388672-0.7324219-5.3037109-2.1962891 c-2.9287109-2.9296875-2.9287109-7.6777344,0-10.6074219C357.7587891,296.0332031,366.9980469,273.7265625,366.9980469,250 s-9.2392578-46.0332031-26.0166016-62.8105469c-2.9287109-2.9287109-2.9287109-7.6777344,0-10.6064453 c2.9306641-2.9291992,7.6787109-2.9291992,10.6074219,0C371.1982422,196.1933594,381.9980469,222.2666016,381.9980469,250 s-10.7998047,53.8066406-30.4091797,73.4169922C350.1240234,324.8808594,348.2041016,325.6132813,346.2851563,325.6132813z'/%3E%3Cpath class='st0' d='M314.4980469,293.8271484c-1.9189453,0-3.8388672-0.7324219-5.3037109-2.1962891 c-2.9287109-2.9296875-2.9287109-7.6777344,0-10.6074219C317.4814453,272.7363281,322.0458984,261.71875,322.0458984,250 s-4.5644531-22.7368164-12.8515625-31.0239258c-2.9287109-2.9287109-2.9287109-7.6777344,0-10.6064453 c2.9296875-2.9287109,7.6777344-2.9287109,10.6074219,0C330.921875,219.4897461,337.0458984,234.2744141,337.0458984,250 s-6.1240234,30.5097656-17.2441406,41.6308594C318.3369141,293.0947266,316.4169922,293.8271484,314.4980469,293.8271484z'/%3E%3C/svg%3E");
                --sound-off: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 24.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0%29 --%3E%3Csvg version='1.1' id='图层_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 500 500' style='enable-background:new 0 0 500 500;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23231815;%7D%0A%3C/style%3E%3Cpath class='st0' d='M275.0019531,382.5c-1.9521484,0-3.8701172-0.7617188-5.3056641-2.1962891L196.8935547,307.5H125 c-4.1420898,0-7.5-3.3574219-7.5-7.5V200c0-4.1420898,3.3579102-7.5,7.5-7.5h71.8935547l72.8027344-72.8032227 c2.1464844-2.1445313,5.3701172-2.7875977,8.1738281-1.6259766C280.6728516,119.2319336,282.5,121.9663086,282.5,125v250 c0,3.0332031-1.8271484,5.7685547-4.6298828,6.9287109C276.9423828,382.3134766,275.9677734,382.5,275.0019531,382.5z M132.5,292.5 H200c1.9892578,0,3.8969727,0.7900391,5.3032227,2.1962891L267.5,356.8935547V143.1064453l-62.1967773,62.1967773 C203.8969727,206.7099609,201.9892578,207.5,200,207.5h-67.5V292.5z'/%3E%3Cpath class='st0' d='M350.6071777,249.999939l19.6965332-19.6967163c2.9287109-2.9287109,2.9287109-7.6777344,0-10.6064453 c-2.9296875-2.9287109-7.6777344-2.9287109-10.6074219,0L340,239.3928833l-19.6962891-19.696106 c-2.9296875-2.9287109-7.6777344-2.9287109-10.6074219,0c-2.9287109,2.9287109-2.9287109,7.6777344,0,10.6064453 l19.6965332,19.6967163l-19.6965332,19.6963501c-2.9287109,2.9296875-2.9287109,7.6777344,0,10.6074219 C311.1611328,281.7675781,313.0810547,282.5,315,282.5s3.8388672-0.7324219,5.3037109-2.1962891L340,260.6072388 l19.6962891,19.6964722C361.1611328,281.7675781,363.0810547,282.5,365,282.5s3.8388672-0.7324219,5.3037109-2.1962891 c2.9287109-2.9296875,2.9287109-7.6777344,0-10.6074219L350.6071777,249.999939z'/%3E%3C/svg%3E");
            }
 
            html {
                overflow: hidden;
            }
 
            body#html-body {
                width: 100dvw;
                height: 100dvh;
                display: grid;
                grid-template-columns: [full-start] 1fr [content-start] min(var(--main-content-width), 90dvw) [content-end] 1fr [full-end];
                grid-template-rows: [full-start] 1fr [full-end];
                background-color: rgb(var(--basalt-primary-color));
                overflow: hidden;
            }
 
            hr {
                border: none;
                height: var(--thin-border-width);
            }
 
            video {
                width: 100%;
                height: 100%;
                position: relative;
                z-index: 10086;
            }
 
            div.hor {
                height: 5rem;
            }
 
            div.wiki-note {
                width: min(100%, calc(var(--main-content-width) * .8));
                font-family: "Zhuque Fangsong (technical preview)";
                font-size: 1.05em;
                margin-block: 1.5rem;
            }
 
            a.page-button {
                color: rgb(var(--basalt-primary-color));
                padding: 0.5rem 1rem;
                border-radius: 0.2rem;
                background-color: rgb(var(--basalt-undertone));
                transition: ease 0.125s;
            }
 
            div.mobile div:has(> a.page-button) {
                padding-block: 1.5rem;
            }
 
            a.page-button:hover {
                text-decoration: none;
                background-color: rgb(var(--basalt-overtone));
            }
 
            a.page-button:focus {
                text-decoration: none;
            }
 
            div#media {
                display: none;
            }
 
            ende-topbar {
                display: flex;
                position: absolute;
                top: 0.5rem;
                right: 0.5rem;
                gap: 0.5rem;
                z-index: 666;
            }
 
            ende-topbar div {
                width: 2rem;
                height: 2rem;
                background-color: rgb(var(--basalt-tertiary-color));
                border-radius: 0.25rem;
            }
 
            ende-topbar div#topbar-sound-button {
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
                cursor: pointer;
            }
 
            ende-topbar div#topbar-sound-button:hover {
                background-color: rgb(var(--basalt-secondary-color));
            }
 
            ende-topbar div#topbar-number-button {
                width: 5rem;
                line-height: 1.5rem;
                padding-block: 0.25rem;
                text-align: center;
                font-family: "Oswald";
                box-sizing: border-box;
            }
 
            ende-topbar div#topbar-number-button span {
                display: inline-block;
                text-align: center;
                white-space: nowrap;
                overflow: hidden;
                vertical-align: top;
            }
 
            ende-topbar div#topbar-number-button span#tnb-chapter {
                width: 0.75rem;
            }
 
            ende-topbar div#topbar-number-button span#tnb-part {
                width: 1.5rem;
            }
 
            ende-topbar div#topbar-number-button span#tnb-total {
                width: 1.5rem;
            }
 
            ende-container {
                display: contents;
            }
 
            ende-document,
            ende-memory > div.document {
                display: grid;
                height: calc(100% - min(20vh, 10rem));
                min-height: min(100%, 25rem);
                align-self: center;
                grid-template-columns: 1fr;
                grid-template-rows: 2.5rem auto;
                grid-column: content;
                grid-row: full;
                opacity: 0;
                pointer-events: none;
            }
 
            ende-document,
            ende-memory div.document,
            ende-memory div.mobile,
            ende-memory div.fade-in {
                opacity: 0;
                animation: fadeIn 0.5s forwards;
            }
 
            ende-document[content="4"] {
                animation-delay: 0.5s;
            }
 
            ende-memory {
                display: contents;
            }
 
            ende-document.hidden,
            ende-memory.hidden {
                display: none;
            }
 
            ende-container div.ende-title {
                padding: 0.5rem 2.5rem;
                border: solid var(--thin-border-width) var(--doc-border, rgb(var(--basalt-tertiary-color)));
                border-bottom: none;
                border-radius: 0.5rem 0.5rem 0 0;
                background-color: var(--doc-bg, rgba(var(--basalt-primary-color), 0.8));
            }
 
            ende-container div.ende-title p {
                margin-block: 0;
                line-height: 1.5rem;
                font-size: 1.2rem;
                font-weight: 700;
            }
 
            ende-container div.ende-content {
                padding: 2.5rem 3.5rem;
                border: solid var(--thin-border-width) var(--doc-border, rgb(var(--basalt-tertiary-color)));
                border-radius: 0 0 0.5rem 0.5rem;
                overflow-y: auto;
                overflow-x: hidden;
                background-color: var(--doc-bg, rgba(var(--basalt-primary-color), 0.8));
            }
 
            div.loading {
                font-size: 0.9rem;
                text-align: center;
                grid-column: content;
                grid-row: full;
                align-self: center;
                justify-self: center;
                animation: out 0.5s forwards;
                pointer-events: none;
                opacity: 1;
            }
 
            div.loading::after {
                content: "";
                display: block;
                width: 9rem;
                height: var(--thin-border-width);
                margin-top: 0.5rem;
                background-color: rgb(var(--basalt-overtone));
            }
 
            div.warning-container {
                position: fixed;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                display: grid;
                grid-template-columns: 1fr;
                grid-template-rows: 1fr;
                background-color: rgba(20, 20, 20, 0.4);
                animation: fadeIn 0.5s forwards;
            }
 
            div.warning {
                align-self: center;
                justify-self: center;
                text-align: center;
                background-color: rgb(var(--basalt-primary-color));
                padding: 0.5rem 1.5rem 1.5rem;
                border: solid var(--thin-border-width) rgb(var(--basalt-tertiary-color));
                border-radius: 0.5rem;
            }
 
            div.full-container {
                width: 100%;
                height: 100%;
                grid-column: full;
                grid-row: full;
                background-color: rgb(0, 0, 0);
            }
 
            div.full-container > div,
            div.full-container > div > div {
                height: 100%;
            }
 
            div.background-shader {
                width: 100%;
                height: 100%;
                background-color: rgb(var(--basalt-overtone));
                background-size: cover;
                background-position: center;
                filter: blur(5px);
            }
 
            div.background-shader.hi-blur {
                filter: blur(30px);
            }
 
            div.mobile {
                display: grid;
                grid-template-columns: 1fr;
                grid-template-rows: 2.5rem 1fr 2.5rem;
                grid-column: content;
                grid-row: full;
                align-self: center;
                justify-self: center;
                height: 90vh;
                background-color: rgb(var(--basalt-primary-color));
                aspect-ratio: 9 / 16;
                border-radius: 2rem;
                overflow: hidden;
            }
 
            div.mobile-header,
            div.mobile-footer {
                display: flex;
                justify-content: center;
                align-items: center;
                text-align: center;
            }
 
            div.mobile-header p,
            div.mobile-footer p {
                margin-block: 0;
            }
 
            div.mobile-footer p {
                opacity: 0.4;
            }
 
            div.mobile-content {
                padding: 0.5rem 1rem;
                background-color: rgb(var(--basalt-secondary-color));
                overflow-y: auto;
            }
 
            div.mobile-content div.right {
                width: 80%;
                margin-block: 0.5rem;
                margin-left: auto;
                display: flex;
                flex-direction: column;
                align-items: end;
            }
 
            div.mobile-content div.left {
                width: 80%;
                margin-block: 0.5rem;
                margin-right: auto;
                display: flex;
                flex-direction: column;
                align-items: start;
            }
 
            div.mobile-content div.right p,
            div.mobile-content div.left p {
                display: block;
                margin-block: 0.25rem;
                padding: 0.5rem 0.8rem;
                border-radius: 0.5rem;
                background-color: rgb(var(--basalt-primary-color));
            }
 
            div.mobile-content div.right p {
                background-color: rgb(225, 225, 254);
            }
 
            div.blockcontent > strong:nth-child(1) {
                display: block;
                margin-top: 0.8rem;
                font-size: 112.5%;
            }
 
            div.question {
                max-width: max-content;
                margin: 1rem auto;
                padding: 0.1rem 1.5rem;
                background-color: rgb(var(--basalt-secondary-color));
                font-weight: 700;
            }
 
            div.online {
                max-width: min(25rem, 80vw);
                margin: 1rem auto;
                padding: 0.1rem 1.5rem;
                background-color: rgb(var(--basalt-primary-color));
                border: solid var(--base-border-width) rgb(var(--basalt-tertiary-color));
                border-radius: 0.5rem;
            }
 
            @keyframes out {
                99.9% {
                    opacity: 1;
                }
 
                100% {
                    opacity: 0;
                }
            }
 
            @keyframes fadeIn {
                0% {
                    opacity: 0;
                    pointer-events: none;
                }
 
                100% {
                    opacity: 1;
                    pointer-events: inherit;
                }
            }
 
            @media (max-width: 960px) {
                ende-container div.ende-content {
                    padding: 0.5rem 1.5rem 1.5rem;
                }
            }
 
            @media (max-width: 560px) {
                body#html-body {
                    grid-template-columns: [full-start] 1fr [content-start] min(var(--main-content-width), 100dvw) [content-end] 1fr [full-end];
                }
 
                ende-document,
                ende-memory > div.document {
                    display: block;
                    height: auto;
                    align-self: stretch;
                    overflow-y: auto;
                    overflow-x: hidden;
                }
 
                ende-container div.ende-title {
                    border: none;
                    padding: 3.5rem 1.5rem 0.5rem;
                    min-height: 1.5rem;
                }
 
                ende-container div.ende-content {
                    border-inline: none;
                    border-bottom: none;
                }
 
                div.mobile {
                    height: unset;
                    aspect-ratio: unset;
                    align-self: stretch;
                    justify-self: stretch;
                    grid-template-rows: 3rem 1fr 3rem;
                    border-radius: 0.5rem;
                }
 
                div.mobile div.mobile-header {
                    justify-content: start;
                    padding-inline: 3rem;
                }
            }
 
            @media (max-width: 960px) and (orientation: portrait) {
                video {
                    object-fit: cover;
                    object-position: 65%;
                }
            }
        </style>
        <script src="https://ah-sandbox.wikidot.com/local--files/scp-cn-4000/contents.js" type="text/javascript"></script>
        <script src="https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/powerglitch.min.js" type="text/javascript"></script>
        <script src="https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/howler.core.js" type="text/javascript"></script>
        <script src="https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/typed.umd.js" type="text/javascript"></script>
        <script type="text/javascript" defer>
            var page = {};
            var pageIdDefault = [1, 4, 0]; // 1 for documents, 0 for memories
 
            var tnbChapter = null;
            var tnbPart = null;
            var tnbTotal = null;
 
            var tsb = null;
 
            var endVideo = null;
            var endAudio = new Howl({
                src: ['Fin.ogg', 'Fin.mp3'],
                preload: true
            });
 
            var SE_Page = new Howl({
                src: ['https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/SE_Page.ogg', 'https://ah-sandbox.wikidot.com/local--files/scp-cn-4000/SE_Page.mp3'],
                preload: true
            });
 
            var mute = false;
 
            var LOAD_Percent = 0; // 待会实现一个加载
 
            function canPlayWebM() {
                var video = document.createElement('video');
                return video.canPlayType('video/webm') !== '';
            }
 
            Object.defineProperties(page, {
                id: {
                    get: function() {
                        return a
                    },
                    set: function(newVal) {
                        a = newVal;
                        document.querySelectorAll('ende-document, ende-memory').forEach(el => el.className = 'hidden');
                        if (a[0] == 0) {
                            document.querySelector('ende-memory[content="'+String(a[1])+'"][sub="'+String(a[2])+'"]').className = '';
                        }
                        if (a[0] == 1) {
                            document.querySelector('ende-document[content="'+String(a[1])+'"]').className = '';
                        }
                    }
                }
            })
 
            function pageChange(list, audio=SE_Page) {
                page.id = list;
                tnbChapter.innerText = String(list[1]);
                if (list[0] == 1) {
                    tnbPart.innerText = "NaN";
                }
                if (list[0] == 0) {
                    tnbPart.innerText = String(list[2]);
                }
                audio.play()
            }
 
            function base64ToBytes(base64) {
                const binString = atob(base64);
                return Uint8Array.from(binString, (m) => m.codePointAt(0));
            }
 
            class EndeContainer extends HTMLElement {
                static observedAttributes = ["color", "size"];
 
                constructor() {
                    super();
                }
 
                connectedCallback() {
                    console.log("自定义元素添加至页面。");
                    // const shadow = this.attachShadow({ mode: "closed" });
                    // shadow.innerHTML = "<span>123</span>";
                }
 
                disconnectedCallback() {
                    console.log("自定义元素从页面中移除。");
                }
 
                adoptedCallback() {
                    console.log("自定义元素移动至新页面。");
                }
 
                attributeChangedCallback(name, oldValue, newValue) {
                    console.log(`属性 ${name} 已变更。`);
                }
            }
 
            customElements.define("ende-container", EndeContainer);
 
            class EndeDocument extends HTMLElement {
                static observedAttributes = ["content", "theme"];
 
                constructor() {
                    super();
                }
 
                connectedCallback() {
                    this.innerHTML = new TextDecoder().decode(base64ToBytes(EndeDocumentContent[Number(this.getAttribute("content"))]));
                }
            }
 
            customElements.define("ende-document", EndeDocument);
 
            class EndeMemory extends HTMLElement {
                static observedAttributes = ["content", "sub", "theme"];
 
                constructor() {
                    super();
                }
 
                connectedCallback() {
                    this.innerHTML = new TextDecoder().decode(base64ToBytes(EndeMemoryContent[Number(this.getAttribute("content"))][Number(this.getAttribute("sub"))]));
                }
            }
 
            customElements.define("ende-memory", EndeMemory);
 
            //杂项
 
            function show(id) {
                document.getElementById(id).style.display = "";
            }
 
            function hide(id) {
                document.getElementById(id).style.display = "none";
            }
 
            //异步sleep
 
            function sleep(time) {
                return new Promise((resolve) => setTimeout(resolve, time));
            }
 
            async function aniChange(list, audio=SE_Page) {
                pageChange(list, audio);
                const shaderGlitch = PowerGlitch.glitch('.background-shader', {glitchTimeSpan: {start: 0.0, end: 1.0}, slice: {cssFilters: 'blur(30px) brightness(0.8)'}});
                await sleep(300);
                shaderGlitch.stopGlitch();
            }
 
            async function document4Change() {
                const contentGlitch = PowerGlitch.glitch('.glitchcontent', {glitchTimeSpan: {start: 0.0, end: 1.0}});
                await sleep(500);
                contentGlitch.stopGlitch();
                document.getElementById('item-number').innerHTML = "<div class='blockcontent'><strong style='opacity: 0;'>SCP-CN-4000</strong></div>";
                document.getElementById('special-containment-procedures').innerHTML = "";
                document.getElementById('description').innerHTML = "";
                document.getElementById('addendum').innerHTML = "";
                show('document-1-tips');
            }
 
            async function document0Change() {
                endVideo.addEventListener("ended", function() {
                    show('end-name-shader');
                    hide('end-video-shader');
                });
                const contentGlitch = PowerGlitch.glitch('.glitchcontent', {glitchTimeSpan: {start: 0.0, end: 1.0}});
                await sleep(500);
                contentGlitch.stopGlitch();
                hide('topbar');
                show('end-video-shader');
                await sleep(7500);
                endAudio.play();
                endAudio.fade(0.05, 1.0, 11451.4);
            }
 
            function final() {
                setTimeout(function(){
                    endVideo.classList.add("grow");
                    endVideo.play();
                    endVideo.currentTime = 0.5;
                }, 750);
            }
 
            // 加载完成后要做的事情
 
            window.onload = function() {
                tnbChapter = document.getElementById("tnb-chapter");
                tnbPart = document.getElementById("tnb-part");
                tnbTotal = document.getElementById("tnb-total");
                endVideo = document.getElementById("end-video");
                tsb = document.getElementById("topbar-sound-button");
                //endAudio = document.getElementById("fin-audio");
 
                if (canPlayWebM()) {
                    document.getElementById("media").innerHTML += `<link id="V-Fin"
                        rel="preload"
                        as="fetch"
                        href="https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/V_Fin.webm"
                        type="video/webm"
                        onload="LOAD_Percent += 4; console.log('FINM')"
                        onerror=""
                        media="screen"
                    >`;
                }
                else {
                    document.getElementById("media").innerHTML += `<link id="V-Fin"
                        rel="preload"
                        as="fetch"
                        href="https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/V_Fin.mp4"
                        type="video/mp4"
                        onload="LOAD_Percent += 4; console.log('FINM')"
                        onerror=""
                        media="screen"
                    >`;
                }
 
                //导航栏
 
                tnbChapter.addEventListener("keydown", function(event) {
                    if (event.key === "Enter") {
                        event.preventDefault();
                        if (Number(tnbChapter.innerText) <= 4 && Number(tnbChapter.innerText) >= 0) {
                            if (tnbPart.innerText == "NaN") {
                                pageChange([1, Number(tnbChapter.innerText), 0]);
                            }
                            else {
                                tnbPart.innerText = "NaN";
                                pageChange([1, Number(tnbChapter.innerText), 0]);
                            }
                        }
 
                        if (Number(tnbChapter.innerText) == 4) {
                            tnbTotal.innerText = "5";
                        }
 
                        if (Number(tnbChapter.innerText) == 0) {
                            tnbTotal.innerText = "NaN";
                        }
                    }
                });
 
                tnbPart.addEventListener("keydown", function(event) {
                    if (event.key === "Enter") {
                        event.preventDefault();
                        if (Number(tnbChapter.innerText) <= 4 && Number(tnbChapter.innerText) >= 0) {
                            if (tnbPart.innerText == "NaN") {
                                pageChange([1, Number(tnbChapter.innerText), 0]);
                            }
                            else {
                                pageChange([0, Number(tnbChapter.innerText), Number(tnbPart.innerText)]);
                            }
                        }
                    }
                });
 
                tsb.addEventListener("click", function() {
                    mute = !mute;
                    const howls = Howler._howls;
                    howls.forEach(howl => {
                        howl.mute(mute);
                    });
 
                    if (tsb.style.backgroundImage == "var(--sound-on)") {
                        tsb.style.backgroundImage = "var(--sound-off)";
                    }
                    else {
                        tsb.style.backgroundImage = "var(--sound-on)";
                    }
                });
 
                //进度条
 
                document.querySelector('ende-topbar').style.display = "";
                document.querySelector('ende-container').style.display = "";
                page.id = pageIdDefault;
            }
        </script>
    </head>
    <body id="html-body">
        <ende-topbar id="topbar" style="display: none;">
            <div id="topbar-number-button">
                <span id="tnb-chapter" contenteditable>4</span>:<span id="tnb-part" contenteditable>NaN</span>/<span id="tnb-total">14</span>
            </div>
            <div id="topbar-sound-button" style="background-image: var(--sound-on);">
            </div>
        </ende-topbar>
        <div class="loading">正在加载资源</div>
        <div id="media">
            <link id="BG_Nebula"
                rel="preload"
                as="image"
                href="https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/BG_Nebula.jpg"
                type="image/jpeg"
                onload="LOAD_Percent += 4; console.log('NEBULA')"
                onerror=""
            >
            <link id="BG_Sunset"
                rel="preload"
                as="image"
                href="https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/BG_Sunset.jpg"
                type="image/jpeg"
                onload="LOAD_Percent += 4; console.log('SUNSET')"
                onerror=""
            >
            <link id="BG_Altun"
                rel="preload"
                as="image"
                href="https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/BG_Altun.jpg"
                type="image/jpeg"
                onload="LOAD_Percent += 4; console.log('ALTUN')"
                onerror=""
            >
            <link id="IMG_State_Road"
                rel="preload"
                as="image"
                href="https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/IMG_State_Road.jpg"
                type="image/jpeg"
                onload="LOAD_Percent += 4; console.log('ISR')"
                onerror=""
            >
            <style>
                :root {
                    --BG_Nebula: url("https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/BG_Nebula.jpg");
                    --BG_Sunset: url("https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/BG_Sunset.jpg");
                    --BG_Altun: url("https://ah-sandbox.wdfiles.com/local--files/scp-cn-4000/BG_Altun.jpg");
                }
            </style>
        </div>
        <ende-container style="display: none;">
            <ende-document class="hidden" content="4"></ende-document>
            <ende-memory class="hidden" content="4" sub="0"></ende-memory>
            <ende-memory class="hidden" content="4" sub="1"></ende-memory>
            <ende-memory class="hidden" content="4" sub="2"></ende-memory>
            <ende-memory class="hidden" content="4" sub="3"></ende-memory>
            <ende-memory class="hidden" content="4" sub="4"></ende-memory>
            <ende-memory class="hidden" content="4" sub="5"></ende-memory>
            <ende-memory class="hidden" content="4" sub="6"></ende-memory>
            <ende-document class="hidden" content="3"></ende-document>
            <ende-memory class="hidden" content="3" sub="0"></ende-memory>
            <ende-memory class="hidden" content="3" sub="1"></ende-memory>
            <ende-memory class="hidden" content="3" sub="2"></ende-memory>
            <ende-memory class="hidden" content="3" sub="3"></ende-memory>
            <ende-memory class="hidden" content="3" sub="4"></ende-memory>
            <ende-memory class="hidden" content="3" sub="5"></ende-memory>
            <ende-memory class="hidden" content="3" sub="6"></ende-memory>
            <ende-document class="hidden" content="2"></ende-document>
            <ende-memory class="hidden" content="2" sub="0"></ende-memory>
            <ende-memory class="hidden" content="2" sub="1"></ende-memory>
            <ende-memory class="hidden" content="2" sub="2"></ende-memory>
            <ende-memory class="hidden" content="2" sub="3"></ende-memory>
            <ende-memory class="hidden" content="2" sub="4"></ende-memory>
            <ende-memory class="hidden" content="2" sub="5"></ende-memory>
            <ende-document class="hidden" content="1"></ende-document>
            <ende-memory class="hidden" content="1" sub="0"></ende-memory>
            <ende-memory class="hidden" content="1" sub="1"></ende-memory>
            <ende-memory class="hidden" content="1" sub="2"></ende-memory>
            <ende-memory class="hidden" content="1" sub="3"></ende-memory>
            <ende-document class="hidden" content="0"></ende-document>
        </ende-container>
    </body>
</html>
CC BY-SA 114514.810