Source: map-openstreetmap/src/main/resources/META-INF/resources/js/MapOpenStreetMap.es.js

  1. /**
  2.  * Copyright (c) 2000-present Liferay, Inc. All rights reserved.
  3.  *
  4.  * This library is free software; you can redistribute it and/or modify it under
  5.  * the terms of the GNU Lesser General Public License as published by the Free
  6.  * Software Foundation; either version 2.1 of the License, or (at your option)
  7.  * any later version.
  8.  *
  9.  * This library is distributed in the hope that it will be useful, but WITHOUT
  10.  * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
  11.  * FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
  12.  * details.
  13.  */
  15. import MapBase from 'map-common/js/MapBase.es';
  16. import {Config} from 'metal-state';
  18. import OpenStreetMapDialog from './OpenStreetMapDialog.es';
  19. import OpenStreetMapGeoJSON from './OpenStreetMapGeoJSON.es';
  20. import OpenStreetMapGeocoder from './OpenStreetMapGeocoder.es';
  21. import OpenStreetMapMarker from './OpenStreetMapMarker.es';
  23. /**
  24.  * MapOpenStreetMap
  25.  * @review
  26.  */
  27. class MapOpenStreetMap extends MapBase {
  29. 	/**
  30. 	 * Creates a new map using OpenStreetMap's API
  31. 	 * @param  {Array} args List of arguments to be passed to State
  32. 	 * @review
  33. 	 */
  34. 	constructor(...args) {
  35. 		super(...args);
  37. 		this._map = null;
  38. 	}
  40. 	/**
  41. 	 * @inheritDoc
  42. 	 * @review
  43. 	 */
  44. 	_createMap(location, controlsConfig) {
  45. 		const mapConfig = {
  46. 			center: location,
  47. 			layers: [L.tileLayer(this.tileURI)],
  48. 			zoom: this.zoom,
  49. 		};
  51. 		const map = L.map(
  52. 			document.querySelector(this.boundingBox),
  53. 			Object.assign(mapConfig, controlsConfig)
  54. 		);
  56. 		if (this.data && this.data.features) {
  57. 			const bounds = new L.LatLngBounds();
  59. 			this.data.features.forEach((feature) =>
  60. 				bounds.extend(
  61. 					new L.LatLng(
  62. 						feature.geometry.coordinates[1],
  63. 						feature.geometry.coordinates[0]
  64. 					)
  65. 				)
  66. 			);
  68. 			map.fitBounds(bounds);
  69. 		}
  71. 		return map;
  72. 	}
  74. 	/**
  75. 	 * @inheritDoc
  76. 	 * @review
  77. 	 */
  78. 	addControl(control, position) {
  79. 		const LeafLetControl = L.Control.extend({
  80. 			onAdd() {
  81. 				if (typeof control === 'string') {
  82. 					control = document.querySelector(control);
  83. 				}
  85. 				return control;
  86. 			},
  88. 			options: {
  89. 				position: MapOpenStreetMap.POSITION_MAP[position],
  90. 			},
  91. 		});
  93. 		this._map.addControl(new LeafLetControl());
  94. 	}
  96. 	/**
  97. 	 * @inheritDoc
  98. 	 * @review
  99. 	 */
  100. 	getBounds() {
  101. 		return this._map.getBounds();
  102. 	}
  104. 	/**
  105. 	 * @inheritDoc
  106. 	 * @review
  107. 	 */
  108. 	setCenter(location) {
  109. 		if (this._map) {
  110. 			this._map.panTo(location);
  111. 		}
  113. 		if (this._geolocationMarker) {
  114. 			this._geolocationMarker.setPosition(location);
  115. 		}
  116. 	}
  117. }
  119. MapBase.DialogImpl = OpenStreetMapDialog;
  121. MapBase.GeocoderImpl = OpenStreetMapGeocoder;
  123. MapBase.GeoJSONImpl = OpenStreetMapGeoJSON;
  125. MapBase.MarkerImpl = OpenStreetMapMarker;
  127. MapBase.SearchImpl = null;
  129. MapOpenStreetMap.CONTROLS_MAP = {
  130. 	[MapBase.CONTROLS.ATTRIBUTION]: 'attributionControl',
  131. 	[MapBase.CONTROLS.ZOOM]: 'zoomControl',
  132. };
  134. MapOpenStreetMap.POSITION_MAP = {
  135. 	[MapBase.POSITION.BOTTOM]: 'bottomleft',
  136. 	[MapBase.POSITION.BOTTOM_CENTER]: 'bottomleft',
  137. 	[MapBase.POSITION.BOTTOM_LEFT]: 'bottomleft',
  138. 	[MapBase.POSITION.BOTTOM_RIGHT]: 'bottomright',
  139. 	[MapBase.POSITION.CENTER]: 'topleft',
  140. 	[MapBase.POSITION.LEFT]: 'topleft',
  141. 	[MapBase.POSITION.LEFT_BOTTOM]: 'bottomleft',
  142. 	[MapBase.POSITION.LEFT_CENTER]: 'topleft',
  143. 	[MapBase.POSITION.LEFT_TOP]: 'topleft',
  144. 	[MapBase.POSITION.RIGHT]: 'bottomright',
  145. 	[MapBase.POSITION.RIGHT_BOTTOM]: 'bottomright',
  146. 	[MapBase.POSITION.RIGHT_CENTER]: 'bottomright',
  147. 	[MapBase.POSITION.RIGHT_TOP]: 'topright',
  148. 	[MapBase.POSITION.TOP]: 'topright',
  149. 	[MapBase.POSITION.TOP_CENTER]: 'topright',
  150. 	[MapBase.POSITION.TOP_LEFT]: 'topleft',
  151. 	[MapBase.POSITION.TOP_RIGHT]: 'topright',
  152. };
  154. /**
  155.  * State definition.
  156.  * @type {!Object}
  157.  * @static
  158.  */
  159. MapOpenStreetMap.STATE = {
  160. 	...MapBase.STATE,
  162. 	/**
  163. 	 * Url used for fetching map tile information
  164. 	 * @type {string}
  165. 	 */
  166. 	tileURI: Config.string().value(
  167. 		'//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'
  168. 	),
  169. };
  171. export default MapOpenStreetMap;
  172. export {MapOpenStreetMap};