<?php

declare(strict_types=1);

namespace FleekDash\Admin;

/**
 * Admin Bar Auto-Hide
 *
 * Renders CSS and JavaScript for admin bar auto-hide functionality.
 * Hides admin bar after delay, shows on top hover.
 *
 * @package FleekDash\Admin
 * @since 2.2.9
 */
class AdminBarAutoHide
{
    /**
     * Render auto-hide CSS and JavaScript to wp_head
     *
     * @return void
     */
    public function render(): void
    {
        ?>
        <style id="fleekdash-admin-bar-autohide-styles">
            /* ===============================================
               AUTO-HIDE FUNCTIONALITY (Desktop Only)
               =============================================== */
            @media screen and (min-width: 783px) {
                /* Default state: visible */
                #wpadminbar {
                    transform: translateY(0) !important;
                    opacity: 1 !important;
                }

                /* Auto-hide states (bar at top: slide up when hidden) */
                #wpadminbar.auto-hide-hidden {
                    transform: translateY(-100%) !important;
                    opacity: 0 !important;
                }

                #wpadminbar.auto-hide-visible {
                    transform: translateY(0) !important;
                    opacity: 1 !important;
                }

                /* Bar at bottom: slide down when hidden (enter/exit from bottom) */
                body.fleekdash-admin-bar-bottom.admin-bar #wpadminbar.auto-hide-hidden {
                    transform: translateY(100%) !important;
                }

                /* Smooth transition for auto-hide */
                #wpadminbar.auto-hide-enabled {
                    transition: transform 0.3s ease, opacity 0.3s ease !important;
                }
            }
        </style>

        <script id="fleekdash-admin-bar-autohide">
            (function() {
                'use strict';

                // Auto-hide initialized successfully

                // Configuration
                const HIDE_DELAY = 3000; // 3 seconds after page load
                const HOVER_HIDE_DELAY = 1000; // 1 second after mouse leaves edge area
                const EDGE_DETECTION_HEIGHT = 20; // px from top or bottom to trigger show

                let hideTimeout = null;
                let hoverHideTimeout = null;
                let isHidden = false;

                function isBarAtBottom() {
                    return document.body && document.body.classList.contains('fleekdash-admin-bar-bottom');
                }

                function isInShowZone(clientY) {
                    if (isBarAtBottom()) {
                        return clientY >= window.innerHeight - EDGE_DETECTION_HEIGHT;
                    }
                    return clientY <= EDGE_DETECTION_HEIGHT;
                }

                function initAutoHide() {
                    // Disable auto-hide on mobile
                    if (window.innerWidth <= 782) {
                        return;
                    }

                    const adminBar = document.getElementById('wpadminbar');
                    if (!adminBar) {
                        return;
                    }

                    // Add auto-hide enabled class for smooth transitions
                    adminBar.classList.add('auto-hide-enabled');

                    // Start visible, then hide after delay
                    setTimeout(() => {
                        hideAdminBar();
                    }, HIDE_DELAY);

                    // Mouse movement detection
                    document.addEventListener('mousemove', handleMouseMove, { passive: true });

                    // Also detect mouse enter/leave on admin bar itself
                    adminBar.addEventListener('mouseenter', showAdminBar, { passive: true });
                    adminBar.addEventListener('mouseleave', handleMouseLeave, { passive: true });

                    // Touch events for mobile
                    document.addEventListener('touchstart', handleTouchStart, { passive: true });
                    document.addEventListener('touchmove', handleTouchMove, { passive: true });

                }

                function showAdminBar() {
                    const adminBar = document.getElementById('wpadminbar');
                    if (!adminBar) return;

                    // Clear any pending hide timeout
                    if (hideTimeout) {
                        clearTimeout(hideTimeout);
                        hideTimeout = null;
                    }
                    if (hoverHideTimeout) {
                        clearTimeout(hoverHideTimeout);
                        hoverHideTimeout = null;
                    }

                    // Show admin bar
                    adminBar.classList.remove('auto-hide-hidden');
                    adminBar.classList.add('auto-hide-visible');
                    isHidden = false;

                    // Compensate body padding when showing
                    updateBodyPadding(true);
                }

                function hideAdminBar() {
                    const adminBar = document.getElementById('wpadminbar');
                    if (!adminBar) return;

                    // Hide admin bar
                    adminBar.classList.remove('auto-hide-visible');
                    adminBar.classList.add('auto-hide-hidden');
                    isHidden = true;

                    // Remove body padding compensation when hidden
                    updateBodyPadding(false);
                }

                function handleMouseMove(event) {
                    if (isInShowZone(event.clientY)) {
                        if (isHidden) {
                            showAdminBar();
                        }
                    } else if (!isMouseOverAdminBar()) {
                        scheduleHoverHide();
                    }
                }

                function handleMouseLeave() {
                    if (!isMouseInEdgeZone()) {
                        scheduleHoverHide();
                    }
                }

                function handleTouchStart(event) {
                    const touch = event.touches[0];
                    if (isInShowZone(touch.clientY) && isHidden) {
                        showAdminBar();
                    }
                }

                function handleTouchMove(event) {
                    const touch = event.touches[0];
                    if (isInShowZone(touch.clientY) && isHidden) {
                        showAdminBar();
                    } else if (!isInShowZone(touch.clientY) && !isTouchOverAdminBar(event)) {
                        scheduleHoverHide();
                    }
                }

                function scheduleHoverHide() {
                    if (hoverHideTimeout) {
                        clearTimeout(hoverHideTimeout);
                    }
                    hoverHideTimeout = setTimeout(() => {
                        if (!isMouseInEdgeZone() && !isMouseOverAdminBar()) {
                            hideAdminBar();
                        }
                        hoverHideTimeout = null;
                    }, HOVER_HIDE_DELAY);
                }

                function isMouseInEdgeZone() {
                    return window.mouseY !== undefined && isInShowZone(window.mouseY);
                }

                function isMouseOverAdminBar() {
                    const adminBar = document.getElementById('wpadminbar');
                    if (!adminBar) return false;

                    const rect = adminBar.getBoundingClientRect();
                    const mouseX = window.mouseX || 0;
                    const mouseY = window.mouseY || 0;

                    return mouseX >= rect.left &&
                           mouseX <= rect.right &&
                           mouseY >= rect.top &&
                           mouseY <= rect.bottom;
                }

                function isTouchOverAdminBar(event) {
                    const adminBar = document.getElementById('wpadminbar');
                    if (!adminBar) return false;

                    const touch = event.touches[0];
                    const rect = adminBar.getBoundingClientRect();

                    return touch.clientX >= rect.left &&
                           touch.clientX <= rect.right &&
                           touch.clientY >= rect.top &&
                           touch.clientY <= rect.bottom;
                }

                function updateBodyPadding(showPadding) {
                    // Frontend auto-hide should not change layout spacing.
                    return;
                }

                // Track mouse position globally for performance
                document.addEventListener('mousemove', function(event) {
                    window.mouseX = event.clientX;
                    window.mouseY = event.clientY;
                }, { passive: true });

                // Initialize on load
                if (document.readyState === 'loading') {
                    document.addEventListener('DOMContentLoaded', initAutoHide);
                } else {
                    initAutoHide();
                }

                // Cleanup on page unload
                window.addEventListener('beforeunload', function() {
                    if (hideTimeout) {
                        clearTimeout(hideTimeout);
                    }
                    if (hoverHideTimeout) {
                        clearTimeout(hoverHideTimeout);
                    }
                });

            })();
        </script>
        <?php
    }
}
