Bug fix: Touch events bleed through divs to the map when they are animated over the map
MODIFY
plugin.xml
plugin.xml
<?xml version='1.0' encoding='utf-8'?>
-<plugin id="cordova-plugin-googlemaps" version="2.3.0-beta-20180430-1841" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android">
+<plugin id="cordova-plugin-googlemaps" version="2.3.0-beta-201800507-1814" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android">
<name>cordova-plugin-googlemaps</name>
<js-module name="BaseClass" src="www/BaseClass.js">
<runs />

MODIFY
www/CordovaGoogleMaps.js
www/CordovaGoogleMaps.js
@@ -450,14 +450,28 @@ CordovaGoogleMaps.prototype.followMapDivPositionOnly = function(opts) {
};
// Is the map moved?
- if (!changed && self.prevMapRects && (divId in self.prevMapRects) && (
- self.prevMapRects[divId].size.left !== mapRects[divId].size.left ||
- self.prevMapRects[divId].size.top !== mapRects[divId].size.top ||
- self.prevMapRects[divId].size.width !== mapRects[divId].size.width ||
- self.prevMapRects[divId].size.height !== mapRects[divId].size.height ||
- self.prevMapRects[divId].zIndex.z !== mapRects[divId].zIndex.z)) {
+ if (!changed && self.prevMapRects && divId in self.prevMapRects) {
+ if (self.prevMapRects[divId].size.left !== mapRects[divId].size.left) {
+ //console.log("changed(left)", divId, self.prevMapRects[divId].size.left, mapRects[divId].size.left);
changed = true;
}
+ if (!changed && self.prevMapRects[divId].size.top !== mapRects[divId].size.top) {
+ //console.log("changed(top)", divId, self.prevMapRects[divId].size.top, mapRects[divId].size.top);
+ changed = true;
+ }
+ if (!changed && self.prevMapRects[divId].size.width !== mapRects[divId].size.width) {
+ //console.log("changed(width)", divId, self.prevMapRects[divId].size.width, mapRects[divId].size.width);
+ changed = true;
+ }
+ if (!changed && self.prevMapRects[divId].size.height !== mapRects[divId].size.height) {
+ //console.log("changed(height)", divId, self.prevMapRects[divId].size.height, mapRects[divId].size.height);
+ changed = true;
+ }
+ if (!changed && self.prevMapRects[divId].zIndex.z !== mapRects[divId].zIndex.z) {
+ //console.log("changed(zIndex.z)", divId, self.prevMapRects[divId].zIndex.z, mapRects[divId].zIndex.z);
+ changed = true;
+ }
+ }
}
});

MODIFY
www/googlemaps-cdv-plugin.js
www/googlemaps-cdv-plugin.js
@@ -60,25 +60,33 @@ if (!cordova) {
// If the `transitionend` event is ocurred on the observed element,
// adjust the position and size of the map view
var scrollEndTimer = null;
- function followMaps() {
- if (cordovaGoogleMaps.followMapDivPositionOnly.call(cordovaGoogleMaps)) {
+ function followMaps(evt) {
+ var changes = cordovaGoogleMaps.followMapDivPositionOnly.call(cordovaGoogleMaps);
if (scrollEndTimer) {
clearTimeout(scrollEndTimer);
+ scrollEndTimer = null;
+ }
+ if (changes) {
+ scrollEndTimer = setTimeout(followMaps.bind(this, evt), 100);
+ } else if (evt && evt.type === "scroll") {
+ common.nextTick(onTransitionEnd);
+ }
+ }
+ function onTransitionEnd() {
+ var changes = cordovaGoogleMaps.followMapDivPositionOnly.call(cordovaGoogleMaps);
+ if (changes) {
+ scrollEndTimer = setTimeout(onTransitionEnd, 100);
+ } else {
cordovaGoogleMaps.isThereAnyChange = true;
cordovaGoogleMaps.checkRequested = false;
cordovaGoogleMaps.putHtmlElements.call(cordovaGoogleMaps);
cordovaGoogleMaps.pause();
-
- } else {
- scrollEndTimer = setTimeout(function() {
- common.nextTick(followMaps);
- }, 100);
- }
+ scrollEndTimer = null;
}
}
document.addEventListener("transitionstart", followMaps);
- document.body.addEventListener("transitionend", followMaps);
+ document.body.addEventListener("transitionend", onTransitionEnd);
// document.body.addEventListener("transitionend", function(e) {
// if (!e.target.hasAttribute("__pluginDomId")) {
// return;

Bug fix: Touch events bleed through divs to the map when they are animated over the map #2255