:bug: fixed block flag for gallery

vue-theme/src/pages/list.vue

@@ -28,6 +28,8 @@
 import { mapGetters } from 'vuex'
 import sidebar from '@/components/sidebars/sidebar'
 
+import { convertTitleCase, typeFromRoute } from '@/utils/helpers'
+
 export default {
     props: {
         sidebar: {
@@ -37,9 +39,7 @@ export default {
             type: String
         }
     },
-    components: {
-        sidebar: sidebar
-    },
+    components: { sidebar },
     computed: {
         ...mapGetters({
             allPages: 'allPages',
@@ -54,19 +54,11 @@ export default {
             allEpisodes: 'allEpisodes',
             allEpisodesLoaded: 'allEpisodesLoaded',
         }),
-        allLoaded() {
-            const flags = []
-            flags.push(this.allPagesLoaded)
-            flags.push(this.allPostsLoaded)
-            flags.push(this.allArtistsLoaded)
-            flags.push(this.allEpisodesLoaded)
-            return flags.every(Boolean)
-        },
         type() { // Checks for type and fixes Episodes route edge case 
-            return this.$route.params.type ? this.$route.params.type : this.$route.fullPath.slice(1)
+            return typeFromRoute(this.$route)
         },
         posts() {
-            let type = this.convertTitleCase(this.type)
+            let type = convertTitleCase(this.type)
             
             // We're override the API to sort by date
             // because items are returned by ID
@@ -79,20 +71,9 @@ export default {
             return this.sortBy ? this[`all${type}`] : sortedByRecent
         },
     },
-    methods: {
-        convertTitleCase(type) {
-            return type.charAt(0).toUpperCase() + type.slice(1)
-        }
-    },
-    created() {
-        let type = this.convertTitleCase(this.type)
-        
-        this.$store.dispatch(`getAll${type}`, this.sortBy)
-        this.$store.commit('SET_HERO', type)
-    },
     watch: {
         $route(to, from){
-            let type = this.convertTitleCase(to.path.slice(1))
+            let type = convertTitleCase(to.path.slice(1))
 
             // Accounts for the sort-by in URL case 
             let dispatchName = this.sortBy ? `getAll${type.split('/')[0]}` : `getAll${type}`
@@ -102,6 +83,12 @@ export default {
                 this.$store.commit('SET_HERO', type)
             }
         }
+    },
+    created() {
+        let type = convertTitleCase(this.type)
+        
+        this.$store.dispatch(`getAll${type}`, this.sortBy)
+        this.$store.commit('SET_HERO', type)
     }
 }
 </script>

vue-theme/src/pages/single.vue

@@ -19,16 +19,15 @@ import { mapGetters } from 'vuex'
 import sidebar from '@/components/sidebars/sidebar'
 import gallery from '@/components/gallery/'
 
+import { convertTitleCase, typeFromRoute } from '@/utils/helpers'
+
 export default {
     props: {
         sidebar: {
             type: Boolean
         }
     },
-    components: {
-        sidebar: sidebar,
-        gallery: gallery
-    },
+    components: { sidebar, gallery },
     data() {
         return {
             images: [], 
@@ -58,10 +57,10 @@ export default {
             return flags.every(Boolean)
         },
         type() { // Checks for type and fixes Episodes route edge case 
-            return this.$route.params.type ? this.$route.params.type : this.$route.fullPath.slice(1)
+            return typeFromRoute(this.$route)
         },
         posts() {
-            let type = this.convertTitleCase(this.type)
+            let type = convertTitleCase(this.type)
             
             if(!type) return []
             
@@ -73,38 +72,33 @@ export default {
         }
     },
     methods: {
-        convertTitleCase(type) {
-            return type.charAt(0).toUpperCase() + type.slice(1)
-        },
         pageBlocks(posts) {
-            if(this.images.length < 1) return []
+            if(!posts) return []
             return posts[this.$route.params.slug].blocks.map(block => {
                 if(block) return block
             })
         },
         checkForImages(posts) {
             if(Object.keys(posts).length == 0) return
-
+            console.log(posts)
             this.pageBlocks(posts).forEach(block => {
-                if(!block) return
-
+                console.log(block)
                 const doc = new DOMParser().parseFromString(block, 'text/html')
                 const gallery = doc.querySelectorAll('.blocks-gallery-item img')
-                
-                // add captions
-                if(gallery.length) {
-                    this.images = [].slice.call(gallery).map(
-                        item => { return item.src }
-                    )
-                }
+
+                if(!gallery || gallery.length < 1) return
+
+                this.images = [].slice.call(gallery).map(item => { 
+                    return item.src
+                })
             })
         },
         checkAndSetHero(posts) {
             const post = posts[this.$route.params.slug]
-            if(post && post.hero){
-                const json = JSON.parse(post.hero)
-                this.$store.commit('SET_HERO', json)
-            }
+            if(!post || ! post.hero) return
+
+            const json = JSON.parse(post.hero)
+            this.$store.commit('SET_HERO', json)
         }
     },
     watch: {
@@ -116,16 +110,18 @@ export default {
             
             // Gottas be on the next render tick
             this.$nextTick(() => {
-                const blocks = this.pageBlocks(newVal)
                 let gallery
-                blocks.forEach(block => {
+                this.pageBlocks(newVal).forEach(block => {
+                    if(!block) return
                     gallery = document.querySelectorAll('.blocks-gallery-item figure')
                 })
                 
                 if(!gallery || gallery.length < 1) return
 
                 gallery.forEach((item, i) => {
-                    item.addEventListener('mouseup', event => { this.fullscreengallery = i })
+                    item.addEventListener('mouseup', event => { 
+                        this.fullscreengallery = i
+                    })
                 })
             })
             
@@ -133,7 +129,7 @@ export default {
     },
     created() {
         if(!this.allLoaded) {
-            let type = this.convertTitleCase(this.$route.params.type)
+            let type = convertTitleCase(this.$route.params.type)
             console.log('Retrieving...', type)
             this.$store.dispatch(`getAll${type}`)
         }

vue-theme/src/utils/helpers.js

@@ -0,0 +1,9 @@
+const convertTitleCase = (type) => {
+    return type.charAt(0).toUpperCase() + type.slice(1)
+}
+
+const typeFromRoute = (route) => {
+    return route.params.type ? route.params.type : route.fullPath.slice(1)
+}
+
+export { convertTitleCase, typeFromRoute }