bachir/drupal-caravane
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

toggle animations

Browse Source
This commit is contained in:
Valentin
2024-11-14 02:31:10 +01:00
parent f2680fc65a
commit 9bf84290ac
8 changed files with 258 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
web/themes/custom/caravane/assets/js/stores/map.js
View File

@@ -10,23 +10,32 @@ export const useMapStore = defineStore('mapState', {
currentPlace: Object,
maxZoom: Number,
currentZoom: Number,
duration: 3,
animationsAreEnabled: true,
animationDuration: 3,
}),
actions: {
zoomToPlace(lat, long) {
if (useLayoutStore().isDesktop) long = long - 0.03;
this.map.flyTo([lat, long], this.maxZoom, { duration: this.duration });
this.currentZoom = this.maxZoom;
this.map.flyTo(
[lat, long],
this.maxZoom,
{ animate: this.animationsAreEnabled, animationDuration: this.animationDuration });
this.currentZoom = this.maxZoom;
},
resetMap() {
this.map.flyTo(this.defaultMapCenter, useLayoutStore().isDesktop ? this.defaultZoomDesktop : this.defaultZoomMobile, { duration: this.duration });
console.log(this.defaultMapCenter);
this.map.flyTo(
this.defaultMapCenter,
useLayoutStore().isDesktop ? this.defaultZoomDesktop : this.defaultZoomMobile,
{ animate: this.animationsAreEnabled, animationDuration: this.animationDuration });
this.currentZoom = useLayoutStore().isDesktop ? this.defaultZoomDesktop : this.defaultZoomMobile;
},
lockMap() {
setTimeout(() => {
this.map.options.minZoom = this.currentZoom;
this.map.options.maxZoom = this.currentZoom;
}, this.duration * 1000 + 100);
}, this.animationDuration * 1000 + 100);
this.map.dragging.disable();
this.map.touchZoom.disable();
this.map.doubleClickZoom.disable();
@@ -34,17 +43,28 @@ export const useMapStore = defineStore('mapState', {
this.map.boxZoom.disable();
this.map.keyboard.disable();
// map.tap.disable();
},
unlockMap() {
this.map.options.minZoom = useLayoutStore().isDesktop ? this.defaultZoomDesktop : this.defaultZoomMobile;
this.map.options.maxZoom = this.maxZoom;
this.map.dragging.enable();
this.map.touchZoom.enable();
this.map.doubleClickZoom.enable();
this.map.scrollWheelZoom.enable();
this.map.boxZoom.enable();
this.map.keyboard.enable();
// map.tap.enable();
},
},
unlockMap() {
this.map.options.minZoom = useLayoutStore().isDesktop ? this.defaultZoomDesktop : this.defaultZoomMobile;
this.map.options.maxZoom = this.maxZoom;
this.map.dragging.enable();
this.map.touchZoom.enable();
this.map.doubleClickZoom.enable();
this.map.scrollWheelZoom.enable();
this.map.boxZoom.enable();
this.map.keyboard.enable();
// map.tap.enable();
},
toggleAnimation() {
this.animationsAreEnabled = !this.animationsAreEnabled;
},
checkReducedMotion() {
const mediaQuery = window.matchMedia('(prefers-reduced-motion: reduce)');
this.animationsAreEnabled = !mediaQuery.matches;
mediaQuery.addEventListener('change', (event) => {
this.animationsAreEnabled = !event.matches;
});
},
},
});
});