(function () { var jq = []; var theme = ["site-runtime.js"]; var globals = "\n/* */\n\n;\n\n/* */\n\n;\n\n/* \\r\\n\\t

\\r\\n\\t\\t

\\r\\n\\t\\t\\t

This content is protected.<\\/p>\\r\\n\\t\\t\\t

To view, please enter the password.<\\/p>\\r\\n\\t\\t\\t

\\r\\n\\t\\t\\t\\t\\t\\t\\t<\\/div>\\r\\n\\t\\t<\\/form>\\r\\n\\t<\\/div>\\r\\n<\\/div>\",\"portfolio_order\":[2275,2323,2144,1154,2135,1074,1652,1358,2157,1757,1150,2139,1932,1579,1104,1109,1101,1122,1120,1134,1148,1131,1127,1125,1088],\"exclusive_nav\":\"disabled\",\"customize\":{\"cursor\":null},\"gallery\":{\"prev\":\"

\r\n\t

\r\n\t\t

\r\n\t\t\t

\r\n\t\t

\r\n\t\t\t

\r\n\t\t\t\t

\r\n\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t

\r\n\t\t\t\t\t

\r\n\t\t\t\t\t\t

\r\n\t\t\t\t\t

\r\n\t\t\t\t

\r\n\t\t\t

\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t

\r\n\t\t\t\t

\r\n\t\t\t

\r\n\t\t

\r\n\t

\r\n

\r\n\t\t

\r\n\t\t\t\r\n\r\n\t\t

\r\n\t\n\t

\n\t\t

\n\t

"; // The theme renders .pswp as a bare child of after #content-holder. // React needs an element to hang dangerouslySetInnerHTML on, which would add // a wrapper div that live does not have, so insert the markup directly. This // runs before the theme chain, so PhotoSwipe always finds its template. if (lightbox && !document.querySelector('.pswp')) { document.body.insertAdjacentHTML('beforeend', lightbox); } // The theme's own submit handler POSTs the password and then navigates to // data-redirect no matter what came back, so a wrong password used to bounce // you to the gate page having lost what you typed. Registered here, before the // theme chain loads, so this capture-phase listener runs first and // stopImmediatePropagation keeps the theme's from running at all. // // .pw-error and .pw-error-msg are the site's own classes — the styling for a // wrong password already existed, nothing was ever triggering it. // Typing in the password field enables the button and clears the last error. // // This came from a block in the home page's own init, which is where it was // added by hand rather than by Semplice. It is vanilla, it belongs with the // submit handler below rather than in one page's script, and putting it here // means the gated pages get it too — they never had it. document.addEventListener('input', function (ev) { var form = ev.target && ev.target.closest && ev.target.closest('.compact-pw-form'); if (!form || form.classList.contains('is-unlocked')) return; var input = form.querySelector('input[name="post_password"]'); var btn = form.querySelector('button[type="submit"]'); if (!input || !btn) return; btn.disabled = input.value.trim() === ''; form.classList.remove('pw-error'); var m = form.nextElementSibling; if (m && m.classList && m.classList.contains('pw-error-msg')) m.remove(); try { input.setCustomValidity(''); } catch (e) {} }, true); document.addEventListener('submit', function (ev) { var form = ev.target && ev.target.closest && ev.target.closest('.compact-pw-form'); if (!form) return; ev.preventDefault(); ev.stopImmediatePropagation(); // Already unlocked: the server removed the password field and the button is // just a link to the case study. The theme's own handler has this branch // too, but stopImmediatePropagation above means it never runs, so it has to // live here or the View button does nothing. if (form.classList.contains('is-unlocked')) { window.location.href = form.getAttribute('data-redirect') || '/'; return; } var input = form.querySelector('input[name="post_password"]'); var btn = form.querySelector('button[type="submit"], input[type="submit"]'); var pw = input && input.value ? input.value.trim() : ''; if (!pw) { if (input) input.focus(); return; } function clearError() { form.classList.remove('pw-error'); var m = form.nextElementSibling; if (m && m.classList && m.classList.contains('pw-error-msg')) m.remove(); } function showError(text) { form.classList.add('pw-error'); var m = form.nextElementSibling; if (!m || !m.classList || !m.classList.contains('pw-error-msg')) { m = document.createElement('div'); m.className = 'pw-error-msg'; form.parentNode.insertBefore(m, form.nextSibling); } m.textContent = text; if (input) { input.focus(); input.select(); } } clearError(); var label = btn ? (btn.textContent || btn.value) : null; if (btn) { btn.disabled = true; if (btn.textContent) btn.textContent = 'Unlocking…'; } var body = new FormData(); body.append('post_password', pw); fetch(form.getAttribute('action'), { method: 'POST', body: body, credentials: 'same-origin', headers: { Accept: 'application/json' } }) .then(function (r) { return r.json().then(function (j) { return { ok: r.ok, body: j }; }); }) .then(function (res) { if (res.ok && res.body && res.body.ok) { window.location.href = res.body.redirect || form.getAttribute('data-redirect') || '/'; return; } if (btn) { btn.disabled = false; if (label && btn.textContent !== undefined) btn.textContent = label; } showError((res.body && res.body.error) || 'That password is not right.'); }) .catch(function () { if (btn) { btn.disabled = false; if (label && btn.textContent !== undefined) btn.textContent = label; } showError('Could not reach the server. Try again.'); }); }, true); function file(src, done) { var el = document.createElement('script'); el.src = '/site/js/' + src + '?v=17ebd7e7b001'; el.async = false; el.onload = done; el.onerror = done; document.body.appendChild(el); } function chain(list, done) { var i = 0; (function step() { i >= list.length ? done() : file(list[i++], step); })(); } // The About page has onmouseover="playclip();" on the pronunciation link, but // the function is defined nowhere — not in the theme, not inline, not in the // snippets plugin. It throws on the live site too; this is a pre-existing bug // reproduced faithfully. The audio it wanted (/meric.mp3) still exists, so // rather than carry the bug forward we restore the intended behaviour. Guarded // so a real definition would win. if (typeof window.playclip !== 'function') { window.playclip = function () { try { var a = new Audio('/meric.mp3'); a.volume = 1; a.play(); } catch (err) { /* autoplay policy may refuse until the user interacts; harmless */ } }; } function inline(code) { if (!code) return; var el = document.createElement('script'); el.textContent = code; document.head.appendChild(el); } chain(jq, function () { inline(globals); chain(theme, function () { inline(init); // Videos play natively. The theme used to wrap all 89 of them in a // MediaElement player here, which is 155 KB of script and two stylesheets to // draw a control bar the browser draws itself. Which videos show one is now // a controls attribute in the markup, put there by scripts/native-video.rb, // and the player itself is runtime/video.js. (function () { var header = document.querySelector('.site-navbar'); if (!header || !window.requestAnimationFrame) return; var lum = new WeakMap(); // element -> 0..1, or null when unreadable var canvas, ctx; function channelLum(r, g, b) { var f = function (c) { c = c / 255; return c <= 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4); }; return 0.2126 * f(r) + 0.7152 * f(g) + 0.0722 * f(b); } function fromBackground(el) { var bg = getComputedStyle(el).backgroundColor; var m = bg && bg.match(/rgba?\(([^)]+)\)/); if (!m) return null; var p = m[1].split(',').map(parseFloat); if (p.length > 3 && p[3] < 0.5) return null; // effectively transparent return channelLum(p[0], p[1], p[2]); } // Sample one pixel of an already-decoded image at a viewport position. function samplePixel(source, rect, x, y) { if (!source.naturalWidth || !rect.width || !rect.height) return null; try { if (!canvas) { canvas = document.createElement('canvas'); ctx = canvas.getContext('2d', { willReadFrequently: true }); } var sx = Math.max(0, Math.min(source.naturalWidth - 1, ((x - rect.left) / rect.width) * source.naturalWidth)); var sy = Math.max(0, Math.min(source.naturalHeight - 1, ((y - rect.top) / rect.height) * source.naturalHeight)); canvas.width = 1; canvas.height = 1; ctx.drawImage(source, sx, sy, 1, 1, 0, 0, 1, 1); var d = ctx.getImageData(0, 0, 1, 1).data; // throws if the source tainted the canvas return channelLum(d[0], d[1], d[2]); } catch (err) { return null; } } // Images the page already displays are read directly when same-origin. The // bucket images are cross-origin and taint the canvas, so a CORS-mode copy is // loaded alongside and sampled instead. // // Deliberately NOT by adding crossorigin to the page's own : the bucket // serves cache-control max-age=31536000, so an object cached before CORS was // enabled would fail to load outright under a CORS-mode request. A separate // copy risks nothing — if it cannot load, the nav simply stays light. var corsCopies = {}; // src -> HTMLImageElement | null (null = gave up) function corsCopyFor(src) { if (Object.prototype.hasOwnProperty.call(corsCopies, src)) return corsCopies[src]; var probe = new Image(); probe.crossOrigin = 'anonymous'; probe.onload = function () { schedule(); }; // re-evaluate once it lands probe.onerror = function () { corsCopies[src] = null; }; probe.src = src; corsCopies[src] = probe; return probe; } function fromImage(img, x, y) { if (!img.naturalWidth) return null; var rect = img.getBoundingClientRect(); var direct = samplePixel(img, rect, x, y); if (direct !== null) return direct; var copy = corsCopyFor(img.currentSrc || img.src); if (!copy || !copy.complete || !copy.naturalWidth) return null; return samplePixel(copy, rect, x, y); } function luminanceAt(x, y) { var stack = document.elementsFromPoint(x, y) || []; for (var i = 0; i < stack.length; i++) { var el = stack[i]; if (header.contains(el) || el === header) continue; if (el.tagName === 'HTML' || el.tagName === 'BODY') break; if (el.tagName === 'IMG') { var v = fromImage(el, x, y); if (v !== null) return v; continue; } if (el.tagName === 'VIDEO') return 0; // treat video as dark; most here are if (!lum.has(el)) lum.set(el, fromBackground(el)); var b = lum.get(el); if (b !== null && b !== undefined) return b; } return null; } var dark = false; function update() { var r = header.getBoundingClientRect(); var y = Math.max(1, Math.min(window.innerHeight - 1, r.top + r.height * 0.6)); // Sample under the links rather than the logo, which is what goes illegible. var xs = [0.55, 0.65, 0.75, 0.85, 0.93].map(function (p) { return window.innerWidth * p; }); var readings = []; for (var i = 0; i < xs.length; i++) { var v = luminanceAt(xs[i], y); if (v !== null) readings.push(v); } if (!readings.length) return; // The darkest reading, not the average. The bar straddles the page's white // column and the dark media beside it, so averaging let one light sample // cancel two dark ones and the state never flipped. Darkening the text is // safe over white as well, so any dark region under the bar should trigger // it. Hysteresis keeps a boundary scrolling past from flickering it. var darkest = Math.min.apply(null, readings); var next = dark ? darkest < 0.45 : darkest < 0.35; // Exposed so the decision can be inspected from the console: // window.__navContrast window.__navContrast = { darkest: darkest, readings: readings, dark: next, y: y }; if (next === dark) return; dark = next; header.classList.toggle('nav-on-dark', dark); } var queued = false; function schedule() { if (queued) return; queued = true; requestAnimationFrame(function () { queued = false; update(); }); } addEventListener('scroll', schedule, { passive: true }); addEventListener('resize', schedule, { passive: true }); addEventListener('load', schedule); setTimeout(schedule, 400); // after the theme has laid out and images decoded schedule(); })(); document.dispatchEvent(new Event('site:ready')); }); }); })();