Bug fix: dom depth calculation is incorrect
MODIFY
plugin.xml
plugin.xml
<?xml version='1.0' encoding='utf-8'?>
-<plugin id="cordova-plugin-googlemaps" version="2.0.0-beta2-20170713-1545" 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.0.0-beta2-20170714-0030" 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/Common.js
www/Common.js
@@ -276,18 +276,18 @@ function getAllChildren(root) {
function shouldWatchByNative(node) {
if (node.nodeType !== Node.ELEMENT_NODE || !node.offsetParent) {
- return;
+ if (node === document.body) {
+ return true;
+ }
+ return false;
}
var visibilityCSS = getStyle(node, 'visibility');
var displayCSS = getStyle(node, 'display');
var opacityCSS = getStyle(node, 'opacity');
opacityCSS = /^[\d.]+$/.test(opacityCSS + "") ? opacityCSS : 1;
- var heightCSS = getStyle(node, 'height');
- var widthCSS = getStyle(node, 'width');
- var clickableSize = (heightCSS != "0px" && widthCSS != "0px" &&
- (node.offsetHeight > 0 && node.offsetWidth > 0 || node.clientHeight > 0 && node.clientWidth > 0));
+ var clickableSize = (node.offsetHeight > 0 && node.offsetWidth > 0 || node.clientHeight > 0 && node.clientWidth > 0);
return displayCSS !== "none" &&
- opacityCSS > 0 && visibilityCSS != "hidden" &&
+ opacityCSS > 0 && visibilityCSS !== "hidden" &&
clickableSize;
}
@@ -322,10 +322,6 @@ function getZIndex(dom) {
var parentNode = dom.parentNode;
if (parentNode && parentNode.nodeType === Node.ELEMENT_NODE) {
var parentElemId = parentNode.getAttribute("__pluginDomId");
- if (!parentElemId) {
- parentElemId = "pgm" + Math.floor(Math.random() * Date.now());
- parentNode.setAttribute("__pluginDomId", parentElemId);
- }
if (parentElemId in internalCache) {
z += internalCache[parentElemId];
} else {
@@ -334,12 +330,7 @@ function getZIndex(dom) {
z += parentZIndex;
}
}
-
var elemId = dom.getAttribute("__pluginDomId");
- if (!elemId) {
- elemId = "pgm" + Math.floor(Math.random() * Date.now());
- dom.setAttribute("__pluginDomId", elemId);
- }
internalCache[elemId] = z;
return z;

MODIFY
www/googlemaps-cdv-plugin.js
www/googlemaps-cdv-plugin.js
@@ -74,16 +74,7 @@ var saltHash = Math.floor(Math.random() * Date.now());
var prevDomPositions = {};
var prevChildrenCnt = 0;
var idlingCnt = -1;
-/*
- var baseDom = document.createElement("div");
- baseDom.style.width = "1px";
- baseDom.style.height = "1px";
- baseDom.style.position = "absolute";
- baseDom.style.zIndex = 9999;
- baseDom.style.visibility = "hidden";
- document.body.insertBefore(baseDom, document.body.firstChild);
- var baseRect;
-*/
+
var isChecking = false;
var cacheDepth = {};
var navDecorBlocker = document.createElement("style");
@@ -130,52 +121,49 @@ var saltHash = Math.floor(Math.random() * Date.now());
}
}
if (visibleMapList.length === 0) {
+ idlingCnt++;
+ if (idlingCnt < 10) {
+ setTimeout(putHtmlElements, idlingCnt < 5 ? 50 : 200);
+ }
isChecking = false;
- cordova.exec(null, null, 'CordovaGoogleMaps', 'clearHtmlElements', []);
return;
}
//-------------------------------------------
// Should the plugin update the map positions?
//-------------------------------------------
- //baseRect = common.getDivRect(baseDom);
- var children = common.getAllChildren(document.body);
- var bodyRect = common.getDivRect(document.body);
-
- if (children.length === 0) {
- children = null;
- isChecking = false;
- return;
- }
-
var domPositions = {};
- var size, elemId, child, parentNode;
var shouldUpdate = false;
+ var traceDomTree = function(element, domIdx) {
- children.unshift(document.body);
- if (children.length !== prevChildrenCnt) {
- shouldUpdate = true;
+ if (common.shouldWatchByNative(element)) {
+
+ // Generates a __pluginDomId
+ var elemId = element.getAttribute("__pluginDomId");
+ if (!elemId) {
+ elemId = "pgm" + Math.floor(Math.random() * Date.now());
+ element.setAttribute("__pluginDomId", elemId);
}
- prevChildrenCnt = children.length;
- for (i = 0; i < children.length; i++) {
- child = children[i];
- elemId = child.getAttribute("__pluginDomId");
- //domPositions[elemId] = common.getDomInfo(child);
- var depth = cacheDepth[elemId];
- var zIndex = common.getZIndex(child);
+
+ // get dom depth
+ var depth;
+ var zIndex = common.getZIndex(element);
if (elemId in cacheDepth &&
elemId in prevDomPositions &&
prevDomPositions[elemId].zIndex === zIndex) {
depth = cacheDepth[elemId];
} else {
- depth = common.getDomDepth(child, i);
+ depth = common.getDomDepth(element, domIdx);
cacheDepth[elemId] = depth;
}
+
+ // Stores dom bounds and depth
domPositions[elemId] = {
- size: common.getDivRect(child),
+ size: common.getDivRect(element),
depth: depth,
zIndex: zIndex
};
+
if (!shouldUpdate) {
if (elemId in prevDomPositions) {
if (domPositions[elemId].size.left !== prevDomPositions[elemId].size.left ||
@@ -189,30 +177,26 @@ var saltHash = Math.floor(Math.random() * Date.now());
shouldUpdate = true;
}
}
+
+ if (element.childNodes.length > 0) {
+ for (var i = 0; i < element.childNodes.length; i++) {
+ traceDomTree(element.childNodes[i], domIdx + i + 1);
}
- /*
- for (i = 0; i < children.length; i++) {
- child = children[i];
- elemId = child.getAttribute("__pluginDomId");
- if (!elemId) {
- elemId = "pgm" + Math.floor(Math.random() * Date.now());
- child.setAttribute("__pluginDomId", elemId);
- }
- domPositions[elemId] = common.getDomInfo(child);
- if (!shouldUpdate) {
- if (elemId in prevDomPositions) {
- if (domPositions[elemId].size.left !== prevDomPositions[elemId].size.left ||
- domPositions[elemId].size.top !== prevDomPositions[elemId].size.top ||
- domPositions[elemId].size.width !== prevDomPositions[elemId].size.width ||
- domPositions[elemId].size.height !== prevDomPositions[elemId].size.height) {
- shouldUpdate = true;
}
+
} else {
+ if (element.nodeType === Node.ELEMENT_NODE) {
+ if (element.hasAttribute("__pluginDomId")) {
shouldUpdate = true;
+ element.removeAttribute("__pluginDomId");
}
+
}
}
- */
+
+ };
+ traceDomTree(document.body, 0);
+
if (!shouldUpdate && idlingCnt > -1) {
idlingCnt++;
if (idlingCnt === 2) {
@@ -230,8 +214,6 @@ var saltHash = Math.floor(Math.random() * Date.now());
return;
}
idlingCnt = 0;
- //console.log(domPositions);
- //return;
// If the map div is not displayed (such as display='none'),
// ignore the map temporally.

Bug fix: dom depth calculation is incorrect  #1541