Merge branch 'sidebar-options' of craft-in-america/vue-wp into dev

vue-theme/src/components/sidebars/sidebar.vue

@@ -2,22 +2,34 @@
 aside.sidebar
     section
         //- if not single layout with sorting
-        .shadow(v-if="['artist', 'exhibition', 'event', 'short', 'guide', 'object', 'publication', 'technique', 'post'].includes(type) && layout !== 'single'")
+        .shadow(v-if="shouldShowListSort.includes(type) && layout !== 'single'")
             h3.t-up sort {{ type }}
             ul.t-up
                 li(v-for="option in sortOptions")
                     router-link(:to="`/${type}/sorted/${sortTypes[option]}`")
                         p {{ option }}
-                //- exhibition, event list sidebar
-                template(v-if="['exhibition', 'event'].includes(type) && layout === 'list'")
                     router-link(:to="`/${type}`")
                         p by all
-                    router-link(:to="`/${type}/sorted/by-current-and-upcoming`")
+                    router-link(v-if="shouldShowDateSort.includes(type) && layout !== 'single'" :to="`/${type}/sorted/by-current-and-upcoming`")
                         p by current and upcoming
-                //- list sidebar 
-                template(v-if="['short', 'guide', 'publication', 'technique', 'post'].includes(type) && layout === 'list'")
-                    router-link(:to="`/${type}`")
-                        p by all
+        
+        //- if {{type}} sorted by-material show material options
+        .shadow(v-if="shouldShowMaterialSort.includes(type) && layout !== 'single'")
+            h3.t-up {{ type }} by material
+            ul.t-up
+                li
+                    template(v-for="material in materials") 
+                        router-link(:to="`/${type}/sorted/by-material#${material}`")
+                            p {{ material }}
+
+        //- if artist sorted by-alpha show alpha options           
+        .shadow(v-if="['artist'].includes(type) && layout !== 'single'")
+            h3.t-up {{ type }} alpha 
+            ul.t-up
+                li
+                    template(v-for="charaSet in charaSets") 
+                        router-link(:to="`/${type}/sorted/by-alpha#${charaSet[0]}`")
+                            p {{ charaSet }}
 
         //- p2p types and related posts
         .shadow(v-if="layout === 'single' && Object.keys(related).length" v-for="p2pPostType in Object.keys(related)")
@@ -50,13 +62,8 @@ aside.sidebar
 import relatedSidebar from './related'
 import exhibitionsSidebar from './exhibitions'
 import eventsSidebar from './events'
-// import shortsSidebar from './shorts'
-// import talksSidebar from './talks'
-// import postsSidebar from './posts'
-// import publicationsSidebar from './publications'
-// import articlesSidebar from './articles'
 
-import { sortTypes } from '@/utils/helpers'
+import { sortTypes, materials } from '@/utils/helpers'
 
 export default {
     props: {
@@ -71,22 +78,42 @@ export default {
         },
     },
     components: {
-        exhibitionsSidebar,
-        eventsSidebar,
-        relatedSidebar,
+        exhibitionsSidebar, eventsSidebar, relatedSidebar,
     },
     data() {
         return {
             sortTypes: {
-                alphabetized: `${sortTypes.alpha}`,
-                'by material': `${sortTypes.material}`,
-                'by artist': `${sortTypes.artist}`,
-                'by episode': `${sortTypes.episode}`,
-                'by artist type': `${sortTypes.subtype}`,
-                'by event type': `${sortTypes.subtype}`,
-                'by post type': `${sortTypes.subtype}`,
-                // 'by exhibition type': `${sortTypes.exhibitiontypes}`,
+                alphabetized: `${sortTypes.alpha}`,       //:0
+                'by material': `${sortTypes.material}`,   //:1
+                'by artist': `${sortTypes.artist}`,       //:2
+                'by episode': `${sortTypes.episode}`,     //:3
             },
+            charaSets: [
+                '0 a b', 'c d e', 'f g h',
+                'i j k', 'l m n', 'o p q',
+                'r s t', 'u v w', 'x y z'
+            ],
+            materials: materials,
+            shouldShowListSort: [
+                'artist', 'exhibition', 'event', 
+                'short', 'guide', 'object',
+                'publication', 'technique', 'post'
+            ],
+            shouldShowMaterialSort: [
+                'artist', 
+                'short', 'guide', 'object',
+                'technique',
+            ],
+            shouldShowAlphaSort: [
+                'artist'
+            ],
+            shouldShowDateSort: [
+                'exhibition', 'event'
+            ],
+            shouldShowTypeSort: [
+                'short', 'guide', 'object',
+                'publication', 'technique', 'post'
+            ]
         }
     },
     computed: {
@@ -98,12 +125,12 @@ export default {
                         Object.keys(this.sortTypes)[0],
                         Object.keys(this.sortTypes)[3],
                         Object.keys(this.sortTypes)[1],
-                        Object.keys(this.sortTypes)[4],
+                        `by ${this.type} type`,
                     ]
                     break
                 case 'post':
                     opts = [
-                        Object.keys(this.sortTypes)[6],
+                        `by ${this.type} type`,
                     ]
                     break
                 case 'short':

vue-theme/src/utils/helpers.js

@@ -3,6 +3,15 @@ const convertTitleCase = type => {
     return type.charAt(0).toUpperCase() + type.slice(1)
 }
 
+const materials = [
+    'clay',
+    'fiber',
+    'glass',
+    'metal',
+    'paper',
+    'wood'
+]
+
 const sortTypes = {
     alpha: 'by-alpha',
     recent: 'by-recent',
@@ -77,6 +86,7 @@ const formatDate = (unix, includeTime) => {
 
 export {
     convertTitleCase,
+    materials,
     sortTypes,
     postTypes,
     ytThumbnail,