<?php
/**
 * Persistent top-centered Instinctor brand lockup (icon stacked over wordmark)
 * used as cinematic page chrome on snap-mode pages.
 *
 * OPT-IN: only emitted when the PAGE setting `screen_brand_logo` is truthy, so
 * it never appears on pages (or client sites) that don't ask for it.
 * Per-screen suppression: a section whose setting `screen_brand_logo_hide` is
 * truthy hides the logo while that screen is active (its id is passed in
 * $hideIds). A single overlay fades in/out as the active screen changes — it
 * reads as consistent brand chrome, not per-screen content.
 *
 * Shared by templates/impulse-page.php (frontend) and
 * admin/views/impulse-preview.php (editor) so both render identically.
 *
 * @since 2.1.1845
 */

if (!defined('ABSPATH')) exit; // No direct access.
if (!function_exists('impulse_screen_brand_logo_html')) {
    function impulse_screen_brand_logo_html(array $hideIds = []) {
        // Real Instinctor product mark (same path data as the editor-demo
        // brand strip — assets/images/logo.svg inlined).
        $svg = '<svg class="impulse-screen-brand-mark" viewBox="0 0 24 24" width="29" height="29" aria-hidden="true">'
             . '<g transform="scale(2.288)" fill="currentColor" stroke="none" fill-rule="evenodd">'
             . '<path d="M3.02 0.02l2.23 0c1.44,0 2.75,0.59 3.7,1.54 0.95,0.95 1.54,2.26 1.54,3.7 0,1.44 -0.59,2.75 -1.54,3.7 -0.95,0.95 -2.26,1.54 -3.7,1.54 -1.44,0 -2.75,-0.59 -3.7,-1.54 -0.95,-0.95 -1.54,-2.26 -1.54,-3.7l0 -2.23 2.31 0 0 2.23c0,0.8 0.33,1.53 0.86,2.06 0.53,0.53 1.26,0.86 2.06,0.86 0.8,0 1.53,-0.33 2.06,-0.86 0.53,-0.53 0.86,-1.26 0.86,-2.06 0,-0.8 -0.33,-1.53 -0.86,-2.06 -0.53,-0.53 -1.26,-0.86 -2.06,-0.86l-2.23 0 0 -2.31z"/>'
             . '<rect x="0.02" y="0.02" width="2.31" height="2.31"/></g></svg>';

        $data = htmlspecialchars(json_encode(array_values(array_map('strval', $hideIds))), ENT_QUOTES);

        $css = '.impulse-screen-brand{position:fixed;top:max(52px,calc(env(safe-area-inset-top) + 30px));left:50%;transform:translateX(-50%);'
             .   'z-index:1100;display:flex;flex-direction:column;align-items:center;gap:13px;color:#fff;pointer-events:none;'
             .   'opacity:0;transition:opacity .45s ease-in-out}'
             . '.impulse-screen-brand.impulse-screen-brand-on{opacity:1}'
             . '.impulse-screen-brand-mark{display:block;filter:drop-shadow(0 2px 10px rgba(0,0,0,0.35))}'
             . '.impulse-screen-brand-text{font:600 12px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;'
             .   'letter-spacing:0.26em;text-transform:uppercase;text-shadow:0 1px 8px rgba(0,0,0,0.4)}'
             . '@media(max-width:767px){.impulse-screen-brand{top:max(32px,calc(env(safe-area-inset-top) + 10px))}.impulse-screen-brand-mark{width:24px;height:24px}.impulse-screen-brand-text{font-size:11px;letter-spacing:0.22em}}';
        // Deterministic CSS reveal (no JS timing race): show the logo whenever
        // ANY screen is active, then re-hide it on suppressed screens by id.
        // :has() reacts to the .impulse-screen-active toggle instantly, so the
        // logo no longer depends on the engine's initial impulse-screen-changed
        // firing AFTER the first screen activates (that race left it stuck at
        // opacity:0 — Sergei 2026-06-28 "logo gone on Home"). The JS below stays
        // as a fallback for the rare browser without :has().
        $css .= 'body:has(.impulse-screen-active) .impulse-screen-brand{opacity:1}';
        if (!empty($hideIds)) {
            $hideSel = array_map(function ($id) {
                return 'body:has(.impulse-screen-active[data-id="' . preg_replace('/[^A-Za-z0-9_-]/', '', (string) $id) . '"]) .impulse-screen-brand';
            }, $hideIds);
            $css .= implode(',', $hideSel) . '{opacity:0}';
        }
        if (function_exists('wp_add_inline_style')) wp_add_inline_style('instinctor-page-inline', $css);

        // Toggle the logo on whenever the active screen is NOT in the
        // suppress list. Works on both the frontend (.impulse-screen) and the
        // editor (.impulse-el[data-type="section"]); both carry data-id.
        // 2.1.199x regression fix: the reveal must NOT depend on the engine's
        // initial impulse-screen-changed firing AFTER the first screen gets
        // .impulse-screen-active (it doesn't, reliably), and the old observer
        // watched .impulse-content-wrapper — a DESCENDANT of the .impulse-screen
        // that receives the class — so it never caught the toggle. Net: the logo
        // never got -on and stayed at opacity:0 (Sergei: "logo gone on Home").
        // Now: DOMContentLoaded-safe, observe .impulse-screen-wrapper (where
        // -active actually toggles), and re-sync on a few boot ticks so the logo
        // lands even if the screen activates after the initial event.
        $js = '(function(){'
            . 'function init(){'
            .   'var b=document.querySelector(".impulse-screen-brand");if(!b)return;'
            .   'var hide={};try{(JSON.parse(b.getAttribute("data-hide-ids")||"[]")||[]).forEach(function(i){hide[String(i)]=1;});}catch(e){}'
            .   'function active(){return document.querySelector(".impulse-screen.impulse-screen-active")||document.querySelector(".impulse-el[data-type=\'section\'].impulse-screen-active");}'
            .   'function sync(){var s=active();var id=s?(s.getAttribute("data-id")||""):"";b.classList.toggle("impulse-screen-brand-on",!!s&&!hide[String(id)]);}'
            .   'sync();'
            .   'document.addEventListener("impulse-screen-changed",sync);'
            .   'if(window.MutationObserver){var w=document.querySelector(".impulse-screen-wrapper")||document.body;new MutationObserver(sync).observe(w,{attributes:true,attributeFilter:["class"],subtree:true});}'
            .   'requestAnimationFrame(sync);setTimeout(sync,200);setTimeout(sync,800);'
            . '}'
            . 'if(document.readyState==="loading"){document.addEventListener("DOMContentLoaded",init);}else{init();}'
            . '})();';
        if (function_exists('wp_add_inline_script')) wp_add_inline_script('instinctor-frontend-js', $js, 'after');

        return '<div class="impulse-screen-brand" data-hide-ids="' . $data . '" aria-hidden="true">'
             . $svg
             . '<span class="impulse-screen-brand-text">Instinctor</span>'
             . '</div>';
    }
}
