<?php
$session = session();
$settings = $session->get('settings');
$picture = "/assets/img/default-user.png";
?>
<!DOCTYPE html>

<html
    lang="<?= $session->get('lang') ?>"
    class="h-100 light-style layout-navbar-fixed layout-menu-fixed"
    dir="ltr"
    data-theme="theme-default"
    data-assets-path="<?= site_url('themes/vuexy/') ?>"
    data-template="vertical-menu-template-no-customizer">


<head>
    <meta charset="utf-8">
    <meta
        name="viewport"
        content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />

    <meta name="locale" content="<?= $session->get("lang") ?>">

    <title><?= config('Safekat')->appName ?></title>

    <meta name="description" content="" />

    <!-- Favicon -->
    <link rel="icon" type="image/x-icon" href="<?= site_url('themes/vuexy/img/favicon/favicon.ico') ?>" />
    <link rel="apple-touch-icon" sizes="57x57" href="<?= site_url('themes/vuexy/img/favicon/apple-icon-57x57.png') ?>">
    <link rel="apple-touch-icon" sizes="60x60" href="<?= site_url('themes/vuexy/img/favicon/apple-icon-60x60.png') ?>">
    <link rel="apple-touch-icon" sizes="72x72" href="<?= site_url('themes/vuexy/img/favicon/apple-icon-72x72.png') ?>">
    <link rel="apple-touch-icon" sizes="76x76" href="<?= site_url('themes/vuexy/img/favicon/apple-icon-76x76.png') ?>">
    <link rel="apple-touch-icon" sizes="114x114"
        href="<?= site_url('themes/vuexy/img/favicon/apple-icon-114x114.png') ?>">
    <link rel="apple-touch-icon" sizes="120x120"
        href="<?= site_url('themes/vuexy/img/favicon/apple-icon-120x120.png') ?>">
    <link rel="apple-touch-icon" sizes="144x144"
        href="<?= site_url('themes/vuexy/img/favicon/apple-icon-144x144.png') ?>">
    <link rel="apple-touch-icon" sizes="152x152"
        href="<?= site_url('themes/vuexy/img/favicon/apple-icon-152x152.png') ?>">
    <link rel="apple-touch-icon" sizes="180x180"
        href="<?= site_url('themes/vuexy/img/favicon/apple-icon-180x180.png') ?>">
    <link rel="icon" type="image/png" sizes="192x192"
        href="<?= site_url('themes/vuexy/img/favicon/android-icon-192x192.png') ?>">
    <link rel="icon" type="image/png" sizes="32x32"
        href="<?= site_url('themes/vuexy/img/favicon/favicon-32x32.png') ?>">
    <link rel="icon" type="image/png" sizes="96x96"
        href="<?= site_url('themes/vuexy/img/favicon/favicon-96x96.png') ?>">
    <link rel="icon" type="image/png" sizes="16x16"
        href="<?= site_url('themes/vuexy/img/favicon/favicon-16x16.png') ?>">
    <link rel="manifest" href="<?= site_url('themes/vuexy/img/favicon/manifest.json') ?>">

    <!-- Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
        href="https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap"
        rel="stylesheet" />

    <!-- Icons -->
    <link rel="stylesheet" href="<?= site_url('themes/vuexy/vendor/fonts/fontawesome.css') ?>" />
    <link rel="stylesheet" href="<?= site_url('themes/vuexy/vendor/fonts/tabler-icons.css') ?>" />
    <link rel="stylesheet" href="<?= site_url('themes/vuexy/vendor/fonts/flag-icons.css') ?>" />

    <!-- Core CSS -->
    <link rel="stylesheet" href="<?= site_url('themes/vuexy/vendor/css/rtl/core.css') ?>" />
    <link rel="stylesheet" href="<?= site_url('themes/vuexy/vendor/css/rtl/theme-semi-dark.css') ?>" />
    <link rel="stylesheet" href="<?= site_url('themes/vuexy/css/safekat.css') ?>" />
    <link rel="stylesheet" href="<?= site_url('themes/vuexy/vendor/libs/flatpickr/flatpickr.css') ?>" />



    <!-- Vendors CSS -->
    <link rel="stylesheet" href="<?= site_url('themes/vuexy/vendor/libs/perfect-scrollbar/perfect-scrollbar.css') ?>" />

    <!-- Page CSS -->
    <?= $this->renderSection('css') ?>

    <link rel="stylesheet" href="<?= site_url('themes/vuexy/css/safekat.css') ?>" />




</head>

<body>

    <!-- Layout wrapper -->
    <div class="layout-wrapper layout-content-navbar">
        <div class="layout-container">
            <aside id="layout-menu" class="layout-menu menu-vertical menu bg-menu-theme">
                <div class="app-brand">
                    <a href="<?= site_url('home') ?>" class="app-brand-link">
                        <span class="app-brand-logo">
                            <img src="<?= site_url('themes/vuexy/img/safekat/logos/sk-logo.png') ?>" width="150px">
                        </span>
                    </a>
                    <a href="javascript:void(0);" class="layout-menu-toggle menu-link text-large ms-auto">
                        <i class="ti menu-toggle-icon d-none d-xl-block ti-sm align-middle"></i>
                        <i class="ti ti-x d-block d-xl-none ti-sm align-middle"></i>
                    </a>
                </div>

                <div class="menu-inner-shadow"></div>

                <ul class="menu-inner py-1 list-group list-group-flush" id="menu-inner-list">

                    <!-- Iterate throught sections -->

                    <?php foreach ($wiki_sections as $key => $value) : ?>
                        <?php if (auth()->user()->inGroup(...$value->roles_array()) || auth()->user()->inGroup('admin')): ?>

                            <li class="menu-item <?= ($value->slug == $slug) ? "active" : "" ?>" data-id="<?= $value->id ?>">
                                <!-- Check if user can view the section link -->
                                <span class="d-flex justify-content-between align-items-center">
                                    <a href="<?= site_url("wiki/view/" . $value->slug) ?>" class="menu-link">
                                        <i class="menu-icon tf-icons <?= $value->icon ?>"></i>
                                        <?= $value->getName()->{$session->get("lang")} ?>
                                    </a>
                                    <?php if (auth()->user()->inGroup('admin')): ?>
                                        <i class="drag-handle cursor-grab icon-base ti ti-arrows-sort align-text-bottom me-2" title="<?= lang('Wiki.alt.sort') ?>"></i>
                                    <?php endif; ?>

                                </span>
                            </li>
                        <?php endif; ?>
                    <?php endforeach; ?>

                </ul>
            </aside>

            <!-- Layout container -->
            <div class="layout-page">

                <!-- Navbar -->
                <nav
                    class="layout-navbar container-fluid navbar navbar-expand-xl navbar-detached align-items-center bg-navbar-theme"
                    id="layout-navbar">
                    <div class="layout-menu-toggle navbar-nav align-items-xl-center me-3 me-xl-0 d-xl-none">
                        <a class="nav-item nav-link px-0 me-xl-4" href="javascript:void(0)">
                            <i class="ti ti-menu-2 ti-sm"></i>
                        </a>
                    </div>
                    <div class="navbar-nav-left d-flex align-items-center" id="navbar-collapse">

                        <ul class="navbar-nav flex-row justify-content-start align-items-center ms-auto">
                            <div>
                                <a class="nav-link" href="<?= route_to("home") ?>">
                                    <i class="ti ti-home rounded-circle me-1 fs-3"></i>
                                </a>
                            </div>
                        </ul>
                    </div>

                    <div class="navbar-nav-right d-flex align-items-center" id="navbar-collapse">

                        <ul class="navbar-nav flex-row justify-content-start align-items-center ms-auto">

                            <!-- Language -->
                            <li class="nav-item dropdown-language dropdown me-2 me-xl-0">
                                <a class="nav-link dropdown-toggle hide-arrow" href="javascript:void(0);"
                                    data-bs-toggle="dropdown">
                                    <i class="fi <?= getCurrentLanguageFlag(); ?> fis rounded-circle me-1 fs-3"></i>
                                </a>

                                <ul class="dropdown-menu dropdown-menu-end">
                                    <li>
                                        <a class="dropdown-item" href="<?= site_url('lang/es'); ?>" data-language="es">
                                            <i class="fi fi-es fis rounded-circle me-1 fs-3"></i>
                                            <span class="align-middle"><?= lang("App.lang_es") ?></span>
                                        </a>
                                    </li>
                                    <li>
                                        <a class="dropdown-item" href="<?= site_url('lang/en'); ?>" data-language="en">
                                            <i class="fi fi-gb fis rounded-circle me-1 fs-3"></i>
                                            <span class="align-middle"><?= lang("App.lang_en") ?></span>
                                        </a>
                                    </li>
                                </ul>
                            </li>

                            <!-- User -->
                            <li class="nav-item navbar-dropdown dropdown-user dropdown">
                                <a class="nav-link dropdown-toggle hide-arrow" href="javascript:void(0);"
                                    data-bs-toggle="dropdown">
                                    <div class="avatar">
                                        <img src="<?= $picture ?? '' ?>" alt class="h-auto rounded-circle" />
                                    </div>
                                </a>
                                <ul class="dropdown-menu dropdown-menu-end">
                                    <li>
                                        <a class="dropdown-item" href="#">
                                            <div class="d-flex">
                                                <div class="flex-shrink-0 me-3">
                                                    <div class="avatar avatar">
                                                        <img src="<?= $picture ?? '' ?>" alt class="h-auto rounded-circle" />
                                                    </div>
                                                </div>
                                                <div class="flex-grow-1">
                                                    <span class="fw-semibold d-block"><?= auth()->user()->getFullName(); ?></span>
                                                    <small class="text-muted"><?= auth()->user()->getEmail(); ?></small>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <div class="dropdown-divider"></div>
                                    </li>
                                    <li>
                                        <a class="dropdown-item" href="<?= site_url('profile'); ?>">
                                            <i class="ti ti-user-check me-2 ti-sm"></i>
                                            <span class="align-middle"><?= lang("App.menu_profile") ?></span>
                                        </a>
                                    </li>
                                    <li>
                                        <div class="dropdown-divider"></div>
                                    </li>
                                    <li>
                                        <a class="dropdown-item" id="btn-log-out" href="<?= site_url("logout") ?>">
                                            <i class="ti ti-logout me-2 ti-sm"></i>
                                            <span class="align-middle"><?= lang("App.menu_logout") ?></span>
                                        </a>
                                    </li>
                                </ul>
                            </li>
                            <!--/ User -->
                        </ul>
                    </div>

                </nav>
                <!-- / Navbar -->

                <!-- Content wrapper -->
                <div class="content-wrapper">
                    <!-- Content -->

                    <div class="container-fluid flex-grow-1 container-p-y">
                        <?php
                        // Include breadcrumbs block
                        include "breadcrumbs.php"
                        ?>

                        <?=
                        // Render the content section
                        $this->renderSection('content')
                        ?>
                    </div>
                    <!-- / Content -->

                    <!-- Footer -->
                    <footer class="content-footer footer bg-footer-theme">
                        <div class="container-fluid">
                            <div class="footer-container d-flex align-items-center justify-content-between py-2 flex-md-row flex-column">
                                <div>
                                    <a href="#" target="_blank" class="fw-semibold">Safekat</a> © <?= date('Y'); ?>
                                </div>
                            </div>
                        </div>
                    </footer>
                    <!-- / Footer -->

                    <div class="content-backdrop fade"></div>
                </div>
                <!-- Content wrapper -->
            </div>
            <!-- / Layout page -->
        </div>

        <!-- Overlay -->
        <div class="layout-overlay layout-menu-toggle"></div>

        <!-- Drag Target Area To SlideIn Menu On Small Screens -->
        <div class="drag-target"></div>
    </div>
    <!-- / Layout wrapper -->

    <?= $this->renderSection('footerAdditions') ?>

    <!-- Core JS -->
    <!-- build:js assets/vendor/js/core.js -->
    <script src="<?= site_url('themes/vuexy/vendor/libs/jquery/jquery.js') ?>"></script>
    <script src="<?= site_url('themes/vuexy/vendor/libs/popper/popper.js') ?>"></script>
    <script src="<?= site_url('themes/vuexy/vendor/js/bootstrap.js') ?>"></script>
    <script src="<?= site_url('themes/vuexy/vendor/libs/flatpickr/flatpickr.js') ?>"></script>
    <script src="<?= site_url('themes/vuexy/vendor/libs/perfect-scrollbar/perfect-scrollbar.js') ?>"></script>
    <script src="<?= site_url('themes/vuexy/vendor/libs/hammer/hammer.js') ?>"></script>
    <script src="<?= site_url('themes/vuexy/vendor/js/menu.js') ?>"></script>


    <script type="module" src="<?= site_url('assets/js/safekat/pages/layout.js') ?>"></script>
    <!-- Helpers -->
    <script src="<?= site_url('themes/vuexy/vendor/js/helpers.js') ?>"></script>
    <script src="<?= site_url('themes/vuexy/js/config.js') ?>"></script>

    <!-- endbuild -->

    <!-- Vendors JS -->
    <?= $this->renderSection('additionalExternalJs') ?>

    <script src="<?= site_url('themes/vuexy/js/main.js') ?>"></script>
    <?php if (auth()->user()->inGroup('admin')): ?>
        <script type="module" src="<?= site_url('assets/js/safekat/pages/wiki/menuSortable.js') ?>"></script>
    <?php endif; ?>


    <?= sweetAlert() ?>

    <?php
    if (isset($global_js_variables)) {
        echo "<script>\n";
        foreach ($global_js_variables as $name => $value):
            echo "\t" . "var $name = $value;" . "\n";
        endforeach;
        echo "</script>\n";
    }
    ?>


    <script type="text/javascript">
        <?= $this->renderSection('globalJsFunctions') ?>

        var theTable;
        var <?= csrf_token() ?? 'token' ?>v = '<?= csrf_hash() ?>';

        function yeniden(andac = null) {
            if (andac == null) {
                andac = <?= csrf_token() ?>v;
            } else {
                <?= csrf_token() ?>v = andac;
            }
            $('input[name="<?= csrf_token() ?>"]').val(andac);
            $('meta[name="<?= config('Security')->tokenName ?>"]').attr('content', andac)
            $.ajaxSetup({
                headers: {
                    '<?= config('Security')->headerName ?>': andac,
                    'X-Requested-With': 'XMLHttpRequest'
                },
                <?= csrf_token() ?>: andac
            });
        }

        document.addEventListener('DOMContentLoaded', function() {

            function adjustSidebar4ContentWrapper() {
                if ($('#sidebar').hasClass('d-none') && $(window).width() <= 768) {
                    $('#contentWrapper').addClass('full-width');
                } else {
                    if (!$('#sidebar').hasClass('inactive')) {
                        $('#contentWrapper').removeClass('full-width');
                    }
                }
            }

            adjustSidebar4ContentWrapper();

            $('#sidebarCollapse').on('click', function() {

                if ($('#sidebar').hasClass('d-none') && $(window).width() <= 768) {
                    $('#sidebar').removeClass('d-none d-sm-none d-md-block');

                    $('#contentWrapper').removeClass('full-width');
                } else {
                    $('#sidebar').toggleClass('inactive');
                    $('#contentWrapper').toggleClass('full-width');
                    $('.collapse.in').toggleClass('in');
                    $('a[aria-expanded=true]').attr('aria-expanded', 'false');
                }

            });

            $(window).resize(function() {
                adjustSidebar4ContentWrapper();
            });

            <?= $this->renderSection('additionalInlineJs') ?>

        });
    </script>

</body>

</html>