v1.3.2

Author: ctf0

README.md

@@ -159,9 +159,9 @@ return [
 - install dependencies
 
 ```bash
-yarn add vue dropzone keycode vue-tippy vue2-filters vuemit
+yarn add vue dropzone keycode vue-tippy vue2-filters vuemit vue-notif
 # or
-npm install vue dropzone keycode vue-tippy vue2-filters vuemit
+npm install vue dropzone keycode vue-tippy vue2-filters vuemit vue-notif --save
 ```
 
 - for styling we use ***bulma***

logs/v1.3.0.txt

@@ -0,0 +1,9 @@
+- remove jquery.scrollTo
+- fix notif not showing up
+- now using any of the shortcuts dont scroll the window
+- make sure the shortcuts used with more than element dont run twice
+- clean styles
+- remove notif-comp file and use the npm package instead
+- some cosmetics for the manager
+- update view
+- update assets

logs/v1.3.2.txt

@@ -127,16 +127,22 @@ export default {
                         if (!this.lightBoxIsActive()) {
                             // when no bulk selecting
                             if (!this.isBulkSelecting()) {
+
                                 let cur = ''
                                 let newSelected = ''
+                                let index = ''
 
                                 if ((keycode(e) == 'left' || keycode(e) == 'up') && curSelected !== 0) {
+                                    e.preventDefault()
+
                                     newSelected = curSelected - 1
                                     cur = $('div[data-index="' + newSelected + '"]')
                                     this.scrollToFile(cur)
                                 }
 
                                 if ((keycode(e) == 'right' || keycode(e) == 'down') && curSelected < this.allItemsCount - 1) {
+                                    e.preventDefault()
+
                                     newSelected = curSelected + 1
                                     cur = $('div[data-index="' + newSelected + '"]')
                                     this.scrollToFile(cur)
@@ -149,7 +155,7 @@ export default {
 
                                 // go up a dir
                                 if (keycode(e) == 'backspace') {
-                                    let index = parseInt(this.folders.length) - 1
+                                    index = parseInt(this.folders.length) - 1
 
                                     if (index < 0) {
                                         return false
@@ -161,11 +167,15 @@ export default {
                                 // go to first / last item
                                 if (this.allItemsCount) {
                                     if (keycode(e) == 'home') {
+                                        e.preventDefault()
+
                                         this.scrollToFile()
                                     }
 
                                     if (keycode(e) == 'end') {
-                                        let index = this.allItemsCount - 1
+                                        e.preventDefault()
+
+                                        index = this.allItemsCount - 1
                                         cur = $('div[data-index="' + index + '"]')
                                         this.scrollToFile(cur)
                                     }
@@ -178,7 +188,6 @@ export default {
 
                                 // play-pause for media
                                 if (keycode(e) == 'space' && e.target == document.body) {
-                                    // prevent body from scrolling
                                     e.preventDefault()
 
                                     if (this.selectedFileIs('video') || this.selectedFileIs('audio')) {
@@ -239,6 +248,7 @@ export default {
                 // when modal is visible
                 else {
                     if (keycode(e) == 'enter') {
+                        e.preventDefault()
                         $('.modal.is-active').find('.submit').trigger('click')
                     }
 
@@ -354,7 +364,7 @@ export default {
 
             // upload
             $('#upload').click(() => {
-                $('#new-upload').fadeToggle('fast')
+                $('#dz').fadeToggle('fast')
             })
 
             // delete

src/resources/assets/js/components/bulma/media.vue

@@ -53,12 +53,16 @@ export default {
                 file = $('div[data-index="0"]')
             }
 
-            $(file).trigger('click')
+            let container = $('#left')
+            let offset = parseInt(container.css('padding-top')) + parseInt(file.css('margin-top'))
 
-            $('#left').scrollTo($(file), 0, {
-                margin: true,
-                offset: -8
-            })
+            file.trigger('click')
+            file[0].scrollIntoView(false)
+
+            // respect container & file offset when scrolling
+            if (file[0].offsetTop > container.height()) {
+                container[0].scrollTop += offset
+            }
         }
     }
 }

src/resources/assets/js/components/bulma/mixins/methods/selected.js

@@ -11,7 +11,7 @@ export default {
                 title: data.title,
                 body: data.body,
                 type: data.type,
-                duration: data.duration !== undefined ? data.duration : null
+                duration: data.duration !== undefined ? data.duration : undefined
             })
         },
         checkForFolders() {

src/resources/assets/js/components/bulma/mixins/methods/utils.js

@@ -15,7 +15,7 @@ Vue.use(require('vue2-filters'))
 
 /*                Components                */
 Vue.component('MediaManager', require('./components/' + process.env.MIX_MM_FRAMEWORK + '/media.vue'))
-Vue.component('MyNotification', require('./components/' + process.env.MIX_MM_FRAMEWORK + '/notifs.vue'))
+Vue.component('MyNotification', require('vue-notif'))
 
 /*                Events                */
 require('./events')

src/resources/assets/js/components/bulma/notifs.vue

@@ -64,20 +64,11 @@ table,
     }
 }
 
-.level {
-    margin-bottom: 0.75rem !important;
-}
-
 .modal.is-active {
     padding-top: 3%;
     align-items: start;
 }
 
-#img_modal {
-    padding: 0;
-    align-items: center;
-}
-
 .modal-card-foot {
     background-color: white;
     justify-content: flex-end;

src/resources/assets/js/media.js

@@ -1,6 +1,5 @@
 .progress {
     height: 1rem;
-    margin-bottom: 20px;
     overflow: hidden;
     background-color: #f5f5f5;
     border-radius: 4px;