{"id":74,"date":"2026-10-29T18:54:34","date_gmt":"2026-10-29T18:54:34","guid":{"rendered":"https:\/\/amarante.vdwoerd.com\/?page_id=74"},"modified":"2026-10-29T22:08:06","modified_gmt":"2026-10-29T22:08:06","slug":"about","status":"publish","type":"page","link":"https:\/\/amarante.vdwoerd.com\/nl\/about\/","title":{"rendered":"About"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"74\" class=\"elementor elementor-74\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3c10e73 e-con-full e-flex e-con e-parent\" data-id=\"3c10e73\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-cd2dd27 elementor-widget elementor-widget-global elementor-global-226 elementor-widget-html\" data-id=\"cd2dd27\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n\n<div class=\"title\">\n    <div class=\"through\">\n        <div class=\"cryptic\">\n            <span>*<\/span><span>t<\/span><span>r\u0325<\/span><span>h<\/span><span><sub>2<\/sub><\/span><span>(<\/span><span>h<\/span><span><sub>3<\/sub><\/span><span>)<\/span><span>k<\/span><span><sup>w<\/sup><\/span><span>-<\/span><\/div>\n        <div class=\"final\">\n            &nbsp;<span>t<\/span><span>h<\/span><span>r<\/span><span>o<\/span><span>u<\/span><span>g<\/span><span>h<\/span>\n        <\/div>\n    <\/div>\n    <div class=\"abscence\">\n        &nbsp;<span>a<\/span><span>b<\/span><span>s<\/span><span>e<\/span><span>n<\/span><span>c<\/span><span>e<\/span>\n    <\/div>\n<\/div>\n\n\n<script>\n    const $title = document.querySelector('.title')\n    const $lettersThroughCryptic = document.querySelectorAll('.title .through .cryptic span')\n    const $lettersNormal = document.querySelectorAll('.title .abscence span, .title .through .final span')\n\n\n    \/\/ Assign unique random ids to every <span> character ---------\n    assignRandomIndicesToElements($lettersThroughCryptic)\n    assignRandomIndicesToElements($lettersNormal)\n\n\n    \/\/ Update loop -----------------------------------------------\n    const bufferZoneX = 100\n    let startTimestamp = Date.now()\n    let currentTimestamp = startTimestamp\n\n    setInterval(() => {\n        currentTimestamp = Date.now()\n        const timeDifference = (currentTimestamp - startTimestamp) \/ 1000\n        \/\/ const progressNormalized = map(timeDifference, 0, 10, 0, 1)\n        const progressNormalized = map(Math.sin(currentTimestamp \/ 4000), -1, 1, 0, 1)\n        \/\/ console.log(timeDifference, progressNormalized)\n\n        updateAnimation(progressNormalized)\n    }, 16)\n\n    \/\/\/\/ mouse version\n    \/\/ addEventListener('mousemove', (e) => {\n    \/\/     const progressNormalized = map(e.clientX, bufferZoneX, innerWidth - bufferZoneX, 0, 1)\n    \/\/     updateAnimation(progressNormalized)\n    \/\/ })\n\n\n    function updateAnimation(progressNormalized) {\n        const distCryptic = Math.abs(progressNormalized - .3)\n        \/\/ console.log(distCryptic)\n\n        const lettersFadeoutCryptic = $lettersThroughCryptic.length - map(distCryptic, 0, .4, 0, $lettersThroughCryptic.length) \n        const lettersFadeinNormal = map(progressNormalized, .6, 1, 0, $lettersNormal.length)\n\n        for (const $letter of $lettersThroughCryptic) {\n            $letter.classList.toggle('visible', lettersFadeoutCryptic > $letter.dataset.i)\n        }\n\n        for (const $letter of $lettersNormal) {\n            $letter.classList.toggle('visible', lettersFadeinNormal > $letter.dataset.i)\n        }\n    }\n\n\n    \/\/ DOM Utils -------------------------------------------------\n    function assignRandomIndicesToElements($elements) {\n        let ids = [];\n        for (let index = 0; index < $elements.length; index++) {\n            ids.push(index)\n        }\n\n        for (const $el of $elements) {\n            let randomIndex = randomInt(ids.length)\n            let i = ids[randomIndex]\n            ids.splice(randomIndex, 1) \n\n            $el.dataset.i = i\n            $el.setAttribute('style', `--i: ${i}`);\n        }\n    }\n\n\n    \/\/ Math Utils ------------------------------------------------\n    function map(n, start1, stop1, start2, stop2, withinBounds) {\n        return clamp((n - start1) \/ (stop1 - start1) * (stop2 - start2) + start2, start2, stop2);\n    }\n\n    function lerp(start, stop, amt) {\n        return amt * (stop - start) + start;\n    }\n\n    function randomInt(max) {\n        return Math.floor(Math.random() * max);\n    }\n\n    function clamp(n, min, max) {\n        return Math.max(Math.min(n, max), min);\n    }\n<\/script>\n\n\n\n<style>\n\/*body {*\/\n\/*    height: 100vh;*\/\n\/*    margin: 0;*\/\n\/*    display: flex;*\/\n\/*}*\/\n\n.title {\n    position: relative;\n    font-family: monospace;\n    font-size: 60px;\n    width: max-content;\n    margin: auto;\n\n    letter-spacing: .5em;\n}\n\n\/* through *\/\n.through .final {\n    top: 0;\n    position: absolute;\n    top: .15lh;\n}\n\n.title span.visible {\n    transition: all 1s;\n}\n\n.title span:not(.visible) {\n    opacity: 0;\n    filter: blur(3px);\n    transition: all .2s;\n}\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>*tr\u0325h2(h3)kw&#8211; &nbsp;through &nbsp;absence<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-74","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/amarante.vdwoerd.com\/nl\/wp-json\/wp\/v2\/pages\/74","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/amarante.vdwoerd.com\/nl\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/amarante.vdwoerd.com\/nl\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/amarante.vdwoerd.com\/nl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/amarante.vdwoerd.com\/nl\/wp-json\/wp\/v2\/comments?post=74"}],"version-history":[{"count":5,"href":"https:\/\/amarante.vdwoerd.com\/nl\/wp-json\/wp\/v2\/pages\/74\/revisions"}],"predecessor-version":[{"id":231,"href":"https:\/\/amarante.vdwoerd.com\/nl\/wp-json\/wp\/v2\/pages\/74\/revisions\/231"}],"wp:attachment":[{"href":"https:\/\/amarante.vdwoerd.com\/nl\/wp-json\/wp\/v2\/media?parent=74"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}