From 8acd75e73ef0a6147064cc791751b5cc732ea06d Mon Sep 17 00:00:00 2001 From: Jakob Schnell Date: Mon, 30 Jan 2023 13:46:10 +0100 Subject: [PATCH] refactor: move eventBus to standalone module Fixes #324 --- src/app.js | 8 +-- src/common/event-bus.js | 5 ++ src/common/global-mixins.js | 13 +++-- src/common/prepared-vue.js | 5 -- src/common/show-toaster-mixin.js | 9 ++-- src/fragments/box/box.js | 10 ++-- src/fragments/box/box.store.js | 5 +- src/fragments/charts/altitude/altitude.js | 7 +-- src/fragments/dialogs/confirm/confirm.js | 10 ++-- src/fragments/dialogs/info/info.js | 6 ++- .../components/form-fields/form-fields.js | 4 +- .../isochrones-details/isochrones-details.js | 6 ++- .../components/isochrones/isochrones.js | 17 ++++--- .../map-form/components/map-form-mixin.js | 5 +- .../altitude-preview/altitude-preview.js | 3 +- .../components/extras/route-extras.js | 8 +-- .../route-details/components/steps/steps.js | 4 +- .../components/route-details/route-details.js | 8 +-- .../places-and-directions.js | 51 ++++++++++--------- .../forms/place-input/place-input.js | 11 ++-- .../profile-selector/profile-selector.js | 3 +- src/fragments/forms/settings/settings.js | 5 +- .../simple-place-search.js | 27 +++++----- src/fragments/header/header.js | 4 +- .../map-left-click/map-left-click.js | 9 ++-- .../map-right-click/map-right-click.js | 5 +- src/fragments/map-view/map-view.js | 31 +++++------ .../sidebar/components/top-menu/top-menu.js | 4 +- src/fragments/sidebar/sidebar.js | 4 +- src/fragments/toaster/toaster.js | 6 ++- src/pages/maps/maps.js | 47 ++++++++--------- 31 files changed, 185 insertions(+), 155 deletions(-) create mode 100644 src/common/event-bus.js diff --git a/src/app.js b/src/app.js index cd012b36..dc3239b9 100755 --- a/src/app.js +++ b/src/app.js @@ -6,6 +6,8 @@ import Confirm from '@/fragments/dialogs/confirm/Confirm' import Info from '@/fragments/dialogs/info/Info' import MainMenu from '@/common/main-menu' import utils from '@/support/utils' +import {EventBus} from '@/common/event-bus' + export default { data () { @@ -25,17 +27,17 @@ export default { }, created () { // Register the listener for the showLoading and titleChanged events - this.eventBus.$on('showLoading', (value) => { + EventBus.$on('showLoading', (value) => { this.showLoading = value }) - this.eventBus.$on('titleChanged', (title) => { + EventBus.$on('titleChanged', (title) => { this.title = title }) const favIcon = document.getElementById('favIcon') favIcon.href = utils.getImgSrc('favIcon') }, mounted() { - this.eventBus.$on('appLoaded', () => { + EventBus.$on('appLoaded', () => { MainMenu.adjustMenu() }) }, diff --git a/src/common/event-bus.js b/src/common/event-bus.js new file mode 100644 index 00000000..4a84e25a --- /dev/null +++ b/src/common/event-bus.js @@ -0,0 +1,5 @@ +import Vue from 'vue' + +// Create a global event bus, so all the components +// can access it to emit and capture events using EventBus +export const EventBus = new Vue() diff --git a/src/common/global-mixins.js b/src/common/global-mixins.js index 309c008f..9338789d 100755 --- a/src/common/global-mixins.js +++ b/src/common/global-mixins.js @@ -1,7 +1,8 @@ import * as showToaster from './show-toaster-mixin' import appConstants from '@/resources/constants' import AppHooks from '@/support/app-hooks' -import AppLoader from '@/app-loader' +import {EventBus} from '@/common/event-bus' + const globalMixins = { data: () => ({ @@ -15,11 +16,10 @@ const globalMixins = { confirm.text = text confirm.title = title confirm.neverOption = options && options.neverOption - let VueInstance = AppLoader.getInstance() - VueInstance.eventBus.$emit('triggerConfirm', confirm) + EventBus.$emit('triggerConfirm', confirm) return new Promise((resolve, reject) => { - VueInstance.eventBus.$on('confirmAnswered', (result) => { + EventBus.$on('confirmAnswered', (result) => { if (result.response === 'yes') { resolve(result) } else { @@ -32,11 +32,10 @@ const globalMixins = { const info = options || {} info.text = text info.title = title - let VueInstance = AppLoader.getInstance() - VueInstance.eventBus.$emit('triggerShowInfo', info) + EventBus.$emit('triggerShowInfo', info) return new Promise((resolve) => { - VueInstance.eventBus.$on('infoOk', () => { + EventBus.$on('infoOk', () => { resolve() }) }) diff --git a/src/common/prepared-vue.js b/src/common/prepared-vue.js index 30fc9d1b..44bd2756 100755 --- a/src/common/prepared-vue.js +++ b/src/common/prepared-vue.js @@ -114,11 +114,6 @@ Vue.use(VeeValidate) // Managing Date and Times Vue.use(VueMoment) -// Create a global event bus, so all the components -// can access it to emit and capture events using this.eventBus -const eventBus = new Vue() -Vue.prototype.eventBus = eventBus - // turn off console message saying we are in dev mode Vue.config.productionTip = false diff --git a/src/common/show-toaster-mixin.js b/src/common/show-toaster-mixin.js index 8bcd97cb..b3fc93cc 100755 --- a/src/common/show-toaster-mixin.js +++ b/src/common/show-toaster-mixin.js @@ -1,14 +1,13 @@ -import AppLoader from '@/app-loader' +import {EventBus} from '@/common/event-bus' + const showMessage = (msg, theme, options) => { options = options || {} - let VueInstance = AppLoader.getInstance() - VueInstance.eventBus.$emit('showSnack', { message: msg, theme: theme, options: options }) + EventBus.$emit('showSnack', { message: msg, theme: theme, options: options }) } const hideMessages = () => { - let VueInstance = AppLoader.getInstance() - VueInstance.eventBus.$emit('hideSnack') + EventBus.$emit('hideSnack') } const showError = (msg, options) => { diff --git a/src/fragments/box/box.js b/src/fragments/box/box.js index 635bcee3..3a4c0376 100755 --- a/src/fragments/box/box.js +++ b/src/fragments/box/box.js @@ -12,6 +12,8 @@ */ import theme from '@/config/theme' import utils from '@/support/utils' +import {EventBus} from '@/common/event-bus' + export default { props: { @@ -84,14 +86,14 @@ export default { // that allow us to synchronize the maximized boxes // setting each to not maximized if they are not the // last one (over the others) - this.eventBus.$on('boxMaximizedStackChanged', function (value) { + EventBus.$on('boxMaximizedStackChanged', function (value) { context.syncBoxesMaximized(value) }) // The box component listen to `closeBox` event so that // it is possible to close a box via eventBus, passing the // box guid - this.eventBus.$on('closeBox', function (boxGuid) { + EventBus.$on('closeBox', function (boxGuid) { if (context.guid === boxGuid) { context.close() } @@ -100,7 +102,7 @@ export default { // it is possible to resize a box via eventBus, passing the // an object containing the boxGuid and maximized boolean property // like {boxGuid: , maximized: true} - this.eventBus.$on('resizeBox', function (data) { + EventBus.$on('resizeBox', function (data) { if (context.guid === data.boxGuid) { context.resize(data.maximized) } @@ -236,7 +238,7 @@ export default { // Tell every body that the box was maximized/minimized const globalEvent = this.maximized ? 'boxMaximized' : 'boxMinimized' - this.eventBus.$emit(globalEvent, { maximized: maximized, guid: this.guid }) + EventBus.$emit(globalEvent, { maximized: maximized, guid: this.guid }) // Ff is not maximized, remove this box from the maximized stack if (!this.maximized) { diff --git a/src/fragments/box/box.store.js b/src/fragments/box/box.store.js index 8ef0493e..7ec5f8e5 100755 --- a/src/fragments/box/box.store.js +++ b/src/fragments/box/box.store.js @@ -1,4 +1,4 @@ -import AppLoader from '@/app-loader' +import {EventBus} from '@/common/event-bus' const state = { boxMaximizedStack: null @@ -13,8 +13,7 @@ const getters = { const mutations = { boxMaximizedStack: (state, value) => { state.boxMaximizedStack = value - let VueInstance = AppLoader.getInstance() - VueInstance.eventBus.$emit('boxMaximizedStackChanged', value) + EventBus.$emit('boxMaximizedStackChanged', value) } } diff --git a/src/fragments/charts/altitude/altitude.js b/src/fragments/charts/altitude/altitude.js index 3277bd5f..9c97380c 100644 --- a/src/fragments/charts/altitude/altitude.js +++ b/src/fragments/charts/altitude/altitude.js @@ -2,6 +2,7 @@ import LineChart from '@/fragments/charts/line-chart/line-chart' import ChartWrapper from '@/fragments/charts/chart-wrapper/ChartWrapper' import AltitudeDataParser from './altitude-parser' import MapViewData from '@/models/map-view-data' +import {EventBus} from '@/common/event-bus' export default { props: { @@ -36,7 +37,7 @@ export default { this.build() // Rebuild altitude data when the active route index change - this.eventBus.$on('activeRouteIndexChanged', this.build) + EventBus.$on('activeRouteIndexChanged', this.build) }, computed: { altitudeData () { @@ -78,11 +79,11 @@ export default { }, chartHoverIndexChanged (index) { if (this.propagateActivePoint) { - this.eventBus.$emit('altitudeChartHoverIndexChanged', index) + EventBus.$emit('altitudeChartHoverIndexChanged', index) } }, mouseLeftChart () { - this.eventBus.$emit('mouseLeftChartAltitudeChart') + EventBus.$emit('mouseLeftChartAltitudeChart') } } } diff --git a/src/fragments/dialogs/confirm/confirm.js b/src/fragments/dialogs/confirm/confirm.js index 4fffce50..976077fb 100755 --- a/src/fragments/dialogs/confirm/confirm.js +++ b/src/fragments/dialogs/confirm/confirm.js @@ -1,4 +1,6 @@ import utils from '@/support/utils' +import {EventBus} from '@/common/event-bus' + export default { data: () => ({ confirmPromise: null, @@ -37,21 +39,21 @@ export default { }, onYes () { this.show = false - this.eventBus.$emit('confirmAnswered', { response: 'yes', guid: this.guid }) + EventBus.$emit('confirmAnswered', { response: 'yes', guid: this.guid }) }, onNo () { this.show = false - this.eventBus.$emit('confirmAnswered', { response: 'no', guid: this.guid }) + EventBus.$emit('confirmAnswered', { response: 'no', guid: this.guid }) }, onNever () { this.show = false - this.eventBus.$emit('confirmAnswered', { response: 'never', guid: this.guid }) + EventBus.$emit('confirmAnswered', { response: 'never', guid: this.guid }) } }, created () { this.guid = utils.guid('confirm') this.$emit('confirmCreated', this.guid) - this.eventBus.$on('triggerConfirm', (confirm) => { + EventBus.$on('triggerConfirm', (confirm) => { this.showDialog(confirm) }) } diff --git a/src/fragments/dialogs/info/info.js b/src/fragments/dialogs/info/info.js index c1a1c375..59d3f6c8 100755 --- a/src/fragments/dialogs/info/info.js +++ b/src/fragments/dialogs/info/info.js @@ -1,4 +1,6 @@ import utils from '@/support/utils' +import {EventBus} from '@/common/event-bus' + export default { data: () => ({ infoPromise: null, @@ -35,13 +37,13 @@ export default { event.preventDefault() event.stopPropagation() this.show = false - this.eventBus.$emit('infoOk', { event: 'ok', guid: this.guid }) + EventBus.$emit('infoOk', { event: 'ok', guid: this.guid }) } }, created () { this.guid = utils.guid('info') this.$emit('infoCreated', this.guid) - this.eventBus.$on('triggerShowInfo', (info) => { + EventBus.$on('triggerShowInfo', (info) => { this.showDialog(info) }) } diff --git a/src/fragments/forms/fields-container/components/form-fields/form-fields.js b/src/fragments/forms/fields-container/components/form-fields/form-fields.js index 15b75288..7cc7fde7 100644 --- a/src/fragments/forms/fields-container/components/form-fields/form-fields.js +++ b/src/fragments/forms/fields-container/components/form-fields/form-fields.js @@ -1,7 +1,7 @@ - import dependencyService from '@/support/dependency-service.js' import defaultMapSettings from '@/config/default-map-settings' import SliderCombo from '../slider-combo/SliderCombo.vue' +import {EventBus} from '@/common/event-bus' export default { props: { @@ -28,7 +28,7 @@ export default { // Every time the active console tab changes // we refresh the single parameter model - this.eventBus.$on('filtersChangedExternally', () => { + EventBus.$on('filtersChangedExternally', () => { context.updateFieldsStatus() context.$forceUpdate() }) diff --git a/src/fragments/forms/map-form/components/isochrones/components/isochrones-details/isochrones-details.js b/src/fragments/forms/map-form/components/isochrones/components/isochrones-details/isochrones-details.js index 692d4b3d..608fc56d 100644 --- a/src/fragments/forms/map-form/components/isochrones/components/isochrones-details/isochrones-details.js +++ b/src/fragments/forms/map-form/components/isochrones/components/isochrones-details/isochrones-details.js @@ -4,6 +4,8 @@ import Print from '@/fragments/forms/map-form/components/print/Print' import PolygonUtils from '@/support/polygon-utils' import MapViewData from '@/models/map-view-data' import Utils from '@/support/utils' +import {EventBus} from '@/common/event-bus' + export default { data: () => ({ @@ -39,12 +41,12 @@ export default { return PolygonUtils.hasPlaceAsCenter(place, polygon) }, toggleVisibility (polygonIndex) { - this.eventBus.$emit('togglePolygonVisibility', polygonIndex) + EventBus.$emit('togglePolygonVisibility', polygonIndex) }, polygonOpacityChanged (polygonIndex) { let fillOpacity = this.localMapViewData.polygons[polygonIndex].properties.fillOpacity - this.eventBus.$emit('setPolygonOpacity', {polygonIndex, fillOpacity }) + EventBus.$emit('setPolygonOpacity', {polygonIndex, fillOpacity }) } }, watch: { diff --git a/src/fragments/forms/map-form/components/isochrones/isochrones.js b/src/fragments/forms/map-form/components/isochrones/isochrones.js index 0f393f78..fd918116 100644 --- a/src/fragments/forms/map-form/components/isochrones/isochrones.js +++ b/src/fragments/forms/map-form/components/isochrones/isochrones.js @@ -10,6 +10,7 @@ import constants from '@/resources/constants' import appConfig from '@/config/app-config' import Draggable from 'vuedraggable' import Place from '@/models/place' +import {EventBus} from '@/common/event-bus' // Local components import IschronesDetails from './components/isochrones-details/IsochronesDetails' @@ -39,13 +40,13 @@ export default { this.loadData() const context = this // When the filters object has changed externally, reprocess the app route - this.eventBus.$on('filtersChangedExternally', () => { + EventBus.$on('filtersChangedExternally', () => { if (context.active) { context.updateAppRoute() } }) // When the user click on a marker to remove it - this.eventBus.$on('removePlace', (data) => { + EventBus.$on('removePlace', (data) => { if (context.active) { context.removePlace(data) } @@ -54,7 +55,7 @@ export default { /** * Update local object when a mapViewData is uploaded */ - this.eventBus.$on('mapViewDataUploaded', (mapViewData) => { + EventBus.$on('mapViewDataUploaded', (mapViewData) => { if (context.active) { context.mapViewData = mapViewData context.places = mapViewData.places @@ -65,7 +66,7 @@ export default { * If the map data view has changed and this component * is not active, then reset its data to the initial state */ - this.eventBus.$on('mapViewDataChanged', () => { + EventBus.$on('mapViewDataChanged', () => { if (!context.active) { context.mapViewData = new MapViewData() context.places = [new Place()] @@ -73,7 +74,7 @@ export default { }) // Avoid polygons changed, so recalculate the route - this.eventBus.$on('avoidPolygonsChanged', (polygons) => { + EventBus.$on('avoidPolygonsChanged', (polygons) => { if (context.active) { context.$root.appHooks.run('avoidPolygonsChangedInIsochrones', polygons) context.avoidPolygonsFilterAccessor.value = polygons @@ -84,13 +85,13 @@ export default { } }) // When the user click on the map and select to add this point as an additional destination in the route - this.eventBus.$on('addAsIsochroneCenter', (data) => { + EventBus.$on('addAsIsochroneCenter', (data) => { context.addAsIsochroneCenter(data) }) // When a marker drag finishes, update // the place coordinates and re render the map - this.eventBus.$on('markerDragged', (marker) => { + EventBus.$on('markerDragged', (marker) => { if (context.active) { const place = new Place(marker.position.lng, marker.position.lat) context.places[marker.inputIndex] = place @@ -100,7 +101,7 @@ export default { } }) - this.eventBus.$on('setInputPlace', (data) => { + EventBus.$on('setInputPlace', (data) => { if (context.active) { context.places[data.pickPlaceIndex] = data.place let filledPlaces = context.getFilledPlaces() diff --git a/src/fragments/forms/map-form/components/map-form-mixin.js b/src/fragments/forms/map-form/components/map-form-mixin.js index cf5d1c88..431dccef 100644 --- a/src/fragments/forms/map-form/components/map-form-mixin.js +++ b/src/fragments/forms/map-form/components/map-form-mixin.js @@ -5,6 +5,7 @@ import AppRouteData from '@/models/app-route-data' import MapViewData from '@/models/map-view-data' import constants from '@/resources/constants' import Place from '@/models/place' +import {EventBus} from '@/common/event-bus' export default { props: { @@ -125,8 +126,8 @@ export default { this.addPlaceInput() this.$store.commit('appRouteData', new AppRouteData()) this.$store.commit('mode', constants.modes.place) - this.eventBus.$emit('mapViewDataChanged', this.mapViewData) - this.eventBus.$emit('clearMap') + EventBus.$emit('mapViewDataChanged', this.mapViewData) + EventBus.$emit('clearMap') this.updateAppRoute() }, /** diff --git a/src/fragments/forms/map-form/components/place-and-directions/components/altitude-preview/altitude-preview.js b/src/fragments/forms/map-form/components/place-and-directions/components/altitude-preview/altitude-preview.js index a4954841..ee1d5863 100644 --- a/src/fragments/forms/map-form/components/place-and-directions/components/altitude-preview/altitude-preview.js +++ b/src/fragments/forms/map-form/components/place-and-directions/components/altitude-preview/altitude-preview.js @@ -1,5 +1,6 @@ import Altitude from '@/fragments/charts/altitude/Altitude' import MapViewData from '@/models/map-view-data' +import {EventBus} from '@/common/event-bus' export default { props: { @@ -22,7 +23,7 @@ export default { if (this.$lowResolution) { this.$store.commit('setLeftSideBarIsOpen', false) } - this.eventBus.$emit('showAltitudeModal') + EventBus.$emit('showAltitudeModal') } } } diff --git a/src/fragments/forms/map-form/components/place-and-directions/components/route-details/components/extras/route-extras.js b/src/fragments/forms/map-form/components/place-and-directions/components/route-details/components/extras/route-extras.js index 139d681a..5a2be716 100644 --- a/src/fragments/forms/map-form/components/place-and-directions/components/route-details/components/extras/route-extras.js +++ b/src/fragments/forms/map-form/components/place-and-directions/components/route-details/components/extras/route-extras.js @@ -1,5 +1,5 @@ - import orsDictionary from '@/resources/ors-dictionary' +import {EventBus} from '@/common/event-bus' export default { props: { @@ -109,7 +109,7 @@ export default { * @param {String} extraKey * @param {Integer} value * @param {Integer} index - * @emits highlightPolylineSections (via eventBus) + * @emits highlightPolylineSections (via EventBus) */ showSection (extraKey, value, index) { const sectionTitle = this.$t('global.' + extraKey).toLowerCase() @@ -118,7 +118,7 @@ export default { const polylineData = this.buildExtraHighlighPolylineData(extraKey, index, value) highlighData.sections.push(polylineData) - this.eventBus.$emit('highlightPolylineSections', highlighData) + EventBus.$emit('highlightPolylineSections', highlighData) }, /** * Handle the show all sections click by @@ -140,7 +140,7 @@ export default { highlighData.sections.push(polylineData) index++ } - this.eventBus.$emit('highlightPolylineSections', highlighData) + EventBus.$emit('highlightPolylineSections', highlighData) }, /** * Build the the extra info highlighting data diff --git a/src/fragments/forms/map-form/components/place-and-directions/components/route-details/components/steps/steps.js b/src/fragments/forms/map-form/components/place-and-directions/components/route-details/components/steps/steps.js index aac11b4e..a3d49c3b 100644 --- a/src/fragments/forms/map-form/components/place-and-directions/components/route-details/components/steps/steps.js +++ b/src/fragments/forms/map-form/components/place-and-directions/components/route-details/components/steps/steps.js @@ -1,6 +1,6 @@ - import InstructionCodeToSymbol from '@/resources/lists/instruction-code-to-symbol' import constants from '@/resources/constants' +import {EventBus} from '@/common/event-bus' export default { props: { @@ -19,7 +19,7 @@ export default { const highlighData = {sectionTitle, sections: [] } const segmentData = this.buildExtraHighlighPolylineData(step, index) highlighData.sections.push(segmentData) - this.eventBus.$emit('highlightPolylineSections', highlighData) + EventBus.$emit('highlightPolylineSections', highlighData) }, buildExtraHighlighPolylineData (step) { const color = constants.segmentHighlightColor diff --git a/src/fragments/forms/map-form/components/place-and-directions/components/route-details/route-details.js b/src/fragments/forms/map-form/components/place-and-directions/components/route-details/route-details.js index 4e035266..e1a59d8e 100644 --- a/src/fragments/forms/map-form/components/place-and-directions/components/route-details/route-details.js +++ b/src/fragments/forms/map-form/components/place-and-directions/components/route-details/route-details.js @@ -6,6 +6,8 @@ import MapViewData from '@/models/map-view-data' import Steps from './components/steps/Steps' import constants from '@/resources/constants' import geoUtils from '@/support/geo-utils' +import {EventBus} from '@/common/event-bus' + export default { props: { @@ -91,7 +93,7 @@ export default { }, routeOpacityChanged (routeIndex) { let opacity = this.localMapViewData.routes[routeIndex].properties.opacity - this.eventBus.$emit('setRouteOpacity', {routeIndex, opacity }) + EventBus.$emit('setRouteOpacity', {routeIndex, opacity }) }, /** * Get the route summary with humanized @@ -143,7 +145,7 @@ export default { * @emits changeActiveRouteIndex */ changeActiveRouteIndex (index) { - this.eventBus.$emit('changeActiveRouteIndex', index) + EventBus.$emit('changeActiveRouteIndex', index) }, /** * When a segment is clicked @@ -159,7 +161,7 @@ export default { const highlighData = {sectionTitle, sections: [] } const segmentData = this.buildExtraHighlighPolylineData(segment, index) highlighData.sections.push(segmentData) - this.eventBus.$emit('highlightPolylineSections', highlighData) + EventBus.$emit('highlightPolylineSections', highlighData) }, /** * Build the the extra info highlighting data diff --git a/src/fragments/forms/map-form/components/place-and-directions/places-and-directions.js b/src/fragments/forms/map-form/components/place-and-directions/places-and-directions.js index 560a22f7..9ef417c8 100644 --- a/src/fragments/forms/map-form/components/place-and-directions/places-and-directions.js +++ b/src/fragments/forms/map-form/components/place-and-directions/places-and-directions.js @@ -21,6 +21,7 @@ import PlaceDetails from './components/place-details/PlaceDetails.vue' import RoundTrip from './components/round-trip/RoundTrip.vue' import FormActions from '../form-actions/FormActions' import MapFormMixin from '../map-form-mixin' +import {EventBus} from '@/common/event-bus' export default { mixins: [MapFormMixin], @@ -173,7 +174,7 @@ export default { // When the simple map search send a place // set the sent place as the destination of a route - this.eventBus.$on('openDirectionsMode', (place) => { + EventBus.$on('openDirectionsMode', (place) => { context.setTargetPlaceForDirections(place) context.setViewMode(constants.modes.directions) context.updateAppRoute() @@ -181,7 +182,7 @@ export default { // When the simple map search sends a place // set the sent place as the destination of a route - this.eventBus.$on('switchToDirections', () => { + EventBus.$on('switchToDirections', () => { if (context.places.length === 1) { context.addPlaceInput() } @@ -194,7 +195,7 @@ export default { // When a marker drag finishes, update // the place coordinates and re render the map - this.eventBus.$on('markerDragged', (marker) => { + EventBus.$on('markerDragged', (marker) => { if (context.active) { context.places[marker.inputIndex].setLnglat(marker.position.lng, marker.position.lat) // remove the name so that the resolve will use only the coordinates @@ -211,7 +212,7 @@ export default { }) // When a marker is marked as a start place of // a direct segment - this.eventBus.$on('directChanged', (data) => { + EventBus.$on('directChanged', (data) => { if (context.active) { context.places[data.index] = data.place context.updateAppRoute() @@ -219,7 +220,7 @@ export default { }) // When the filters object has changed externally, reprocess the app route - this.eventBus.$on('filtersChangedExternally', () => { + EventBus.$on('filtersChangedExternally', () => { // Filters are only used to calculate route (directions or round trip) // so we must update the app route if we are already // in directions/round trip mode if all the place inputs are filled @@ -235,37 +236,37 @@ export default { }) // When the user click on the map and select a point as the route start - this.eventBus.$on('directionsFromPoint', (data) => { + EventBus.$on('directionsFromPoint', (data) => { this.$store.commit('pointerTriggeredAction', true) context.directionsFromPoint(data) }) // When the user click on the map and select a point as the route end - this.eventBus.$on('directionsToPoint', (data) => { + EventBus.$on('directionsToPoint', (data) => { this.$store.commit('pointerTriggeredAction', true) context.directionsToPoint(data) }) // When the user click on the map and select to add this point to the route - this.eventBus.$on('addRouteStop', (data) => { + EventBus.$on('addRouteStop', (data) => { this.$store.commit('pointerTriggeredAction', true) context.addRouteStop(data) }) // When the user click on a marker to remove it - this.eventBus.$on('removePlace', (data) => { + EventBus.$on('removePlace', (data) => { if (context.active) { context.removePlaceInput(data, true) } }) // When the user click on the map and select to add this point as an additional destination in the route - this.eventBus.$on('addDestinationToRoute', (data) => { + EventBus.$on('addDestinationToRoute', (data) => { context.addDestinationToRoute(data) }) // Avoid polygons changed, so recalculate the route - this.eventBus.$on('avoidPolygonsChanged', (polygons) => { + EventBus.$on('avoidPolygonsChanged', (polygons) => { if (context.active) { context.$root.appHooks.run('avoidPolygonsChangedInDirections', polygons) context.avoidPolygonsFilterAccessor.value = polygons @@ -277,18 +278,18 @@ export default { // If the app is in a low resolution mode // hide the sidebar when route sections are highlighted - this.eventBus.$on('highlightPolylineSections', () => { + EventBus.$on('highlightPolylineSections', () => { const sidebarVisible = !context.$lowResolution context.setSidebarIsOpen(sidebarVisible) }) // reload the map data after the app route has changed - this.eventBus.$on('appRouteDataChanged', (appRouteData) => { + EventBus.$on('appRouteDataChanged', (appRouteData) => { context.reloadAfterAppRouteDataChanged(appRouteData) }) // Update local object when a mapViewData is uploaded - this.eventBus.$on('mapViewDataUploaded', (mapViewData) => { + EventBus.$on('mapViewDataUploaded', (mapViewData) => { if (context.active) { context.mapViewData = mapViewData context.places = mapViewData.places @@ -298,14 +299,14 @@ export default { * If the map data view has changed and this component * is not active, then reset its data to the initial state */ - this.eventBus.$on('mapViewDataChanged', () => { + EventBus.$on('mapViewDataChanged', () => { if (!context.active) { context.mapViewData = new MapViewData() context.places = [new Place()] } }) - this.eventBus.$on('setInputPlace', (data) => { + EventBus.$on('setInputPlace', (data) => { if (context.active) { context.places[data.pickPlaceIndex] = data.place let filledPlaces = context.getFilledPlaces() @@ -367,7 +368,7 @@ export default { if (!place.unresolved) { resolve(place) } else { - this.eventBus.$emit('showLoading', true) + EventBus.$emit('showLoading', true) context.searching = true place.resolve(this.$store.getters.appRouteData.options.zoom).then(() => { resolve(place) @@ -533,7 +534,7 @@ export default { this.mapViewData.places = places this.mapViewData.routes = [] this.mapViewData.timestamp = Date.now() - this.eventBus.$emit('mapViewDataChanged', this.mapViewData) + EventBus.$emit('mapViewDataChanged', this.mapViewData) }, /** @@ -572,7 +573,7 @@ export default { prepareDirectionsViewAndData () { this.setViewMode(constants.modes.directions) this.setSidebarIsOpen() - this.eventBus.$emit('newInfoAvailable') + EventBus.$emit('newInfoAvailable') // Only calculate a route if there are more then one place defined if (this.getFilledPlaces().length > 1) { @@ -582,7 +583,7 @@ export default { }) } else { // The app might be in directions mode, but containing for example, only the destination this.mapViewData.places = this.places - this.eventBus.$emit('mapViewDataChanged', this.mapViewData) + EventBus.$emit('mapViewDataChanged', this.mapViewData) } }, /** @@ -748,7 +749,7 @@ export default { this.setFocusedPlaceInput(this.places.length - 1) this.switchPlaceInputsValues() this.setViewMode(constants.modes.directions) - this.eventBus.$emit('clearMap') + EventBus.$emit('clearMap') this.updateAppRoute() }, @@ -796,7 +797,7 @@ export default { // in order to allow the user to continue to // use the directions mode, add a place input if (keepDirectionsMode && placeInputsBeforeRemoval === 2) { - this.eventBus.$emit('newInfoAvailable', false) + EventBus.$emit('newInfoAvailable', false) setTimeout(() => { this.addInput() this.setViewMode(constants.modes.directions) @@ -842,7 +843,7 @@ export default { this.mapViewData.options = options // Notify the listeners that the MapViewData has changed - this.eventBus.$emit('mapViewDataChanged', this.mapViewData) + EventBus.$emit('mapViewDataChanged', this.mapViewData) // Update the place view for the place input // at index 0 (the only one) @@ -863,7 +864,7 @@ export default { this.updateAppRoute() } else if (filledPlaces.length > 0) { this.mapViewData.places = filledPlaces - this.eventBus.$emit('mapViewDataChanged', this.mapViewData) + EventBus.$emit('mapViewDataChanged', this.mapViewData) } this.searching = false }, @@ -890,7 +891,7 @@ export default { appRouteData.options = {} this.$store.commit('appRouteData', appRouteData) this.mapViewData = new MapViewData() - this.eventBus.$emit('mapViewDataChanged', this.mapViewData) + EventBus.$emit('mapViewDataChanged', this.mapViewData) }, /** * Reset a place input at a given index diff --git a/src/fragments/forms/place-input/place-input.js b/src/fragments/forms/place-input/place-input.js index f7e17a0c..bece1be8 100644 --- a/src/fragments/forms/place-input/place-input.js +++ b/src/fragments/forms/place-input/place-input.js @@ -5,6 +5,7 @@ import appConfig from '@/config/app-config' import GeoUtils from '@/support/geo-utils' import Place from '@/models/place' import Utils from '@/support/utils' +import {EventBus} from '@/common/event-bus' export default { @@ -89,7 +90,7 @@ export default { const context = this - this.eventBus.$on('suggestionsUpdated', (data) => { + EventBus.$on('suggestionsUpdated', (data) => { context.suggestionUpdated(data) }) this.resolveModel() @@ -442,7 +443,7 @@ export default { */ resolvePlace () { const place = this.localModel - this.eventBus.$emit('showLoading', true) + EventBus.$emit('showLoading', true) const context = this return new Promise((resolve, reject) => { context.searching = false @@ -498,7 +499,7 @@ export default { const context = this // Run the place search - this.eventBus.$emit('showLoading', true) + EventBus.$emit('showLoading', true) PlacesSearch(this.localModel.placeName, 10).then(places => { context.localModel.setSuggestions(places) context.focused = true @@ -525,7 +526,7 @@ export default { */ autocompleteByCoords () { const latlng = this.model.getLatLng() - this.eventBus.$emit('showLoading', true) + EventBus.$emit('showLoading', true) const context = this ReverseGeocode(latlng.lat, latlng.lng, 10).then(places => { const place = new Place(latlng.lng, latlng.lat) @@ -591,7 +592,7 @@ export default { if (!this.localModel.nameIsCoord()) { let context = this if (appConfig.autoSelectFirstExactAddressMatchOnSearchEnter) { - this.eventBus.$emit('showLoading', true) + EventBus.$emit('showLoading', true) PlacesSearch(this.localModel.placeName, 10).then(places => { // If the first result is an address and the match_type is exact, // then we auto select the first item on the enter/return action diff --git a/src/fragments/forms/profile-selector/profile-selector.js b/src/fragments/forms/profile-selector/profile-selector.js index da184f8f..6488d2b9 100644 --- a/src/fragments/forms/profile-selector/profile-selector.js +++ b/src/fragments/forms/profile-selector/profile-selector.js @@ -4,6 +4,7 @@ import defaultMapSettings from '@/config/default-map-settings' import ProfileSelectorOption from './components/profile-selector-option/ProfileSelectorOption' import lodash from 'lodash' import constants from '@/resources/constants' +import {EventBus} from '@/common/event-bus' export default { data: () => ({ @@ -80,7 +81,7 @@ export default { }, notifyProfileChanged () { - this.eventBus.$emit('filtersChangedExternally') + EventBus.$emit('filtersChangedExternally') }, /** diff --git a/src/fragments/forms/settings/settings.js b/src/fragments/forms/settings/settings.js index 225023b0..d73efa0d 100644 --- a/src/fragments/forms/settings/settings.js +++ b/src/fragments/forms/settings/settings.js @@ -4,6 +4,7 @@ import defaultMapSettings from '@/config/default-map-settings' import constants from '@/resources/constants' import utils from '@/support/utils' import lodash from 'lodash' +import {EventBus} from '@/common/event-bus' export default { data: () => ({ @@ -64,12 +65,12 @@ export default { } }) } - this.eventBus.$emit('mapSettingsChanged', savingSettings) + EventBus.$emit('mapSettingsChanged', savingSettings) this.$emit('saved') }) } // Dispatch an event about the locale change - this.eventBus.$emit('localeChanged', this.mapSettingsTransient.locale) + EventBus.$emit('localeChanged', this.mapSettingsTransient.locale) }, saveAll () { if (!this.validateSettings()) { diff --git a/src/fragments/forms/simple-place-search/simple-place-search.js b/src/fragments/forms/simple-place-search/simple-place-search.js index 998d498a..fe1e2d81 100644 --- a/src/fragments/forms/simple-place-search/simple-place-search.js +++ b/src/fragments/forms/simple-place-search/simple-place-search.js @@ -10,6 +10,7 @@ import MapViewData from '@/models/map-view-data' import { PlacesSearch } from '@/support/ors-api-runner' import constants from '@/resources/constants' import Place from '@/models/place' +import {EventBus} from '@/common/event-bus' export default { data: () => ({ @@ -93,7 +94,7 @@ export default { // Set marker clicked event listener // When in search place mode, if the marker is clicked, we select it as the target // for the inputIndex - this.eventBus.$on('markerClicked', (marker) => { + EventBus.$on('markerClicked', (marker) => { const lat = marker.data.geometry.coordinates[1] const lng = marker.data.geometry.coordinates[0] const placeOptions = { resolve: false, id: marker.data.properties.id } @@ -103,13 +104,13 @@ export default { // When a marker drag finishes, update // the place coordinates and re render the map - this.eventBus.$on('markerDragged', (marker) => { + EventBus.$on('markerDragged', (marker) => { context.place.coordinates = [marker.position.lng, marker.position.lat] context.loadData() }) // reload the map data after the app route has changed - this.eventBus.$on('appRouteDataChanged', (appRouteData) => { + EventBus.$on('appRouteDataChanged', (appRouteData) => { context.reloadAfterAppRouteDataChanged(appRouteData) }) @@ -117,26 +118,26 @@ export default { // side bar is not opened, notify visually that there // new data about the route calculated that can be seen // by opening the sidebar - this.eventBus.$on('newInfoAvailable', (available) => { + EventBus.$on('newInfoAvailable', (available) => { if (!context.$store.getters.isSidebarVisible) { context.newInfoAvailable = available } }) - this.eventBus.$on('searched', () => { + EventBus.$on('searched', () => { if (!context.$store.getters.isSidebarVisible) { context.newInfoAvailable = true } context.$emit('searched') }) - this.eventBus.$on('refreshSearch', () => { + EventBus.$on('refreshSearch', () => { context.refreshSearch() }) // When the user click on a marker to remove it // and there is only one place - this.eventBus.$on('removePlace', () => { + EventBus.$on('removePlace', () => { if (context.$store.getters.mode === constants.modes.place) { context.place = new Place() } @@ -209,7 +210,7 @@ export default { // the only search result place must auto selected as target if (this.$store.getters.mode === constants.modes.search && this.mapViewData.places.length === 1) { this.place = this.mapViewData.places[0] - this.eventBus.$emit('openDirectionsMode', this.place) + EventBus.$emit('openDirectionsMode', this.place) } else { if (this.place.isEmpty()) { // place has no lat and lng // Make sure that the place will @@ -218,9 +219,9 @@ export default { // It must be resolved using its coordinates this.place.placeName = '' this.place.unresolved = false - this.eventBus.$emit('switchToDirections') + EventBus.$emit('switchToDirections') } else { - this.eventBus.$emit('openDirectionsMode', this.place) + EventBus.$emit('openDirectionsMode', this.place) } } this.openingRouteMode = true @@ -251,7 +252,7 @@ export default { this.mapViewData.places = places this.mapViewData.routes = [] this.mapViewData.timestamp = Date.now() - this.eventBus.$emit('mapViewDataChanged', this.mapViewData) + EventBus.$emit('mapViewDataChanged', this.mapViewData) }, /** @@ -279,7 +280,7 @@ export default { */ placeCleared () { this.place = new Place() - this.eventBus.$emit('clearMap') + EventBus.$emit('clearMap') this.$forceUpdate() this.searching = true this.updateAppRoute() @@ -294,7 +295,7 @@ export default { const context = this // Run the place search - this.eventBus.$emit('showLoading', true) + EventBus.$emit('showLoading', true) PlacesSearch(this.place.placeName).then(places => { if (places.length === 0) { this.showInfo(this.$t('simplePlaceSearch.noPlaceFound')) diff --git a/src/fragments/header/header.js b/src/fragments/header/header.js index f9093c33..927294a0 100755 --- a/src/fragments/header/header.js +++ b/src/fragments/header/header.js @@ -2,6 +2,8 @@ import menuManager from '@/support/menu-manager' import resolver from '@/support/routes-resolver' import appConfig from '@/config/app-config' import utils from '@/support/utils' +import {EventBus} from '@/common/event-bus' + export default { data () { @@ -32,7 +34,7 @@ export default { const context = this context.menuItems = context.$store.getters.mainMenu - this.eventBus.$on('routeChanged', (routeParams) => { + EventBus.$on('routeChanged', (routeParams) => { if (context.menuItems.length > 0) { menuManager.setMenuActiveStatus(context.menuItems, routeParams.to) } diff --git a/src/fragments/map-view/components/map-left-click/map-left-click.js b/src/fragments/map-view/components/map-left-click/map-left-click.js index f66bf0a0..2dfde863 100644 --- a/src/fragments/map-view/components/map-left-click/map-left-click.js +++ b/src/fragments/map-view/components/map-left-click/map-left-click.js @@ -9,6 +9,7 @@ import { ReverseGeocode } from '@/support/ors-api-runner' import GeoUtils from '@/support/geo-utils' import Place from '@/models/place' +import {EventBus} from '@/common/event-bus' export default { data () { @@ -109,7 +110,7 @@ export default { */ resolvePoint (lat, lng) { return new Promise((resolve, reject) => { - this.eventBus.$emit('showLoading', true) + EventBus.$emit('showLoading', true) const context = this ReverseGeocode(lat, lng).then(places => { if (places.length > 0) { @@ -123,7 +124,7 @@ export default { console.log(response) reject(response) }).finally(() => { - this.eventBus.$emit('showLoading', false) + EventBus.$emit('showLoading', false) }) }) }, @@ -177,10 +178,10 @@ export default { }, created () { const context = this - this.eventBus.$on('mapLeftClicked', (data) => { + EventBus.$on('mapLeftClicked', (data) => { context.mapLeftClick(data) }) - this.eventBus.$on('mapRightClicked', () => { + EventBus.$on('mapRightClicked', () => { context.showLeftClickPopup = false }) } diff --git a/src/fragments/map-view/components/map-right-click/map-right-click.js b/src/fragments/map-view/components/map-right-click/map-right-click.js index 50a8523d..8553d323 100644 --- a/src/fragments/map-view/components/map-right-click/map-right-click.js +++ b/src/fragments/map-view/components/map-right-click/map-right-click.js @@ -2,6 +2,7 @@ import constants from '@/resources/constants' import MapViewData from '@/models/map-view-data' import appConfig from '@/config/app-config' import lodash from 'lodash' +import {EventBus} from '@/common/event-bus' /** * Render and deals with right click events @@ -135,10 +136,10 @@ export default { }, created () { const context = this - this.eventBus.$on('mapRightClicked', (data) => { + EventBus.$on('mapRightClicked', (data) => { context.mapRightClick(data) }) - this.eventBus.$on('mapLeftClicked', () => { + EventBus.$on('mapLeftClicked', () => { context.showRightClickPopup = false }) }, diff --git a/src/fragments/map-view/map-view.js b/src/fragments/map-view/map-view.js index f95b72fb..ba7b6007 100644 --- a/src/fragments/map-view/map-view.js +++ b/src/fragments/map-view/map-view.js @@ -67,6 +67,7 @@ import GeoUtils from '@/support/geo-utils' import Utils from '@/support/utils' import theme from '@/config/theme' import Place from '@/models/place' +import {EventBus} from '@/common/event-bus' import 'vue2-leaflet-draw-toolbar' import Leaflet from 'leaflet' import lodash from 'lodash' @@ -822,7 +823,7 @@ export default { alternativeRouteIndexSelected (index, event) { event.originalEvent.stopPropagation() event.originalEvent.preventDefault() - this.eventBus.$emit('activeRouteIndexChanged', index) + EventBus.$emit('activeRouteIndexChanged', index) this.setActiveRouteIndex(index) }, /** @@ -1337,7 +1338,7 @@ export default { // If the app is in a low resolution mode // hide the sidebar so that the features can be seen if (this.$lowResolution) { - this.eventBus.$emit('setSidebarStatus', false) + EventBus.$emit('setSidebarStatus', false) } }, @@ -1397,11 +1398,11 @@ export default { GeoUtils.normalizeCoordinates(event.latlng) const data = { event, mapEl, canAddStop: this.canAddStop } // Event to be catch by the MapRightClick.vue component - this.eventBus.$emit('mapRightClicked', data) + EventBus.$emit('mapRightClicked', data) } this.clickLatlng = { lat: event.latlng.lat, lng: event.latlng.lng } } else if (this.$store.getters.isSidebarVisible) { - this.eventBus.$emit('setSidebarStatus', false) + EventBus.$emit('setSidebarStatus', false) } }, @@ -1428,7 +1429,7 @@ export default { // must close the side bar to allow the user to interact with the map. // If not then the normal left click handler must be executed if (this.$store.getters.isSidebarVisible && this.$lowResolution) { - this.eventBus.$emit('setSidebarStatus', false) + EventBus.$emit('setSidebarStatus', false) } this.handleShowLeftClickPlaceInfo(event) } @@ -1463,7 +1464,7 @@ export default { const insidePolygon = this.isPointInsidePolygons(event.latlng) GeoUtils.normalizeCoordinates(event.latlng) const data = { event, insidePolygon } - this.eventBus.$emit('mapLeftClicked', data) + EventBus.$emit('mapLeftClicked', data) this.clickLatlng = { lat: event.latlng.lat, lng: event.latlng.lng } } }, @@ -1985,23 +1986,23 @@ export default { setListeners () { const context = this - this.eventBus.$on('clearMap', context.clearMap) + EventBus.$on('clearMap', context.clearMap) - this.eventBus.$on('changeActiveRouteIndex', context.setActiveRouteIndex) + EventBus.$on('changeActiveRouteIndex', context.setActiveRouteIndex) - this.eventBus.$on('altitudeChartHoverIndexChanged', context.highlightRoutePoint) + EventBus.$on('altitudeChartHoverIndexChanged', context.highlightRoutePoint) - this.eventBus.$on('mouseLeftChartAltitudeChart', context.removeRoutePoint) + EventBus.$on('mouseLeftChartAltitudeChart', context.removeRoutePoint) - this.eventBus.$on('showAltitudeModal', () => { context.isAltitudeModalOpen = true }) + EventBus.$on('showAltitudeModal', () => { context.isAltitudeModalOpen = true }) - this.eventBus.$on('mapSettingsChanged', context.setProviders) + EventBus.$on('mapSettingsChanged', context.setProviders) - this.eventBus.$on('placeFocusChanged', context.placeFocusChanged) + EventBus.$on('placeFocusChanged', context.placeFocusChanged) - this.eventBus.$on('highlightPolylineSections', context.highlightPolylineSections) + EventBus.$on('highlightPolylineSections', context.highlightPolylineSections) - this.eventBus.$on('redrawAndFitMap', (data) => { + EventBus.$on('redrawAndFitMap', (data) => { if (data.guid && data.guid === context.guid) { context.adjustMap() } diff --git a/src/fragments/sidebar/components/top-menu/top-menu.js b/src/fragments/sidebar/components/top-menu/top-menu.js index 1b9a07ab..37f4da2c 100644 --- a/src/fragments/sidebar/components/top-menu/top-menu.js +++ b/src/fragments/sidebar/components/top-menu/top-menu.js @@ -1,4 +1,6 @@ import FloatingMenu from './components/floating-menu/FloatingMenu' +import {EventBus} from '@/common/event-bus' + export default { data () { @@ -32,7 +34,7 @@ export default { }, settingsClicked () { this.settingsTooltipClicked = true - this.eventBus.$emit('showSettingsModal') + EventBus.$emit('showSettingsModal') } }, components: { diff --git a/src/fragments/sidebar/sidebar.js b/src/fragments/sidebar/sidebar.js index 76ba8d2c..c6ceb027 100755 --- a/src/fragments/sidebar/sidebar.js +++ b/src/fragments/sidebar/sidebar.js @@ -5,6 +5,8 @@ import resolver from '@/support/routes-resolver' import Footer from '@/fragments/footer/Footer' import appConfig from '@/config/app-config' import utils from '@/support/utils' +import {EventBus} from '@/common/event-bus' + export default { data () { @@ -66,7 +68,7 @@ export default { * Set sidebar open status */ const context = this - this.eventBus.$on('setSidebarStatus', (isOpen) => { + EventBus.$on('setSidebarStatus', (isOpen) => { // pass a boolean that indicates 'force' context.$store.commit('setLeftSideBarIsOpen', isOpen) }) diff --git a/src/fragments/toaster/toaster.js b/src/fragments/toaster/toaster.js index dd33d2ed..27d7ea84 100755 --- a/src/fragments/toaster/toaster.js +++ b/src/fragments/toaster/toaster.js @@ -1,3 +1,5 @@ +import {EventBus} from '@/common/event-bus' + export default { data () { return { @@ -58,10 +60,10 @@ export default { } }, created () { - this.eventBus.$on('showSnack', (snack) => { + EventBus.$on('showSnack', (snack) => { this.show(snack) }) - this.eventBus.$on('hideSnack', () => { + EventBus.$on('hideSnack', () => { this.hide() }) } diff --git a/src/pages/maps/maps.js b/src/pages/maps/maps.js index 2c87f61a..e89d4f97 100644 --- a/src/pages/maps/maps.js +++ b/src/pages/maps/maps.js @@ -15,6 +15,7 @@ import constants from '@/resources/constants' import { ResizeObserver } from 'vue-resize' import Place from '@/models/place' import lodash from 'lodash' +import {EventBus} from '@/common/event-bus' export default { data: () => ({ @@ -273,7 +274,7 @@ export default { // the map bounds have been already defined by the user this.refreshingSearch = true this.searchBtnAvailable = false - this.eventBus.$emit('refreshSearch') + EventBus.$emit('refreshSearch') }, /** * Get current map place center @@ -363,14 +364,14 @@ export default { * @param {*} data */ removePlace (data) { - this.eventBus.$emit('removePlace', data) + EventBus.$emit('removePlace', data) }, /** * Remove place * @param {*} data */ directChanged (data) { - this.eventBus.$emit('directChanged', data) + EventBus.$emit('directChanged', data) }, /** * Close bottom nav component @@ -385,7 +386,7 @@ export default { * @emits placeFocusChanged [via eventBus] */ placeIndexSelectedInBottomNav (index) { - this.eventBus.$emit('placeFocusChanged', this.mapViewData.places[index]) + EventBus.$emit('placeFocusChanged', this.mapViewData.places[index]) }, /** * Set the map view data object and emit a event to redraw the map @@ -448,7 +449,7 @@ export default { * @emits appRouteDataChanged */ loadRoute () { - this.eventBus.$emit('clearMap') + EventBus.$emit('clearMap') // After clearing the map, wait a bit to load the new route var appRouteData = false @@ -462,7 +463,7 @@ export default { this.$store.commit('appRouteData', appRouteData) if (this.$route.name !== 'MapLocation') { this.storeZoomValue() - this.eventBus.$emit('appRouteDataChanged', appRouteData) + EventBus.$emit('appRouteDataChanged', appRouteData) } } } @@ -485,7 +486,7 @@ export default { * @emits markerDragged via eventBus */ markerDragged (marker) { - this.eventBus.$emit('markerDragged', marker) + EventBus.$emit('markerDragged', marker) }, /** @@ -497,7 +498,7 @@ export default { * @emits directionsFromPoint via eventBus */ directionsFromPoint (data) { - this.eventBus.$emit('directionsFromPoint', data) + EventBus.$emit('directionsFromPoint', data) }, /** * Trigger directions based on the data passed @@ -509,7 +510,7 @@ export default { */ directionsToPoint (data) { let context = this - this.eventBus.$emit('clearMap') + EventBus.$emit('clearMap') setTimeout(() => { this.mapViewData.places = [data.place] context.eventBus.$emit('directionsToPoint', data) @@ -525,7 +526,7 @@ export default { */ setInputPlace (data) { if (data.pickPlaceIndex !== null) { - this.eventBus.$emit('setInputPlace', data) + EventBus.$emit('setInputPlace', data) } }, /** @@ -552,7 +553,7 @@ export default { * @emits addAsIsochroneCenter via eventBus */ addAsIsochroneCenter (data) { - this.eventBus.$emit('addAsIsochroneCenter', data) + EventBus.$emit('addAsIsochroneCenter', data) }, /** @@ -564,7 +565,7 @@ export default { * @emits addRouteStop via eventBus */ addRouteStop (data) { - this.eventBus.$emit('addRouteStop', data) + EventBus.$emit('addRouteStop', data) }, /** * When an `add destination to route` option is hit, @@ -575,7 +576,7 @@ export default { * @emits addDestinationToRoute via eventBus */ addDestinationToRoute (data) { - this.eventBus.$emit('addDestinationToRoute', data) + EventBus.$emit('addDestinationToRoute', data) }, /** * Set the `settings` open flag as false @@ -615,7 +616,7 @@ export default { // As it is possible to have several polygons, we merge them into // a multiPolygon so that all them are considered (array of polygons is not supported) let multiPolygon = PolygonUtils.mergePolygonsIntoMultiPolygon(polygons) - this.eventBus.$emit('avoidPolygonsChanged', multiPolygon) + EventBus.$emit('avoidPolygonsChanged', multiPolygon) } }, /** @@ -655,7 +656,7 @@ export default { created () { // Emit the an event catch by root App component // telling it to update the page title - this.eventBus.$emit('titleChanged', this.$t('maps.pageTitle')) + EventBus.$emit('titleChanged', this.$t('maps.pageTitle')) // Set sidebar initial state (open/closed) let sidebarStartOpen = false @@ -667,7 +668,7 @@ export default { const context = this // Listen to the mapViewDataChanged event and call the // necessary methods when it happens - this.eventBus.$on('mapViewDataChanged', function (mapViewData) { + EventBus.$on('mapViewDataChanged', function (mapViewData) { context.$root.appHooks.run('mapViewDataChanged', mapViewData) context.setMapDataAndUpdateMapView(mapViewData) context.setViewHeightAndBottomNav() @@ -675,32 +676,32 @@ export default { // Set the modal open flags to true when // a show- events happen - this.eventBus.$on('showAltitudeModal', () => { + EventBus.$on('showAltitudeModal', () => { context.isAltitudeModalOpen = true }) - this.eventBus.$on('showSettingsModal', () => { + EventBus.$on('showSettingsModal', () => { context.isSettingsOpen = true }) - this.eventBus.$on('showAboutModal', () => { + EventBus.$on('showAboutModal', () => { context.isAboutOpen = true }) - this.eventBus.$on('loadAvoidPolygons', (avoidPolygons) => { + EventBus.$on('loadAvoidPolygons', (avoidPolygons) => { context.localAvoidPolygons = avoidPolygons }) - this.eventBus.$on('togglePolygonVisibility', (polygonIndex) => { + EventBus.$on('togglePolygonVisibility', (polygonIndex) => { if (context.mapViewData.polygons[polygonIndex]) { context.mapViewData.polygons[polygonIndex].properties.visible = !context.mapViewData.polygons[polygonIndex].properties.visible } }) - this.eventBus.$on('setPolygonOpacity', (data) => { + EventBus.$on('setPolygonOpacity', (data) => { if (context.mapViewData.polygons[data.polygonIndex]) { context.mapViewData.polygons[data.polygonIndex].properties.fillOpacity = data.fillOpacity } }) - this.eventBus.$on('setRouteOpacity', (data) => { + EventBus.$on('setRouteOpacity', (data) => { if (context.mapViewData.routes[data.routeIndex]) { context.mapViewData.routes[data.routeIndex].properties.opacity = data.opacity }