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

add CSS class name support for full-screen button

Browse Source
This commit is contained in:
Mihai CAZACU
2020-08-06 21:23:16 +03:00
parent 7cbdf16a64
commit bd22d427ab
1 changed files with 27 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/ol/control/FullScreen.js
View File

@@ -39,6 +39,10 @@ const FullScreenEventType = {
* Instead of text, also an element (e.g. a `span` element) can be used.
* @property {string|Text} [labelActive='\u00d7'] Text label to use for the
* button when full-screen is active.
* @property {string} [activeClassName=className + '-true'] CSS class name for the button
* when full-screen is active.
* @property {string} [inactiveClassName=className + '-false'] CSS class name for the button
* when full-screen is inactive.
* Instead of text, also an element (e.g. a `span` element) can be used.
* @property {string} [tipLabel='Toggle full-screen'] Text label to use for the button tip.
* @property {boolean} [keys=false] Full keyboard access.
@@ -83,6 +87,24 @@ class FullScreen extends Control {
this.cssClassName_ =
options.className !== undefined ? options.className : 'ol-full-screen';
/**
* @private
* @type {string}
*/
this.activeClassName_ =
options.activeClassName !== undefined
? options.activeClassName.split(' ')
: [this.cssClassName_ + '-true'];
/**
* @private
* @type {string}
*/
this.inactiveClassName_ =
options.inactiveClassName !== undefined
? options.inactiveClassName.split(' ')
: [this.cssClassName_ + '-false'];
const label = options.label !== undefined ? options.label : '\u2922';
/**
@@ -212,12 +234,12 @@ class FullScreen extends Control {
* @private
*/
setClassName_(element, fullscreen) {
const activeClassName = this.cssClassName_ + '-true';
const inactiveClassName = this.cssClassName_ + '-false';
const activeClassName = this.activeClassName_;
const inactiveClassName = this.inactiveClassName_;
const nextClassName = fullscreen ? activeClassName : inactiveClassName;
element.classList.remove(activeClassName);
element.classList.remove(inactiveClassName);
element.classList.add(nextClassName);
element.classList.remove(...activeClassName);
element.classList.remove(...inactiveClassName);
element.classList.add(...nextClassName);
}
/**