User:Monster Domosed/common.js: Difference between revisionsGive feedback
Replaced content with " const personal = document.querySelector(".vector-menu-content-list"); if (personal){ const test2 = document.createElement("li"); const test3 = document.createElement("li"); const test4 = document.createElement("li"); test2.innerHTML = `<a href="/User:Monster_Domosed/common.js">JS</a>`; test3.innerHTML = `<a href="/User:Monster_Domosed/common.css">CSS</a>`; test4.innerHTML = `<a href="/User:Monster_Domosed/Sandbox">SB</a>`; personal.prepend(test2, test3, te..." Tags: Replaced Manual revert |
No edit summary |
||
| Line 1: | Line 1: | ||
(function () { | |||
'use strict'; | |||
const urlCache = new Map(); | |||
function getSize(element) { | |||
const match = element.className.match(/model_size_(\d+)/); | |||
return match ? parseInt(match[1], 10) : 500; | |||
} | |||
function getFileUrl(fileName) { | |||
if (urlCache.has(fileName)) { | |||
return urlCache.get(fileName); | |||
} | |||
const apiUrl = | |||
mw.config.get('wgScriptPath') + | |||
'/api.php?action=query' + | |||
'&titles=File:' + encodeURIComponent(fileName) + | |||
'&prop=imageinfo' + | |||
'&iiprop=url' + | |||
'&format=json'; | |||
const promise = fetch(apiUrl) | |||
.then(function (response) { | |||
if (!response.ok) { | |||
throw new Error('API request failed'); | |||
} | |||
return response.json(); | |||
}) | |||
.then(function (data) { | |||
const page = Object.values(data.query.pages)[0]; | |||
return page && page.imageinfo ? page.imageinfo[0].url : null; | |||
}) | |||
.catch(function () { | |||
return null; | |||
}); | |||
urlCache.set(fileName, promise); | |||
return promise; | |||
} | |||
function loadModel(preview) { | |||
if (preview.dataset.loaded) { | |||
return; | |||
} | |||
preview.dataset.loaded = '1'; | |||
const fileName = preview.dataset.model; | |||
const displayName = preview.dataset.name || fileName; | |||
const size = getSize(preview); | |||
getFileUrl(fileName + '.glb') | |||
.then(function (url) { | |||
if (!url) { | |||
return; | |||
} | |||
const wrap = document.createElement('div'); | |||
wrap.className = 'model-viewer-wrap'; | |||
const container = document.createElement('div'); | |||
container.className = 'model-viewer-container'; | |||
container.style.width = size + 'px'; | |||
container.style.height = size + 'px'; | |||
const viewer = document.createElement('model-viewer'); | |||
viewer.src = url; | |||
viewer.setAttribute('camera-controls', ''); | |||
viewer.setAttribute('touch-action', 'pan-y'); | |||
container.appendChild(viewer); | |||
wrap.appendChild(container); | |||
const name = document.createElement('div'); | |||
name.className = 'model-name'; | |||
name.textContent = displayName; | |||
wrap.appendChild(name); | |||
preview.replaceWith(wrap); | |||
}); | |||
} | |||
function initPreview(preview) { | |||
if (preview.dataset.initialized) { | |||
return; | |||
} | |||
preview.dataset.initialized = '1'; | |||
const button = document.createElement('button'); | |||
button.className = 'model-load-button'; | |||
button.type = 'button'; | |||
button.addEventListener('click', function () { | |||
loadModel(preview); | |||
}); | |||
preview.appendChild(button); | |||
} | |||
function scan() { | |||
document | |||
.querySelectorAll('.model-placeholder') | |||
.forEach(initPreview); | |||
} | |||
let scanTimer = null; | |||
function debouncedScan() { | |||
clearTimeout(scanTimer); | |||
scanTimer = setTimeout(scan, 100); | |||
} | |||
scan(); | |||
const observer = new MutationObserver(debouncedScan); | |||
observer.observe(document.body, { | |||
childList: true, | |||
subtree: true | |||
}); | |||
})(); | |||