Przeglądaj źródła

:poop: trying really really old intersecton handler

tags/0.9.0
J 4 lat temu
rodzic
commit
aac1aff00a
1 zmienionych plików z 17 dodań i 19 usunięć
  1. 17
    19
      vue-theme/src/pages/list.vue

+ 17
- 19
vue-theme/src/pages/list.vue Wyświetl plik

@@ -18,12 +18,12 @@
18 18
             section(v-for="(post, i) in posts" :key="post.slug").shadow.post
19 19
                 card(:content="post" :type="type" :wide="type == 'exhibition' && i > 1 || type == 'event' && i > 1 ")
20 20
 
21
-        footer(v-if="loadingFetched || showMeta")
22
-            p(v-if="loadingFetched") loading more {{ type }} ...
21
+        footer
22
+            p(v-if="loadingFetched") loading more {{ type }}...
23 23
             p {{ `${type} count: ${Object.values(posts).length}` }}
24 24
             p {{ `show sidebar: ${sidebar}` }}
25 25
 
26
-    sidebar(v-if="sidebar" :type="`${type}`" layout="list")
26
+    //- sidebar(v-if="sidebar" :type="`${type}`" layout="list")
27 27
 </template>
28 28
 
29 29
 <script>
@@ -46,9 +46,8 @@ export default {
46 46
     mixins: [postTypeGetters, scrollTop, heroUtils],
47 47
     data() {
48 48
         return {
49
-            showMeta: false,
50 49
             page: 0,
51
-            perPage: 21,
50
+            perPage: 15,
52 51
             keepFetching: true,
53 52
             loadingFetched: false,
54 53
             observer: null
@@ -79,17 +78,13 @@ export default {
79 78
             this.$store.commit(`${uppercaseType}_LOADED`)
80 79
         },
81 80
         async loadMorePosts() {
82
-            // console.log('trying to load for: ', this.$route)
81
+            console.log('trying to load for: ', this.$route)
83 82
             const type = typeFromRoute(this.$route)
84
-            if(!type) return console.error(`type: ${type} not found...`)
83
+            if(!type) return console.warn(`type: ${type} not found...`)
85 84
             if(!this.keepFetching) return console.warn('nothing left to fetch...')
86 85
 
86
+            console.warn(`loading more ${type} posts...`)
87 87
             this.loadingFetched = true
88
-            console.warn(
89
-                `loading page ${this.page} of ${type} posts: 
90
-                    ${this.page * this.perPage + 1} through 
91
-                        ${(this.page + 1) * this.perPage}`
92
-            )
93 88
             this.page++
94 89
             await this.getPosts()
95 90
         },
@@ -125,7 +120,7 @@ export default {
125 120
 
126 121
             // Stop trying to load more posts
127 122
             if(res && !res.length) {
128
-                console.warn('did not receive response...', res, this.type)
123
+                console.warn('nothing left to get...')
129 124
                 this.keepFetching = false
130 125
             }
131 126
             this.loadingFetched = false
@@ -149,12 +144,13 @@ export default {
149 144
             this.$store.commit('SET_HERO', this._setHeroInfo(page))
150 145
         },
151 146
         setIntersectionLoader() {
152
-            if(!this.type) return console.error('cannot setup intersection handler for undefined type')
153
-            if(this.type == 'episode') return console.warn('intersection handler not setup for episode')
147
+            if(!this.type) return console.error('cannot setup interseciton handler for undefined type')
154 148
 
155
-            // console.warn('setting up intersection handler for:', this.type)
149
+            console.warn('setting up intersection handler for:', this.type)
156 150
             const footerEl = document.querySelector(INTERSECT_SELECTION)
151
+            // console.warn('found el: ',footerEl)
157 152
             if(!footerEl) return
153
+            // console.warn('attach to: ',footerEl)
158 154
 
159 155
             const onIntersect = (entries, observer) => {
160 156
                 console.log('intersection handler fired...')
@@ -163,7 +159,7 @@ export default {
163 159
                     console.log("intersected:", entry)
164 160
                     setTimeout(() => {
165 161
                         this.loadMorePosts()
166
-                    }, 1000)
162
+                    }, TIMEOUT)
167 163
                 })
168 164
             }
169 165
             this.observer = new IntersectionObserver(onIntersect, {
@@ -171,7 +167,6 @@ export default {
171 167
             })
172 168
             this.observer['_for_type'] = this.type
173 169
             this.observer.observe(footerEl)
174
-
175 170
         },
176 171
         unsetIntersectionLoader() {
177 172
             const footerEl = document.querySelector(INTERSECT_SELECTION)
@@ -195,9 +190,12 @@ export default {
195 190
         // This only fires navigating from
196 191
         // a list page, to another list page
197 192
         type(newType, oldType){
193
+            console.log('old:', oldType)
194
+            console.log('new:', newType)
195
+            
198 196
             if(!postTypes.includes(newType)) return console.warn('type not found...')
199
-            this.clearAndInitPostList()
200 197
             this.setIntersectionLoader()
198
+            this.clearAndInitPostList()
201 199
         },
202 200
     },
203 201
     mounted() {

Ładowanie…
Anuluj
Zapisz