xref: /plugin/openlayersmap/script.js (revision 6921fdc470b4dbcfd7e415712840b28beb7fe7cf)
1/*
2 * Copyright (c) 2008-2016 Mark C. Prins <mprins@users.sf.net>
3 *
4 * Permission to use, copy, modify, and distribute this software for any
5 * purpose with or without fee is hereby granted, provided that the above
6 * copyright notice and this permission notice appear in all copies.
7 *
8 * THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
9 * WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
10 * MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
11 * ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
12 * WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
13 * ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
14 * OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
15 */
16
17/**
18 * @fileoverview Javascript voor OpenLayers plugin.
19 *
20 * @requires {lib/OpenLayers.js} or a full openlayers build
21 * @author Mark C. Prins <mprins@users.sf.net>
22 *
23 */
24
25/**
26 * Openlayers selectcontrol.
27 *
28 * @type {OpenLayers.Control.SelectFeature}
29 * @private
30 */
31var selectControl;
32
33/**
34 * handle feature select event.
35 *
36 * @param {OpenLayers.Feature.Vector}
37 *            selFeature the selected feature
38 */
39function onFeatureSelect(selFeature) {
40	// 'this' is selectFeature control
41	var pPos = selFeature.geometry.getBounds().getCenterLonLat();
42	// != OpenLayers.Geometry.Point
43	if (selFeature.geometry.CLASS_NAME === "OpenLayers.Geometry.LineString") {
44		try {
45			// for lines make the popup show at the cursor position
46			pPos = selFeature.layer.map.getLonLatFromViewPortPx(this.handlers.feature.evt.xy);
47		} catch (anErr) {
48			OpenLayers.Console.warn("unable to get event position; reverting to boundingbox center.");
49			pPos = selFeature.geometry.getBounds().getCenterLonLat();
50		}
51	}
52
53	var pContent = '<div class="spacer">&nbsp;</div>';
54	if (selFeature.data.rowId !== undefined) {
55		pContent += '<span class="rowId">' + selFeature.data.rowId + ': </span>';
56	}
57	if (selFeature.data.name !== undefined) {
58		pContent += '<span class="txt">' + selFeature.data.name + '</span>';
59	}
60	if (selFeature.data.ele !== undefined) {
61		pContent += '<div class="ele">elevation: ' + selFeature.data.ele + '</div>';
62	}
63	if (selFeature.data.type !== undefined) {
64		pContent += '<div>' + selFeature.data.type + '</div>';
65	}
66	if (selFeature.data.time !== undefined) {
67		pContent += '<div class="time">time: ' + selFeature.data.time + '</div>';
68	}
69	if (selFeature.data.description !== undefined) {
70		pContent += '<div class="desc">' + selFeature.data.description + '</div>';
71	}
72	// mapillary layer
73	if (selFeature.attributes.location !== undefined) {
74		pContent += '<div class="desc">' + selFeature.data.location + '</div>';
75	}
76	// mapillary layer
77	if (selFeature.attributes.image !== undefined) {
78		pContent += '<img class="img" src=' + selFeature.data.image + ' width="320" />';
79	}
80	// mapillary layer
81	if (selFeature.attributes.ca !== undefined) {
82		var angle = Math.floor(selFeature.data.ca);
83		pContent += '<div class="coord"><img src="' + DOKU_BASE + 'lib/plugins/openlayersmapoverlays/icons/arrow-up-20.png'
84				+ '" width="16" height="16" style="transform:rotate(' + angle + 'deg)" alt="' + angle + 'º"/> '+OpenLayers.i18n("compass") + angle + 'º</div>';
85	}
86
87	if (selFeature.attributes.img !== undefined) {
88		pContent += '<div class="coord" title="lat;lon"><img src="' + selFeature.attributes.img
89				+ '" width="16" height="16" style="transform:rotate(' + selFeature.attributes.angle + 'deg)" />&nbsp;'
90				// + 'lat;lon: '
91				+ selFeature.data.latlon + '</div>';
92	}
93	if (pContent.length > 0) {
94		// only show when there is something to show...
95		var popup = new OpenLayersMap.Popup.FramedCloud("olPopup", pPos, null, pContent, null, true, function() {
96			selectControl.unselect(selFeature);
97			jQuery('#' + selectControl.layer.map.div.id).focus();
98		});
99		selFeature.popup = popup;
100		selFeature.layer.map.addPopup(popup);
101		jQuery('#olPopup').attr("tabindex", -1).focus();
102	}
103}
104
105/**
106 * handle feature unselect event. remove & destroy the popup.
107 *
108 * @param {OpenLayers.Feature.Vector}
109 *            selFeature the un-selected feature
110 */
111function onFeatureUnselect(selFeature) {
112	if (selFeature.popup !== null) {
113		selFeature.layer.map.removePopup(selFeature.popup);
114		selFeature.popup.destroy();
115		selFeature.popup = null;
116	}
117}
118/**
119 * Test for css support in the browser by sniffing for a css class we added
120 * using javascript added by the action plugin; this is an edge case because
121 * browsers that support javascript generally support css as well.
122 *
123 * @returns {Boolean} true when the browser supports css (and implicitly
124 *          javascript)
125 */
126function olTestCSSsupport() {
127	return (jQuery('.olCSSsupported').length > 0);
128}
129
130/**
131 * Creates a DocumentFragment to insert into the dom.
132 *
133 * @param mapid
134 *            id for the map div
135 * @param width
136 *            width for the map div
137 * @param height
138 *            height for the map div
139 * @returns a {DocumentFragment} element that can be injected into the dom
140 */
141function olCreateMaptag(mapid, width, height) {
142	var mEl = '<div id="' + mapid + '-olContainer" class="olContainer olWebOnly">'
143	// map
144	+ '<div id="' + mapid + '" tabindex="0" style="width:' + width + ';height:' + height + ';" class="olMap"></div>'
145	// statusbar
146	+ '<div id="' + mapid + '-olStatusBar" style="width:' + width + ';" class="olStatusBarContainer">' + '  <div id="'
147			+ mapid + '-statusbar-scale" class="olStatusBar olStatusBarScale">scale</div>' + '  <div id="' + mapid
148			+ '-statusbar-mouseposition" class="olStatusBar olStatusBarMouseposition"></div>' + '  <div id="' + mapid
149			+ '-statusbar-projection" class="olStatusBar olStatusBarProjection">proj</div>' + '  <div id="' + mapid
150			+ '-statusbar-text" class="olStatusBar olStatusBarText">txt</div>' + '</div>'
151			//
152			+ '</div>',
153	// fragment
154	frag = document.createDocumentFragment(),
155	// temp node
156	temp = document.createElement('div');
157	temp.innerHTML = mEl;
158	while (temp.firstChild) {
159		frag.appendChild(temp.firstChild);
160	}
161	return frag;
162}
163
164/**
165 * Create the map based on the params given.
166 *
167 * @param {Object}
168 *            mapOpts MapOptions hash {id:'olmap', width:500px, height:500px,
169 *            lat:6710200, lon:506500, zoom:13, statusbar:1, controls:1,
170 *            poihoverstyle:1, baselyr:'', kmlfile:'', gpxfile:'', geojsonfile,
171 *            summary:''}
172 * @param {Array}
173 *            OLmapPOI array with POI's [ {lat:6710300,lon:506000,txt:'instap
174 *            punt',angle:180,opacity:.9,img:'', rowId:n},... ]);
175 *
176 * @return {OpenLayers.Map} the created map
177 */
178function createMap(mapOpts, OLmapPOI) {
179	if (!olEnable) {
180		return;
181	}
182	if (!olTestCSSsupport()) {
183		olEnable = false;
184		return;
185	}
186	OpenLayers.ImgPath = DOKU_BASE + 'lib/plugins/openlayersmap/lib/img/';
187	OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
188
189	// find map element location
190	var cleartag = document.getElementById(mapOpts.id + '-clearer');
191	if (cleartag === null) {
192		return;
193	}
194	// create map element and add to document
195	var fragment = olCreateMaptag(mapOpts.id, mapOpts.width, mapOpts.height);
196	cleartag.parentNode.insertBefore(fragment, cleartag);
197
198	/** dynamic map extent. */
199	var extent = new OpenLayers.Bounds(),
200
201	/** map. */
202	m = new OpenLayers.Map({
203		div : mapOpts.id,
204		projection : 'EPSG:900913',
205		displayProjection : new OpenLayers.Projection("EPSG:4326"),
206		numZoomLevels : 22,
207		controls : [],
208		theme : null
209	});
210
211	if (osmEnable) {
212		/* add OSM map layers */
213		m.addLayer(new OpenLayers.Layer.OSM());
214
215		/* open cycle map */
216		m.addLayer(new OpenLayersMap.Layer.OCM());
217		m.addLayer(new OpenLayersMap.Layer.OCM("transport", [
218				"http://a.tile2.opencyclemap.org/transport/${z}/${x}/${y}.png",
219				"http://b.tile2.opencyclemap.org/transport/${z}/${x}/${y}.png",
220				"http://c.tile2.opencyclemap.org/transport/${z}/${x}/${y}.png" ], {
221			visibility : mapOpts.baselyr === "transport"
222		}));
223		m.addLayer(new OpenLayersMap.Layer.OCM("landscape", [
224				"http://a.tile3.opencyclemap.org/landscape/${z}/${x}/${y}.png",
225				"http://b.tile3.opencyclemap.org/landscape/${z}/${x}/${y}.png",
226				"http://c.tile3.opencyclemap.org/landscape/${z}/${x}/${y}.png" ], {
227			visibility : mapOpts.baselyr === "landscape"
228		}));
229
230		m.addLayer(new OpenLayers.Layer.OSM(
231				"hike and bike map", "http://toolserver.org/tiles/hikebike/${z}/${x}/${y}.png", {
232					visibility : mapOpts.baselyr === "hike and bike map",
233					tileOptions : {
234						crossOriginKeyword : null
235					}
236		}));
237	}
238	/*
239	 * add Stamen map layers, see: http://maps.stamen.com/
240	 */
241	if (stamenEnable) {
242		m.addLayer(new OpenLayersMap.Layer.StamenTerrain());
243		m.addLayer(new OpenLayersMap.Layer.StamenToner());
244	}
245
246	if (gEnable) {
247		/* load google maps */
248		try {
249			m.addLayer(new OpenLayers.Layer.Google("google relief", {
250				type : google.maps.MapTypeId.TERRAIN,
251				numZoomLevels : 16,
252				animationEnabled : true,
253				visibility : mapOpts.baselyr === "google relief"
254			}));
255			m.addLayer(new OpenLayers.Layer.Google("google sat", {
256				type : google.maps.MapTypeId.SATELLITE,
257				animationEnabled : true,
258				visibility : mapOpts.baselyr === "google sat"
259			}));
260			m.addLayer(new OpenLayers.Layer.Google("google hybrid", {
261				type : google.maps.MapTypeId.HYBRID,
262				animationEnabled : true,
263				visibility : mapOpts.baselyr === "google hybrid"
264			}));
265			m.addLayer(new OpenLayers.Layer.Google("google road", {
266				animationEnabled : true,
267				visibility : mapOpts.baselyr === "google road"
268			}));
269		} catch (ol_err1) {
270			Openlayers.Console.userError('Error loading Google maps' + ol_err1);
271		}
272	}
273
274	if (bEnable && bApiKey !== '') {
275		try {
276			/* add Bing tiles */
277			m.addLayer(new OpenLayers.Layer.Bing({
278				key : bApiKey,
279				type : "Road",
280				name : "bing road",
281				visibility : mapOpts.baselyr === "bing road",
282				wrapDateLine : true,
283				attributionTemplate : '<a target="_blank" href="http://www.bing.com/maps/">'
284						+ 'Bing™</a><img src="//www.bing.com/favicon.ico" alt="Bing logo"/> ${copyrights}'
285						+ '<a target="_blank" href="http://www.microsoft.com/maps/product/terms.html">Terms of Use</a>'
286			}));
287			m.addLayer(new OpenLayers.Layer.Bing({
288				key : bApiKey,
289				type : "Aerial",
290				name : "bing sat",
291				visibility : mapOpts.baselyr === "bing sat",
292				wrapDateLine : true,
293				attributionTemplate : '<a target="_blank" href="http://www.bing.com/maps/">'
294						+ 'Bing™</a><img src="//www.bing.com/favicon.ico" alt="Bing logo"/> ${copyrights}'
295						+ '<a target="_blank" href="http://www.microsoft.com/maps/product/terms.html">Terms of Use</a>'
296			}));
297			m.addLayer(new OpenLayers.Layer.Bing({
298				key : bApiKey,
299				type : "AerialWithLabels",
300				name : "bing hybrid",
301				visibility : mapOpts.baselyr === "bing hybrid",
302				wrapDateLine : true,
303				attributionTemplate : '<a target="_blank" href="http://www.bing.com/maps/">'
304						+ 'Bing™</a><img src="//www.bing.com/favicon.ico" alt="Bing logo"/> ${copyrights}'
305						+ '<a target="_blank" href="http://www.microsoft.com/maps/product/terms.html">Terms of Use</a>'
306			}));
307		} catch (ol_errBing) {
308			Openlayers.Console.userError('Error loading Bing maps: ' + ol_errBing);
309		}
310	}
311
312	m.setCenter(new OpenLayers.LonLat(mapOpts.lon, mapOpts.lat).transform(m.displayProjection, m.projection),
313			mapOpts.zoom);
314	extent.extend(m.getExtent());
315
316	// change/set alternative baselyr
317	try {
318		m.setBaseLayer(((m.getLayersByName(mapOpts.baselyr))[0]));
319	} catch (ol_err4) {
320		m.setBaseLayer(m.layers[0]);
321	}
322
323	m.addControls([ new OpenLayers.Control.ScaleLine({
324		geodesic : true
325	}), new OpenLayers.Control.KeyboardDefaults({
326		observeElement : mapOpts.id
327	}), new OpenLayers.Control.Navigation() ]);
328
329	if (mapOpts.statusbar === 1) {
330		// statusbar control: mouse pos.
331		m.addControl(new OpenLayers.Control.MousePosition({
332			'div' : OpenLayers.Util.getElement(mapOpts.id + '-statusbar-mouseposition')
333		}));
334		// statusbar control: scale
335		m.addControl(new OpenLayers.Control.Scale(mapOpts.id + '-statusbar-scale'));
336		// statusbar control: attribution
337		m.addControl(new OpenLayers.Control.Attribution({
338			'div' : OpenLayers.Util.getElement(mapOpts.id + '-statusbar-text')
339		}));
340		// statusbar control: projection
341		OpenLayers.Util.getElement(mapOpts.id + '-statusbar-projection').innerHTML = m.displayProjection;
342	} else {
343		OpenLayers.Util.getElement(mapOpts.id + '-olStatusBar').display = 'none';
344	}
345
346	if (OLmapPOI.length > 0) {
347		var markers = new OpenLayers.Layer.Vector("POI", {
348			styleMap : new OpenLayers.StyleMap({
349				"default" : {
350					cursor : "help",
351					externalGraphic : "${img}",
352					graphicHeight : 16,
353					graphicWidth : 16,
354					// graphicXOffset : 0,
355					// graphicYOffset : -8,
356					graphicOpacity : "${opacity}",
357					rotation : "${angle}",
358					backgroundGraphic : DOKU_BASE + "lib/plugins/openlayersmap/icons/marker_shadow.png",
359					// backgroundXOffset : 0,
360					// backgroundYOffset : -4,
361					backgroundRotation : "${angle}",
362					pointRadius : 10,
363					labelXOffset : 8,
364					labelYOffset : 8,
365					labelAlign : "lb",
366					label : "${label}",
367					// fontColor : "",
368					fontFamily : "monospace",
369					fontSize : "12px",
370					fontWeight : "bold"
371				},
372				"select" : {
373					cursor : "help",
374					externalGraphic : DOKU_BASE + "lib/plugins/openlayersmap/icons/marker-red.png",
375					graphicHeight : 16,
376					graphicWidth : 16,
377					// graphicXOffset : 0,
378					// graphicYOffset : -8,
379					graphicOpacity : 1.0,
380					rotation : "${angle}"
381				}
382			}),
383			isBaseLayer : false,
384			rendererOptions : {
385				yOrdering : true
386			}
387		});
388		m.addLayer(markers);
389		var features = [];
390		for (var j = 0; j < OLmapPOI.length; j++) {
391			var feat = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(OLmapPOI[j].lon, OLmapPOI[j].lat)
392					.transform(m.displayProjection, m.projection), {
393				angle : OLmapPOI[j].angle,
394				opacity : OLmapPOI[j].opacity,
395				img : DOKU_BASE + "lib/plugins/openlayersmap/icons/" + OLmapPOI[j].img,
396				label : OLmapPOI[j].rowId
397			});
398			var _latlon = OLmapPOI[j].lat + 'º;' + OLmapPOI[j].lon + 'º';
399			if (mapOpts.displayformat === 'DMS') {
400				_latlon = OpenLayers.Util.getFormattedLonLat(OLmapPOI[j].lat, 'lat') + ';'
401						+ OpenLayers.Util.getFormattedLonLat(OLmapPOI[j].lon, 'lon');
402			}
403			feat.data = {
404				name : OLmapPOI[j].txt,
405				rowId : OLmapPOI[j].rowId,
406				latlon : _latlon
407			};
408			features.push(feat);
409		}
410		markers.addFeatures(features);
411		extent.extend(markers.getDataExtent());
412		m.zoomToExtent(extent);
413	}
414
415	/* GPX layer */
416	if (mapOpts.gpxfile.length > 0) {
417		var layerGPX = new OpenLayers.Layer.Vector("GPS route", {
418			protocol : new OpenLayers.Protocol.HTTP({
419				url : DOKU_BASE + "lib/exe/fetch.php?media=" + mapOpts.gpxfile,
420				format : new OpenLayers.Format.GPX({
421					extractWaypoints : true,
422					extractTracks : true,
423					extractStyles : true,
424					extractAttributes : true,
425					handleHeight : true,
426					maxDepth : 3
427				})
428			}),
429			style : {
430				strokeColor : "#0000FF",
431				strokeWidth : 3,
432				strokeOpacity : 0.7,
433				pointRadius : 4,
434				fillColor : "#0099FF",
435				fillOpacity : 0.7
436			// , label:"${name}"
437			},
438			projection : new OpenLayers.Projection("EPSG:4326"),
439			strategies : [ new OpenLayers.Strategy.Fixed() ]
440		});
441		m.addLayer(layerGPX);
442		layerGPX.events.register('loadend', m, function() {
443			extent.extend(layerGPX.getDataExtent());
444			m.zoomToExtent(extent);
445		});
446	}
447
448	/* GeoJSON layer */
449	if (mapOpts.geojsonfile.length > 0) {
450		var layerGJS = new OpenLayers.Layer.Vector("json data", {
451			protocol : new OpenLayers.Protocol.HTTP({
452				url : DOKU_BASE + "lib/exe/fetch.php?media=" + mapOpts.geojsonfile,
453				format : new OpenLayers.Format.GeoJSON({
454					ignoreExtraDims : true
455				})
456			}),
457			style : {
458				strokeColor : "#FF00FF",
459				strokeWidth : 3,
460				strokeOpacity : 0.7,
461				pointRadius : 4,
462				fillColor : "#FF99FF",
463				fillOpacity : 0.7
464			// , label:"${name}"
465			},
466			projection : new OpenLayers.Projection("EPSG:4326"),
467			strategies : [ new OpenLayers.Strategy.Fixed() ]
468		});
469		m.addLayer(layerGJS);
470		layerGJS.events.register('loadend', m, function() {
471			extent.extend(layerGJS.getDataExtent());
472			m.zoomToExtent(extent);
473		});
474	}
475
476	/* KML layer */
477	if (mapOpts.kmlfile.length > 0) {
478		var layerKML = new OpenLayers.Layer.Vector("KML file", {
479			protocol : new OpenLayers.Protocol.HTTP({
480				url : DOKU_BASE + "lib/exe/fetch.php?media=" + mapOpts.kmlfile,
481				format : new OpenLayers.Format.KML({
482					extractStyles : true,
483					extractAttributes : true,
484					maxDepth : 3
485				})
486			}),
487			style : {
488				label : "${name}"
489			},
490			projection : new OpenLayers.Projection("EPSG:4326"),
491			strategies : [ new OpenLayers.Strategy.Fixed() ]
492		});
493		m.addLayer(layerKML);
494		layerKML.events.register('loadend', m, function() {
495			extent.extend(layerKML.getDataExtent());
496			m.zoomToExtent(extent);
497		});
498	}
499
500	// selectcontrol for layers
501	if ((m.getLayersByClass('OpenLayers.Layer.GML').length > 0)
502			|| m.getLayersByClass('OpenLayers.Layer.Vector').length > 0) {
503		selectControl = new OpenLayers.Control.SelectFeature((m.getLayersByClass('OpenLayers.Layer.Vector')).concat(m
504				.getLayersByClass('OpenLayers.Layer.GML')), {
505			hover : mapOpts.poihoverstyle,
506			onSelect : onFeatureSelect,
507			onUnselect : onFeatureUnselect
508		});
509		m.addControl(selectControl);
510		selectControl.activate();
511
512		// keyboard select control
513		var iControl = new OpenLayersMap.Control.KeyboardClick({
514			observeElement : mapOpts.id,
515			selectControl : selectControl
516		});
517		m.addControl(iControl);
518	}
519
520	if (mapOpts.controls === 1) {
521		/* add base controls to map */
522		m.addControls([ new OpenLayersMap.Control.LayerSwitcher(), new OpenLayers.Control.Graticule({
523			visible : false
524		}), new OpenLayersMap.Control.OverviewMap({
525			mapOptions : {
526				theme : null
527			}
528		}), new OpenLayersMap.Control.Zoom(), new OpenLayersMap.Control.Fullscreen() ]);
529
530		// add hillshade, since this is off by default only add when we have a
531		// layerswitcher
532		/*
533		m.addLayer(new OpenLayers.Layer.OSM("Hillshade", "http://toolserver.org/~cmarqu/hill/${z}/${x}/${y}.png", {
534			isBaseLayer : false,
535			transparent : true,
536			visibility : false,
537			displayOutsideMaxExtent : true,
538			attribution : '',
539			tileOptions : {
540				crossOriginKeyword : null
541			}
542		}));
543		*/
544	}
545
546	return m;
547}
548
549/** init. */
550function olInit() {
551	if (olEnable) {
552		var _i = 0;
553		// create the maps in the page
554		for (_i = 0; _i < olMapData.length; _i++) {
555			var _id = olMapData[_i].mapOpts.id;
556			olMaps[_id] = createMap(olMapData[_i].mapOpts, olMapData[_i].poi);
557
558			// set max-width on help pop-over
559			jQuery('#' + _id).parent().parent().find('.olMapHelp').css('max-width', olMapData[_i].mapOpts.width);
560
561			// shrink the map width to fit inside page container
562			var _w = jQuery('#' + _id + '-olContainer').parent().innerWidth();
563			if (parseInt(olMapData[_i].mapOpts.width) > _w) {
564				jQuery('#' + _id).width(_w);
565				jQuery('#' + _id + '-olStatusBar').width(_w);
566				jQuery('#' + _id).parent().parent().find('.olMapHelp').width(_w);
567				olMaps[_id].updateSize();
568			}
569		}
570
571		// hide the table(s) with POI by giving it a print-only style
572		jQuery('.olPOItableSpan').addClass('olPrintOnly');
573		// hide the static map image(s) by giving it a print only style
574		jQuery('.olStaticMap').addClass('olPrintOnly');
575		// add help button with toggle.
576		jQuery('.olWebOnly > .olMap')
577				.prepend(
578						'<div class="olMapHelpButtonDiv">'
579								+ '<button onclick="jQuery(\'.olMapHelp\').toggle(500);" class="olMapHelpButton olHasTooltip"><span>'
580								+ OpenLayers.i18n("toggle_help") + '</span>?</button></div>');
581		// toggle to switch dynamic vs. static map
582		jQuery('.olMapHelp').before(
583				'<div class="a11y"><button onclick="jQuery(\'.olPrintOnly\').toggle();jQuery(\'.olWebOnly\').toggle();">'
584						+ OpenLayers.i18n("toggle_dynamic_map") + '</button></div>');
585	}
586}
587
588/**
589 * ol api flag.
590 *
591 * @type {Boolean}
592 */
593var olEnable = false,
594/**
595 * An array with data for each map in the page.
596 *
597 * @type {Array}
598 */
599olMapData = [],
600/**
601 * Holds a reference to all of the maps on this page with the map's id as key.
602 * Can be used as an extension point.
603 *
604 * @type {Object}
605 */
606olMaps = new Object(),
607/**
608 * Stamen tiles flag.
609 *
610 * @type {Boolean}
611 */
612stamenEnable = false,
613/**
614 * google map api flag.
615 *
616 * @type {Boolean}
617 */
618gEnable = false,
619/**
620 * Bing tiles flag.
621 *
622 * @type {Boolean}
623 */
624bEnable = false,
625/**
626 * Bing API key.
627 *
628 * @type {String}
629 */
630bApiKey = '',
631/**
632 * Google API key.
633 *
634 * @type {String}
635 */
636gApiKey = '',
637/**
638 * OSM tiles flag.
639 *
640 * @type {Boolean}
641 */
642osmEnable = true,
643/**
644 * CSS support flag.
645 *
646 * @type {Boolean}
647 */
648olCSSEnable = true;
649
650/* register olInit to run with onload event. */
651jQuery(olInit);
652