<?php

require_once 'inc/walker-nav-menu.php';
$scripts = [];
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo('charset'); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="apple-touch-icon" sizes="120x120" href="<?= get_theme_file_uri('/assets/img/favicon/apple-touch-icon.png'); ?>">
    <link rel="icon" type="image/png" sizes="32x32" href="<?= get_theme_file_uri('/assets/img/favicon/favicon-32x32.png'); ?>">
    <link rel="icon" type="image/png" sizes="16x16" href="<?= get_theme_file_uri('/assets/img/favicon/favicon-16x16.png'); ?>">
    <link rel="manifest" href="<?= get_theme_file_uri('/assets/img/favicon/site.webmanifest'); ?>">
    <link rel="mask-icon" href="<?= get_theme_file_uri('/assets/img/favicon/safari-pinned-tab.svg'); ?>" color="#5bbad5">
    <link rel="shortcut icon" href="<?= get_theme_file_uri('/assets/img/favicon/favicon.ico'); ?>" type="image/x-icon">
    <meta name="msapplication-TileColor" content="#da532c">
    <meta name="msapplication-config" content="<?= get_theme_file_uri('/assets/img/favicon/browserconfig.xml'); ?>">
    <meta name="theme-color" content="#ffffff">
    <script>
        var lawCartaDomain = '<?= get_lawcarta_url()?>';
    </script>
    <script>
        if (window.document.documentMode) {
            window.top.location = lawCartaDomain + '/catalog';
        }
    </script>

    <?php if (get_query_var('lctc', false)):?>
        <link rel="canonical" href="<?= get_canonocal_url()?>">
    <?php endif; ?>
    <!-- ClickDesk Live Chat Service for websites -->

    <a href="#" id="livilyChatLink" class="livilyChatButton ClickdeskChatLink" onclick="return false;"></a>
    <script type='text/javascript'>
        var _glc =_glc || []; _glc.push('all_ag9zfmNsaWNrZGVza2NoYXRyEgsSBXVzZXJzGICAoN3L5aYLDA');
        var glcpath = (('https:' == document.location.protocol) ? 'https://my.clickdesk.com/clickdesk-ui/browser/' :
            'http://my.clickdesk.com/clickdesk-ui/browser/');
        var glcp = (('https:' == document.location.protocol) ? 'https://' : 'http://');
        var glcspt = document.createElement('script'); glcspt.type = 'text/javascript';
        glcspt.async = true; glcspt.src = glcpath + 'livechat-cloud-new.js';
        var s = document.getElementsByTagName('script')[0];s.parentNode.insertBefore(glcspt, s);
    </script>
    <style>
        .ClickdeskChatLink {
            position: fixed;
            right: 0;
            bottom: 0;
            z-index: 2147483638 !important;
        }
        .ClickdeskChatLink img {
            width: 70px;
            height: 70px;
        }
        .clickdesk_bubble {
            display: none !important;
        }
    </style>
    
    <script src="<?= get_lawcarta_url()?>/assets/front-settings<?php if(isset($_GET['law']) && $_GET['law'] == 1 ):?>?law=1<?php endif;?>"></script>
    <?php
     $baseTemplate = basename( get_page_template() );
    if ($baseTemplate == 'page_home.php'):?>
        <script type="application/javascript">
            var isHomeTemplate = true;
        </script>
    <?php endif;?>

    <?php $scripts[] = ['type' => 'script', 'src' =>"https://www.googleoptimize.com/optimize.js?id=OPT-TCXZSGK"]; ?>
        <?php $scripts[] = ['type' => 'comment', 'source' =>'Google Tag Manager']; ?>
        <?php $scripts[] = ['type' => 'script', 'source' =>"(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
        new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
        j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
        'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
        })(window,document,'script','dataLayer','".LC_GTM."');"]; ?>
        <?php $scripts[] = ['type' => 'comment', 'source' =>'End Google Tag Manager']; ?>
    <?php if(
            (isset($_COOKIE['cookie_level']) &&(strpos($_COOKIE['cookie_level'], '4') !== false))
            || LC_ALLOW_COOKIE_POPUP == false
            ):?>
        <?php foreach($scripts as $script):?>
            <?php switch($script['type']):
                case 'comment': ?>
                    <!--<?=$script['type']?> -->
                    <?php break; ?>
                <?php case 'style': ?>
                    <style><?=$script['source']?></style>
                    <?php break; ?>
                <?php case 'script': ?>
                    <?php if(isset($script['src'])):?>
                        <script <?php if(isset($script['async'])):?>async<?php endif;?> src="<?=$script['src']?>"></script>
                    <?php else:?>
                        <script><?=$script['source']?></script>
                    <?php endif;?>
                    <?php break; ?>
                <?php endswitch; ?>
        <?php endforeach;?>
    <?php endif; ?>
    <?php if(!isset($_COOKIE['cookie_level']) && LC_ALLOW_COOKIE_POPUP == true):?>
    <script>
        var scripts = <?php echo json_encode($scripts) ?>;
    </script>
    <script src="<?= get_lawcarta_url()?>/assets/track-enable"></script>
    <?php endif; ?>
    <script>
        function support_format_webp() {
            var elem = document.createElement('canvas');
            if (!!(elem.getContext && elem.getContext('2d'))) {
                return elem.toDataURL('image/webp').indexOf('data:image/webp') == 0;
            } else {
                return false;
            }
        }
        if (support_format_webp()) {
            document.getElementsByTagName('html')[0].classList.add('webp')
        }
    </script>

    <link rel="preconnect" href="https://static.hotjar.com">
    <link rel="preconnect" href="https://static.hotjar.com">
    <link rel="preconnect" href="https://script.hotjar.com">
    <link rel="preconnect" href="https://s3.amazonaws.com">
    <link rel="preconnect" href="https://region1.analytics.google.com">
    <link rel="preconnect" href="https://www.googletagmanager.com">
    <link rel="preconnect" href="https://my.clickdesk.com">

    <?php wp_head(); ?>



</head>
<body <?php body_class(); ?>>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=<?=LC_GTM ?>"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

<div class="wrapper">

    <?php
    $the_page = sanitize_post( $GLOBALS['wp_the_query']->get_queried_object() );
    $slug = $the_page->post_name;
    if ($slug != 'publish-your-book'):?>
    <header class="header">
        <div class="cont">
            <div class="header-cont">
                <button class="header-menu-toggle header-btn mobile" title="Open Menu">
                    <span class="icon-menu"></span>
                </button>
                <a href="/" class="logo" title="Logo" tabindex="0">
                    <picture>
                        <source media="(min-width: 600px)" srcset="<?= get_lawcarta_url()?>/img/logo.svg">
                        <img src="<?= get_lawcarta_url()?>/img/logo-mobile.svg" width="36" height="36" alt="Logo">
                    </picture>
                </a>
                <div class="desktop-menu">
                    
                </div>
                <div class="header-search">
                    <div class="search-input with-btn">
                        <div class="si-flex">
                            <div class="close-search">
                                <button class="header-btn" title="Close Search">
                                    <span class="icon-back"></span>
                                </button>
                            </div>
                            <div class="left">
                                <span class="icon-search hide-sm"></span>
                                <button class="button clear link clear-search" id="clear-search" title="Clear Search" style="display: none;">
                                    <span class="icon-close"></span>
                                </button>
                                <input type="text" class="form-control" placeholder="Search customizable books and materials" id="header-search">
                            </div>
                            <div class="right">
                                <button class="button action" id="header-search-btn" title="Start Search">
                                    <span class="icon-search"></span>													
                                </button>
                            </div>
                        </div>										
                    </div>
                    <button class="header-btn open-search" title="Open Search">
                        <span class="icon-search"></span>
                    </button>
                </div>
                <div class="header-right-menu"></div>
            </div>	
            <div class="mobile-menu">
                <div class="mm-bg"></div>
                <button class="close-header-menu header-btn" title="Close Menu">
                    <span class="icon-close"></span>
                </button>
                <div class="mm-cont">
                    <div class="mobile-links-cont">				
                        
                    </div>
                    <div class="mm-links">

                    </div>
                    
                    <div class="mobile-sign-cont"></div>
                </div>
            </div>	
        </div>

        <script>

            (function(){

                let appUrl = 'https://app.livecarta.com';
                let wpUrl = 'https://livecarta.com';
                let isGuest = true;

                let sharedAccounts = [];
                let showAccountAccess = true;
                let showAdmin = true;
                let showConfirmationNotice = false;
                let showRoyaltiesAndSales = true;

                let currentPage = location.pathname;

                function drawHeader() {
                    

                    if (typeof frontSettings !== 'undefined') {
                        appUrl = frontSettings.appUrl;
                        wpUrl = frontSettings.wordPressUrl;
                        isGuest = frontSettings.isGuest;
                    }

                    if (!isGuest && frontSettings.menu) {
                        sharedAccounts = frontSettings.menu.sharedAccounts;
                        showAccountAccess = frontSettings.menu.showAccountAccess;
                        showAdmin = frontSettings.menu.showAdmin;
                        showConfirmationNotice = frontSettings.menu.showConfirmationNotice;
                        showRoyaltiesAndSales = frontSettings.menu.showRoyaltiesAndSales;
                    }

                    let linksObject = {
                        home: wpUrl,
                        dashboard: appUrl + '/dashboard',
                        catalog: appUrl + '/catalog',
                        library: appUrl + '/library',
                        // bundles: appUrl + '/bundle',
                        features: wpUrl + '/features/',
                        aboutUs: wpUrl + '/about-us/',
                        cart: appUrl + '/checkout/cart',
                        login: appUrl + '/user/login',
                        signUp: appUrl + '/user/registration',
                        llm: appUrl + '/outline-builder',

                        verify: appUrl + '/user/registration/verify',

                        profile: appUrl + '/user/registration/profile',
                        royalties: appUrl + '/report/royalties',
                        order: appUrl + '/report/transactions',
                        report: appUrl + '/report/shared-report',
                        accountAccess: appUrl + '/user/registration/account-access',
                        accountManage: appUrl + '/user/account/<id>/manage',
                        admin: appUrl + '/admin',
                        logout: appUrl + '/user/logout'
                    };

                    let isPageSelected = {
                        home: currentPage === '/' ? ' selected' : '',
                        features: currentPage.indexOf('/features') === 0 ? ' selected' : '',
                        aboutUs: currentPage.indexOf('/about-us') === 0 ? ' selected' : ''
                    }

                    let desktopLinks = '';
                    if (!isGuest) desktopLinks += '<a href="' + linksObject.dashboard + '" class="menu-link movable" tabindex="0"><span class="text">Dashboard</span></a>';
                    desktopLinks += '<a href="' + linksObject.catalog + '" class="menu-link movable" tabindex="0"><span class="text">Catalog</span></a>';                                              
                    if (!isGuest) desktopLinks += '<a href="' + linksObject.library + '" class="menu-link movable" tabindex="0"><span class="text">My Library</span></a>';
                    // if (!isGuest) desktopLinks += '<a href="' + linksObject.bundles + '" class="menu-link movable" tabindex="0"><span class="text">Bundles</span></a>';
                    if (isGuest) desktopLinks += '<a href="' + linksObject.features + '" class="menu-link movable' + isPageSelected.features +'" tabindex="0"><span class="text">Features</span></a>';
                    if (isGuest) desktopLinks += '<a href="' + linksObject.aboutUs + '" class="menu-link movable' + isPageSelected.aboutUs +'" tabindex="0"><span class="text">About Us</span></a>';
                    desktopLinks += `<a href="${linksObject.llm}" class="menu-link movable" tabindex="0">
                        <span class="icon-magic"></span>
                        <span class="text">Curriculum Builder</span>
                    </a>`;

                    document.querySelector('.desktop-menu').innerHTML = desktopLinks;  


                    let hrmHtml = '';
                    let mmSign = '';
                    if (isGuest) {
                        hrmHtml += `
                            <div class="desktop-sign-cont">
                                <a href="` + linksObject.login + `" class="sign-link button action" tabindex="0">Log In</a>
                                <a href="` + linksObject.signUp + `" class="sign-link button secondary" tabindex="0">Sign Up</a>
                            </div>
                        `;  
                        mmSign += `
                            <a href="` + linksObject.login + `" class="sign-link button action" tabindex="0">Log In</a>
                            <a href="` + linksObject.signUp + `" class="sign-link button secondary" tabindex="0">Sign Up</a>
                        `;                  
                    }
                    if (!isGuest) {
                        hrmHtml += `<button class="header-btn circle header-menu-toggle" title="Manage Account">
                                <span class="icon-profile"></span> `;
                        if (showConfirmationNotice) hrmHtml += '<span class="icon-warning"></span>';
                        hrmHtml += `</button>`;
                    }
                    hrmHtml += `
                        <a class="header-btn circle" href="` + linksObject.cart + `" title="My Cart" tabindex="0">
                            <span class="icon-shop"></span>`;
                    hrmHtml += frontSettings?.cartItemsCount > 0 ? '<span class="num">' + frontSettings.cartItemsCount + '</span>' : '';
                    hrmHtml += `</a>`;
                    document.querySelector('.header-right-menu').innerHTML = hrmHtml;
                    document.querySelector('.mobile-sign-cont').innerHTML = mmSign;

                    let mmHtml = '';
                    if (!isGuest) {

                        if (sharedAccounts.length > 0) {
                            mmHtml += `<div class="acc-manage">
                                        <span class="label">Manage account:</span>`;
                            sharedAccounts.forEach((account) => {
                                mmHtml += '<a href="' + 
                                          linksObject.accountManage.replace('<id>', account.id) + '" class="menu-link" tabindex="0"><span class="text">' + 
                                          account.name + '</span></a>'
                            })
                            mmHtml += `</div>`;
                        }

                        mmHtml += `<div class="menu-link-cont">
                                    <a href="` + linksObject.profile + `" class="menu-link" tabindex="0"><span class="icon-my-profile"></span><span class="text">My Profile</span></a>`;
                        if (showConfirmationNotice) mmHtml += `<a href="` + linksObject.verify + `" class="confirm-email" tabindex="0">Confirm email</a>`;
                        mmHtml += `</div>`;

                        if (showRoyaltiesAndSales) mmHtml += '<a href="' + linksObject.royalties + '" class="menu-link" tabindex="0"><span class="icon-royalties"></span><span class="text">Royalties and Sales</span></a>';
                        mmHtml += '<a href="' + linksObject.order + '" class="menu-link" tabindex="0"><span class="icon-order-history"></span><span class="text">Order History</span></a>';
                        if (showAccountAccess) mmHtml += '<a href="' + linksObject.accountAccess + '" class="menu-link" tabindex="0"><span class="icon-account-access"></span><span class="text">Account Access</span></a>';
                        mmHtml += '<a href="' + linksObject.report + '" class="menu-link" tabindex="0"><span class="icon-document reports-icon"></span><span class="text">Reports</span></a>';
                        if (showAdmin) mmHtml += '<a href="' + linksObject.admin + '" class="menu-link" tabindex="0"><span class="icon-admin"></span><span class="text">Admin</span></a>';
                        mmHtml += '<a href="' + linksObject.logout + '" class="menu-link" tabindex="0"><span class="icon-logout"></span><span class="text">Logout</span></a>'; 
                    }

                    document.querySelector('.mm-links').innerHTML = mmHtml;
                }

                window.addEventListener('DOMContentLoaded', (event) => {

                    let headerSearch = document.querySelector('.header-search .form-control');
                    let headerSearchCont = document.querySelector('.header-search .search-input');
                    let mobileMenu = document.querySelector('.header .mobile-menu');

                    let mobileCont = document.querySelector('.mobile-links-cont');
                    let desktopCont = document.querySelector('.desktop-menu');
                                
                    drawHeader();

                    headerSearch.addEventListener('focus', () => {
                        headerSearchCont?.classList.add('open');
                    });
                    headerSearch.addEventListener('blur', () => {
                        headerSearchCont?.classList.remove('open');
                    });

                    headerSearch.addEventListener('keydown', () => {
                        setTimeout(() => {
                            if (document.getElementById('header-search').value.length > 0) {
                                document.getElementById('clear-search').style.display = 'block';
                            } else {
                                document.getElementById('clear-search').style.display = 'none';
                            }
                        }, 20);
                        
                    });

                    const moveMenu = function(){
                        let menuItems = document.querySelectorAll('.menu-link.movable');
                        
                        let contToMoveTo = window.innerWidth >= 992 ? desktopCont : mobileCont;
                        menuItems.forEach(item => contToMoveTo.appendChild(item));
                    }
                    moveMenu();
                    window.addEventListener('resize', moveMenu, {passive: true});
                    window.addEventListener('orientationchange', moveMenu, {passive: true});

                    document.addEventListener('click', event => {
                        if (event.target?.closest('.open-search')) {
                            headerSearchCont?.classList.add('open-search-panel');
                            headerSearchCont.querySelector('.form-control').focus();
                        }
                        if (event.target?.closest('.close-search')) {
                            headerSearchCont?.classList.remove('open-search-panel');
                        }
                        if (event.target?.closest('.header-menu-toggle') || 
                            event.target?.closest('.close-header-menu') || 
                            event.target?.closest('.mm-bg')) {
                                setTimeout(() => {
                                    mobileMenu?.classList.toggle('open');
                                }, 1);					
                        }


                        if (event.target?.closest('.clear-search')) {
                            document.getElementById('header-search').value = "";
                            document.getElementById('clear-search').style.display = 'none';
                        }

                        if (event.target?.closest('#header-search-btn')) {
                            let searchData = document.getElementById('header-search').value.trim();
                            top.location = appUrl + '/catalog?tab=materials&search=' + searchData;
                        }
                        
                        if (!event.target.closest('.mobile-menu.open')) {
                            mobileMenu?.classList.remove('open');
                        }
                    });

                    document.querySelector('#header-search').addEventListener('keyup', function(e){
                        if (e.key === "Enter") {
                            let searchData = e.target.value.trim();
                            top.location = appUrl + '/catalog?tab=materials&search=' + searchData;
                        }
                    })
                });
            })();

            
        </script>


        <?php
        $post = get_post();
        if($post && $post->post_type == 'post'){
            $slug = 'blog';
        }else{
            $slug = basename(get_permalink());
        }
        ?>
        <script src="<?= get_lawcarta_url()?>/assets/url-track"></script>
        <script src="<?= get_lawcarta_url()?>/assets/fireworks"></script>
        <script src="<?= get_lawcarta_url()?>/assets/redirect-popup-redesign"></script>
    </header>
    <?php endif;?>