User:Monster Domosed/common.js: Difference between revisions

Jump to navigation Jump to search
Browse history interactively
← Older editNewer edit →

Monster Domosed (talk | contribs)

2 user groups
4,611 edits
No edit summary
No edit summary
Line 1: Line 1:
document.querySelectorAll('model-viewer').forEach(el => {
(function () {
    const wrapper = el.closest('[class*="model_size_"]');
    'use strict';
    if (!wrapper) {
 
         return;
    const LQ_ICON = '/images/6/65/2D_icon.png';
    const HQ_ICON = '/images/7/7e/3D_icon.png';
 
    function updateViewerSize(viewer, wrapper) {
        const match = wrapper.className.match(/model_size_(\d+)/);
 
        if (!match) {
            return;
        }
 
        const size = parseInt(match[1], 10);
 
        viewer.style.width = size + 'px';
         viewer.style.height = size + 'px';
     }
     }


     const match = wrapper.className.match(/\bmodel_size_(\d+)\b/);
 
    if (!match) {
     function getHQUrl(fileName) {
        return;
        const apiUrl =
            mw.config.get('wgScriptPath') +
            '/api.php?action=query' +
            '&titles=File:' + encodeURIComponent(fileName) +
            '.glb' +
            '&prop=imageinfo' +
            '&iiprop=url' +
            '&format=json';
 
        return fetch(apiUrl)
            .then(function (response) {
                return response.json();
            })
            .then(function (data) {
                const pages = data.query.pages;
                const page = Object.values(pages)[0];
 
                if (!page.imageinfo) {
                    return null;
                }
 
                return page.imageinfo[0].url;
            });
     }
     }


    const size = parseInt(match[1], 10);


     el.style.width = `${size}px`;
     function switchQuality(viewer, icon, lqUrl, hqUrl) {
    el.style.height = `${size}px`;
        const isLQ = viewer.src === lqUrl;
});
 
        const oldTime = viewer.currentTime;
        const oldAnimation = viewer.animationName;
        const oldOrbit = viewer.getAttribute('camera-orbit');
        const oldTarget = viewer.getAttribute('camera-target');
 
        viewer.addEventListener('load', function restore() {
            viewer.removeEventListener('load', restore);
 
            if (oldOrbit) {
                viewer.setAttribute('camera-orbit', oldOrbit);
            }
 
            if (oldTarget) {
                viewer.setAttribute('camera-target', oldTarget);
            }
 
            if (oldAnimation) {
                viewer.animationName = oldAnimation;
            }
 
            if (typeof oldTime === 'number') {
                viewer.currentTime = oldTime;
            }
 
            if (viewer.hasAttribute('autoplay')) {
                viewer.play();
            }
        }, { once: true });
 
        viewer.src = isLQ ? hqUrl : lqUrl;
 
        icon.src = isLQ ? HQ_ICON : LQ_ICON;
    }


(function () {
    'use strict';


     const LQ_ICON = '/images/6/65/2D_icon.png';
     function initViewer(viewer) {
    const HQ_ICON = '/images/7/7e/3D_icon.png';
        if (viewer.dataset.qualityButtonAdded) {
            return;
        }


    function updateViewerSize(viewer) {
         const wrapper = viewer.closest('[class*="model_size_"]');
         const wrapper = viewer.closest('[class*="model_size_"]');


Line 29: Line 95:
         }
         }


         const match = wrapper.className.match(/model_size_(\d+)/);
         const src = viewer.getAttribute('src');


         if (!match) {
         if (!src || !src.endsWith('-compressed.glb')) {
             return;
             return;
         }
         }


         const size = match[1];
         viewer.dataset.qualityButtonAdded = '1';
 
        updateViewerSize(viewer, wrapper);


        viewer.style.width = size + 'px';
        viewer.style.height = size + 'px';
    }


        const fileMatch = src.match(/\/([^\/]+)-compressed\.glb$/);


    function addButton(viewer) {
         if (!fileMatch) {
         if (viewer.dataset.qualityButton) {
             return;
             return;
         }
         }


         viewer.dataset.qualityButton = '1';
         const baseName = fileMatch[1];
 


         updateViewerSize(viewer);
         getHQUrl(baseName)
            .then(function (hqUrl) {


        const parent = viewer.parentElement;
                if (!hqUrl) {
                    return;
                }


        const container = document.createElement('div');
        container.className = 'mv-quality-container';


        parent.insertBefore(container, viewer);
                const container = document.createElement('div');
        container.appendChild(viewer);
                container.className = 'mv-quality-container';


                viewer.parentNode.insertBefore(container, viewer);
                container.appendChild(viewer);


        const button = document.createElement('button');
        button.className = 'mv-quality-toggle';
        button.type = 'button';


                const button = document.createElement('button');
                button.className = 'mv-quality-toggle';
                button.type = 'button';


        const icon = document.createElement('img');
        icon.src = LQ_ICON;
        icon.alt = 'LQ/HQ';


                const icon = document.createElement('img');
                icon.src = LQ_ICON;
                icon.alt = '';


        button.appendChild(icon);
        container.appendChild(button);


                button.appendChild(icon);
                container.appendChild(button);


        button.addEventListener('click', function () {
            console.log('quality button clicked');
            icon.src = icon.src.includes('2D_icon')
                ? HQ_ICON
                : LQ_ICON;
        });


                button.addEventListener('click', function () {
                    switchQuality(
                        viewer,
                        icon,
                        src,
                        hqUrl
                    );
                });


        console.log('Added quality button', viewer);
            });
     }
     }




     function scan() {
     function scan() {
         document.querySelectorAll('model-viewer').forEach(addButton);
         document.querySelectorAll('model-viewer').forEach(initViewer);
     }
     }




     scan();
     scan();


     const observer = new MutationObserver(function () {
     const observer = new MutationObserver(function () {
         scan();
         scan();
     });
     });


     observer.observe(document.body, {
     observer.observe(document.body, {
         childList: true,
         childList: true,
         subtree: true
         subtree: true
    });
    window.addEventListener('resize', function () {
        document.querySelectorAll('model-viewer').forEach(function (viewer) {
            const wrapper = viewer.closest('[class*="model_size_"]');
            if (wrapper) {
                updateViewerSize(viewer, wrapper);
            }
        });
     });
     });


})();
})();




Retrieved from "https://deadlock.wiki/User:Monster_Domosed/common.js"