refactor du système de routing (EXPORTS DES SETTINGS DRUPAL)
This commit is contained in:
Valentin
@@ -5,33 +5,17 @@ import REST from '../api/rest-axios';
|
||||
|
||||
export const useContentStore = defineStore('content', {
|
||||
state: () => ({
|
||||
href: '',
|
||||
map: {},
|
||||
etape: {
|
||||
title: '',
|
||||
adresse: {},
|
||||
contentType: '',
|
||||
pageTitle: '',
|
||||
content: {
|
||||
contentTitle: '',
|
||||
coordinates: {},
|
||||
adresse: {},
|
||||
etape_number: '',
|
||||
vignette: {},
|
||||
couleur: '',
|
||||
previous: {},
|
||||
dates: {},
|
||||
previous : {},
|
||||
next: {},
|
||||
dates: {
|
||||
start: {
|
||||
d: '',
|
||||
m: '',
|
||||
y: '',
|
||||
},
|
||||
end: {
|
||||
d: '',
|
||||
m: '',
|
||||
y: '',
|
||||
},
|
||||
},
|
||||
parties: [],
|
||||
},
|
||||
page: {
|
||||
title: '',
|
||||
vignette: {},
|
||||
parties: [],
|
||||
},
|
||||
@@ -39,320 +23,237 @@ export const useContentStore = defineStore('content', {
|
||||
error: null,
|
||||
}),
|
||||
actions: {
|
||||
async fetchEtapeData(nid, map) {
|
||||
this.resetStore();
|
||||
this.map = map;
|
||||
async fetchContentData(path) {
|
||||
this.resetStore(false);
|
||||
const contentTypes = [ 'etape', 'static' ];
|
||||
try {
|
||||
const response = await REST.get(`/jsonapi/node/etape/`);
|
||||
for (let etape of response.data.data) {
|
||||
if (etape.attributes.drupal_internal__nid == nid) {
|
||||
for (let metatag of etape.attributes.metatag) {
|
||||
if (metatag.tag === "link") {
|
||||
this.href = metatag.attributes.href;
|
||||
}
|
||||
}
|
||||
this.etape.coordinates = {
|
||||
lat: etape.attributes.field_geofield.lat,
|
||||
lon: etape.attributes.field_geofield.lon,
|
||||
};
|
||||
this.etape.title = etape.attributes.title;
|
||||
this.etape.adresse = etape.attributes.field_adresse;
|
||||
this.etape.etape_number = etape.attributes.field_arret_numero;
|
||||
const vignetteFetch = await this.fetchContent('field_vignette', etape.relationships);
|
||||
if (vignetteFetch) {
|
||||
this.etape.vignette = {
|
||||
url: vignetteFetch.attributes.uri.url,
|
||||
alt: etape.relationships.field_vignette.data.meta.alt
|
||||
};
|
||||
}
|
||||
this.etape.couleur = etape.attributes.field_couleur;
|
||||
let rawContent,
|
||||
contentType,
|
||||
response;
|
||||
|
||||
this.etape.dates = {
|
||||
start: this.getCleanDate(etape.attributes.field_dates.value),
|
||||
end: this.getCleanDate(etape.attributes.field_dates.end_value),
|
||||
}
|
||||
|
||||
const partiesFetch = await this.fetchContent('field_parties', etape.relationships);
|
||||
if (partiesFetch) {
|
||||
this.etape.parties = [];
|
||||
for (let partie of partiesFetch) {
|
||||
const partieType = partie.type.replace(/^paragraph--/, "");
|
||||
let partieContent = {
|
||||
type: partieType,
|
||||
};
|
||||
|
||||
switch (partieType) {
|
||||
case 'carte_sensible':
|
||||
const carteSensibleFetch = await this.fetchContent('field_image_carte', partie.relationships);
|
||||
if (carteSensibleFetch) {
|
||||
partieContent.carteSensible = {
|
||||
url: carteSensibleFetch.attributes.uri.url,
|
||||
alt: partie.relationships.field_image_carte.data.meta.alt,
|
||||
};
|
||||
}
|
||||
break;
|
||||
case 'titre_texte':
|
||||
partieContent.titre = partie.attributes.field_titre;
|
||||
partieContent.texte = partie.attributes.field_texte.value;
|
||||
break;
|
||||
case 'chiffres_cles':
|
||||
const chiffresClesFetch = await this.fetchContent('field_chiffres_clefs', partie.relationships);
|
||||
if (chiffresClesFetch) {
|
||||
partieContent.chiffresCles = [];
|
||||
for (let chiffre of chiffresClesFetch) {
|
||||
partieContent.chiffresCles.push({
|
||||
chiffre: chiffre.attributes.field_chiffre,
|
||||
description: chiffre.attributes.field_description,
|
||||
});
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 'diaporama':
|
||||
const diaporamaFetch = await this.fetchContent('field_diaporama', partie.relationships);
|
||||
if (diaporamaFetch) {
|
||||
partieContent.diaporama = [];
|
||||
for (let [index, image] of diaporamaFetch.entries()) {
|
||||
partieContent.diaporama.push({
|
||||
url: image.attributes.uri.url,
|
||||
alt: partie.relationships.field_diaporama.data[index].meta.alt,
|
||||
});
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 'entretien':
|
||||
partieContent.entretien = {};
|
||||
const personnesFetch = await this.fetchContent('field_personne_s', partie.relationships);
|
||||
const questionsReponsesFetch = await this.fetchContent('field_questions_reponses', partie.relationships);
|
||||
if (personnesFetch && questionsReponsesFetch) {
|
||||
partieContent.entretien.personnes = [];
|
||||
for (let personne of personnesFetch) {
|
||||
const portraitFetch = await this.fetchContent('field_portrait', personne.relationships);
|
||||
if (portraitFetch) {
|
||||
partieContent.entretien.personnes.push({
|
||||
portrait: portraitFetch.attributes.uri.url,
|
||||
alt: personne.relationships.field_portrait.data.meta.alt,
|
||||
description: personne.attributes.field_description,
|
||||
});
|
||||
}
|
||||
}
|
||||
partieContent.entretien.questionsReponses = [];
|
||||
for (let qr of questionsReponsesFetch) {
|
||||
partieContent.entretien.questionsReponses.push({
|
||||
question: qr.attributes.field_question,
|
||||
reponse: qr.attributes.field_reponse.value,
|
||||
});
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 'exergue':
|
||||
partieContent.exergue = partie.attributes.field_texte_exergue.value;
|
||||
break;
|
||||
case 'video':
|
||||
partieContent.videos = [];
|
||||
for (let video of partie.attributes.field_videos) {
|
||||
const videoId = video.split('?v=')[1];
|
||||
const videoUrl = `https://www.youtube.com/embed/${videoId}`;
|
||||
partieContent.videos.push(videoUrl);
|
||||
}
|
||||
break;
|
||||
}
|
||||
this.etape.parties.push(partieContent);
|
||||
}
|
||||
}
|
||||
|
||||
// get previous and next étape infos
|
||||
// the list from the json api /node is not ordered
|
||||
// and i need authentification to get the json view ordered list
|
||||
// so i get it from the displayed list in the page
|
||||
const orderedEtapesList = document.querySelectorAll('#etapes-liste li');
|
||||
|
||||
if (orderedEtapesList) {
|
||||
const processEtape = async (etapeItemNid, etapesList, key) => {
|
||||
for (let etape of etapesList) {
|
||||
if (etape.attributes.drupal_internal__nid == etapeItemNid) {
|
||||
const vignetteFetch = await REST.get(etape.relationships.field_vignette.links.related.href);
|
||||
this.etape[key] = {
|
||||
nid: etape.attributes.drupal_internal__nid,
|
||||
couleur: etape.attributes.field_couleur,
|
||||
title: etape.attributes.title,
|
||||
postalCode: etape.attributes.field_adresse.postal_code,
|
||||
dates: {
|
||||
start: this.getCleanDate(etape.attributes.field_dates.value),
|
||||
end: this.getCleanDate(etape.attributes.field_dates.end_value),
|
||||
},
|
||||
vignette: {
|
||||
url: vignetteFetch.data.data.attributes.uri.url,
|
||||
alt: etape.relationships.field_vignette.data.meta.alt,
|
||||
},
|
||||
};
|
||||
break;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
for (let li of orderedEtapesList) {
|
||||
if (li.querySelector('a').dataset.nodeNid == nid) {
|
||||
const previousEtapeItemNid = li.previousElementSibling?.querySelector('a').dataset.nodeNid;
|
||||
const nextEtapeItemNid = li.nextElementSibling?.querySelector('a').dataset.nodeNid;
|
||||
if (previousEtapeItemNid) {
|
||||
await processEtape(previousEtapeItemNid, response.data.data, 'previous');
|
||||
}
|
||||
if (nextEtapeItemNid) {
|
||||
await processEtape(nextEtapeItemNid, response.data.data, 'next');
|
||||
}
|
||||
}
|
||||
contentTypesLoop:
|
||||
for (let type of contentTypes) {
|
||||
response = await REST.get(`/jsonapi/node/${type}/`);
|
||||
for (let content of response.data.data) {
|
||||
for (let tag of content.attributes.metatag) {
|
||||
if (tag.tag === "link" && tag.attributes.href === path) {
|
||||
this.contentType = type;
|
||||
rawContent = content;
|
||||
contentType = type;
|
||||
break contentTypesLoop;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// pageTitle
|
||||
for (let tag of rawContent.attributes.metatag) {
|
||||
if (tag.tag === "meta") {
|
||||
this.pageTitle = tag.attributes.content;
|
||||
break;
|
||||
}
|
||||
}
|
||||
this.setActiveItemInMenu(nid);
|
||||
// contentTitle
|
||||
this.content.contentTitle = rawContent.attributes.title;
|
||||
|
||||
// vignette
|
||||
const vignetteFetch = await this.fetchDeeperContent('field_vignette', rawContent.relationships);
|
||||
if (vignetteFetch) {
|
||||
this.content.vignette = {
|
||||
url: vignetteFetch.attributes.uri.url,
|
||||
alt: rawContent.relationships.field_vignette.data.meta.alt
|
||||
};
|
||||
}
|
||||
|
||||
if (contentType === 'etape') {
|
||||
// coordinates
|
||||
this.content.coordinates = {
|
||||
lat: rawContent.attributes.field_geofield.lat,
|
||||
lon: rawContent.attributes.field_geofield.lon,
|
||||
};
|
||||
// adresse
|
||||
this.content.adresse = rawContent.attributes.field_adresse;
|
||||
// étape number
|
||||
this.content.etape_number = rawContent.attributes.field_arret_numero;
|
||||
// couleur
|
||||
this.content.couleur = rawContent.attributes.field_couleur;
|
||||
// dates
|
||||
this.content.dates = {
|
||||
start: this.getCleanDate(rawContent.attributes.field_dates.value),
|
||||
end: this.getCleanDate(rawContent.attributes.field_dates.end_value),
|
||||
}
|
||||
// previous / next
|
||||
await this.getRelatedEtape('previous', response.data.data, path);
|
||||
await this.getRelatedEtape('next', response.data.data, path);
|
||||
}
|
||||
|
||||
// parties
|
||||
const fieldParties = contentType === 'etape' ? 'field_parties' : 'field_parties_static';
|
||||
const partiesFetch = await this.fetchDeeperContent(fieldParties, rawContent.relationships);
|
||||
|
||||
if (partiesFetch) {
|
||||
this.content.parties = [];
|
||||
for (let partie of partiesFetch) {
|
||||
const partieType = partie.type.replace(/^paragraph--/, "");
|
||||
let partieContent = {
|
||||
type: partieType,
|
||||
};
|
||||
|
||||
switch (partieType) {
|
||||
case 'carte_sensible':
|
||||
const carteSensibleFetch = await this.fetchDeeperContent('field_image_carte', partie.relationships);
|
||||
if (carteSensibleFetch) {
|
||||
partieContent.carteSensible = {
|
||||
url: carteSensibleFetch.attributes.uri.url,
|
||||
alt: partie.relationships.field_image_carte.data.meta.alt,
|
||||
};
|
||||
}
|
||||
break;
|
||||
case 'titre_texte':
|
||||
partieContent.titre = partie.attributes.field_titre;
|
||||
partieContent.texte = partie.attributes.field_texte.value;
|
||||
break;
|
||||
case 'chiffres_cles':
|
||||
const chiffresClesFetch = await this.fetchDeeperContent('field_chiffres_clefs', partie.relationships);
|
||||
if (chiffresClesFetch) {
|
||||
partieContent.chiffresCles = [];
|
||||
for (let chiffre of chiffresClesFetch) {
|
||||
partieContent.chiffresCles.push({
|
||||
chiffre: chiffre.attributes.field_chiffre,
|
||||
description: chiffre.attributes.field_description,
|
||||
});
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 'diaporama':
|
||||
const diaporamaFetch = await this.fetchDeeperContent('field_diaporama', partie.relationships);
|
||||
if (diaporamaFetch) {
|
||||
partieContent.diaporama = [];
|
||||
for (let [index, image] of diaporamaFetch.entries()) {
|
||||
partieContent.diaporama.push({
|
||||
url: image.attributes.uri.url,
|
||||
alt: partie.relationships.field_diaporama.data[index].meta.alt,
|
||||
});
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 'entretien':
|
||||
partieContent.entretien = {};
|
||||
const personnesFetch = await this.fetchDeeperContent('field_personne_s', partie.relationships);
|
||||
const questionsReponsesFetch = await this.fetchDeeperContent('field_questions_reponses', partie.relationships);
|
||||
if (personnesFetch && questionsReponsesFetch) {
|
||||
partieContent.entretien.personnes = [];
|
||||
for (let personne of personnesFetch) {
|
||||
const portraitFetch = await this.fetchDeeperContent('field_portrait', personne.relationships);
|
||||
if (portraitFetch) {
|
||||
partieContent.entretien.personnes.push({
|
||||
portrait: portraitFetch.attributes.uri.url,
|
||||
alt: personne.relationships.field_portrait.data.meta.alt,
|
||||
description: personne.attributes.field_description,
|
||||
});
|
||||
}
|
||||
}
|
||||
partieContent.entretien.questionsReponses = [];
|
||||
for (let qr of questionsReponsesFetch) {
|
||||
partieContent.entretien.questionsReponses.push({
|
||||
question: qr.attributes.field_question,
|
||||
reponse: qr.attributes.field_reponse.value,
|
||||
});
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 'exergue':
|
||||
partieContent.exergue = partie.attributes.field_texte_exergue.value;
|
||||
break;
|
||||
case 'video':
|
||||
partieContent.videos = [];
|
||||
for (let video of partie.attributes.field_videos) {
|
||||
const videoId = video.split('?v=')[1];
|
||||
const videoUrl = `https://www.youtube.com/embed/${videoId}`;
|
||||
partieContent.videos.push(videoUrl);
|
||||
}
|
||||
break;
|
||||
}
|
||||
this.content.parties.push(partieContent);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
this.error = 'Failed to fetch data';
|
||||
console.error('Issue with getNodeData', error);
|
||||
} finally {
|
||||
this.loading = false;
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
async fetchStaticData(nid, map) {
|
||||
this.resetStore();
|
||||
this.map = map;
|
||||
try {
|
||||
const response = await REST.get(`/jsonapi/node/static/`);
|
||||
for (let page of response.data.data) {
|
||||
if (page.attributes.drupal_internal__nid == nid) {
|
||||
for (let metatag of page.attributes.metatag) {
|
||||
if (metatag.tag === "link") {
|
||||
this.href = metatag.attributes.href;
|
||||
}
|
||||
}
|
||||
this.page.title = page.attributes.title;
|
||||
const vignetteFetch = await this.fetchContent('field_vignette', page.relationships);
|
||||
if (vignetteFetch) {
|
||||
this.page.vignette = {
|
||||
url: vignetteFetch.attributes.uri.url,
|
||||
alt: page.relationships.field_vignette.data.meta.alt
|
||||
};
|
||||
}
|
||||
|
||||
const partiesFetch = await this.fetchContent('field_parties_static', page.relationships);
|
||||
if (partiesFetch) {
|
||||
this.page.parties = [];
|
||||
|
||||
for (let partie of partiesFetch) {
|
||||
const partieType = partie.type.replace(/^paragraph--/, "");
|
||||
let partieContent = {
|
||||
type: partieType,
|
||||
};
|
||||
|
||||
switch (partieType) {
|
||||
case 'titre_texte':
|
||||
partieContent.titre = partie.attributes.field_titre;
|
||||
partieContent.texte = partie.attributes.field_texte.value;
|
||||
break;
|
||||
case 'diaporama':
|
||||
const diaporamaFetch = await this.fetchContent('field_diaporama', partie.relationships);
|
||||
if (diaporamaFetch) {
|
||||
partieContent.diaporama = [];
|
||||
for (let [index, image] of diaporamaFetch.entries()) {
|
||||
partieContent.diaporama.push({
|
||||
url: image.attributes.uri.url,
|
||||
alt: partie.relationships.field_diaporama.data[index].meta.alt,
|
||||
});
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 'exergue':
|
||||
partieContent.exergue = partie.attributes.field_texte_exergue.value;
|
||||
break;
|
||||
case 'video':
|
||||
partieContent.videos = [];
|
||||
for (let video of partie.attributes.field_videos) {
|
||||
const videoId = video.split('?v=')[1];
|
||||
const videoUrl = `https://www.youtube.com/embed/${videoId}`;
|
||||
partieContent.videos.push(videoUrl);
|
||||
}
|
||||
break;
|
||||
}
|
||||
this.page.parties.push(partieContent);
|
||||
getCleanDate(date) {
|
||||
return {
|
||||
d: date.split('-')[2],
|
||||
m: new Intl.DateTimeFormat('fr-FR', { month: 'long' }).format(new Date(date)),
|
||||
y: date.split('-')[0],
|
||||
}
|
||||
},
|
||||
async getRelatedEtape(direction, allEtapesData, path) {
|
||||
const getRelatedEtapeContent = async (relatedPath, allEtapesData) => {
|
||||
const baseUrl = window.location.protocol + "//" + window.location.host;
|
||||
for (let etape of allEtapesData) {
|
||||
for (let tag of etape.attributes.metatag) {
|
||||
if (tag.tag === "link" && tag.attributes.href === baseUrl + relatedPath) {
|
||||
const vignetteFetch = await REST.get(etape.relationships.field_vignette.links.related.href);
|
||||
this.content[direction] = {
|
||||
url: tag.attributes.href,
|
||||
couleur: etape.attributes.field_couleur,
|
||||
title: etape.attributes.title,
|
||||
postalCode: etape.attributes.field_adresse.postal_code,
|
||||
dates: {
|
||||
start: this.getCleanDate(etape.attributes.field_dates.value),
|
||||
end: this.getCleanDate(etape.attributes.field_dates.end_value),
|
||||
},
|
||||
vignette: {
|
||||
url: vignetteFetch.data.data.attributes.uri.url,
|
||||
alt: etape.relationships.field_vignette.data.meta.alt,
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
this.setActiveItemInMenu(nid);
|
||||
} catch (error) {
|
||||
}
|
||||
|
||||
const orderedEtapesList = document.querySelectorAll('#etapes-liste li');
|
||||
if (orderedEtapesList) {
|
||||
for (let li of orderedEtapesList) {
|
||||
const liHref = li.querySelector('a').getAttribute('href');
|
||||
if (path.endsWith(liHref)) {
|
||||
const previousEtapeItemPath = li.previousElementSibling?.querySelector('a').getAttribute('href');
|
||||
const nextEtapeItemPath = li.nextElementSibling?.querySelector('a').getAttribute('href');
|
||||
|
||||
if (previousEtapeItemPath && direction === 'previous') {
|
||||
let prevContent = await getRelatedEtapeContent(previousEtapeItemPath, allEtapesData);
|
||||
return prevContent;
|
||||
}
|
||||
if (nextEtapeItemPath && direction === 'next') {
|
||||
let nextContent = await getRelatedEtapeContent(nextEtapeItemPath, allEtapesData);
|
||||
return nextContent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
async fetchDeeperContent(field, relationships) {
|
||||
if (relationships[field].data) {
|
||||
try {
|
||||
const contentLink = relationships[field].links.related.href;
|
||||
const contentFetch = await REST.get(contentLink);
|
||||
return contentFetch.data.data;
|
||||
} catch (error) {
|
||||
this.error = 'Failed to fetch data';
|
||||
console.error('Issue with getNodeData', error);
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
async fetchContent(field, relationships) {
|
||||
if (relationships[field].data) {
|
||||
try {
|
||||
const contentLink = relationships[field].links.related.href;
|
||||
const contentFetch = await REST.get(contentLink);
|
||||
return contentFetch.data.data;
|
||||
} catch (error) {
|
||||
this.error = 'Failed to fetch data';
|
||||
console.error('Issue with getNodeData', error);
|
||||
}
|
||||
}
|
||||
},
|
||||
emptyAll(nid, map) {
|
||||
this.href = '';
|
||||
this.map = map;
|
||||
this.etape = {};
|
||||
this.page = {};
|
||||
this.setActiveItemInMenu(nid);
|
||||
},
|
||||
setActiveItemInMenu(nid) {
|
||||
const title = this.etape.title || this.page.title;
|
||||
|
||||
const generalLinks = document.querySelectorAll('#menu > ul > li > a');
|
||||
if (Object.entries(this.etape).length === 0 && Object.entries(this.page).length === 0) {
|
||||
for (let link of generalLinks) {
|
||||
link.classList.remove('is-active');
|
||||
}
|
||||
generalLinks[0].classList.add('is-active');
|
||||
} else {
|
||||
for (let link of generalLinks) {
|
||||
if (link.dataset.nodeNid == nid) {
|
||||
link.classList.add('is-active');
|
||||
} else {
|
||||
link.classList.remove('is-active');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const etapeLinks = document.querySelectorAll('#etapes-liste li');
|
||||
for (let link of etapeLinks) {
|
||||
const a = link.querySelector('a');
|
||||
if (a.innerText === title) {
|
||||
link.classList.remove('inactive');
|
||||
} else {
|
||||
link.classList.add('inactive');
|
||||
}
|
||||
}
|
||||
const inactiveLinks = document.querySelectorAll('#etapes-liste li.inactive');
|
||||
if (inactiveLinks.length === etapeLinks.length) {
|
||||
for (let link of inactiveLinks) {
|
||||
link.classList.remove('inactive');
|
||||
}
|
||||
}
|
||||
},
|
||||
resetStore() {
|
||||
this.loading = true;
|
||||
resetStore(forFrontDisplay) {
|
||||
this.contentType = '';
|
||||
this.pageTitle = '';
|
||||
this.content = {};
|
||||
this.loading = !forFrontDisplay;
|
||||
this.error = null;
|
||||
this.etape = {};
|
||||
this.page = {};
|
||||
},
|
||||
getCleanDate(date) {
|
||||
return {
|
||||
d: date.split('-')[2],
|
||||
m: new Intl.DateTimeFormat('fr-FR', { month: 'long' }).format(new Date(date)),
|
||||
y: date.split('-')[0],
|
||||
}
|
||||
},
|
||||
}
|
||||
},
|
||||
});
|
||||
@@ -2,6 +2,7 @@ import { defineStore } from 'pinia';
|
||||
|
||||
export const useMapStore = defineStore('mapState', {
|
||||
state: () => ({
|
||||
map: Object,
|
||||
defaultZoom: Number,
|
||||
defaultMapCenter: Object,
|
||||
currentPlace: Object,
|
||||
@@ -10,36 +11,36 @@ export const useMapStore = defineStore('mapState', {
|
||||
duration: 3,
|
||||
}),
|
||||
actions: {
|
||||
zoomToPlace(map, lat, long) {
|
||||
map.flyTo([lat, long], this.maxZoom, { duration: this.duration });
|
||||
this.currentZoom = this.maxZoom;
|
||||
zoomToPlace(lat, long) {
|
||||
this.map.flyTo([lat, long], this.maxZoom, { duration: this.duration });
|
||||
this.currentZoom = this.maxZoom;
|
||||
},
|
||||
resetMap(map) {
|
||||
map.flyTo(this.defaultMapCenter, this.defaultZoom, { duration: this.duration });
|
||||
resetMap() {
|
||||
this.map.flyTo(this.defaultMapCenter, this.defaultZoom, { duration: this.duration });
|
||||
this.currentZoom = this.defaultZoom;
|
||||
},
|
||||
lockMap(map) {
|
||||
lockMap() {
|
||||
setTimeout(() => {
|
||||
map.options.minZoom = this.currentZoom;
|
||||
map.options.maxZoom = this.currentZoom;
|
||||
this.map.options.minZoom = this.currentZoom;
|
||||
this.map.options.maxZoom = this.currentZoom;
|
||||
}, this.duration * 1000 + 100);
|
||||
map.dragging.disable();
|
||||
map.touchZoom.disable();
|
||||
map.doubleClickZoom.disable();
|
||||
map.scrollWheelZoom.disable();
|
||||
map.boxZoom.disable();
|
||||
map.keyboard.disable();
|
||||
this.map.dragging.disable();
|
||||
this.map.touchZoom.disable();
|
||||
this.map.doubleClickZoom.disable();
|
||||
this.map.scrollWheelZoom.disable();
|
||||
this.map.boxZoom.disable();
|
||||
this.map.keyboard.disable();
|
||||
// map.tap.disable();
|
||||
},
|
||||
unlockMap(map) {
|
||||
map.options.minZoom = this.defaultZoom;
|
||||
map.options.maxZoom = this.maxZoom;
|
||||
map.dragging.enable();
|
||||
map.touchZoom.enable();
|
||||
map.doubleClickZoom.enable();
|
||||
map.scrollWheelZoom.enable();
|
||||
map.boxZoom.enable();
|
||||
map.keyboard.enable();
|
||||
unlockMap() {
|
||||
this.map.options.minZoom = this.defaultZoom;
|
||||
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();
|
||||
},
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user