MediaWiki:Scramble.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

const alpha = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ!";
const shadowContainerName = 'shadow-container';
const scrambleCounterName = 'scramble-counter';
const scrambleAttrib = 'data-scramble';

function createShadowCopy(container) {
  let shadowContainer = container.cloneNode(true);
  shadowContainer.style.display = 'none';
  shadowContainer.setAttribute(shadowContainerName, 'true');
  shadowContainer.removeAttribute(scrambleAttrib);
  container.appendChild(shadowContainer);
  
  scrambleNodes(container.childNodes);
}

function scrambleNodes(nodes) {
  nodes.forEach((node) => {
    if (node.nodeType == Node.TEXT_NODE) {
      let newTextArray = [];
      let oldValue = [...node.nodeValue];
      oldValue.forEach((char) => {
        if (/\S/.test(char)) {
          newTextArray.push(alpha[Math.floor(Math.random() * alpha.length)]);
        }
        else {
          newTextArray.push(char);
        }
      });

      node.nodeValue = newTextArray.join("");
    }
    else if(node.getAttribute && node.getAttribute(shadowContainerName) === "true") {
      // If we find the shadow copy, we are done.
      return;
    }
    else if(node.nodeType == Node.ELEMENT_NODE) {
      scrambleNodes(node.childNodes);
    }
  })
}

function unscramble(container) {
  children = Array.from(container.childNodes)
  let shadowCopy = children.find((node) => node.getAttribute && node.getAttribute(shadowContainerName));

  console.log(shadowCopy);
  
  if (shadowCopy) {
    while (container.firstChild) {
        container.removeChild(container.firstChild);
      }

    container.appendChild(shadowCopy);
    shadowCopy.style.display = '';
  }
}

function setLooper(t) {
  t.setAttribute(scrambleCounterName, "0");

  t._itv = setInterval((s) => {
    let iter = parseInt(s.getAttribute(scrambleCounterName));

    if(iter > 10) {
      if(s.getAttribute(scrambleAttrib) === "true") {
        unscramble(s);
      }
      clearInterval(s._itv);
    } else {
      console.log("Iter: " + iter);
      scrambleNodes(s.childNodes);
      iter = iter + 1;
      s.setAttribute(scrambleCounterName, iter.toString());
    }
  }, 500, t);
}

$('[' + scrambleAttrib + ']').each(function () { 
  createShadowCopy(this); 
  setLooper(this);
});