<%

from cuchulu.libraries.sessionplugin import get_session

session=get_session()

dark_checked=''
dark_css=''

if session.get('theme', '0')=='1':
    dark_checked='checked'
    dark_css='dark'


%>
<!DOCTYPE html>
<html>
<head>                                                                                          
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<title>${title}</title>
<link href="${make_media_url('css/font-awesome.min.css', 'admin')}" rel="stylesheet" />
<link href="${make_media_url('css/admin.css', 'admin')}" rel="stylesheet" />
<link href="${make_media_url('css/responsive-nav.css', 'admin')}" rel="stylesheet" />
<link href="${make_media_url('css/tooltipster.bundle.min.css', 'admin')}" rel="stylesheet" />
<!--<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> -->
<%block name="extra_css">
</%block>
<script language="Javascript" src="${make_media_url('js/jquery.min.js', 'admin')}"></script>
<script language="Javascript" src="${make_media_url('js/responsive-nav.min.js', 'admin')}"></script>
<script language="Javascript" src="${make_media_url('js/tooltipster.bundle.min.js', 'admin')}"></script>
${load_js()|n}
<%block name="extra_js">
</%block>
<%block name="extra_header">
</%block>
</head>
<body class="${dark_css}">
<div id="layer_loading"><div id="container_loading"><div class="lds-dual-ring"></div></div></div>
<div id="languages_general">
</div>
<div id="logout">
<%block name="logout"><a href="${url_for('admin_app.logout')}"><i class="fa fa-power-off" aria-hidden="true"></i> Logout</a></%block>
</div>

<div id="center_body">
    <div id="header">
        <a href="#nav" id="toggle"><i class="fa fa-bars" aria-hidden="true"></i><span>Menu</span></a>
        <%block name="title_admin">
        <%

        from settings import config

        portal_admin_name_set=('Paramecio', 'Framework!')

        if hasattr(config, 'portal_admin_name_set'):
            portal_admin_name_set=('Paramecio', 'Framework!')

        %>
        <span id="title_phango">${portal_admin_name_set[0]}</span> <span id="title_framework">${portal_admin_name_set[1]}</span>
        </%block>
        
    </div>
    <div class="content_admin">
    
        <nav id="menu" class="nav-collapse">
            <ul>
                <li class="menu_title"><%block name="applications"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" width="22" style="fill: currentColor;display: inline-block;vertical-align: -.130em;position:relative;left:-3px;top:2px;">
                <!--!Font Awesome Free v7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
                <path d="M259.1 73.5C262.1 58.7 275.2 48 290.4 48L350.2 48C365.4 48 378.5 58.7 381.5 73.5L396 143.5C410.1 149.5 423.3 157.2 435.3 166.3L503.1 143.8C517.5 139 533.3 145 540.9 158.2L570.8 210C578.4 223.2 575.7 239.8 564.3 249.9L511 297.3C511.9 304.7 512.3 312.3 512.3 320C512.3 327.7 511.8 335.3 511 342.7L564.4 390.2C575.8 400.3 578.4 417 570.9 430.1L541 481.9C533.4 495 517.6 501.1 503.2 496.3L435.4 473.8C423.3 482.9 410.1 490.5 396.1 496.6L381.7 566.5C378.6 581.4 365.5 592 350.4 592L290.6 592C275.4 592 262.3 581.3 259.3 566.5L244.9 496.6C230.8 490.6 217.7 482.9 205.6 473.8L137.5 496.3C123.1 501.1 107.3 495.1 99.7 481.9L69.8 430.1C62.2 416.9 64.9 400.3 76.3 390.2L129.7 342.7C128.8 335.3 128.4 327.7 128.4 320C128.4 312.3 128.9 304.7 129.7 297.3L76.3 249.8C64.9 239.7 62.3 223 69.8 209.9L99.7 158.1C107.3 144.9 123.1 138.9 137.5 143.7L205.3 166.2C217.4 157.1 230.6 149.5 244.6 143.4L259.1 73.5zM320.3 400C364.5 399.8 400.2 363.9 400 319.7C399.8 275.5 363.9 239.8 319.7 240C275.5 240.2 239.8 276.1 240 320.3C240.2 364.5 276.1 400.2 320.3 400z"/></svg>${_('Applications')}</li></%block>
                <%block name="menu_list">
                <%
                
                from cuchulu.libraries.config_admin import config_admin
    
                %>
                % for admin in config_admin:
                    
                    <%
                    
                    class_selected=''
                    link_text=''
                    
                    %>
                
                    % if len(admin)>=3:
                    <%
                    
                    if admin[2]==path_module:
                        class_selected='selected_menu'
                        
                    icon_module='fa-circle-o'
                    
                    if len(admin)>3:
                        icon_module=admin[3]
                    
                    if type(admin[0]).__name__=='function':
                        link_text=admin[0]()
                    else:
                        link_text=admin[0]
                    
                    %>
                
                
                    <li><a href="${url_for(admin[2])}" class="${class_selected}">&nbsp;
                            % if icon_module.startswith('fa-'):
                            <i class="fa ${icon_module}" aria-hidden="true"></i>
                            %else:
                            ${icon_module|n}
                            % endif
                            ${link_text}
                        </a>
                    </li>
                                        
                    % elif len(admin)==1:
                    <%
                    if type(admin[0]).__name__=='function':
                        link_text=admin[0]()
                    else:
                        link_text=admin[0]
                    %>
                    
                    <li><div class="father_admin">${link_text}</div></li>
                    
                    % endif
                
                % endfor
                </%block>
            </ul>
        </nav>
        <div class="contents">
            <h1>${title}</h1>
            <div class="switch-btn">
                <div class="switch-text">
                    ${_('Dark theme')}
                </div>
                <div class="switch-slider">
                    <label class="switch">
                        <input type="checkbox" name="theme" value="1" id="theme" ${dark_checked}/>
                        <span class="slider round"></span>
                    </label>
                </div>
            </div>
            <div class="content">
                <%
                flash=show_flash_message()
                %>
                % if flash!='':
                <div class="flash">${flash}</div>
                <script>setTimeout(function () { $(".flash").fadeOut();  }, 3000);</script>
                % endif
                <%block name="content">
                </%block>
            </div>
    </div>
</div>
<div id="loading_ajax">
</div>
<script>
    var navigation = responsiveNav(".nav-collapse", {customToggle: "#toggle"});
    
    $('.tooltip').tooltipster({
        animation: 'fade',
        delay: 100,
        trigger: 'click'
    });
    
    const slider = document.querySelector('input[name="theme"]');

    slider.addEventListener("change", function () {
        
        //Block button while send to ajax. 
        
        $(this).prop("disabled",true);
        
        var dark='';
        
        if (this.checked) {
            document.body.classList.add("dark");
            
            dark='1';
            
        } else {
            document.body.classList.remove("dark");
            
            dark='0';
        }
        
        $.ajax({
            url: "${url_for('admin_app.change_theme')}?theme="+dark,
            type: 'GET',
            data:  {},
            success: function (data) {

                if(!data.error) {

                    console.log('Changed to dark in all pages');

                }
                else {

                    console.log('Cannot set dark theme in all pages!');

                }
                
                $(slider).prop("disabled",false);

            },
            error: function (data) {

                alert('Error: '+data.status+' '+data.statusText);
                
                $(slider).prop("disabled", false);

            },
            dataType: 'json'
        });

    });
    
    $(document).ready(function () {
        
        $('#layer_loading').hide();
    
    });

</script>
<%block name="jscript_block">
</%block>
</body>
</html>
