From ff8a84a220c41d9e068f67e0d0b934823fb07c27 Mon Sep 17 00:00:00 2001 From: Tim Schaub Date: Wed, 31 Aug 2016 07:42:35 -0600 Subject: [PATCH] Deal with ol.global issues --- src/ol/control/fullscreen.js | 9 +++++---- src/ol/control/zoomslider.js | 3 ++- src/ol/dom.js | 12 ++++++++---- src/ol/geolocation.js | 8 +++++--- src/ol/has.js | 18 +++++++++--------- src/ol/interaction/mousewheelzoom.js | 10 ++++++---- src/ol/map.js | 19 ++++++++++++------- src/ol/mapbrowserevent.js | 10 ++++++---- src/ol/net.js | 13 +++++++------ src/ol/overlay.js | 7 ++++--- 10 files changed, 64 insertions(+), 45 deletions(-) diff --git a/src/ol/control/fullscreen.js b/src/ol/control/fullscreen.js index dfb3053778..f48eedf4ab 100644 --- a/src/ol/control/fullscreen.js +++ b/src/ol/control/fullscreen.js @@ -1,11 +1,11 @@ goog.provide('ol.control.FullScreen'); -goog.require('ol.events'); -goog.require('ol.events.EventType'); goog.require('ol'); goog.require('ol.control.Control'); -goog.require('ol.dom'); goog.require('ol.css'); +goog.require('ol.dom'); +goog.require('ol.events'); +goog.require('ol.events.EventType'); /** @@ -158,9 +158,10 @@ ol.control.FullScreen.prototype.handleFullScreenChange_ = function() { * @api stable */ ol.control.FullScreen.prototype.setMap = function(map) { + var global = ol.global; ol.control.Control.prototype.setMap.call(this, map); if (map) { - this.listenerKeys.push(ol.events.listen(ol.global.document, + this.listenerKeys.push(ol.events.listen(global.document, ol.control.FullScreen.getChangeType_(), this.handleFullScreenChange_, this) ); diff --git a/src/ol/control/zoomslider.js b/src/ol/control/zoomslider.js index eccb41adf1..22fd464bcb 100644 --- a/src/ol/control/zoomslider.js +++ b/src/ol/control/zoomslider.js @@ -181,13 +181,14 @@ ol.control.ZoomSlider.prototype.setMap = function(map) { * @private */ ol.control.ZoomSlider.prototype.initSlider_ = function() { + var global = ol.global; var container = this.element; var containerSize = { width: container.offsetWidth, height: container.offsetHeight }; var thumb = container.firstElementChild; - var computedStyle = ol.global.getComputedStyle(thumb); + var computedStyle = global.getComputedStyle(thumb); var thumbWidth = thumb.offsetWidth + parseFloat(computedStyle['marginRight']) + parseFloat(computedStyle['marginLeft']); diff --git a/src/ol/dom.js b/src/ol/dom.js index 2ae64be09b..f55e9655c8 100644 --- a/src/ol/dom.js +++ b/src/ol/dom.js @@ -37,6 +37,7 @@ ol.dom.createCanvasContext2D = function(opt_width, opt_height) { * @return {boolean} */ ol.dom.canUseCssTransform = (function() { + var global = ol.global; var canUseCssTransform; return function() { if (canUseCssTransform === undefined) { @@ -53,7 +54,7 @@ ol.dom.canUseCssTransform = (function() { for (var t in transforms) { if (t in el.style) { el.style[t] = 'translate(1px,1px)'; - has2d = ol.global.getComputedStyle(el).getPropertyValue( + has2d = global.getComputedStyle(el).getPropertyValue( transforms[t]); } } @@ -73,6 +74,7 @@ ol.dom.canUseCssTransform = (function() { * @return {boolean} */ ol.dom.canUseCssTransform3D = (function() { + var global = ol.global; var canUseCssTransform3D; return function() { if (canUseCssTransform3D === undefined) { @@ -89,7 +91,7 @@ ol.dom.canUseCssTransform3D = (function() { for (var t in transforms) { if (t in el.style) { el.style[t] = 'translate3d(1px,1px,1px)'; - has3d = ol.global.getComputedStyle(el).getPropertyValue( + has3d = global.getComputedStyle(el).getPropertyValue( transforms[t]); } } @@ -177,8 +179,9 @@ ol.dom.transformElement2D = function(element, transform, opt_precision) { * @return {number} The width. */ ol.dom.outerWidth = function(element) { + var global = ol.global; var width = element.offsetWidth; - var style = element.currentStyle || ol.global.getComputedStyle(element); + var style = element.currentStyle || global.getComputedStyle(element); width += parseInt(style.marginLeft, 10) + parseInt(style.marginRight, 10); return width; @@ -193,8 +196,9 @@ ol.dom.outerWidth = function(element) { * @return {number} The height. */ ol.dom.outerHeight = function(element) { + var global = ol.global; var height = element.offsetHeight; - var style = element.currentStyle || ol.global.getComputedStyle(element); + var style = element.currentStyle || global.getComputedStyle(element); height += parseInt(style.marginTop, 10) + parseInt(style.marginBottom, 10); return height; diff --git a/src/ol/geolocation.js b/src/ol/geolocation.js index 51bf6adcdd..37f6b9f41c 100644 --- a/src/ol/geolocation.js +++ b/src/ol/geolocation.js @@ -3,9 +3,9 @@ goog.provide('ol.Geolocation'); goog.require('ol'); +goog.require('ol.Object'); goog.require('ol.events'); goog.require('ol.events.EventType'); -goog.require('ol.Object'); goog.require('ol.geom.Polygon'); goog.require('ol.has'); goog.require('ol.math'); @@ -113,15 +113,17 @@ ol.Geolocation.prototype.handleProjectionChanged_ = function() { * @private */ ol.Geolocation.prototype.handleTrackingChanged_ = function() { + var global = ol.global; if (ol.has.GEOLOCATION) { + var navigator = global.navigator; var tracking = this.getTracking(); if (tracking && this.watchId_ === undefined) { - this.watchId_ = ol.global.navigator.geolocation.watchPosition( + this.watchId_ = navigator.geolocation.watchPosition( this.positionChange_.bind(this), this.positionError_.bind(this), this.getTrackingOptions()); } else if (!tracking && this.watchId_ !== undefined) { - ol.global.navigator.geolocation.clearWatch(this.watchId_); + navigator.geolocation.clearWatch(this.watchId_); this.watchId_ = undefined; } } diff --git a/src/ol/has.js b/src/ol/has.js index 3d56c9d792..3f7d8124b1 100644 --- a/src/ol/has.js +++ b/src/ol/has.js @@ -3,7 +3,7 @@ goog.provide('ol.has'); goog.require('ol'); goog.require('ol.webgl'); - +var olGlobal = ol.global; var ua = typeof navigator !== 'undefined' ? navigator.userAgent.toLowerCase() : ''; @@ -48,7 +48,7 @@ ol.has.MAC = ua.indexOf('macintosh') !== -1; * @type {number} * @api stable */ -ol.has.DEVICE_PIXEL_RATIO = ol.global.devicePixelRatio || 1; +ol.has.DEVICE_PIXEL_RATIO = olGlobal.devicePixelRatio || 1; /** @@ -70,7 +70,7 @@ ol.has.CANVAS = ol.ENABLE_CANVAS && ( * @return {boolean} Canvas supported. */ function() { - if (!('HTMLCanvasElement' in ol.global)) { + if (!('HTMLCanvasElement' in olGlobal)) { return false; } try { @@ -95,7 +95,7 @@ ol.has.CANVAS = ol.ENABLE_CANVAS && ( * @type {boolean} * @api stable */ -ol.has.DEVICE_ORIENTATION = 'DeviceOrientationEvent' in ol.global; +ol.has.DEVICE_ORIENTATION = 'DeviceOrientationEvent' in olGlobal; /** @@ -112,7 +112,7 @@ ol.has.DOM = ol.ENABLE_DOM; * @type {boolean} * @api stable */ -ol.has.GEOLOCATION = 'geolocation' in ol.global.navigator; +ol.has.GEOLOCATION = 'geolocation' in olGlobal.navigator; /** @@ -121,7 +121,7 @@ ol.has.GEOLOCATION = 'geolocation' in ol.global.navigator; * @type {boolean} * @api stable */ -ol.has.TOUCH = ol.ASSUME_TOUCH || 'ontouchstart' in ol.global; +ol.has.TOUCH = ol.ASSUME_TOUCH || 'ontouchstart' in olGlobal; /** @@ -129,7 +129,7 @@ ol.has.TOUCH = ol.ASSUME_TOUCH || 'ontouchstart' in ol.global; * @const * @type {boolean} */ -ol.has.POINTER = 'PointerEvent' in ol.global; +ol.has.POINTER = 'PointerEvent' in olGlobal; /** @@ -137,7 +137,7 @@ ol.has.POINTER = 'PointerEvent' in ol.global; * @const * @type {boolean} */ -ol.has.MSPOINTER = !!(ol.global.navigator.msPointerEnabled); +ol.has.MSPOINTER = !!(olGlobal.navigator.msPointerEnabled); /** @@ -156,7 +156,7 @@ ol.has.WEBGL; var textureSize; var /** @type {Array.} */ extensions = []; - if ('WebGLRenderingContext' in ol.global) { + if ('WebGLRenderingContext' in olGlobal) { try { var canvas = /** @type {HTMLCanvasElement} */ (document.createElement('CANVAS')); diff --git a/src/ol/interaction/mousewheelzoom.js b/src/ol/interaction/mousewheelzoom.js index 72d6f76826..91a1eb74c2 100644 --- a/src/ol/interaction/mousewheelzoom.js +++ b/src/ol/interaction/mousewheelzoom.js @@ -87,13 +87,15 @@ ol.interaction.MouseWheelZoom.handleEvent = function(mapBrowserEvent) { // https://github.com/mapbox/mapbox-gl-js/blob/001c7b9/js/ui/handler/scroll_zoom.js //TODO There's more good stuff in there for inspiration to improve this interaction. var delta; + var global = ol.global; + var WheelEvent = global.WheelEvent; if (mapBrowserEvent.type == ol.events.EventType.WHEEL) { delta = wheelEvent.deltaY; if (ol.has.FIREFOX && - wheelEvent.deltaMode === ol.global.WheelEvent.DOM_DELTA_PIXEL) { + wheelEvent.deltaMode === WheelEvent.DOM_DELTA_PIXEL) { delta /= ol.has.DEVICE_PIXEL_RATIO; } - if (wheelEvent.deltaMode === ol.global.WheelEvent.DOM_DELTA_LINE) { + if (wheelEvent.deltaMode === WheelEvent.DOM_DELTA_LINE) { delta *= 40; } } else if (mapBrowserEvent.type == ol.events.EventType.MOUSEWHEEL) { @@ -112,8 +114,8 @@ ol.interaction.MouseWheelZoom.handleEvent = function(mapBrowserEvent) { var duration = ol.MOUSEWHEELZOOM_TIMEOUT_DURATION; var timeLeft = Math.max(duration - (Date.now() - this.startTime_), 0); - ol.global.clearTimeout(this.timeoutId_); - this.timeoutId_ = ol.global.setTimeout( + global.clearTimeout(this.timeoutId_); + this.timeoutId_ = global.setTimeout( this.doZoom_.bind(this, map), timeLeft); mapBrowserEvent.preventDefault(); diff --git a/src/ol/map.js b/src/ol/map.js index e86229edc4..48e17709b2 100644 --- a/src/ol/map.js +++ b/src/ol/map.js @@ -553,6 +553,7 @@ ol.Map.prototype.removePreRenderFunction = function(preRenderFunction) { * @inheritDoc */ ol.Map.prototype.disposeInternal = function() { + var global = ol.global; this.mapBrowserEventHandler_.dispose(); this.renderer_.dispose(); ol.events.unlisten(this.viewport_, ol.events.EventType.WHEEL, @@ -560,12 +561,12 @@ ol.Map.prototype.disposeInternal = function() { ol.events.unlisten(this.viewport_, ol.events.EventType.MOUSEWHEEL, this.handleBrowserEvent, this); if (this.handleResize_ !== undefined) { - ol.global.removeEventListener(ol.events.EventType.RESIZE, + global.removeEventListener(ol.events.EventType.RESIZE, this.handleResize_, false); this.handleResize_ = undefined; } if (this.animationDelayKey_) { - ol.global.cancelAnimationFrame(this.animationDelayKey_); + global.cancelAnimationFrame(this.animationDelayKey_); this.animationDelayKey_ = undefined; } this.setTarget(null); @@ -1039,6 +1040,7 @@ ol.Map.prototype.handleSizeChanged_ = function() { * @private */ ol.Map.prototype.handleTargetChanged_ = function() { + var global = ol.global; // target may be undefined, null, a string or an Element. // If it's a string we convert it to an Element before proceeding. // If it's not now an Element we remove the viewport from the DOM. @@ -1061,7 +1063,7 @@ ol.Map.prototype.handleTargetChanged_ = function() { if (!targetElement) { ol.dom.removeNode(this.viewport_); if (this.handleResize_ !== undefined) { - ol.global.removeEventListener(ol.events.EventType.RESIZE, + global.removeEventListener(ol.events.EventType.RESIZE, this.handleResize_, false); this.handleResize_ = undefined; } @@ -1079,7 +1081,7 @@ ol.Map.prototype.handleTargetChanged_ = function() { if (!this.handleResize_) { this.handleResize_ = this.updateSize.bind(this); - ol.global.addEventListener(ol.events.EventType.RESIZE, + global.addEventListener(ol.events.EventType.RESIZE, this.handleResize_, false); } } @@ -1160,8 +1162,9 @@ ol.Map.prototype.isRendered = function() { * @api stable */ ol.Map.prototype.renderSync = function() { + var global = ol.global; if (this.animationDelayKey_) { - ol.global.cancelAnimationFrame(this.animationDelayKey_); + global.cancelAnimationFrame(this.animationDelayKey_); } this.animationDelay_(); }; @@ -1172,8 +1175,9 @@ ol.Map.prototype.renderSync = function() { * @api stable */ ol.Map.prototype.render = function() { + var global = ol.global; if (this.animationDelayKey_ === undefined) { - this.animationDelayKey_ = ol.global.requestAnimationFrame( + this.animationDelayKey_ = global.requestAnimationFrame( this.animationDelay_); } }; @@ -1380,12 +1384,13 @@ ol.Map.prototype.skipFeature = function(feature) { * @api stable */ ol.Map.prototype.updateSize = function() { + var global = ol.global; var targetElement = this.getTargetElement(); if (!targetElement) { this.setSize(undefined); } else { - var computedStyle = ol.global.getComputedStyle(targetElement); + var computedStyle = global.getComputedStyle(targetElement); this.setSize([ targetElement.offsetWidth - parseFloat(computedStyle['borderLeftWidth']) - diff --git a/src/ol/mapbrowserevent.js b/src/ol/mapbrowserevent.js index 3551386749..90aa80f00c 100644 --- a/src/ol/mapbrowserevent.js +++ b/src/ol/mapbrowserevent.js @@ -214,20 +214,22 @@ ol.inherits(ol.MapBrowserEventHandler, ol.events.EventTarget); * @private */ ol.MapBrowserEventHandler.prototype.emulateClick_ = function(pointerEvent) { - var newEvent; - newEvent = new ol.MapBrowserPointerEvent( + var global = ol.global; + var clearTimeout = global.clearTimeout; + var setTimeout = global.setTimeout; + var newEvent = new ol.MapBrowserPointerEvent( ol.MapBrowserEvent.EventType.CLICK, this.map_, pointerEvent); this.dispatchEvent(newEvent); if (this.clickTimeoutId_ !== 0) { // double-click - ol.global.clearTimeout(this.clickTimeoutId_); + clearTimeout(this.clickTimeoutId_); this.clickTimeoutId_ = 0; newEvent = new ol.MapBrowserPointerEvent( ol.MapBrowserEvent.EventType.DBLCLICK, this.map_, pointerEvent); this.dispatchEvent(newEvent); } else { // click - this.clickTimeoutId_ = ol.global.setTimeout(function() { + this.clickTimeoutId_ = setTimeout(function() { this.clickTimeoutId_ = 0; var newEvent = new ol.MapBrowserPointerEvent( ol.MapBrowserEvent.EventType.SINGLECLICK, this.map_, pointerEvent); diff --git a/src/ol/net.js b/src/ol/net.js index 3b9684f762..0775bf2bd1 100644 --- a/src/ol/net.js +++ b/src/ol/net.js @@ -15,25 +15,26 @@ goog.require('ol'); * callback. Default is 'callback'. */ ol.net.jsonp = function(url, callback, opt_errback, opt_callbackParam) { - var script = ol.global.document.createElement('script'); + var global = ol.global; + var script = global.document.createElement('script'); var key = 'olc_' + ol.getUid(callback); function cleanup() { - delete ol.global[key]; + delete global[key]; script.parentNode.removeChild(script); } script.async = true; script.src = url + (url.indexOf('?') == -1 ? '?' : '&') + (opt_callbackParam || 'callback') + '=' + key; - var timer = ol.global.setTimeout(function() { + var timer = global.setTimeout(function() { cleanup(); if (opt_errback) { opt_errback(); } }, 10000); - ol.global[key] = function(data) { - ol.global.clearTimeout(timer); + global[key] = function(data) { + global.clearTimeout(timer); cleanup(); callback(data); }; - ol.global.document.getElementsByTagName('head')[0].appendChild(script); + document.getElementsByTagName('head')[0].appendChild(script); }; diff --git a/src/ol/overlay.js b/src/ol/overlay.js index 588c2b8ec5..947f84afe8 100644 --- a/src/ol/overlay.js +++ b/src/ol/overlay.js @@ -1,11 +1,11 @@ goog.provide('ol.Overlay'); goog.require('ol'); -goog.require('ol.events'); goog.require('ol.MapEventType'); goog.require('ol.Object'); goog.require('ol.animation'); goog.require('ol.dom'); +goog.require('ol.events'); goog.require('ol.extent'); @@ -398,9 +398,10 @@ ol.Overlay.prototype.panIntoView_ = function() { * @private */ ol.Overlay.prototype.getRect_ = function(element, size) { + var global = ol.global; var box = element.getBoundingClientRect(); - var offsetX = box.left + ol.global.pageXOffset; - var offsetY = box.top + ol.global.pageYOffset; + var offsetX = box.left + global.pageXOffset; + var offsetY = box.top + global.pageYOffset; return [ offsetX, offsetY,