From ca481d2b919e8ac42a2aecd35611e46e4541ff18 Mon Sep 17 00:00:00 2001 From: Ro Date: Thu, 1 Oct 2020 13:53:44 -0700 Subject: [PATCH] added notification for adding images in post editor, added animation to working icon --- brain/views/frame.pug | 5 +++-- src/com/controllers/PageEditor.js | 3 +++ src/styles/main/_structure.sass | 17 ++++++++++++++++- 3 files changed, 22 insertions(+), 3 deletions(-) diff --git a/brain/views/frame.pug b/brain/views/frame.pug index e72b6c8..e137b12 100644 --- a/brain/views/frame.pug +++ b/brain/views/frame.pug @@ -21,8 +21,9 @@ html(xmlns='http://www.w3.org/1999/xhtml', lang='en', xml:lang="en") svg(viewBox="0 0 20 20" class="icons") use#submit-update(xlink:href='/assets/images/global/sprite.svg#entypo-emoji-sad') .notify-icon#notify-working - svg(viewBox="0 0 20 20" class="icons") - use#submit-update(xlink:href='/assets/images/global/sprite.svg#entypo-cog') + #notify-working-box + svg(viewBox="0 0 20 20" class="icons") + use#submit-update(xlink:href='/assets/images/global/sprite.svg#entypo-cog') p#message-text This is a message .main-container#main-content section#dash-index-content diff --git a/src/com/controllers/PageEditor.js b/src/com/controllers/PageEditor.js index be4e7fb..89baabd 100644 --- a/src/com/controllers/PageEditor.js +++ b/src/com/controllers/PageEditor.js @@ -225,13 +225,16 @@ export default class PostEditor { } handleImageUpload(type, files) { let self = this; + notify.alert('Uploading Image', null); admin .imageUpload(type, files) .then(r => { if (r.type == DataEvent.POST_IMAGE_ADDED) self.editor.notify(EditorEvent.EDITOR_UPLOAD_POST_IMAGE, r.url); + notify.alert('Image Added to Entry', true); }) .catch(() => { + notify.alert('Uh oh. Image not added', false); //console.log('ERROR', err); }); } diff --git a/src/styles/main/_structure.sass b/src/styles/main/_structure.sass index 46ddc0a..9fcf94b 100644 --- a/src/styles/main/_structure.sass +++ b/src/styles/main/_structure.sass @@ -42,7 +42,22 @@ svg.icons transform: rotateX(-120deg) transform-origin: 50% 0 #notify-good, #notify-lame, #notify-working - display: none + display: block + #notify-working-box + -webkit-animation: spin 2s linear infinite + -moz-animation: spin 2s linear infinite + animation: spin 2s linear infinite + @-moz-keyframes spin + 100% + -moz-transform: rotate(360deg) + @-webkit-keyframes spin + 100% + -webkit-transform: rotate(360deg) + @keyframes spin + 100% + -webkit-transform: rotate(360deg) + transform: rotate(360deg) + .notify-icon background: $black padding: 8px 5px 5px 5px