function compareChildren(oChild1, oChild2) {
			var oGeometry1 = DOMUtil.getGeometry(oChild1);
			var oGeometry2 = DOMUtil.getGeometry(oChild2);
			var oPosition1 = oGeometry1 && oGeometry1.position;
			var oPosition2 = oGeometry2 && oGeometry2.position;

			if (oPosition1 && oPosition2) {
				var iBottom1 = oPosition1.top + oGeometry1.size.height;
				var iBottom2 = oPosition2.top + oGeometry2.size.height;

				if (oPosition1.top < oPosition2.top) {
					if (iBottom1 >= iBottom2 && oPosition2.left < oPosition1.left) {
						/*  Example:
							            +--------------+
							+------+    |              |
							|  2   |    |       1      |
							+------+    |              |
							            +--------------+
							Despites 1st overlay's top is above 2nd element,
							the order should be switched, since 2nd element
							is shorter and is more to the left
						 */
						return 1;
					}

					return -1; // do not switch order
				} else if (oPosition1.top === oPosition2.top) {
					if (oPosition1.left === oPosition2.left) {
						// Give priority to smaller block by height or width
						if (
							oGeometry1.size.height < oGeometry2.size.height
							|| oGeometry1.size.width < oGeometry2.size.width
						) {
							return -1;
						} else if (
							oGeometry1.size.height > oGeometry2.size.height
							|| oGeometry1.size.width > oGeometry2.size.width
						) {
							return 1;
						}
						return 0;
					} else if (oPosition1.left < oPosition2.left) {
						return -1; // order is correct
					}
					return 1; // switch order
				} else if (iBottom1 <= iBottom2 && oPosition2.left > oPosition1.left) { // if (oPosition1.top > oPosition2.top)
					/* see picture above, but switch 1 and 2 - order is correct */
					return -1;
				}
				/*  Example:
								+--------------+
					+------+    |       2      |
					|  1   |    +--------------+
					|      |
					+------+

					Since 1st overlay's both top and bottom coordinates are
					bellow in dom, then top and bottom of 2nd, they should be switched
					*/
				return 1;
			}
			return 0;
		}
// compares two DOM Nodes and returns 1, if first child should be bellow in dom order
compares two DOM Nodes and returns 1, if first child should be bellow in dom order
compares two DOM Nodes and returns 1 if first child should be bellow in dom order
function compareChildren(oChild1, oChild2) {
			var oGeometry1 = DOMUtil.getGeometry(oChild1);
			var oGeometry2 = DOMUtil.getGeometry(oChild2);
			var oPosition1 = oGeometry1 && oGeometry1.position;
			var oPosition2 = oGeometry2 && oGeometry2.position;
			if (oPosition1 && oPosition2) {
				var iBottom1 = oPosition1.top + oGeometry1.size.height;
				var iBottom2 = oPosition2.top + oGeometry2.size.height;
				if (oPosition1.top < oPosition2.top) {
					if (iBottom1 >= iBottom2 && oPosition2.left < oPosition1.left) {
						return 1;
					}
					return -1; 
				} else if (oPosition1.top === oPosition2.top) {
					if (oPosition1.left === oPosition2.left) {
						if (
							oGeometry1.size.height < oGeometry2.size.height
							|| oGeometry1.size.width < oGeometry2.size.width
						) {
							return -1;
						} else if (
							oGeometry1.size.height > oGeometry2.size.height
							|| oGeometry1.size.width > oGeometry2.size.width
						) {
							return 1;
						}
						return 0;
					} else if (oPosition1.left < oPosition2.left) {
						return -1; 
					}
					return 1; 
				} else if (iBottom1 <= iBottom2 && oPosition2.left > oPosition1.left) { 
					return -1;
				}
				return 1;
			}
			return 0;
		}
function compareChildren ( oChild1 , oChild2 ) { var oGeometry1 = DOMUtil . getGeometry ( oChild1 ) ; var oGeometry2 = DOMUtil . getGeometry ( oChild2 ) ; var oPosition1 = oGeometry1 && oGeometry1 . position ; var oPosition2 = oGeometry2 && oGeometry2 . position ; if ( oPosition1 && oPosition2 ) { var iBottom1 = oPosition1 . top + oGeometry1 . size . height ; var iBottom2 = oPosition2 . top + oGeometry2 . size . height ; if ( oPosition1 . top < oPosition2 . top ) { if ( iBottom1 >= iBottom2 && oPosition2 . left < oPosition1 . left ) { return 1 ; } return - 1 ; } else if ( oPosition1 . top === oPosition2 . top ) { if ( oPosition1 . left === oPosition2 . left ) { if ( oGeometry1 . size . height < oGeometry2 . size . height || oGeometry1 . size . width < oGeometry2 . size . width ) { return - 1 ; } else if ( oGeometry1 . size . height > oGeometry2 . size . height || oGeometry1 . size . width > oGeometry2 . size . width ) { return 1 ; } return 0 ; } else if ( oPosition1 . left < oPosition2 . left ) { return - 1 ; } return 1 ; } else if ( iBottom1 <= iBottom2 && oPosition2 . left > oPosition1 . left ) { return - 1 ; } return 1 ; } return 0 ; }
compares two DOM Nodes and returns 1, if first child should be bellow in dom order
compares two DOM Nodes and returns 1 if first child should be bellow in dom order
/*  Example:
							            +--------------+
							+------+    |              |
							|  2   |    |       1      |
							+------+    |              |
							            +--------------+
							Despites 1st overlay's top is above 2nd element,
							the order should be switched, since 2nd element
							is shorter and is more to the left
						 */ // do not switch order // Give priority to smaller block by height or width // order is correct // switch order // if (oPosition1.top > oPosition2.top) /* see picture above, but switch 1 and 2 - order is correct */ /*  Example:
								+--------------+
					+------+    |       2      |
					|  1   |    +--------------+
					|      |
					+------+

					Since 1st overlay's both top and bottom coordinates are
					bellow in dom, then top and bottom of 2nd, they should be switched
					*/