No edit summary |
No edit summary |
||
| Line 43: | Line 43: | ||
</div> | </div> | ||
</div> | </div> | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
(function() { | (function() { | ||
| Line 58: | Line 57: | ||
v: ge("-veyra") | v: ge("-veyra") | ||
}; | }; | ||
function pad2(n){return ("0"+n).slice(-2);} | function pad2(n){return ("0"+n).slice(-2);} | ||
// --- NEW: simple preloader & caches --- | |||
var cache = { T: [], R: [], V: [] }; | |||
function preloadSet(prefix, count, bucket){ | |||
for(var i=0;i<count;i++){ | |||
var img = new Image(); | |||
img.decoding = "async"; | |||
img.referrerPolicy = "no-referrer"; | |||
img.draggable = false; | |||
img.src = BASE + prefix + "_" + pad2(i) + ".png"; | |||
bucket[i] = img; | |||
} | |||
} | |||
// Kick off preloads (non-blocking) | |||
preloadSet("Tiriel", 12, cache.T); | |||
preloadSet("Rhaen", 32, cache.R); | |||
preloadSet("Veyra", 67, cache.V); | |||
// Track last indices to avoid redundant src swaps while scrubbing | |||
var last = { t:-1, r:-1, v:-1 }; | |||
function update(){ | function update(){ | ||
var X = parseInt(el.x.value,10); | var X = parseInt(el.x.value,10); | ||
var Y = Math.floor(X/479); | var Y = Math.floor(X/479); | ||
var Z = X % 479; | var Z = X % 479; | ||
var iT = (X-1) % 12; | var iT = (X-1) % 12; | ||
var iR = (X-1) % 32; | var iR = (X-1) % 32; | ||
var iV = (X-1) % 67; | var iV = (X-1) % 67; | ||
el.xval.textContent = X; | el.xval.textContent = X; | ||
el.cyc.textContent = Y; | el.cyc.textContent = Y; | ||
el.day.textContent = Z; | el.day.textContent = Z; | ||
el.t.src = BASE + "Tiriel_" + pad2(iT) + ".png"; | |||
el.r.src = BASE + "Rhaen_" + pad2(iR) + ".png"; | if(iT !== last.t){ last.t = iT; el.t.src = (cache.T[iT] && cache.T[iT].src) || (BASE + "Tiriel_" + pad2(iT) + ".png"); } | ||
el.v.src = BASE + "Veyra_" + pad2(iV) + ".png"; | if(iR !== last.r){ last.r = iR; el.r.src = (cache.R[iR] && cache.R[iR].src) || (BASE + "Rhaen_" + pad2(iR) + ".png"); } | ||
if(iV !== last.v){ last.v = iV; el.v.src = (cache.V[iV] && cache.V[iV].src) || (BASE + "Veyra_" + pad2(iV) + ".png"); } | |||
} | } | ||
el.x.addEventListener("input", update); | |||
// Smooth scrubbing without spamming layout | |||
var raf = null; | |||
el.x.addEventListener("input", function(){ | |||
if(raf) return; | |||
raf = requestAnimationFrame(function(){ raf = null; update(); }); | |||
}); | |||
update(); | update(); | ||
})(); | })(); | ||
</script></includeonly> | </script></includeonly> | ||
Revision as of 15:23, 10 November 2025
This widget allows you to embed the lunar orbits of WyrdeHaven in your mediaWiki page
Usage
{{#widget:MoonStack | basePath=/images/moons/ | size=512 | id=ms1}}
| basePath | Location of image files for the orbits | /images/moons/ | ||
| size | maximum image size in pixels | 512 | ||
| id | unique id prefix if you embed multiple widgets on one page | wh |