Use extends and super for control/ScaleLine

This commit is contained in:
ahocevar
2018-07-17 14:35:47 +02:00
parent 7d5efd0348
commit 1da14a6d97
+12 -21
View File
@@ -1,7 +1,6 @@
/** /**
* @module ol/control/ScaleLine * @module ol/control/ScaleLine
*/ */
import {inherits} from '../util.js';
import {getChangeEventType} from '../Object.js'; import {getChangeEventType} from '../Object.js';
import {assert} from '../asserts.js'; import {assert} from '../asserts.js';
import Control from '../control/Control.js'; import Control from '../control/Control.js';
@@ -60,17 +59,22 @@ const LEADING_DIGITS = [1, 2, 5];
* but this can be changed by using the css selector `.ol-scale-line`. * but this can be changed by using the css selector `.ol-scale-line`.
* *
* @constructor * @constructor
* @extends {module:ol/control/Control}
* @param {module:ol/control/ScaleLine~Options=} opt_options Scale line options. * @param {module:ol/control/ScaleLine~Options=} opt_options Scale line options.
* @api * @api
*/ */
class ScaleLine { class ScaleLine extends Control {
constructor(opt_options) { constructor(opt_options) {
const options = opt_options ? opt_options : {}; const options = opt_options ? opt_options : {};
const className = options.className !== undefined ? options.className : 'ol-scale-line'; const className = options.className !== undefined ? options.className : 'ol-scale-line';
super({
element: document.createElement('DIV'),
render: options.render || render,
target: options.target
});
/** /**
* @private * @private
* @type {HTMLElement} * @type {HTMLElement}
@@ -78,13 +82,8 @@ class ScaleLine {
this.innerElement_ = document.createElement('DIV'); this.innerElement_ = document.createElement('DIV');
this.innerElement_.className = className + '-inner'; this.innerElement_.className = className + '-inner';
/** this.element.className = className + ' ' + CLASS_UNSELECTABLE;
* @private this.element.appendChild(this.innerElement_);
* @type {HTMLElement}
*/
this.element_ = document.createElement('DIV');
this.element_.className = className + ' ' + CLASS_UNSELECTABLE;
this.element_.appendChild(this.innerElement_);
/** /**
* @private * @private
@@ -116,12 +115,6 @@ class ScaleLine {
*/ */
this.renderedHTML_ = ''; this.renderedHTML_ = '';
Control.call(this, {
element: this.element_,
render: options.render || render,
target: options.target
});
listen( listen(
this, getChangeEventType(UNITS_PROP), this, getChangeEventType(UNITS_PROP),
this.handleUnitsChanged_, this); this.handleUnitsChanged_, this);
@@ -169,7 +162,7 @@ class ScaleLine {
if (!viewState) { if (!viewState) {
if (this.renderedVisible_) { if (this.renderedVisible_) {
this.element_.style.display = 'none'; this.element.style.display = 'none';
this.renderedVisible_ = false; this.renderedVisible_ = false;
} }
return; return;
@@ -256,7 +249,7 @@ class ScaleLine {
Math.pow(10, Math.floor(i / 3)); Math.pow(10, Math.floor(i / 3));
width = Math.round(count / pointResolution); width = Math.round(count / pointResolution);
if (isNaN(width)) { if (isNaN(width)) {
this.element_.style.display = 'none'; this.element.style.display = 'none';
this.renderedVisible_ = false; this.renderedVisible_ = false;
return; return;
} else if (width >= this.minWidth_) { } else if (width >= this.minWidth_) {
@@ -277,15 +270,13 @@ class ScaleLine {
} }
if (!this.renderedVisible_) { if (!this.renderedVisible_) {
this.element_.style.display = ''; this.element.style.display = '';
this.renderedVisible_ = true; this.renderedVisible_ = true;
} }
} }
} }
inherits(ScaleLine, Control);
/** /**
* Update the scale line element. * Update the scale line element.