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 '@liferay/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. 		MapBase.DialogImpl = OpenStreetMapDialog;
  38. 		MapBase.GeocoderImpl = OpenStreetMapGeocoder;
  39. 		MapBase.GeoJSONImpl = OpenStreetMapGeoJSON;
  40. 		MapBase.MarkerImpl = OpenStreetMapMarker;
  41. 		MapBase.SearchImpl = null;
  43. 		this._map = null;
  44. 	}
  46. 	/**
  47. 	 * @inheritDoc
  48. 	 * @review
  49. 	 */
  50. 	_createMap(location, controlsConfig) {
  51. 		const mapConfig = {
  52. 			center: location,
  53. 			layers: [L.tileLayer(this.tileURI)],
  54. 			zoom: this.zoom,
  55. 		};
  57. 		const map = L.map(
  58. 			document.querySelector(this.boundingBox),
  59. 			Object.assign(mapConfig, controlsConfig)
  60. 		);
  62. 		if (this.data && this.data.features) {
  63. 			const bounds = new L.LatLngBounds();
  65. 			this.data.features.forEach((feature) =>
  66. 				bounds.extend(
  67. 					new L.LatLng(
  68. 						feature.geometry.coordinates[1],
  69. 						feature.geometry.coordinates[0]
  70. 					)
  71. 				)
  72. 			);
  74. 			map.fitBounds(bounds);
  75. 		}
  77. 		return map;
  78. 	}
  80. 	/**
  81. 	 * @inheritDoc
  82. 	 * @review
  83. 	 */
  84. 	addControl(control, position) {
  85. 		const LeafLetControl = L.Control.extend({
  86. 			onAdd() {
  87. 				if (typeof control === 'string') {
  88. 					control = document.querySelector(control);
  89. 				}
  91. 				return control;
  92. 			},
  94. 			options: {
  95. 				position: MapOpenStreetMap.POSITION_MAP[position],
  96. 			},
  97. 		});
  99. 		this._map.addControl(new LeafLetControl());
  100. 	}
  102. 	/**
  103. 	 * @inheritDoc
  104. 	 * @review
  105. 	 */
  106. 	getBounds() {
  107. 		return this._map.getBounds();
  108. 	}
  110. 	/**
  111. 	 * @inheritDoc
  112. 	 * @review
  113. 	 */
  114. 	setCenter(location) {
  115. 		if (this._map) {
  116. 			this._map.panTo(location);
  117. 		}
  119. 		if (this._geolocationMarker) {
  120. 			this._geolocationMarker.setPosition(location);
  121. 		}
  122. 	}
  123. }
  125. MapOpenStreetMap.CONTROLS_MAP = {
  126. 	[MapBase.CONTROLS.ATTRIBUTION]: 'attributionControl',
  127. 	[MapBase.CONTROLS.ZOOM]: 'zoomControl',
  128. };
  130. MapOpenStreetMap.POSITION_MAP = {
  131. 	[MapBase.POSITION.BOTTOM]: 'bottomleft',
  132. 	[MapBase.POSITION.BOTTOM_CENTER]: 'bottomleft',
  133. 	[MapBase.POSITION.BOTTOM_LEFT]: 'bottomleft',
  134. 	[MapBase.POSITION.BOTTOM_RIGHT]: 'bottomright',
  135. 	[MapBase.POSITION.CENTER]: 'topleft',
  136. 	[MapBase.POSITION.LEFT]: 'topleft',
  137. 	[MapBase.POSITION.LEFT_BOTTOM]: 'bottomleft',
  138. 	[MapBase.POSITION.LEFT_CENTER]: 'topleft',
  139. 	[MapBase.POSITION.LEFT_TOP]: 'topleft',
  140. 	[MapBase.POSITION.RIGHT]: 'bottomright',
  141. 	[MapBase.POSITION.RIGHT_BOTTOM]: 'bottomright',
  142. 	[MapBase.POSITION.RIGHT_CENTER]: 'bottomright',
  143. 	[MapBase.POSITION.RIGHT_TOP]: 'topright',
  144. 	[MapBase.POSITION.TOP]: 'topright',
  145. 	[MapBase.POSITION.TOP_CENTER]: 'topright',
  146. 	[MapBase.POSITION.TOP_LEFT]: 'topleft',
  147. 	[MapBase.POSITION.TOP_RIGHT]: 'topright',
  148. };
  150. /**
  151.  * State definition.
  152.  * @type {!Object}
  153.  * @static
  154.  */
  155. MapOpenStreetMap.STATE = {
  156. 	...MapBase.STATE,
  158. 	/**
  159. 	 * Url used for fetching map tile information
  160. 	 * @type {string}
  161. 	 */
  162. 	tileURI: Config.string().value(
  163. 		'//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'
  164. 	),
  165. };
  167. export default MapOpenStreetMap;
  168. export {MapOpenStreetMap};