@thinkpixellab-public/px-vue 4.0.2 → 4.0.4

package/components/PxSlides.vue

@@ -79,11 +79,49 @@ export default {
     data() {
         return {
             direction: 1,
+            lastInteractionType: null,
             activeTransitions: 0,
             scrollPreview: 0,
         };
     },
-    computed: {},
+    computed: {
+        lethargyOverrides() {
+            // query strings overrides
+
+            const stability = parseFloat(this.$route.query?.scrollStability);
+            const sensitivity = parseFloat(this.$route.query?.scrollSensitivity);
+            const tolerance = parseFloat(this.$route.query?.scrollTolerance);
+
+            if (stability || sensitivity || tolerance) {
+                console.log('[Custom scroll values enabled.]');
+                console.log(`stability: ${stability || 8}`);
+                console.log(`sensitivity: ${sensitivity || 100}`);
+                console.log(`tolerance: ${tolerance || 1.1}`);
+
+                return {
+                    stability: stability || 8,
+                    sensitivity: sensitivity || 100,
+                    tolerance: tolerance || 1.1,
+                };
+            }
+
+            // windows overrides
+
+            if (
+                navigator.userAgent.indexOf('Win') != -1 ||
+                this.$route.query?.scroll == 'windows'
+            ) {
+                //console.log('[Windows scroll values enabled.]');
+                return {
+                    stability: stability || 8,
+                    sensitivity: sensitivity || 20,
+                    tolerance: tolerance || 0.1,
+                };
+            }
+
+            return null;
+        },
+    },
     watch: {
         selectedData(nv, ov) {
             let newIndex = this.itemKeys.indexOf(nv);
@@ -94,8 +132,11 @@ export default {
                 oldKey: ov,
                 index: newIndex,
                 previousIndex: oldIndex,
+                interactionType: this.lastInteractionType,
             });
 
+            this.lastInteractionType = null;
+
             newIndex = this.selectedRelativeIndex(newIndex);
             oldIndex = this.selectedRelativeIndex(oldIndex);
 
@@ -123,6 +164,20 @@ export default {
         });
 
         if (this.scrollEnabled) {
+            let overrides = this.lethargyOverrides;
+
+            if (overrides) {
+                this.lethargy = new Lethargy(
+                    overrides.stability,
+                    overrides.sensitivity,
+                    overrides.tolerance
+                );
+            } else {
+                this.lethargy = new Lethargy();
+            }
+
+            this.lethargyPrevCheck = false;
+
             this.$el.addEventListener('wheel', this.onWheel);
         }
     },
@@ -172,6 +227,9 @@ export default {
             if (Math.abs(ev.delta.x) < 10) {
                 gsap.to(this.dragElements, { x: 0 });
             } else {
+                this.lastInteractionType = 'drag';
+                this.$emit('drag-complete');
+
                 if (ev.delta.x > 0) {
                     this.previous();
                 } else {
@@ -181,11 +239,6 @@ export default {
         },
 
         onWheel(e) {
-            if (typeof this.lethargy == 'undefined') {
-                this.lethargy = new Lethargy();
-                this.lethargyPrevCheck = false;
-            }
-
             if (this.scrollPreviewEnabled) {
                 const delta = (e.deltaY + e.deltaX) / 2;
                 if (Math.abs(delta) > 5) {
@@ -202,6 +255,9 @@ export default {
 
             if (check !== this.lethargyPrevCheck) {
                 if (check) {
+                    this.lastInteractionType = 'scroll';
+                    this.$emit('scroll-complete');
+
                     if (check > 0) {
                         this.previous(false);
                     } else {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@thinkpixellab-public/px-vue",
-    "version": "4.0.2",
+    "version": "4.0.4",
     "description": "General purpose Vue components and helpers that can be used across projects.",
     "author": "Pixel Lab",
     "license": "MIT",

package/plugins/common.js

@@ -48,7 +48,7 @@ export default {
 
         // $eventBus is only client-side but we want to avoid warnings about missing $eventBus
         // for inject called during setup on server-side.
-        if (process.server) {
+        if (isServer()) {
             app.provide('$eventBus', null);
         }
     },