From fcca7357bc05889d97b0d3b53cba576c90fa27a5 Mon Sep 17 00:00:00 2001 From: Ro Date: Fri, 24 Mar 2023 14:57:01 -0700 Subject: [PATCH] Fixes for removing media items and page deletion The upload process changed, so some tweaks needed to me made to the page deletion process, which just marks the page as deleted but keeps the file. Also updated the file manager to properly delete items from the display list. The css for page listings also had to updated [forgot to put that on the list] so the styles for that were updated and the template pages adjusted accordingnly. Also forgot to mention changes to the notification display in the last commit. It's basic as of right now but it will be enhanced as needed. --- brain/views/dash/book.twig | 149 ++++++++++++--------------- brain/views/dash/partials/index.twig | 3 +- public/assets/css/dash/book.css | 116 +++++++++++++++++++++ public/assets/css/dash/frame.css | 6 +- public/assets/css/dash/index.css | 10 ++ public/assets/css/dash/start.css | 1 + public/assets/scripts/Start.js | 19 ++-- src/com/controllers/PageEditor.js | 4 +- src/com/ui/FileManager.js | 18 +--- 9 files changed, 206 insertions(+), 120 deletions(-) create mode 100644 public/assets/css/dash/book.css diff --git a/brain/views/dash/book.twig b/brain/views/dash/book.twig index 28b6a70..4b06ba0 100644 --- a/brain/views/dash/book.twig +++ b/brain/views/dash/book.twig @@ -5,95 +5,76 @@ {% endblock %} {% block stylesheets %} - + {% endblock %} {% block mainContent %} -
-
-
-
- {{ filter }} - Pages -
-
- - - - - - - - - -
+
+
+ {{ filter }} + Pages +
+
+
+ {% for page in pages %} + {% if page.media[0].type == 'mp4' %} + +
+
-
-
- {% endblock %} + {% endfor %} + {% if numOfPages > 1 %} +
+ + + + + {{ currentPage }} + of + {{ numOfPages }} + + + + +
+ {% endif %} + + + {% endblock %} diff --git a/brain/views/dash/partials/index.twig b/brain/views/dash/partials/index.twig index d31d633..61b1576 100644 --- a/brain/views/dash/partials/index.twig +++ b/brain/views/dash/partials/index.twig @@ -26,13 +26,12 @@ {% if page.media[0].type == 'mp4' %} + {{ include("dash/partials/recent-meta.twig") }} - - {{ include("dash/partials/recent-meta.twig") }} {% else %} diff --git a/public/assets/css/dash/book.css b/public/assets/css/dash/book.css new file mode 100644 index 0000000..714b9fd --- /dev/null +++ b/public/assets/css/dash/book.css @@ -0,0 +1,116 @@ +section[role="book-index-header"] { + display: grid; + grid-template-columns: 1fr 1fr; + margin: 100px auto 20px; + width: 100%; + max-width: 900px; +} + +section[role="book-index-header"] > div[role="book-index-header-left"] { + text-transform: capitalize; + display: inline-block; + color: var(--white); + font-size: 3em; +} + +section[role="book-index-header"] > div[role="book-index-header-right"] { + text-align: right; + display: inline-block; +} + +section[role="book-index-pages"] { + margin: 0 auto; + width: 100%; + max-width: 900px; +} + +section[role="book-index-pages"] > a.page-link { + vertical-align: top; + display: inline-block; + width: 100%; + text-decoration: none; + margin: 0 0 20px; + border-radius: 3px; + height: 350px; + overflow: hidden; +} + +section[role="book-index-pages"] > a.page-link div.page-video { + width: 100%; + height: 350px; + display: flex; + justify-content: left; + align-items: center; + border-radius: 5px; + border-bottom: none; + position: relative; +} + +section[role="book-index-pages"] > a.page-link video { + width: 100%; + height: 100%; + position: absolute; + object-fit: cover; +} + +section[role="book-index-pages"] > a.page-link > div.page-bg { + width: 100%; + height: 350px; + display: flex; + justify-content: left; + align-items: center; + border-radius: 5px; + border-bottom: none; + position: relative; +} + +section[role="book-index-pages"] aside { + font-size: 1.1em; + color: var(--white); + text-shadow: 2px 2px 2px var(--black); + padding: 10px; + position: relative; +} + +section[role="book-index-pages"] hr { + color: var(--white); + border: 0.1px solid; + margin: 7px 0; +} + +section[role="book-index-pages"] button[data-active="true"] { + background: var(--primary); +} + +section[role="book-index-pages"] button[data-active="true"] svg { + fill: var(--tertiary); +} + +section[role="book-index-pages"] button[data-active="false"] { + background: var(--secondary); +} + +section[role="book-index-pages"] button[data-active="false"] svg { + fill: var(--primary); +} + +section[role="book-index-pages"] > div[role="paginate"] { + width: fit-content; + margin: 0 auto; + font-size: 1.5em; + color: var(--highlight); +} + +section[role="book-index-pages"] > div[role="paginate"] i { + color: var(--secondary); +} + +section[role="book-index-pages"] > div[role="paginate"] a, +section[role="book-index-pages"] > div[role="paginate"] span { + display: inline; +} + +section[role="book-index-pages"] > div[role="paginate"] span { + position: relative; + top: -15px; +} diff --git a/public/assets/css/dash/frame.css b/public/assets/css/dash/frame.css index 7b7f74b..0b52d07 100644 --- a/public/assets/css/dash/frame.css +++ b/public/assets/css/dash/frame.css @@ -20,14 +20,10 @@ html body { a { color: var(--primary); text-decoration: none; - border-bottom: 1px solid var(--secondary); + border-bottom: 0; transition: all 0.2s linear; } -a:hover { - border-bottom: 1px solid var(--highlight); -} - sup { background: var(--black); color: var(--white); diff --git a/public/assets/css/dash/index.css b/public/assets/css/dash/index.css index 6940596..005d131 100644 --- a/public/assets/css/dash/index.css +++ b/public/assets/css/dash/index.css @@ -14,6 +14,15 @@ section[role="index-recent-pages"] a { align-items: center; border-radius: 5px; border-bottom: none; + position: relative; +} + +section[role="index-recent-pages"] a video { + width: 100%; + position: absolute; + object-fit: cover; + height: 100%; + border-radius: 5px; } section[role="index-recent-pages"] a:nth-child(1) { @@ -76,6 +85,7 @@ section[role="index-recent-pages"] aside { color: var(--white); text-shadow: 2px 2px 2px var(--black); padding: 10px; + z-index: 10; } section[role="index-recent-pages"] hr { diff --git a/public/assets/css/dash/start.css b/public/assets/css/dash/start.css index cdd6c0a..88b05da 100644 --- a/public/assets/css/dash/start.css +++ b/public/assets/css/dash/start.css @@ -5,5 +5,6 @@ @import url("icons.css"); @import url("notifications.css"); @import url("index.css"); +@import url("book.css"); @import url("page-editor.css"); @import url("page-editor-highlights.css"); diff --git a/public/assets/scripts/Start.js b/public/assets/scripts/Start.js index 930fa9a..fda7840 100644 --- a/public/assets/scripts/Start.js +++ b/public/assets/scripts/Start.js @@ -6954,25 +6954,18 @@ class $832f4be7bc001332$export$2e2bcd8739ae039 { // event handlers //-------------------------- removeFile(e) { - var list = []; - switch(e.target.parentNode.className){ + var item = e.target.parentNode.parentNode; + switch(item.className){ case "img-item": case "video-item": - list = this.imageList; + this.imageList.removeChild(item); break; case "audio-item": case "file-item": - list = this.fileList; + this.fileList.removeChild(item); break; } - for(let index = 0; index < list.childNodes.length; index++){ - let media = list.childNodes[index]; - if (media.id == e.target.id) { - list.removeChild(media); - $832f4be7bc001332$var$notify.alert("REINDEXING MEDIA", null); - //this.updateFiles(); - } - } + $832f4be7bc001332$var$notify.alert("File Removed!", true); } handleFileActions(e) { e.stopPropagation(); @@ -7104,7 +7097,7 @@ class $371d2518d50c1748$export$2e2bcd8739ae039 { $371d2518d50c1748$var$notify.alert("Index cannot be deleted", false); return; } - if (confirm("AYE! You know you're deleting this post, right?")) new (0, $de01a7e5b1773530$export$2e2bcd8739ae039)().collectInfo(document.getElementById("featured-image-upload").files[0]).then((page)=>{ + if (confirm("AYE! You know you're deleting this post, right?")) new (0, $de01a7e5b1773530$export$2e2bcd8739ae039)().collectInfo(this.fm.getFileOrder()).then((page)=>{ self.processing = true; this.admin.pageActions((0, $cbea55afea03b976$export$f9aea0c55bfa15c9), page).then(()=>{ self.processing = false; diff --git a/src/com/controllers/PageEditor.js b/src/com/controllers/PageEditor.js index 714933d..098fc88 100644 --- a/src/com/controllers/PageEditor.js +++ b/src/com/controllers/PageEditor.js @@ -177,9 +177,7 @@ export default class PostEditor { } if (confirm("AYE! You know you're deleting this post, right?")) { new PageActions() - .collectInfo( - document.getElementById('featured-image-upload').files[0] - ) + .collectInfo(this.fm.getFileOrder()) .then(page => { self.processing = true; this.admin diff --git a/src/com/ui/FileManager.js b/src/com/ui/FileManager.js index efc7de1..8f78dcc 100644 --- a/src/com/ui/FileManager.js +++ b/src/com/ui/FileManager.js @@ -249,26 +249,18 @@ export default class FileManager { // event handlers //-------------------------- removeFile(e) { - var list = []; - switch (e.target.parentNode.className) { + var item = e.target.parentNode.parentNode; + switch (item.className) { case 'img-item': case 'video-item': - list = this.imageList; - + this.imageList.removeChild(item); break; case 'audio-item': case 'file-item': - list = this.fileList; + this.fileList.removeChild(item); break; } - for (let index = 0; index < list.childNodes.length; index++) { - let media = list.childNodes[index]; - if (media.id == e.target.id) { - list.removeChild(media); - notify.alert('REINDEXING MEDIA', null); - //this.updateFiles(); - } - } + notify.alert('File Removed!', true); } handleFileActions(e) {