admin back-office environment (skeleton); admin categories

8 files changed, 238 insertions, 33 deletions

diff --git a/public/app/views/admin/admin-menu.php b/public/app/views/admin/admin-menu.php
new file mode 100644
index 0000000..813420d
--- /dev/null
+++ b/public/app/views/admin/admin-menu.php
@@ -0,0 +1,47 @@
+<?php
+/** admin panel
+ * -----------------------------------------------------------------------------
+ * 
+ * imported variables:
+ * ---
+ * @param $action (string) : array of articles
+ * 
+ * example call:
+ * ---
+ * Render::template("sections/admin_panel.php",[
+ *      'action' => 'posts',
+ * ])
+ * -----------------------------------------------------------------------------
+ */
+
+
+$admin_options = [
+    'new' => 'Νέο Μάθημα',
+    'lessons' => 'Μαθήματα',
+    'categories' => 'Κατηγορίες',
+    'pages' => 'Σελίδες',
+    'privileges' => 'Δικαιώματα',
+    'users' => 'Χρήστες'
+];
+
+?>
+
+<div class="top-bar">
+
+    <span class="btn btn-warning">Admin</span>
+
+    <?php foreach($admin_options as $opt => $label) : ?>
+
+        <?php if ($opt == $action) : ?>
+            <span class="btn btn-primary selected"><?=$label?></span>
+
+        <?php else : ?>
+            <a href="/admin/<?= $opt ?>" class="btn"><?= $label ?></a>
+
+        <?php endif; ?>
+
+    <?php endforeach ?>
+
+    <a href="/logout" class="btn">Logout</a>
+
+</div>
\ No newline at end of file
diff --git a/public/app/views/admin/categories.php b/public/app/views/admin/categories.php
new file mode 100644
index 0000000..e33d9b0
--- /dev/null
+++ b/public/app/views/admin/categories.php
@@ -0,0 +1,97 @@
+ <!-- title bar -->
+ <div class="title-bar">
+    <div>Διαχείριση Κατηγοριών</div>
+    <div>
+        <!-- Button trigger modal -->
+        <button type="button" class="btn btn-success pull-right"
+            data-bs-toggle="modal" data-bs-target="#manageCategory" data-id="0">
+            <i class="fas fa-plus"></i> &nbsp; Νέα Κατηγορία
+        </button>
+    </div>
+</div>
+
+<div class="manage">
+    <div class="row">
+        <div class="col-md-12">
+
+            <div id="categories-tree">
+
+                <table id="dt-categories" class="table table-responsive dt-table">
+                    <thead>
+                        <th class="dt-breadcrumb">Κατηγορία</th>
+                        <th class="dt-actions"></th>
+                    </thead>
+                </table>
+
+            </div>
+
+
+        </div>
+    </div>
+</div><!-- /manage -->
+
+
+
+<!-- MODAL for new/edit category -->
+<!-- NOTE: tabindex="-1" removed, ref:https://github.com/select2/select2-bootstrap-theme/issues/41 -->
+<div class="modal fade" id="manageCategory" aria-labelledby="myModalLabel" aria-hidden="true">
+    <div class="modal-dialog modal-lg" role="document">
+        <div class="modal-content">
+        
+        <form method="post" action="">
+
+            <div class="modal-header">
+                <h4 class="modal-title" id="myModalLabel">Modal title</h4>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div><!-- /modal-header -->
+
+            <!-- modal-body -->
+            <div class="modal-body">
+
+                <!-- loader
+                <div class="modal-loader">
+                    <img src="/img/ajax-loader.gif">
+                </div>
+                -->
+
+                <!-- form fields -->
+                    
+                <div class="row form-group">
+                    <label class="control-label col-sm-12" for="label">Όνομα κατηγορίας</label>
+                    <div class="col-sm-12">
+                        <input class="form-control" type="text" name="label" value="" required="">
+                    </div>
+                </div>
+
+                <div class="row form-group">
+                    <label class="control-label col-sm-12" for="parent_id">Γονική Κατηγορία</label>
+                    <div class="col-sm-12">
+                        <select class="form-control" id="parent_id" name="parent_id" required /></select>
+                    </div>
+                </div>
+
+                <div class="row form-group">
+                    <input type="hidden" name="id" value="0"><!-- action = (0) ? 'new' : 'edit' -->
+                </div>
+                        
+
+            </div><!-- /modal body -->
+
+            <div class="modal-footer">
+                <div class="row">
+                    <div class="form-actions">
+                        <div class="col-xs-4">
+                            <button type="button" class="btn btn-default js-modal-close col-sm-12" data-bs-dismiss="modal">Κλείσιμο</button>
+                        </div>
+                        <div class="col-xs-8">
+                            <button class="btn btn-success col-sm-12" type="submit">Καταχώριση</button>
+                        </div>
+                    </div>
+                </div>
+            </div><!-- /modal-footer -->
+
+        </form><!-- /form -->
+
+        </div>
+    </div>
+</div>
diff --git a/public/app/views/admin/skeleton.php b/public/app/views/admin/skeleton.php
index a9c2dcf..fea346f 100644
--- a/public/app/views/admin/skeleton.php
+++ b/public/app/views/admin/skeleton.php
@@ -3,35 +3,31 @@
 <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>ΣΚΛΑΒΕΝΙΤΗΣ - <?=$page['title']?></title>
+    <title>Classroom - <?=$title?></title>
 
-    <!-- styling assets -->
-
-    <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+Slab:wght@300;400;500;700&display=swap" rel="stylesheet">
-
-    <!-- script assets -->
+    <?php   // header includes
+        ////////////////////////////////////////////////////////////////////////
+        Render::view('components/header_includes', ['administration' => true]);
+    ?>
 
 
 </head>
 <body>
 
-    <div class="admin-container">
-
-        <div class="menu">
-
-        </div>
-
-        <div class="workspace">
-
-        </div>
-
-        <div class="options">
-
-        </div>
-
+    <div class="classroom admin-container">
+
+        <?php 
+            Render::view('admin/admin-menu',[
+                'action' => $action
+            ])
+        ?>
+       
+        <?php 
+            Render::view("admin/{$action}");
+        ?>
     </div>
 
+    <script src="/assets/js/admin/<?= $action ?>.js"></script>
+
 </body>
 </html><?php ob_flush(); ?>
diff --git a/public/app/views/components/header_includes.php b/public/app/views/components/header_includes.php
index 4ee6904..e5e51cd 100644
--- a/public/app/views/components/header_includes.php
+++ b/public/app/views/components/header_includes.php
@@ -1,3 +1,8 @@
+<?php 
+    if (!isset($administration)) {
+        $administration = false;
+    }
+?>
 
 <!-- fonts (CDN) -->
 <link rel="preconnect" href="https://fonts.googleapis.com">
@@ -10,14 +15,42 @@
 <!-- bootstap (CDN) -->
 <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-aFq/bzH65dt+w6FI2ooMVUpc+21e0SRygnTpmBvdBgSdnuTN7QbdgL+OapgHtvPp" crossorigin="anonymous">
 
+<?php if ($administration) : ?>
+    <!-- datatables css -->
+    <link href="https://cdn.datatables.net/v/bs5/jszip-2.5.0/dt-1.13.4/b-2.3.6/b-colvis-2.3.6/b-html5-2.3.6/b-print-2.3.6/cr-1.6.2/date-1.4.0/fc-4.2.2/fh-3.3.2/kt-2.8.2/r-2.4.1/rr-1.3.3/sc-2.1.1/sl-1.6.2/sr-1.2.2/datatables.min.css" rel="stylesheet"/>
+
+    <!-- select2 css -->
+    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
+<?php endif ?>
+
+
 <!-- main css -->
 <link href="/assets/css/class.css" rel="stylesheet">
 
 <!-- overides  -->
 <link href="/assets/css/overides.css" rel="stylesheet">
 
+
+
 <!-- bootstrap javascript (CDN) -->
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha2/dist/js/bootstrap.bundle.min.js" integrity="sha384-qKXV1j0HvMUeCBQ+QVp7JcfGl760yU08IQ+GpUo5hlbpg51QRiuqHAJz8+BrxE/N" crossorigin="anonymous"></script>
 
 <!-- jQuery (CDN) -->
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.4/jquery.min.js" integrity="sha512-pumBsjNRGGqkPzKHndZMaAG+bir374sORyzM3uulLV14lN5LyykqNk8eEeUlUkB3U0M4FApyaHraT65ihJhDpQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+
+<!-- basic cookie handling (vanilla js) -->
+<script src="/assets/js/cookie.js"></script>
+
+
+<?php if ($administration) : ?>
+    <!-- datatables js -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
+    <script src="https://cdn.datatables.net/v/bs5/jszip-2.5.0/dt-1.13.4/b-2.3.6/b-colvis-2.3.6/b-html5-2.3.6/b-print-2.3.6/cr-1.6.2/date-1.4.0/fc-4.2.2/fh-3.3.2/kt-2.8.2/r-2.4.1/rr-1.3.3/sc-2.1.1/sl-1.6.2/sr-1.2.2/datatables.min.js"></script>
+
+    <!-- select2 js -->
+    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>    
+<?php endif ?>
+
+
+ 
diff --git a/public/app/views/components/user-management.php b/public/app/views/components/user-management.php
index 02a439e..9f95af8 100644
--- a/public/app/views/components/user-management.php
+++ b/public/app/views/components/user-management.php
@@ -18,12 +18,13 @@
 
     <div class="dropdown js-subscriber">
         <button type="button" class="btn btn-default dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
+            <i class="fa fa-regular fa-user"></i>
             Διαχείριση Λογαριασμού <span class="caret"></span>
         </button>
         <ul class="dropdown-menu">
-            <li><a class="dropdown-item" href="/profile">Διαχείριση Προφίλ</a></li>
-            <li><a class="dropdown-item" href="/courses">Ύλη μαθημάτων</a></li>
-            <li><a class="dropdown-item" href="/payments">Πληρωμές</a></li>
+            <li><a class="dropdown-item" href="/account/profile">Διαχείριση Προφίλ</a></li>
+            <li><a class="dropdown-item" href="/account/courses">Ύλη μαθημάτων</a></li>
+            <li><a class="dropdown-item" href="/account/payments">Πληρωμές</a></li>
             
             <li><hr class="dropdown-divider"></li>
 
@@ -35,8 +36,30 @@
 
 
 <script>
-    // default: hide subscriber's menu
-    [].forEach.call(document.querySelectorAll('.js-subscriber'), function (el) {
+    // if user is connected hide anonymous user menu and show connected user's content
+    if (cookieExists('cluser') && (readCookie('cluser').includes('connected'))) {
+        [].forEach.call(document.querySelectorAll('.js-visitor'), function (el) {
+            el.style.display = 'none';
+        });
+        [].forEach.call(document.querySelectorAll('.js-subscriber'), function (el) {
+            el.style.display = 'unset';
+        });
+
+        // also extract user's full name to personalize messages
+        let connection = unescape(readCookie('cluser')).split(';');
+        connection.shift();     // remove 1st item (="connection")
+        let name = connection.join(' ');    console.log(name);
+        var node = document.querySelectorAll('.js-subscriber button')[0];
+        node.innerHTML = `<i class="fa fa-regular fa-user"></i> ${name} <span class="caret"></span>`;
+
+
+    } else {    // else ... do the opposite
+        [].forEach.call(document.querySelectorAll('.js-subscriber'), function (el) {
             el.style.display = 'none';
-    });
+        });
+        [].forEach.call(document.querySelectorAll('.js-visitor'), function (el) {
+            el.style.display = 'unset';
+        });
+    }
+    
 </script>
diff --git a/public/app/views/error/404.php b/public/app/views/error/404.php
index 2b67e8d..89c35cc 100644
--- a/public/app/views/error/404.php
+++ b/public/app/views/error/404.php
@@ -22,7 +22,7 @@
     .container { display: flex; height: 100vh; align-items:center; }
     .content { position: relative;
         max-width:320px; width: 100%;
-        margin: auto auto; padding: 1.5em;
+        margin: auto auto; padding: 1.5em 1.5em 3em 1.5em;
         text-align: center; justify-center: center;
         opacity: .33;
     }
diff --git a/public/app/views/error/general.php b/public/app/views/error/general.php
index 257e68d..74566a4 100644
--- a/public/app/views/error/general.php
+++ b/public/app/views/error/general.php
@@ -34,7 +34,7 @@
     .container { display: flex; height: 100vh; align-items:center; }
     .content { position: relative;
         max-width: 480px; width: 100%;
-        margin: auto auto; padding: 1.5em;
+        margin: auto auto; padding: 1.5em 1.5em 3em 1.5em;
         text-align: center; justify-center: center;
         opacity: .33;
         font-size: .87em
diff --git a/public/app/views/welcome.php b/public/app/views/welcome.php
index de00645..ded2294 100644
--- a/public/app/views/welcome.php
+++ b/public/app/views/welcome.php
@@ -17,12 +17,21 @@
         Render::view('components/top-bar');
     ?>
 
-    <?php print_r($_SESSION); ?>
+    <pre>
+        <?php print_r($categories); ?>
+    </pre>
+
+    <!-- TESTING STRINGS (while developing only) -->
+    <?php /* --- print_r($_SESSION); ?>
     <?php print_r($_COOKIE); ?>
     <?php 
-    if (isset($_SESSION)) echo 'session seted';
+        if (isset($_SESSION)) echo '; session seted ; ';
     ?>
-    <?=var_dump($_SESSION[UserTokenInterface::DEFAULT_PREFIX_KEY])?>
+    <?=
+        isset($_SESSION[UserTokenInterface::DEFAULT_PREFIX_KEY])
+        ? var_dump($_SESSION[UserTokenInterface::DEFAULT_PREFIX_KEY])
+        : 'none!'
+    --- */ ?>
 
 </body>
 </html>
\ No newline at end of file