<!DOCTYPE html>
<html lang="pl">
  <head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>adsPRO</title>
    <meta name="robots" content="noindex, nofollow">
    <link href="/layout/favicon.png" rel="icon" type="image/x-icon">
    <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=Roboto:ital,wght@0,300..800;1,300..800&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
    <script src="https://cdn.datatables.net/2.1.7/js/dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/2.1.7/js/dataTables.bootstrap5.min.js"></script>
    <script src="https://code.highcharts.com/highcharts.js"></script>
    <script src="/libraries/framework/vendor/jquery/jquery_ui/jquery-ui.min.js"></script>
    <script src="/libraries/framework/vendor/plugins/moment/moment.js"></script>
    <script src="/libraries/framework/vendor/plugins/moment/pl.js"></script>
    <script src="/libraries/framework/vendor/plugins/datepicker/js/bootstrap-datetimepicker.js"></script>
    <script src="/libraries/framework/vendor/plugins/daterange/daterangepicker.js"></script>
    <script src="/libraries/adspro-dialog.js"></script>
    <script src="/libraries/select2/js/select2.full.min.js"></script>
    <script src="/libraries/functions.js"></script>
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/2.1.7/css/dataTables.bootstrap5.min.css">
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="/libraries/framework/vendor/plugins/datepicker/css/bootstrap-datetimepicker.css">
    <link rel="stylesheet" type="text/css" href="/libraries/framework/vendor/plugins/daterange/daterangepicker.css">
    <link rel="stylesheet" type="text/css" href="/libraries/adspro-dialog.css">
    <link rel="stylesheet" type="text/css" href="/libraries/select2/css/select2.min.css">
    <link rel="stylesheet" type="text/css" href="/libraries/select2/css/select2-bootstrap-5-theme.min.css">
    <link rel="stylesheet" type="text/css" href="/layout/style.css">
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
  </head>
  <body class="logged">
    <?php
      $module = $this -> current_module;
      $google_ads_modules = [ 'campaigns', 'campaign_terms', 'products', 'campaign_alerts', 'clients', 'feeds' ];
      $is_google_ads_module = in_array( $module, $google_ads_modules, true );
      $facebook_ads_modules = [ 'facebook_ads' ];
      $is_facebook_ads_module = in_array( $module, $facebook_ads_modules, true );
    ?>
    <!-- Sidebar -->
    <aside class="sidebar" id="sidebar">
      <div class="sidebar-header">
        <div class="sidebar-logo">
          <a href="/">
            <span class="logo-text">ads<strong>PRO</strong></span>
          </a>
        </div>
        <button class="sidebar-toggle" id="sidebarToggle">
          <i class="fa-solid fa-angles-left"></i>
        </button>
      </div>
      <nav class="sidebar-nav">
        <ul>
          <li class="nav-group <?= $is_google_ads_module ? 'active' : '' ?>">
            <div class="nav-group-label">
              <i class="fa-brands fa-google"></i>
              <span>Google ADS</span>
            </div>
            <ul class="nav-submenu">
              <li class="<?= $module === 'campaigns' ? 'active' : '' ?>">
                <a href="/campaigns">
                  <i class="fa-solid fa-bullhorn"></i>
                  <span>Kampanie</span>
                </a>
              </li>
              <li class="<?= $module === 'campaign_terms' ? 'active' : '' ?>">
                <a href="/campaign_terms">
                  <i class="fa-solid fa-list-check"></i>
                  <span>Grupy i frazy</span>
                </a>
              </li>
              <li class="<?= $module === 'products' ? 'active' : '' ?>">
                <a href="/products">
                  <i class="fa-solid fa-box-open"></i>
                  <span>Produkty</span>
                </a>
              </li>
              <li class="<?= $module === 'campaign_alerts' ? 'active' : '' ?>">
                <a href="/campaign_alerts">
                  <i class="fa-solid fa-triangle-exclamation"></i>
                  <span>Alerty</span>
                  <?php if ( (int) ( $this -> campaign_alerts_count ?? 0 ) > 0 ): ?>
                    <span class="badge-alerts-count"><?= (int) $this -> campaign_alerts_count; ?></span>
                  <?php endif; ?>
                </a>
              </li>
              <li class="<?= $module === 'clients' ? 'active' : '' ?>">
                <a href="/clients">
                  <i class="fa-solid fa-building"></i>
                  <span>Klienci</span>
                </a>
              </li>
              <li class="<?= $module === 'feeds' ? 'active' : '' ?>">
                <a href="/feeds">
                  <i class="fa-solid fa-file-csv"></i>
                  <span>Supplemental Feeds</span>
                </a>
              </li>
            </ul>
          </li>
          <li class="nav-group <?= $is_facebook_ads_module ? 'active' : '' ?>">
            <div class="nav-group-label">
              <i class="fa-brands fa-facebook"></i>
              <span>Facebook ADS</span>
            </div>
            <ul class="nav-submenu">
              <li class="<?= $module === 'facebook_ads' ? 'active' : '' ?>">
                <a href="/facebook_ads">
                  <i class="fa-solid fa-chart-line"></i>
                  <span>Kampanie i reklamy</span>
                </a>
              </li>
            </ul>
          </li>
          <li class="<?= $module === 'allegro' ? 'active' : '' ?>">
            <a href="/allegro">
              <i class="fa-solid fa-file-import"></i>
              <span>Allegro import</span>
            </a>
          </li>
          <li class="<?= $module === 'logs' ? 'active' : '' ?>">
            <a href="/logs">
              <i class="fa-solid fa-file-lines"></i>
              <span>Logi</span>
            </a>
          </li>
          <li class="nav-divider"></li>
          <li class="<?= $module === 'users' ? 'active' : '' ?>">
            <a href="/settings">
              <i class="fa-solid fa-gear"></i>
              <span>Ustawienia</span>
            </a>
          </li>
        </ul>
      </nav>
      <div class="sidebar-footer">
        <div class="sidebar-user">
          <div class="user-avatar">
            <i class="fa-solid fa-user"></i>
          </div>
          <div class="user-info">
            <span class="user-email"><?= $this -> user['email']; ?></span>
          </div>
        </div>
        <a href="/logout" class="sidebar-logout" title="Wyloguj się">
          <i class="fa-solid fa-right-from-bracket"></i>
          <span>Wyloguj</span>
        </a>
      </div>
    </aside>

    <!-- Main content -->
    <div class="main-wrapper" id="mainWrapper">
      <header class="topbar">
        <button class="topbar-toggle" id="topbarToggle">
          <i class="fa-solid fa-bars"></i>
        </button>
        <div class="topbar-breadcrumb">
          <?php
            $breadcrumbs = [
              'campaigns' => 'Kampanie',
              'campaign_terms' => 'Grupy i frazy',
              'products'  => 'Produkty',
              'campaign_alerts' => 'Alerty',
              'clients'   => 'Klienci',
              'feeds'     => 'Supplemental Feeds',
              'facebook_ads' => 'Facebook Ads',
              'allegro'   => 'Allegro import',
              'logs'      => 'Logi',
              'users'     => 'Ustawienia',
            ];
            echo $breadcrumbs[$module] ?? 'adsPRO';
          ?>
        </div>
      </header>
      <main class="content">
        <? if ( $this -> alert ): ?>
          <div class="app-alert"><?= $this -> alert; ?></div>
        <? endif; ?>
        <?= $this -> content; ?>
      </main>
    </div>

    <!-- Popup domyslny -->
    <div class="default_popup">
      <div class="popup_content">
        <div class="popup_header">
          <div class="title"></div>
          <div class="close"><i class="fa-solid fa-xmark"></i></div>
        </div>
        <div class="popup_body"></div>
      </div>
    </div>

    <script type="text/javascript">
      // Sidebar toggle
      $(function() {
        var sidebar = $('#sidebar');
        var mainWrapper = $('#mainWrapper');
        var collapsed = localStorage.getItem('sidebar_collapsed') === 'true';

        if (collapsed) {
          sidebar.addClass('collapsed');
          mainWrapper.addClass('expanded');
        }

        $('#sidebarToggle, #topbarToggle').on('click', function() {
          sidebar.toggleClass('collapsed');
          mainWrapper.toggleClass('expanded');
          localStorage.setItem('sidebar_collapsed', sidebar.hasClass('collapsed'));
        });

        // Datepicker
        $('input.date').datepicker({
          language: 'pl',
          autoClose: true
        });

        // Popup close
        $('body').on('click', '.default_popup .close', function(e) {
          e.preventDefault();
          $('.default_popup .popup_body').empty();
          $('.default_popup').hide();
          return false;
        });
      });

      function show_default_popup(content) {
        $('.default_popup .popup_body').html(content);
        $('.default_popup').fadeIn();
      }
    </script>
  </body>
</html>

