added notification for adding images in post editor, added animation to working icon

This commit is contained in:
Ro 2020-10-01 13:53:44 -07:00
parent fdde954822
commit ca481d2b91
3 changed files with 22 additions and 3 deletions

View file

@ -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") svg(viewBox="0 0 20 20" class="icons")
use#submit-update(xlink:href='/assets/images/global/sprite.svg#entypo-emoji-sad') use#submit-update(xlink:href='/assets/images/global/sprite.svg#entypo-emoji-sad')
.notify-icon#notify-working .notify-icon#notify-working
svg(viewBox="0 0 20 20" class="icons") #notify-working-box
use#submit-update(xlink:href='/assets/images/global/sprite.svg#entypo-cog') 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 p#message-text This is a message
.main-container#main-content .main-container#main-content
section#dash-index-content section#dash-index-content

View file

@ -225,13 +225,16 @@ export default class PostEditor {
} }
handleImageUpload(type, files) { handleImageUpload(type, files) {
let self = this; let self = this;
notify.alert('Uploading Image', null);
admin admin
.imageUpload(type, files) .imageUpload(type, files)
.then(r => { .then(r => {
if (r.type == DataEvent.POST_IMAGE_ADDED) if (r.type == DataEvent.POST_IMAGE_ADDED)
self.editor.notify(EditorEvent.EDITOR_UPLOAD_POST_IMAGE, r.url); self.editor.notify(EditorEvent.EDITOR_UPLOAD_POST_IMAGE, r.url);
notify.alert('Image Added to Entry', true);
}) })
.catch(() => { .catch(() => {
notify.alert('Uh oh. Image not added', false);
//console.log('ERROR', err); //console.log('ERROR', err);
}); });
} }

View file

@ -42,7 +42,22 @@ svg.icons
transform: rotateX(-120deg) transform: rotateX(-120deg)
transform-origin: 50% 0 transform-origin: 50% 0
#notify-good, #notify-lame, #notify-working #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 .notify-icon
background: $black background: $black
padding: 8px 5px 5px 5px padding: 8px 5px 5px 5px