From becb23c4accd7f4481924b9505e4c99bc370c06c Mon Sep 17 00:00:00 2001 From: roemhildtg Date: Thu, 21 Apr 2016 11:17:19 -0500 Subject: [PATCH] Switch to the bower version of google maps loader. --- viewer/js/gis/dijit/StreetView.js | 77 ++++++----- viewer/js/gis/plugins/Google.js | 219 ++++++++++++++++++++++++++++++ 2 files changed, 262 insertions(+), 34 deletions(-) create mode 100644 viewer/js/gis/plugins/Google.js diff --git a/viewer/js/gis/dijit/StreetView.js b/viewer/js/gis/dijit/StreetView.js index 51cb49719..403b526e2 100644 --- a/viewer/js/gis/dijit/StreetView.js +++ b/viewer/js/gis/dijit/StreetView.js @@ -19,28 +19,19 @@ define([ 'dijit/MenuItem', 'proj4js/proj4', 'dojo/i18n!./StreetView/nls/resource', + 'gis/plugins/Google', 'dijit/form/ToggleButton', - 'xstyle/css!./StreetView/css/StreetView.css', - 'gis/plugins/async!//maps.google.com/maps/api/js?v=3' -], function (declare, _WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, lang, aspect, topic, GraphicsLayer, Graphic, SimpleRenderer, template, PictureMarkerSymbol, domStyle, domGeom, Point, SpatialReference, MenuItem, proj4, i18n) { - + 'xstyle/css!./StreetView/css/StreetView.css' + // 'gis/plugins/async!//maps.google.com/maps/api/js?v=3' +], function (declare, _WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, lang, aspect, topic, GraphicsLayer, Graphic, SimpleRenderer, template, PictureMarkerSymbol, domStyle, domGeom, Point, SpatialReference, MenuItem, proj4, i18n, Google) { + var google; return declare([_WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin], { widgetsInTemplate: true, templateString: template, i18n: i18n, mapClickMode: null, - panoOptions: { - addressControlOptions: { - position: google.maps.ControlPosition.TOP_RIGHT - }, - linksControl: false, - panControl: false, - zoomControlOptions: { - style: google.maps.ZoomControlStyle.SMALL - }, - enableCloseButton: false - }, + panoOptions: null, // in case this changes some day proj4BaseURL: 'http://spatialreference.org/', @@ -56,29 +47,47 @@ define([ postCreate: function () { this.inherited(arguments); - this.createGraphicsLayer(); - this.map.on('click', lang.hitch(this, 'getStreetView')); + //load the google api asynchronously + Google.load(lang.hitch(this, function(g){ + //store a reference to google + google = g; - this.own(topic.subscribe('mapClickMode/currentSet', lang.hitch(this, 'setMapClickMode'))); + //init our panoOptions since they depend on google + this.panoOptions = { + addressControlOptions: { + position: google.maps.ControlPosition.TOP_RIGHT + }, + linksControl: false, + panControl: false, + zoomControlOptions: { + style: google.maps.ZoomControlStyle.SMALL + }, + enableCloseButton: false + }; + this.createGraphicsLayer(); + this.map.on('click', lang.hitch(this, 'getStreetView')); - if (this.parentWidget) { - if (this.parentWidget.toggleable) { - this.own(aspect.after(this.parentWidget, 'toggle', lang.hitch(this, function () { - this.onLayoutChange(this.parentWidget.open); - }))); - } - this.own(aspect.after(this.parentWidget, 'resize', lang.hitch(this, 'resize'))); - this.own(topic.subscribe(this.parentWidget.id + '/resize/resize', lang.hitch(this, 'resize'))); - } + this.own(topic.subscribe('mapClickMode/currentSet', lang.hitch(this, 'setMapClickMode'))); - // spatialreference.org uses the old - // Proj4js style so we need an alias - // https://github.com/proj4js/proj4js/issues/23 - window.Proj4js = proj4; + if (this.parentWidget) { + if (this.parentWidget.toggleable) { + this.own(aspect.after(this.parentWidget, 'toggle', lang.hitch(this, function () { + this.onLayoutChange(this.parentWidget.open); + }))); + } + this.own(aspect.after(this.parentWidget, 'resize', lang.hitch(this, 'resize'))); + this.own(topic.subscribe(this.parentWidget.id + '/resize/resize', lang.hitch(this, 'resize'))); + } - if (this.mapRightClickMenu) { - this.addRightClickMenu(); - } + // spatialreference.org uses the old + // Proj4js style so we need an alias + // https://github.com/proj4js/proj4js/issues/23 + window.Proj4js = proj4; + + if (this.mapRightClickMenu) { + this.addRightClickMenu(); + } + })); }, createGraphicsLayer: function () { this.pointSymbol = new PictureMarkerSymbol(require.toUrl('gis/dijit/StreetView/images/blueArrow.png'), 30, 30); diff --git a/viewer/js/gis/plugins/Google.js b/viewer/js/gis/plugins/Google.js new file mode 100644 index 000000000..3d9435c82 --- /dev/null +++ b/viewer/js/gis/plugins/Google.js @@ -0,0 +1,219 @@ +(function(root, factory) { + + if (root === null) { + throw new Error('Google-maps package can be used only in browser'); + } + + if (typeof define === 'function' && define.amd) { + define(factory); + } else if (typeof exports === 'object') { + module.exports = factory(); + } else { + root.GoogleMapsLoader = factory(); + } + +})(typeof window !== 'undefined' ? window : null, function() { + + + 'use strict'; + + + var googleVersion = '3.18'; + + var script = null; + + var google = null; + + var loading = false; + + var callbacks = []; + + var onLoadEvents = []; + + var originalCreateLoaderMethod = null; + + + var GoogleMapsLoader = {}; + + + GoogleMapsLoader.URL = 'https://maps.googleapis.com/maps/api/js'; + + GoogleMapsLoader.KEY = null; + + GoogleMapsLoader.LIBRARIES = []; + + GoogleMapsLoader.CLIENT = null; + + GoogleMapsLoader.CHANNEL = null; + + GoogleMapsLoader.LANGUAGE = null; + + GoogleMapsLoader.REGION = null; + + GoogleMapsLoader.VERSION = googleVersion; + + GoogleMapsLoader.WINDOW_CALLBACK_NAME = '__google_maps_api_provider_initializator__'; + + + GoogleMapsLoader._googleMockApiObject = {}; + + + GoogleMapsLoader.load = function(fn) { + if (google === null) { + if (loading === true) { + if (fn) { + callbacks.push(fn); + } + } else { + loading = true; + + window[GoogleMapsLoader.WINDOW_CALLBACK_NAME] = function() { + ready(fn); + }; + + GoogleMapsLoader.createLoader(); + } + } else if (fn) { + fn(google); + } + }; + + + GoogleMapsLoader.createLoader = function() { + script = document.createElement('script'); + script.type = 'text/javascript'; + script.src = GoogleMapsLoader.createUrl(); + + document.body.appendChild(script); + }; + + + GoogleMapsLoader.isLoaded = function() { + return google !== null; + }; + + + GoogleMapsLoader.createUrl = function() { + var url = GoogleMapsLoader.URL; + + url += '?callback=' + GoogleMapsLoader.WINDOW_CALLBACK_NAME; + + if (GoogleMapsLoader.KEY) { + url += '&key=' + GoogleMapsLoader.KEY; + } + + if (GoogleMapsLoader.LIBRARIES.length > 0) { + url += '&libraries=' + GoogleMapsLoader.LIBRARIES.join(','); + } + + if (GoogleMapsLoader.CLIENT) { + url += '&client=' + GoogleMapsLoader.CLIENT + '&v=' + GoogleMapsLoader.VERSION; + } + + if (GoogleMapsLoader.CHANNEL) { + url += '&channel=' + GoogleMapsLoader.CHANNEL; + } + + if (GoogleMapsLoader.LANGUAGE) { + url += '&language=' + GoogleMapsLoader.LANGUAGE; + } + + if (GoogleMapsLoader.REGION) { + url += '®ion=' + GoogleMapsLoader.REGION; + } + + return url; + }; + + + GoogleMapsLoader.release = function(fn) { + var release = function() { + GoogleMapsLoader.KEY = null; + GoogleMapsLoader.LIBRARIES = []; + GoogleMapsLoader.CLIENT = null; + GoogleMapsLoader.CHANNEL = null; + GoogleMapsLoader.LANGUAGE = null; + GoogleMapsLoader.REGION = null; + GoogleMapsLoader.VERSION = googleVersion; + + google = null; + loading = false; + callbacks = []; + onLoadEvents = []; + + if (typeof window.google !== 'undefined') { + delete window.google; + } + + if (typeof window[GoogleMapsLoader.WINDOW_CALLBACK_NAME] !== 'undefined') { + delete window[GoogleMapsLoader.WINDOW_CALLBACK_NAME]; + } + + if (originalCreateLoaderMethod !== null) { + GoogleMapsLoader.createLoader = originalCreateLoaderMethod; + originalCreateLoaderMethod = null; + } + + if (script !== null) { + script.parentElement.removeChild(script); + script = null; + } + + if (fn) { + fn(); + } + }; + + if (loading) { + GoogleMapsLoader.load(function() { + release(); + }); + } else { + release(); + } + }; + + + GoogleMapsLoader.onLoad = function(fn) { + onLoadEvents.push(fn); + }; + + + GoogleMapsLoader.makeMock = function() { + originalCreateLoaderMethod = GoogleMapsLoader.createLoader; + + GoogleMapsLoader.createLoader = function() { + window.google = GoogleMapsLoader._googleMockApiObject; + window[GoogleMapsLoader.WINDOW_CALLBACK_NAME](); + }; + }; + + + var ready = function(fn) { + var i; + + loading = false; + + if (google === null) { + google = window.google; + } + + for (i = 0; i < onLoadEvents.length; i++) { + onLoadEvents[i](google); + } + + if (fn) { + fn(google); + } + + for (i = 0; i < callbacks.length; i++) { + callbacks[i](google); + } + + callbacks = []; + }; + + + return GoogleMapsLoader; + +});