editor

ZpcBulletinBoard/wwwroot/css/editor/editor-main.css

@@ -51,3 +51,36 @@
 .input-hidden {
     display: none;
 }
+
+.div-pages {
+    margin: 5px;
+    height: 50px;
+}
+
+.div-pages > div {
+    float: left;
+    text-align: center;
+    width: 100px;
+    height: 50px;
+    border:1px solid rgba(24, 28, 33, 0.06);
+    border-radius: 0.25rem;
+    margin-right: 5px;
+}
+
+.div-pages > div:hover {
+    cursor: pointer;
+    background-color: rgba(24, 28, 33, 0.06);
+}
+
+.page-active {
+    background-color: rgba(128, 171, 226, 0.5);
+}
+
+.div-pages > div > h5 {
+    margin-top: 5px;
+    margin-bottom: 2px;
+}
+
+.div-pages > div > i {
+    margin-top: 10px;
+}

ZpcBulletinBoard/wwwroot/js/editor/edit-main.js

@@ -128,6 +128,8 @@ function loadBoard(id){
         },
         success: function (data) {
             if (data.successful){
+                $('#lblBoardName').text(data.board.name);
+                $('#lblBoardName').attr('data-idboard', data.board.idBulletinBoard);
                 let placeholder = $('#divPlaceholder');
                 placeholder.empty();
                 console.log(data);
@@ -142,10 +144,15 @@ function loadBoard(id){
                     'background-color': 'white',
                     'padding': '5px'
                 });
-                loadNotes();
+                $('[data-idpage]').remove();
+                if (data.board.pages){
+                    data.board.pages.forEach(element => {
+                        boardAddPage(element);
+                    });
+                }
             } else {
                 console.log(data);
-                alert(data);
+                alert(data); //TODO swal
             }
             $.unblockUI();
         },
@@ -157,3 +164,115 @@ function loadBoard(id){
     });
 }
 
+function openModalBoardAddNewPage(){
+    $('#titleModalAddEditPage').html('Dodaj list');
+    $('#inpModalAddEditPageName').val('');
+    $('#inpModalAddEditPageId').val(0);
+    $('#inpModalAddEditPageDuration').val('30');
+    $('#divModalAddEditPage').modal('show');
+}
+
+function openModalBoardEditPage(id){
+    $('#titleModalAddEditPage').html('Uredi list');
+    $.blockUI();
+    $.ajax({
+        type: "GET",
+        url: "/Editor/EditMain/?handler=Page",
+        data: {
+            id
+        },
+        success: function (data) {
+            if (data.successful){
+                $('#inpModalAddEditPageId').val(data.page.idBulletinBoardPage);
+                $('#inpModalAddEditPageName').val(data.page.name);
+                $('#inpModalAddEditPageDuration').val(data.page.duration);
+                $('#divModalAddEditPage').modal('show');
+                
+            } else {
+                console.log(data);
+                alert(data); //TODO swal
+            }
+            $.unblockUI();
+        },
+        error: function (xhr, ajaxOptions, thrownError) {
+            console.log(xhr);
+            alert(xhr.responseText);
+            $.unblockUI();
+        }
+    });
+}
+
+function boardAddNewPage(){
+    let idBulletinBoardPage = parseInt($('#inpModalAddEditPageId').val());
+    let name = $('#inpModalAddEditPageName').val();
+    let duration = parseInt($('#inpModalAddEditPageDuration').val());
+    let idBulletinBoard = parseInt($('#lblBoardName').attr('data-idboard'));
+    if (name === ''){
+        //TODO Swall
+        return;
+    }
+
+    if (isNaN(duration)){
+        //TODO swall
+        return;
+    }
+
+    if (isNaN(idBulletinBoard)){
+        return;
+    }
+
+    $.blockUI();
+    $.ajax({
+        type: "POST",
+        beforeSend: function(xhr) {
+            xhr.setRequestHeader("XSRF-TOKEN",
+                $('input:hidden[name="__RequestVerificationToken"]').val());
+        },
+        url: "EditMain/?handler=BoardPage",
+        data: { page : {
+            name,
+            duration,
+            idBulletinBoard,
+            idBulletinBoardPage
+        } },
+        success: function(data) {
+            if (data.successful){
+                boardAddPage(data.page);
+                selectPage(data.page.idBulletinBoardPage);
+                $('#divModalAddEditPage').modal('hide');
+            } else {
+                alert(data.error);
+                //TODO swall
+            }
+            $.unblockUI();
+        },
+        error: function (xhr, ajaxOptions, thrownError) {
+            alert(xhr.responseText);
+            $.unblockUI();
+        }
+    });
+}
+
+function boardAddPage(page){
+    let element = $(`<div data-idpage='${page.idBulletinBoardPage}'>
+    <h5>${page.name}</h5>
+    <small>${page.duration} sekund</small>
+</div>`);
+    element.insertBefore(".add-page");
+    element.on('click', function (){
+        let id = parseInt($(this).attr('data-idpage'));
+        selectPage(id);
+    });
+    element.on('dblclick', function (){
+        let id = parseInt($(this).attr('data-idpage'));
+        openModalBoardEditPage(id);
+    });
+}
+
+function selectPage(id){
+    $('[data-idpage]').removeClass('page-active');
+    $('[data-idpage="' + id + '"]').addClass('page-active');
+}
+
+
+