ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Make code prettier

Browse Source 
This updates ESLint and our shared eslint-config-openlayers to use Prettier.  Most formatting changes were automatically applied with this:

    npm run lint -- --fix

A few manual changes were required:

 * In `examples/offscreen-canvas.js`, the `//eslint-disable-line` comment needed to be moved to the appropriate line to disable the error about the `'worker-loader!./offscreen-canvas.worker.js'` import.
 * In `examples/webpack/exapmle-builder.js`, spaces could not be added after a couple `function`s for some reason.  While editing this, I reworked `ExampleBuilder` to be a class.
 * In `src/ol/format/WMSGetFeatureInfo.js`, the `// @ts-ignore` comment needed to be moved down one line so it applied to the `parsersNS` argument.
This commit is contained in:
Tim Schaub
2020-04-06 12:25:12 -06:00
parent 53b48baf62
commit 054af09032
790 changed files with 46833 additions and 33765 deletions
Download Patch File Download Diff File Expand all files Collapse all files

159
src/ol/control/OverviewMap.js
View File

@@ -1,24 +1,29 @@
/**
* @module ol/control/OverviewMap
*/
import PluggableMap from '../PluggableMap.js';
import CompositeMapRenderer from '../renderer/Composite.js';
import Control from './Control.js';
import EventType from '../events/EventType.js';
import MapEventType from '../MapEventType.js';
import MapProperty from '../MapProperty.js';
import {getChangeEventType} from '../Object.js';
import ObjectEventType from '../ObjectEventType.js';
import Overlay from '../Overlay.js';
import OverlayPositioning from '../OverlayPositioning.js';
import ViewProperty from '../ViewProperty.js';
import Control from './Control.js';
import {fromExtent as polygonFromExtent} from '../geom/Polygon.js';
import {CLASS_CONTROL, CLASS_UNSELECTABLE, CLASS_COLLAPSED} from '../css.js';
import {replaceNode} from '../dom.js';
import {listen, listenOnce} from '../events.js';
import EventType from '../events/EventType.js';
import {containsExtent, equals as equalsExtent, getBottomRight, getTopLeft, scaleFromCenter} from '../extent.js';
import PluggableMap from '../PluggableMap.js';
import View from '../View.js';
import ViewProperty from '../ViewProperty.js';
import {CLASS_COLLAPSED, CLASS_CONTROL, CLASS_UNSELECTABLE} from '../css.js';
import {
containsExtent,
equals as equalsExtent,
getBottomRight,
getTopLeft,
scaleFromCenter,
} from '../extent.js';
import {getChangeEventType} from '../Object.js';
import {listen, listenOnce} from '../events.js';
import {fromExtent as polygonFromExtent} from '../geom/Polygon.js';
import {replaceNode} from '../dom.js';
/**
* Maximum width and/or height extent ratio that determines when the overview
@@ -27,7 +32,6 @@ import View from '../View.js';
*/
const MAX_RATIO = 0.75;
/**
* Minimum width and/or height extent ratio that determines when the overview
* map should be zoomed in.
@@ -35,14 +39,12 @@ const MAX_RATIO = 0.75;
*/
const MIN_RATIO = 0.1;
class ControlledMap extends PluggableMap {
createRenderer() {
return new CompositeMapRenderer(this);
}
}
/**
* @typedef {Object} Options
* @property {string} [className='ol-overviewmap'] CSS class name.
@@ -64,7 +66,6 @@ class ControlledMap extends PluggableMap {
* a default view with the same projection as the main map will be used.
*/
/**
* Create a new control with a map acting as an overview map for another
* defined map.
@@ -72,18 +73,16 @@ class ControlledMap extends PluggableMap {
* @api
*/
class OverviewMap extends Control {
/**
* @param {Options=} opt_options OverviewMap options.
*/
constructor(opt_options) {
const options = opt_options ? opt_options : {};
super({
element: document.createElement('div'),
render: options.render || render,
target: options.target
target: options.target,
});
/**
@@ -95,14 +94,15 @@ class OverviewMap extends Control {
* @type {boolean}
* @private
*/
this.collapsed_ = options.collapsed !== undefined ? options.collapsed : true;
this.collapsed_ =
options.collapsed !== undefined ? options.collapsed : true;
/**
* @private
* @type {boolean}
*/
this.collapsible_ = options.collapsible !== undefined ?
options.collapsible : true;
this.collapsible_ =
options.collapsible !== undefined ? options.collapsible : true;
if (!this.collapsible_) {
this.collapsed_ = false;
@@ -112,8 +112,8 @@ class OverviewMap extends Control {
* @private
* @type {boolean}
*/
this.rotateWithView_ = options.rotateWithView !== undefined ?
options.rotateWithView : false;
this.rotateWithView_ =
options.rotateWithView !== undefined ? options.rotateWithView : false;
/**
* @private
@@ -121,11 +121,14 @@ class OverviewMap extends Control {
*/
this.viewExtent_ = undefined;
const className = options.className !== undefined ? options.className : 'ol-overviewmap';
const className =
options.className !== undefined ? options.className : 'ol-overviewmap';
const tipLabel = options.tipLabel !== undefined ? options.tipLabel : 'Overview map';
const tipLabel =
options.tipLabel !== undefined ? options.tipLabel : 'Overview map';
const collapseLabel = options.collapseLabel !== undefined ? options.collapseLabel : '\u00AB';
const collapseLabel =
options.collapseLabel !== undefined ? options.collapseLabel : '\u00AB';
if (typeof collapseLabel === 'string') {
/**
@@ -140,7 +143,6 @@ class OverviewMap extends Control {
const label = options.label !== undefined ? options.label : '\u00BB';
if (typeof label === 'string') {
/**
* @private
@@ -152,14 +154,18 @@ class OverviewMap extends Control {
this.label_ = label;
}
const activeLabel = (this.collapsible_ && !this.collapsed_) ?
this.collapseLabel_ : this.label_;
const activeLabel =
this.collapsible_ && !this.collapsed_ ? this.collapseLabel_ : this.label_;
const button = document.createElement('button');
button.setAttribute('type', 'button');
button.title = tipLabel;
button.appendChild(activeLabel);
button.addEventListener(EventType.CLICK, this.handleClick_.bind(this), false);
button.addEventListener(
EventType.CLICK,
this.handleClick_.bind(this),
false
);
/**
* @type {HTMLElement}
@@ -180,12 +186,12 @@ class OverviewMap extends Control {
* @private
*/
this.ovmap_ = new ControlledMap({
view: options.view
view: options.view,
});
const ovmap = this.ovmap_;
if (options.layers) {
options.layers.forEach(function(layer) {
options.layers.forEach(function (layer) {
ovmap.addLayer(layer);
});
}
@@ -201,13 +207,18 @@ class OverviewMap extends Control {
this.boxOverlay_ = new Overlay({
position: [0, 0],
positioning: OverlayPositioning.CENTER_CENTER,
element: box
element: box,
});
this.ovmap_.addOverlay(this.boxOverlay_);
const cssClasses = className + ' ' + CLASS_UNSELECTABLE + ' ' + CLASS_CONTROL +
(this.collapsed_ && this.collapsible_ ? ' ' + CLASS_COLLAPSED : '') +
(this.collapsible_ ? '' : ' ol-uncollapsible');
const cssClasses =
className +
' ' +
CLASS_UNSELECTABLE +
' ' +
CLASS_CONTROL +
(this.collapsed_ && this.collapsible_ ? ' ' + CLASS_COLLAPSED : '') +
(this.collapsible_ ? '' : ' ol-uncollapsible');
const element = this.element;
element.className = cssClasses;
element.appendChild(this.ovmapDiv_);
@@ -222,21 +233,23 @@ class OverviewMap extends Control {
/* Functions definition */
const computeDesiredMousePosition = function(mousePosition) {
const computeDesiredMousePosition = function (mousePosition) {
return {
clientX: mousePosition.clientX,
clientY: mousePosition.clientY
clientY: mousePosition.clientY,
};
};
const move = function(event) {
const move = function (event) {
const position = /** @type {?} */ (computeDesiredMousePosition(event));
const coordinates = ovmap.getEventCoordinateInternal(/** @type {Event} */ (position));
const coordinates = ovmap.getEventCoordinateInternal(
/** @type {Event} */ (position)
);
overlay.setPosition(coordinates);
};
const endMoving = function(event) {
const endMoving = function (event) {
const coordinates = ovmap.getEventCoordinateInternal(event);
scope.getMap().getView().setCenterInternal(coordinates);
@@ -247,11 +260,10 @@ class OverviewMap extends Control {
/* Binding */
overlayBox.addEventListener('mousedown', function() {
overlayBox.addEventListener('mousedown', function () {
window.addEventListener('mousemove', move);
window.addEventListener('mouseup', endMoving);
});
}
/**
@@ -277,9 +289,14 @@ class OverviewMap extends Control {
if (map) {
this.ovmap_.setTarget(this.ovmapDiv_);
this.listenerKeys.push(listen(
map, ObjectEventType.PROPERTYCHANGE,
this.handleMapPropertyChange_, this));
this.listenerKeys.push(
listen(
map,
ObjectEventType.PROPERTYCHANGE,
this.handleMapPropertyChange_,
this
)
);
const view = map.getView();
if (view) {
@@ -317,12 +334,15 @@ class OverviewMap extends Control {
if (!this.view_) {
// Unless an explicit view definition was given, derive default from whatever main map uses.
const newView = new View({
projection: view.getProjection()
projection: view.getProjection(),
});
this.ovmap_.setView(newView);
}
view.addEventListener(getChangeEventType(ViewProperty.ROTATION), this.boundHandleRotationChanged_);
view.addEventListener(
getChangeEventType(ViewProperty.ROTATION),
this.boundHandleRotationChanged_
);
// Sync once with the new view
this.handleRotationChanged_();
}
@@ -333,7 +353,10 @@ class OverviewMap extends Control {
* @private
*/
unbindView_(view) {
view.removeEventListener(getChangeEventType(ViewProperty.ROTATION), this.boundHandleRotationChanged_);
view.removeEventListener(
getChangeEventType(ViewProperty.ROTATION),
this.boundHandleRotationChanged_
);
}
/**
@@ -381,10 +404,12 @@ class OverviewMap extends Control {
const ovview = ovmap.getView();
const ovextent = ovview.calculateExtentInternal(ovmapSize);
const topLeftPixel =
ovmap.getPixelFromCoordinateInternal(getTopLeft(extent));
const bottomRightPixel =
ovmap.getPixelFromCoordinateInternal(getBottomRight(extent));
const topLeftPixel = ovmap.getPixelFromCoordinateInternal(
getTopLeft(extent)
);
const bottomRightPixel = ovmap.getPixelFromCoordinateInternal(
getBottomRight(extent)
);
const boxWidth = Math.abs(topLeftPixel[0] - bottomRightPixel[0]);
const boxHeight = Math.abs(topLeftPixel[1] - bottomRightPixel[1]);
@@ -392,10 +417,12 @@ class OverviewMap extends Control {
const ovmapWidth = ovmapSize[0];
const ovmapHeight = ovmapSize[1];
if (boxWidth < ovmapWidth * MIN_RATIO ||
boxHeight < ovmapHeight * MIN_RATIO ||
boxWidth > ovmapWidth * MAX_RATIO ||
boxHeight > ovmapHeight * MAX_RATIO) {
if (
boxWidth < ovmapWidth * MIN_RATIO ||
boxHeight < ovmapHeight * MIN_RATIO ||
boxWidth > ovmapWidth * MAX_RATIO ||
boxHeight > ovmapHeight * MAX_RATIO
) {
this.resetExtent_();
} else if (!containsExtent(ovextent, extent)) {
this.recenter_();
@@ -425,8 +452,7 @@ class OverviewMap extends Control {
// get how many times the current map overview could hold different
// box sizes using the min and max ratio, pick the step in the middle used
// to calculate the extent from the main map to set it to the overview map,
const steps = Math.log(
MAX_RATIO / MIN_RATIO) / Math.LN2;
const steps = Math.log(MAX_RATIO / MIN_RATIO) / Math.LN2;
const ratio = 1 / (Math.pow(2, steps / 2) * MIN_RATIO);
scaleFromCenter(extent, ratio);
ovview.fitInternal(polygonFromExtent(extent));
@@ -473,8 +499,8 @@ class OverviewMap extends Control {
const center = view.getCenterInternal();
const resolution = view.getResolution();
const ovresolution = ovview.getResolution();
const width = mapSize[0] * resolution / ovresolution;
const height = mapSize[1] * resolution / ovresolution;
const width = (mapSize[0] * resolution) / ovresolution;
const height = (mapSize[1] * resolution) / ovresolution;
// set position using center coordinates
overlay.setPosition(center);
@@ -520,11 +546,14 @@ class OverviewMap extends Control {
}
ovmap.updateSize();
this.resetExtent_();
listenOnce(ovmap, MapEventType.POSTRENDER,
function(event) {
listenOnce(
ovmap,
MapEventType.POSTRENDER,
function (event) {
this.updateBox_();
},
this);
this
);
}
}
@@ -617,7 +646,6 @@ class OverviewMap extends Control {
}
}
/**
* Update the overview map element.
* @param {import("../MapEvent.js").default} mapEvent Map event.
@@ -628,5 +656,4 @@ export function render(mapEvent) {
this.updateBox_();
}
export default OverviewMap;