cnx-public/vue-google-maps-community-fork
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update dependencies and improve build system

Browse Source
This commit is contained in:
Fawad Mirzad
2021-02-13 17:30:46 +01:00
parent 04431e1b39
commit 9a20c42459
57 changed files with 8395 additions and 1064 deletions
Download Patch File Download Diff File Expand all files Collapse all files

144
src/components/mapImpl.js
View File

@@ -1,5 +1,5 @@
import bindEvents from '../utils/bindEvents.js'
import {bindProps, getPropsValues} from '../utils/bindProps.js'
import { bindProps, getPropsValues } from '../utils/bindProps.js'
import mountableMixin from '../utils/mountableMixin.js'
import TwoWayBindingWrapper from '../utils/TwoWayBindingWrapper.js'
@@ -25,7 +25,7 @@ const props = {
},
mapTypeId: {
twoWay: true,
type: String
type: String,
},
tilt: {
twoWay: true,
@@ -33,8 +33,10 @@ const props = {
},
options: {
type: Object,
default () { return {} }
}
default() {
return {}
},
},
}
const events = [
@@ -54,27 +56,26 @@ const events = [
]
// Plain Google Maps methods exposed here for convenience
const linkedMethods = [
'panBy',
'panTo',
'panToBounds',
'fitBounds'
].reduce((all, methodName) => {
const linkedMethods = ['panBy', 'panTo', 'panToBounds', 'fitBounds'].reduce((all, methodName) => {
all[methodName] = function () {
if (this.$mapObject) { this.$mapObject[methodName].apply(this.$mapObject, arguments) }
if (this.$mapObject) {
this.$mapObject[methodName].apply(this.$mapObject, arguments)
}
}
return all
}, {})
// Other convenience methods exposed by Vue Google Maps
const customMethods = {
resize () {
resize() {
if (this.$mapObject) {
google.maps.event.trigger(this.$mapObject, 'resize')
}
},
resizePreserveCenter () {
if (!this.$mapObject) { return }
resizePreserveCenter() {
if (!this.$mapObject) {
return
}
const oldCenter = this.$mapObject.getCenter()
google.maps.event.trigger(this.$mapObject, 'resize')
@@ -84,98 +85,97 @@ const customMethods = {
/// Override mountableMixin::_resizeCallback
/// because resizePreserveCenter is usually the
/// expected behaviour
_resizeCallback () {
_resizeCallback() {
this.resizePreserveCenter()
}
},
}
export default {
mixins: [mountableMixin],
props: mappedPropsToVueProps(props),
provide () {
provide() {
this.$mapPromise = new Promise((resolve, reject) => {
this.$mapPromiseDeferred = { resolve, reject }
})
return {
'$mapPromise': this.$mapPromise
$mapPromise: this.$mapPromise,
}
},
emits: ['center_changed', 'zoom_changed', 'bounds_changed'],
computed: {
finalLat () {
return this.center &&
(typeof this.center.lat === 'function') ? this.center.lat() : this.center.lat
finalLat() {
return this.center && typeof this.center.lat === 'function'
? this.center.lat()
: this.center.lat
},
finalLng () {
return this.center &&
(typeof this.center.lng === 'function') ? this.center.lng() : this.center.lng
finalLng() {
return this.center && typeof this.center.lng === 'function'
? this.center.lng()
: this.center.lng
},
finalLatLng() {
return { lat: this.finalLat, lng: this.finalLng }
},
finalLatLng () {
return {lat: this.finalLat, lng: this.finalLng}
}
},
watch: {
zoom (zoom) {
zoom(zoom) {
if (this.$mapObject) {
this.$mapObject.setZoom(zoom)
}
}
},
},
mounted () {
return this.$gmapApiPromiseLazy().then(() => {
// getting the DOM element where to create the map
const element = this.$refs['vue-map']
mounted() {
return this.$gmapApiPromiseLazy()
.then(() => {
// getting the DOM element where to create the map
const element = this.$refs['vue-map']
// creating the map
const options = {
...this.options,
...getPropsValues(this, props),
}
delete options.options
this.$mapObject = new google.maps.Map(element, options)
// creating the map
const options = {
...this.options,
...getPropsValues(this, props),
}
delete options.options
this.$mapObject = new google.maps.Map(element, options)
// binding properties (two and one way)
bindProps(this, this.$mapObject, props)
// binding events
bindEvents(this, this.$mapObject, events)
// binding properties (two and one way)
bindProps(this, this.$mapObject, props)
// binding events
bindEvents(this, this.$mapObject, events)
// manually trigger center and zoom
TwoWayBindingWrapper((increment, decrement, shouldUpdate) => {
this.$mapObject.addListener('center_changed', () => {
if (shouldUpdate()) {
this.$emit('center_changed', this.$mapObject.getCenter())
// manually trigger center and zoom
TwoWayBindingWrapper((increment, decrement, shouldUpdate) => {
this.$mapObject.addListener('center_changed', () => {
if (shouldUpdate()) {
this.$emit('center_changed', this.$mapObject.getCenter())
}
decrement()
})
const updateCenter = () => {
increment()
this.$mapObject.setCenter(this.finalLatLng)
}
decrement()
WatchPrimitiveProperties(this, ['finalLat', 'finalLng'], updateCenter)
})
this.$mapObject.addListener('zoom_changed', () => {
this.$emit('zoom_changed', this.$mapObject.getZoom())
})
this.$mapObject.addListener('bounds_changed', () => {
this.$emit('bounds_changed', this.$mapObject.getBounds())
})
const updateCenter = () => {
increment()
this.$mapObject.setCenter(this.finalLatLng)
}
this.$mapPromiseDeferred.resolve(this.$mapObject)
WatchPrimitiveProperties(
this,
['finalLat', 'finalLng'],
updateCenter
)
return this.$mapObject
})
this.$mapObject.addListener('zoom_changed', () => {
this.$emit('zoom_changed', this.$mapObject.getZoom())
.catch((error) => {
throw error
})
this.$mapObject.addListener('bounds_changed', () => {
this.$emit('bounds_changed', this.$mapObject.getBounds())
})
this.$mapPromiseDeferred.resolve(this.$mapObject)
return this.$mapObject
})
.catch((error) => {
throw error
})
},
methods: {
...customMethods,