document.addEventListener("DOMContentLoaded", initShuffle);
function initShuffle(){
document.querySelectorAll("#top .menu-title-text").forEach(el=>{
if(el.dataset.ready) return;
el.dataset.ready="1";
const original=el.textContent;
const letters=original.split("");
el.innerHTML="";
letters.forEach(letter=>{
const span=document.createElement("span");
span.className="shuffle-letter";
span.dataset.real=letter;
span.textContent=letter;
if(letter===" "){
span.style.width=".35em";
}else{
span.style.width=".62em";
}
span.style.display="inline-block";
span.style.textAlign="center";
el.appendChild(span);
});
const spans=[...el.querySelectorAll(".shuffle-letter")];
el.parentElement.addEventListener("mouseenter",()=>{
if(el.dataset.animating==="1") return;
el.dataset.animating="1";
animate(spans,()=>{
el.dataset.animating="0";
});
});
});
}
function animate(spans,done){
const original=spans.map(s=>s.dataset.real);
let progress=0;
const timer=setInterval(()=>{
// Buchstaben des Originalwortes mischen
let pool=[...original];
for(let i=pool.length-1;i>0;i--){
let j=Math.floor(Math.random()*(i+1));
[pool[i],pool[j]]=[pool[j],pool[i]];
}
spans.forEach((span,i)=>{
if(i=spans.length){
clearInterval(timer);
spans.forEach(s=>s.textContent=s.dataset.real);
done();
}
},30);
}(function () {
const alphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZÄÖÜabcdefghijklmnopqrstuvwxyzäöüß";
function shuffleArray(arr){
const a = [...arr];
for(let i=a.length-1;i>0;i--){
const j = Math.floor(Math.random()*(i+1));
[a[i],a[j]]=[a[j],a[i]];
}
return a;
}
function prepare(){
document.querySelectorAll(".menu-title-text").forEach(el=>{
if(el.dataset.shuffleReady) return;
el.dataset.shuffleReady="1";
const text = el.textContent;
el.innerHTML="";
[...text].forEach(char=>{
const span=document.createElement("span");
span.className="ls-char";
span.dataset.char=char;
span.textContent=char;
el.appendChild(span);
});
const spans=[...el.children];
el.parentElement.addEventListener("mouseenter",()=>{
if(el.dataset.running==="1") return;
el.dataset.running="1";
let progress=0;
const timer=setInterval(()=>{
const pool=shuffleArray(
spans.map(s=>s.dataset.char)
);
spans.forEach((span,i)=>{
if(span.dataset.char===" "){
span.textContent=" ";
return;
}
if(i=spans.length){
clearInterval(timer);
spans.forEach(span=>{
span.textContent=span.dataset.char;
});
el.dataset.running="0";
}
},32);
});
});
}
document.addEventListener("DOMContentLoaded",prepare);
document.addEventListener("nectar_ajax_loaded",prepare);
})();
Neueste Kommentare