Bladeren bron

:recycle: small refactor of click setting

tags/1.0.1^2^2
J 3 jaren geleden
bovenliggende
commit
6d2394c7f7
1 gewijzigde bestanden met toevoegingen van 31 en 24 verwijderingen
  1. 31
    24
      vue-theme/src/pages/single.vue

+ 31
- 24
vue-theme/src/pages/single.vue Bestand weergeven

@@ -184,6 +184,13 @@ export default {
184 184
             }
185 185
             this.loading = false
186 186
         },
187
+        _setClick(el, cb) {
188
+            if (el.addEventListener) {
189
+                el.addEventListener('click', cb, false)
190
+            } else {
191
+                el.attachEvent('onclick', cb)
192
+            }
193
+        },
187 194
     },
188 195
     watch: {
189 196
         slug(newSlug, oldSlug) {
@@ -197,32 +204,32 @@ export default {
197 204
         async singlePost(post) {
198 205
             console.log('---')
199 206
             if (!this.$el) return
200
-            const content = this.$el.children[0].querySelector('section')
207
+            const section = this.$el.children[0].querySelector('section')
201 208
             await nextTick()
202
-            const galleries = content.querySelectorAll('.wp-block-gallery')
203
-            const cb = e => {
204
-                this.activeGalleryIndex = parseInt(e.target.dataset.gallery)
205
-                const galleryImages =
206
-                    this.singlePost.galleries[this.activeGalleryIndex]
207
-                console.log(galleryImages)
208
-                if (!galleryImages.ids) return
209
-                this.activeImageIndex = galleryImages.ids.indexOf(
210
-                    parseInt(e.target.dataset.id),
211
-                )
212
-                console.log(
213
-                    `opening gallery: ${this.activeGalleryIndex}.${this.activeImageIndex}`,
209
+            const galleries = section.querySelectorAll('.wp-block-gallery')
210
+            galleries.forEach((gallery, galleryIndex) => {
211
+                el.dataset.gallery = galleryIndex
212
+                gallery.querySelectorAll('img').forEach(image =>
213
+                    this._setClick(image, e => {
214
+                        this.activeGalleryIndex = parseInt(
215
+                            e.target.dataset.gallery,
216
+                        )
217
+                        const galleryImages =
218
+                            this.singlePost.galleries[this.activeGalleryIndex]
219
+
220
+                        console.log(this.singlePost.galleries)
221
+                        console.log(galleryImages)
222
+                        if (!galleryImages.ids) return
223
+
224
+                        this.activeImageIndex = galleryImages.ids.indexOf(
225
+                            parseInt(e.target.dataset.id),
226
+                        )
227
+                        console.log(
228
+                            `opening gallery: ${this.activeGalleryIndex}.${this.activeImageIndex}`,
229
+                        )
230
+                        console.log(e.target.dataset)
231
+                    }),
214 232
                 )
215
-                console.log(e.target.dataset)
216
-            }
217
-            galleries.forEach((gal, galleryIndex) => {
218
-                gal.querySelectorAll('img').forEach(image => {
219
-                    image.dataset.gallery = galleryIndex
220
-                    if (image.addEventListener) {
221
-                        image.addEventListener('click', cb, false)
222
-                    } else {
223
-                        image.attachEvent('onclick', cb)
224
-                    }
225
-                })
226 233
             })
227 234
         },
228 235
     },

Laden…
Annuleren
Opslaan