From 65d07ba64d45c77d2db16272710ec5702b34d641 Mon Sep 17 00:00:00 2001 From: George Halkiadakis Date: Tue, 25 Apr 2023 03:40:09 +0300 Subject: front-end: putting everything together --- public/assets/css/class.css | 11 +-- public/assets/js/admin/files.js | 48 ++++++++++-- public/assets/js/admin/lessons.js | 158 ++++++++++++++++---------------------- 3 files changed, 117 insertions(+), 100 deletions(-) (limited to 'public/assets') diff --git a/public/assets/css/class.css b/public/assets/css/class.css index 6ee2c04..a65bfa2 100644 --- a/public/assets/css/class.css +++ b/public/assets/css/class.css @@ -164,8 +164,8 @@ * ----------------------------------------------------------------------------- */ -.classroom .breadcrumb { counter-reset: var(--class-blue); } -.classroom .breadcrumb i.fas { padding: 0 6px; } +.classroom .breadcrumb a { counter-reset: var(--class-blue); font-size: 14px; } +.classroom .breadcrumb i.fas { padding-top: 7px; font-size: 12px; } @@ -229,11 +229,12 @@ +.classroom .course-view h5 { padding-top: 2em; } /** sub-categories on category page * ----------------------------------------------------------------------------- */ - +/* .classroom .category-childs { margin: 1em; padding: 1em; } .classroom .category-childs a { @@ -253,7 +254,7 @@ text-decoration: none; } - +*/ @@ -274,7 +275,7 @@ flex-grow: 1; width: calc(100% - 90px); } -.classroom .post-card h3 { padding: 0; margin: 0; border: none; } +.classroom .post-card h3 { padding: 0; margin: 0; border: none; font-size: 20px; } .classroom .post-card h3 a { display: block; } .classroom .post-card h3 a:hover { color: #f47920; } .classroom .post-card .category { color: #566; } diff --git a/public/assets/js/admin/files.js b/public/assets/js/admin/files.js index bfb0c73..e100b30 100644 --- a/public/assets/js/admin/files.js +++ b/public/assets/js/admin/files.js @@ -1,6 +1,6 @@ // Globals // ----------------------------------------------------------------------------- -var privileges = []; +var privileges = [ { id: 0, label: 'Δημόσιο' } ]; var files = []; var table; @@ -34,16 +34,36 @@ if (!Array.prototype.indexOf) }; } + +// function for sorting an array by 'label' attribute +// --- -- -- - - - +function compare_label (a,b) { + if ( a.label < b.label ) { return -1; } + if ( a.label > b.label ) { return 1; } + return 0; +} + + // return file record by file-id // --- -- -- - - - function privilege_record(id) { var record = 0; - files.forEach(el => { if (el.id == id) record = el; }); - + files.forEach(el => { if (el.id == id) record = el; }); return record; } +/** privilege(id) + * label of privilege with + * @param id (int) + */ +function privilege_(id) { + let reply = false; + privileges.forEach( pri => { if (pri.id == id) reply = pri.label; }); + return reply; +} + + // create actions html (edit and delete buttons) // --- -- -- - - - function create_actions_html(id) { @@ -106,6 +126,7 @@ $(document).ready(function() { path: el.path, type: el.type, privilege_id: ((el.privilege_id == null) ? 0 : el.privilege_id), + privilege: privilege_( ((el.privilege_id == null) ? 0 : el.privilege_id) ), actions: create_actions_html(el.id) }); }); @@ -127,7 +148,7 @@ $(document).ready(function() { { data: 'label' }, { data: 'path' }, { data: 'type' }, - { data: 'privilege_id' }, + { data: 'privilege' }, { data: 'actions' } ] }); @@ -138,7 +159,24 @@ $(document).ready(function() { }); } - init_table(); // init table on first run + + + + $.getJSON( "/admin/api/privileges" ) + .done( function( response ) { + + // construct provileges data + // --- + response.forEach( el => { + privileges.push({ + id: el.id, + label: el.label + }); + }); + privileges.sort( compare_label ); // sort categories by breadcrumb + + init_table(); // init table on first run + }); diff --git a/public/assets/js/admin/lessons.js b/public/assets/js/admin/lessons.js index 8391f4d..1a08875 100644 --- a/public/assets/js/admin/lessons.js +++ b/public/assets/js/admin/lessons.js @@ -1,7 +1,7 @@ // Globals // ----------------------------------------------------------------------------- var categories = []; -var privileges = []; +var privileges = [ { id: 0, label: 'Δημόσιο' } ]; var lessons = []; var table; @@ -36,9 +36,6 @@ if (!Array.prototype.indexOf) } -// Supplamentary functions -// ----------------------------------------------------------------------------- - // function for sorting an array by 'label' attribute // --- -- -- - - - function compare_label (a,b) { @@ -65,25 +62,45 @@ function lesson_record(id) { return record; } +/** course(id) + * label of course with + * @param id (int) + */ +function course_(id) { + let reply = false; + categories.forEach( cat => { if (cat.id == id) reply = cat.label; }) + return reply; +} -// return children of parent -// --- -- -- - - - -function childs_of_parents(list) { - // if 'list' is integer then make it an one-item list - parents = (Number.isInteger(list)) ? [ list ] : list; - - var childs = []; - - if (parents.length == 0) { return []; } - - parents.forEach( pid => { - categories.forEach( el => { if (el.parent == pid) childs.push(el.id)}); - }); +/** privilege(id) + * label of privilege with + * @param id (int) + */ +function privilege_(id) { + let reply = false; + privileges.forEach( pri => { if (pri.id == id) reply = pri.label; }); + return reply; +} - var grandchilds = childs_of_parents(childs); - return childs.concat(grandchilds); -} +//// return children of parent +//// --- -- -- - - - +//function childs_of_parents(list) { +// // if 'list' is integer then make it an one-item list +// parents = (Number.isInteger(list)) ? [ list ] : list; +// +// var childs = []; +// +// if (parents.length == 0) { return []; } +// +// parents.forEach( pid => { +// categories.forEach( el => { if (el.parent == pid) childs.push(el.id)}); +// }); +// +// var grandchilds = childs_of_parents(childs); +// +// return childs.concat(grandchilds); +//} // create actions html (edit and delete buttons) @@ -132,6 +149,7 @@ $(document).ready(function() { // ... $("#privilege_id").select2({ placeholder: 'Επίπεδο Πρόσβασης', + dropdownParent: $('#manageLessons'), width: '100%' }); @@ -168,7 +186,9 @@ $(document).ready(function() { id: parseInt(el.id), title: el.title, course_id: el.course_id, + course: course_(el.course_id), privilege_id: el.privilege_id, + privilege: privilege_(el.privilege_id), actions: create_actions_html(el) }); }); @@ -188,8 +208,8 @@ $(document).ready(function() { columns: [ { data: 'id' }, { data: 'title' }, - { data: 'course_id' }, - { data: 'privilege_id' }, + { data: 'course' }, + { data: 'privilege' }, { data: 'actions' } ] }); @@ -269,89 +289,47 @@ $(document).ready(function() { * ... prepare the manage-category form * ... update select2 with possible parents */ - $('#manageCategory').on('show.bs.modal', event => { + $('#manageLesson').on('show.bs.modal', event => { var button = $(event.relatedTarget); // Button that triggered the modal var id = parseInt( button.data('id') ); // category_id from data-id // var modal = $(this); // modal object - // update modal literature - // --- - $('#manageCategory .modal-title').html( // modal title - (id) ? 'Ενημέρωση Κατηγορίας' : 'Δημιουργία Κατηγορίας' - ); - $('#manageCategory form input[name=id]').val( id ); // category id (hidden) - $('#manageCategory form input[name=label]').val( // category label - (id) ? category_record(id).label : "" - ); - prepare_parents_element(id); // prepare for parents }) -// /** prepare_parents_element() -// * --- -// * @param id (int) : id of selected category -// * -> Get all posible parents -// * -> call set_parent_options() to render the options -// */ -// function prepare_parents_element(id) { -// var parents = []; -// -// if (id) { // get all possible parents -// -// // id-category and subcategories are fobiden parents -// var forbiden = childs_of_parents(id); -// forbiden.push(id); -// -// // filter catogories adn prepare parents -// categories.forEach( el => { -// if (!forbiden.includes(el.id)) { -// parents.push({ -// id: el.id, -// breadcrumb: el.breadcrumb, -// }); -// } -// }); -// set_parent_options(parents, category_record(id).parent); -// -// -// } else { // new record; all categories are possible parrents -// categories.forEach( el => { -// parents.push({ -// id: el.id, -// breadcrumb: el.breadcrumb, -// }); -// }) -// set_parent_options(parents, -1); -// } -// } /** set_parent_options() + * * -> create options for parents should be a select2 control + * * @param parents (array): array of parents * @param selected (int): selected parent */ - function set_select_options(parents, selected) { - // sort parents by breadcrumb - parents.sort( compare_breadcrumb ); + function set_parent_options(selector, list, selected_value = false) { - // remove any olded options from select2 - $('#parent_id option').each(function() { $(this).remove(); }); - - // first option is the root category - $('#parent_id').append('') - - // add all other parent options - parents.forEach( i => { - $('#parent_id').append(``); - }); - - if (selected == -1) { // new category; remove any parent pre-selection - $('#parent_id').val(null).trigger('change'); - - } else { // category exists; choose selected parent - $('#parent_id').val(selected).trigger('change'); + list.forEach( li => { // attach options into