diff --git a/ZpcBulletinBoard/Pages/BoardsLinks/Index.cshtml b/ZpcBulletinBoard/Pages/BoardsLinks/Index.cshtml index b1c3774..7881179 100644 --- a/ZpcBulletinBoard/Pages/BoardsLinks/Index.cshtml +++ b/ZpcBulletinBoard/Pages/BoardsLinks/Index.cshtml @@ -51,8 +51,8 @@ page image @tmpPage.Name
- - + @* *@ +
} diff --git a/ZpcBulletinBoard/Pages/BoardsLinks/Index.cshtml.cs b/ZpcBulletinBoard/Pages/BoardsLinks/Index.cshtml.cs index c2c3a26..04c0c1e 100644 --- a/ZpcBulletinBoard/Pages/BoardsLinks/Index.cshtml.cs +++ b/ZpcBulletinBoard/Pages/BoardsLinks/Index.cshtml.cs @@ -48,7 +48,7 @@ namespace ZpcBulletinBoard.Pages.BoardsLinks var order = 1; var links = context.BulletinBoardPageLinks.Where(x => x.IdBulletinBoardFk == idBoard).ToList(); if (links.Any()) - order = links.Max(x => x.IdLink) + 1; + order = links.Max(x => x.Order) + 1; var link = new BulletinBoardPageLink { @@ -68,5 +68,58 @@ namespace ZpcBulletinBoard.Pages.BoardsLinks return new JsonResult(new { successful = true, error = $"", link }); } + + public IActionResult OnPostSwapLinkOrder(int idLinkStart, int idLinkEnd) + { + var linkStart = context.BulletinBoardPageLinks.FirstOrDefault(x => x.IdLink == idLinkStart); + var linkEnd = context.BulletinBoardPageLinks.FirstOrDefault(x => x.IdLink == idLinkEnd); + + if (linkStart == null) + return new JsonResult(new { successful = false, error = $"Link with ID {idLinkStart} not exists!" }); + + if (linkEnd == null) + return new JsonResult(new { successful = false, error = $"Link with ID {idLinkEnd} not exists!" }); + + (linkStart.Order, linkEnd.Order) = (linkEnd.Order, linkStart.Order); + + context.SaveChanges(); + + return new JsonResult(new { successful = true, error = $"", linkStart, linkEnd }); + } + + public IActionResult OnPostLinkDuration(int idLink, int duration) + { + var link = context.BulletinBoardPageLinks.FirstOrDefault(x => x.IdLink == idLink); + + if (link == null) + return new JsonResult(new { successful = false, error = $"Link with ID {idLink} not exists!" }); + + link.Duration = duration; + + context.SaveChanges(); + + return new JsonResult(new { successful = true, error = $"", link }); + } + + //Delete + public IActionResult OnDeleteLink(int idLink) + { + var link = context.BulletinBoardPageLinks.FirstOrDefault(x => x.IdLink == idLink); + if (link == null) + return new JsonResult(new { successful = false, error = $"Link with ID {idLink} not exists!", link }); + + var links = context.BulletinBoardPageLinks + .Where(x => x.IdBulletinBoardFk == link.IdBulletinBoardFk && x.Order > link.Order).ToList(); + foreach (var tmpLink in links) + { + tmpLink.Order -= 1; + } + + context.BulletinBoardPageLinks.Remove(link); + + context.SaveChanges(); + + return new JsonResult(new { successful = true, error = $"", link }); + } } } diff --git a/ZpcBulletinBoard/Pages/Layouts/Partials/_LayoutSidenav.cshtml b/ZpcBulletinBoard/Pages/Layouts/Partials/_LayoutSidenav.cshtml index bed20ae..19f9dd6 100644 --- a/ZpcBulletinBoard/Pages/Layouts/Partials/_LayoutSidenav.cshtml +++ b/ZpcBulletinBoard/Pages/Layouts/Partials/_LayoutSidenav.cshtml @@ -16,13 +16,13 @@ \ No newline at end of file diff --git a/ZpcBulletinBoard/Pages/Pages/Index.cshtml b/ZpcBulletinBoard/Pages/Pages/Index.cshtml index 84af8f0..32b0fd4 100644 --- a/ZpcBulletinBoard/Pages/Pages/Index.cshtml +++ b/ZpcBulletinBoard/Pages/Pages/Index.cshtml @@ -7,19 +7,8 @@ } @section Styles { - - + + }

@@ -29,79 +18,14 @@ / Pregled

-
-
-
-
- - -
- - -
- -
-
-
-
+
- Seznam strani + Strani
- - - - - - - - - - - @foreach (var item in Model.Pages) - { - - - - - - - } - -
- @Html.DisplayNameFor(model => model.Pages[0].Name) - - @Html.DisplayNameFor(model => model.Pages[0].Type) - - @Html.DisplayNameFor(model => model.Pages[0].Ratio) -
- @Html.DisplayFor(modelItem => item.Name) - - @Html.DisplayFor(modelItem => item.Type) - - @Html.DisplayFor(modelItem => item.Ratio) - - - -
+
+ +
diff --git a/ZpcBulletinBoard/Pages/Pages/Index.cshtml.cs b/ZpcBulletinBoard/Pages/Pages/Index.cshtml.cs index 16545a2..ed6a769 100644 --- a/ZpcBulletinBoard/Pages/Pages/Index.cshtml.cs +++ b/ZpcBulletinBoard/Pages/Pages/Index.cshtml.cs @@ -16,17 +16,19 @@ namespace ZpcBulletinBoard.Pages.Pages [Authorize] public class IndexModel(ApplicationDbContext context, IWebHostEnvironment webHostEnvironment) : PageModel { - public IList Pages { get;set; } - public int OpenEditorForPage = 0; - public async Task OnGetAsync(int? openEditorForPage = null) + public void OnGet() { - OpenEditorForPage = openEditorForPage ?? 0; - Pages = await context.BulletinBoardPage.ToListAsync(); } //Get + public IActionResult OnGetPages() + { + var pages = context.BulletinBoardPage.ToList(); + return new JsonResult(new { successful = true, error = $"", pages }); + } + public IActionResult OnGetPage(int id) { var page = context.BulletinBoardPage.Include(x => x.Links) diff --git a/ZpcBulletinBoard/wwwroot/bulletin-board-images/pages/StaticImage_4.png b/ZpcBulletinBoard/wwwroot/bulletin-board-images/pages/StaticImage_4.png new file mode 100644 index 0000000..ce2ac77 Binary files /dev/null and b/ZpcBulletinBoard/wwwroot/bulletin-board-images/pages/StaticImage_4.png differ diff --git a/ZpcBulletinBoard/wwwroot/css/pages/index.css b/ZpcBulletinBoard/wwwroot/css/pages/index.css new file mode 100644 index 0000000..47d2b98 --- /dev/null +++ b/ZpcBulletinBoard/wwwroot/css/pages/index.css @@ -0,0 +1,38 @@ +.div-page { + float: left; + text-align: center; + width: 200px; + height: 230px; + border: 1px solid rgba(24, 28, 33, 0.06); + border-radius: 0.25rem; + margin-right: 5px; + margin-top: 5px; + margin-left: 10px; +} + +.div-page:hover { + cursor: grab; + /* background-color: rgba(24, 28, 33, 0.06); */ + border-color: blue; +} + +.page-active { + background-color: rgba(128, 171, 226, 0.5); +} + +.div-page > h5 { + margin-top: 5px; + margin-bottom: 2px; +} + +.div-page > i { + margin-top: 10px; +} + + +.img-thumbnail{ + height: 170px; + width: 170px; + margin-left: 15px; + margin-top: 5px; +} \ No newline at end of file diff --git a/ZpcBulletinBoard/wwwroot/js/boards-links/index.js b/ZpcBulletinBoard/wwwroot/js/boards-links/index.js index d23f941..818a140 100644 --- a/ZpcBulletinBoard/wwwroot/js/boards-links/index.js +++ b/ZpcBulletinBoard/wwwroot/js/boards-links/index.js @@ -47,26 +47,30 @@ function loadBoards(){ } function allowDropPage(ev) { - console.log('allowDrop'); - console.log({tmp: ev.dataTransfer}); - console.log({tmp2: ev.dataTransfer.getData("test")}); - if (ev.dataTransfer.getData("idPage")){ - ev.preventDefault(); - } - } - - function dragPage(ev, el) { - console.log('drag'); - ev.dataTransfer.setData("idPage", $(el).attr('data-id')); - ev.dataTransfer.setData("test",1); - - } - - function dropPage(ev, el) { - console.log('drop'); ev.preventDefault(); - let idPage = parseInt(ev.dataTransfer.getData("idPage")); + + // if (ev.dataTransfer.getData("idPage")){ + // ev.preventDefault(); + // } +} + +function dragPage(ev, el) { + $('.available-page[data-dragg="1"]').removeAttr('data-dragg'); + $(el).attr('data-dragg', '1'); +} + +function dropPage(ev, el) { + ev.preventDefault(); + let idPage = parseInt($('.available-page[data-dragg="1"]').attr('data-id')); + if (isNaN(idPage)){ + return; + } + $('.available-page[data-dragg="1"]').removeAttr('data-dragg'); let idBoard = parseInt($(el).attr('data-idboard')); + insertPageToBoard(idBoard, idPage); +} + +function insertPageToBoard(idBoard, idPage){ $.blockUI(); $.ajax({ type: "POST", @@ -93,20 +97,197 @@ function allowDropPage(ev) { alert(xhr.responseText); $.unblockUI(); } - }); - } + }); +} - function addPageToBoard(idBoard, link){ +function addPageToAllBoards(el){ + let idPage = parseInt($(el).parent().parent().attr('data-id')); + + $('.div-pages').each(function (i, e){ + let idBoard = parseInt($(e).attr('data-idboard')); + insertPageToBoard(idBoard, idPage); + }); +} + +function addPageToBoard(idBoard, link){ let div = $('.div-pages[data-idboard="' + idBoard + '"]'); - div.append(`
+ div.append(`
page image ${link.bulletinBoardPage.name}
- - - - + + + +
`); - } \ No newline at end of file +} + +function deleteLink(el){ + let idLink = parseInt($(el).parent().parent().attr('data-id')); + if (isNaN(idLink)){ + return; + } + + $.blockUI(); + $.ajax({ + type: "DELETE", + beforeSend: function(xhr) { + xhr.setRequestHeader("XSRF-TOKEN", + $('input:hidden[name="__RequestVerificationToken"]').val()); + }, + url: "/BoardsLinks/Index/?handler=Link", + data: { + idLink + }, + success: function(data) { + if (data.successful){ + $(el).parent().parent().remove(); + } else { + Swal.fire('Napaka', data.error, 'error'); + console.log(data); + } + $.unblockUI(); + }, + error: function (xhr, ajaxOptions, thrownError) { + console.log({xhr, ajaxOptions, thrownError}); + alert(xhr.responseText); + $.unblockUI(); + } + }); +} + +function moveLink(el, direction){ + let divStart = $(el).parent().parent(); + let idLinkStart = parseInt(divStart.attr('data-id')); + if (isNaN(idLinkStart)){ + return; + } + + let divEnd; + let idLinkEnd; + if (direction == -1){ + divEnd = divStart.prev(); + } else { + divEnd = divStart.next(); + } + + idLinkEnd = parseInt(divEnd.attr('data-id')); + + if (isNaN(idLinkEnd)){ + return; + } + + $.blockUI(); + $.ajax({ + type: "POST", + beforeSend: function(xhr) { + xhr.setRequestHeader("XSRF-TOKEN", + $('input:hidden[name="__RequestVerificationToken"]').val()); + }, + url: "/BoardsLinks/Index/?handler=SwapLinkOrder", + data: { + idLinkStart, + idLinkEnd + }, + success: function(data) { + if (data.successful){ + if (direction == -1){ + divStart.insertBefore(divEnd); + } else { + divStart.insertAfter(divEnd); + } + } else { + Swal.fire('Napaka', data.error, 'error'); + console.log(data); + } + $.unblockUI(); + }, + error: function (xhr, ajaxOptions, thrownError) { + console.log({xhr, ajaxOptions, thrownError}); + alert(xhr.responseText); + $.unblockUI(); + } + }); +} + +function setDuration(el){ + let div = $(el).parent().parent(); + let idLink = parseInt(div.attr('data-id')); + if (isNaN(idLink)){ + return; + } + let step = 5; + let duration = div.attr('data-duration'); + Swal.fire({ + title: 'Trajanje [s]', + html: ` + `, + input: 'range', + inputValue: duration, + inputAttributes: { + min: '5', + max: '3600', + step: step.toString(), + }, + confirmButtonText: 'Potrdi', + cancelButtonText: 'Prekliči', + showCancelButton: true, + didOpen: () => { + const inputRange = Swal.getInput(); + const inputNumber = Swal.getPopup().querySelector('#range-value'); + + // remove default output + Swal.getPopup().querySelector('output').style.display = 'none' + inputRange.style.width = '100%' + + // sync input[type=number] with input[type=range] + inputRange.addEventListener('input', () => { + inputNumber.value = inputRange.value + }) + + // sync input[type=range] with input[type=number] + inputNumber.addEventListener('change', () => { + inputRange.value = inputNumber.value + }) + }, + }).then((result) => { + console.log(result); + if (result.isConfirmed) { + let newDuration = parseInt(result.value); + $.blockUI(); + $.ajax({ + type: "POST", + beforeSend: function(xhr) { + xhr.setRequestHeader("XSRF-TOKEN", + $('input:hidden[name="__RequestVerificationToken"]').val()); + }, + url: "/BoardsLinks/Index/?handler=LinkDuration", + data: { + idLink, + duration: newDuration + }, + success: function(data) { + if (data.successful){ + div.attr('data-duration', data.link.duration); + } else { + Swal.fire('Napaka', data.error, 'error'); + console.log(data); + } + $.unblockUI(); + }, + error: function (xhr, ajaxOptions, thrownError) { + console.log({xhr, ajaxOptions, thrownError}); + alert(xhr.responseText); + $.unblockUI(); + } + }); + } + }); +} \ No newline at end of file diff --git a/ZpcBulletinBoard/wwwroot/js/pages/index.js b/ZpcBulletinBoard/wwwroot/js/pages/index.js index 8180b85..166502f 100644 --- a/ZpcBulletinBoard/wwwroot/js/pages/index.js +++ b/ZpcBulletinBoard/wwwroot/js/pages/index.js @@ -4,16 +4,61 @@ $(function(){ $('#inpOpenEditorForPage').val(0); openEditor(openEditorForPage); } - $('[data-toggle="tooltip"]').tooltip(); + loadPages(); }); +function loadPages(){ + $.blockUI(); + $.ajax({ + type: "GET", + url: "/Pages/Index/?handler=Pages", + data: { + }, + success: function (data) { + if (data.successful){ + let pageContent = $('.div-pages'); + pageContent.empty(); + + if (data.pages){ + data.pages.forEach((page) => { + addPageToDiv(page); + }); + } + } else { + Swal.fire('Napaka', data.error, 'error'); + console.log(data); + } + $.unblockUI(); + }, + error: function (xhr, ajaxOptions, thrownError) { + console.log(xhr); + alert(xhr.responseText); + $.unblockUI(); + } + }); +} + +function addPageToDiv(page){ + let element = $(`
+ page image + ${page.name} +
+ + + +
+
`); + $('.div-pages').append(element); + + element.find('[data-toggle="tooltip"]').tooltip(); +} + function openModalAddPage(){ $('#inpModalAddEditPageIdPage').val(0); $('#inpModalAddEditPageName').val(''); $('#divModalAddEditPage').modal('show'); } - function openModalEditPage(el){ let idBulletinBoardPage = parseInt($(el).parent().parent().attr('data-id')); if (isNaN(idBulletinBoardPage)){ @@ -105,7 +150,7 @@ function saveModalAddEditPage(){ }); } -function rowOpenEditor(el){ +function pageOpenEditor(el){ openEditor(parseInt($(el).parent().parent().attr('data-id'))); }