Add label option to FullScreen control
This commit is contained in:
@@ -120,12 +120,6 @@
|
|||||||
.ol-zoom .ol-zoom-out {
|
.ol-zoom .ol-zoom-out {
|
||||||
border-radius: 0 0 2px 2px;
|
border-radius: 0 0 2px 2px;
|
||||||
}
|
}
|
||||||
button.ol-full-screen-false:after {
|
|
||||||
content: "\2194";
|
|
||||||
}
|
|
||||||
button.ol-full-screen-true:after {
|
|
||||||
content: "\00d7";
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.ol-attribution {
|
.ol-attribution {
|
||||||
|
|||||||
@@ -980,6 +980,8 @@ olx.control.DefaultsOptions.prototype.zoomOptions;
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* @typedef {{className: (string|undefined),
|
* @typedef {{className: (string|undefined),
|
||||||
|
* label: (string|undefined),
|
||||||
|
* labelActive: (string|undefined),
|
||||||
* tipLabel: (string|undefined),
|
* tipLabel: (string|undefined),
|
||||||
* keys: (boolean|undefined),
|
* keys: (boolean|undefined),
|
||||||
* target: (Element|undefined)}}
|
* target: (Element|undefined)}}
|
||||||
@@ -996,6 +998,23 @@ olx.control.FullScreenOptions;
|
|||||||
olx.control.FullScreenOptions.prototype.className;
|
olx.control.FullScreenOptions.prototype.className;
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Text label to use for the button. Default is `\u2194` (an arrow).
|
||||||
|
* @type {string|undefined}
|
||||||
|
* @api
|
||||||
|
*/
|
||||||
|
olx.control.FullScreenOptions.prototype.label;
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Text label to use for the button when full-screen is active.
|
||||||
|
* Default is `\u00d7` (a cross).
|
||||||
|
* @type {string|undefined}
|
||||||
|
* @api
|
||||||
|
*/
|
||||||
|
olx.control.FullScreenOptions.prototype.labelActive;
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Text label to use for the button tip. Default is `Toggle full-screen`
|
* Text label to use for the button tip. Default is `Toggle full-screen`
|
||||||
* @type {string|undefined}
|
* @type {string|undefined}
|
||||||
|
|||||||
@@ -3,7 +3,6 @@ goog.provide('ol.control.FullScreen');
|
|||||||
goog.require('goog.asserts');
|
goog.require('goog.asserts');
|
||||||
goog.require('goog.dom');
|
goog.require('goog.dom');
|
||||||
goog.require('goog.dom.TagName');
|
goog.require('goog.dom.TagName');
|
||||||
goog.require('goog.dom.classlist');
|
|
||||||
goog.require('goog.dom.fullscreen');
|
goog.require('goog.dom.fullscreen');
|
||||||
goog.require('goog.dom.fullscreen.EventType');
|
goog.require('goog.dom.fullscreen.EventType');
|
||||||
goog.require('goog.events');
|
goog.require('goog.events');
|
||||||
@@ -37,13 +36,33 @@ ol.control.FullScreen = function(opt_options) {
|
|||||||
this.cssClassName_ = goog.isDef(options.className) ?
|
this.cssClassName_ = goog.isDef(options.className) ?
|
||||||
options.className : 'ol-full-screen';
|
options.className : 'ol-full-screen';
|
||||||
|
|
||||||
|
var label = goog.isDef(options.label) ?
|
||||||
|
options.label : '\u2194';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @private
|
||||||
|
* @type {Node}
|
||||||
|
*/
|
||||||
|
this.labelNode_ = /** @type {Node} */ (goog.isString(label) ?
|
||||||
|
goog.dom.createTextNode(label) : label);
|
||||||
|
|
||||||
|
var labelActive = goog.isDef(options.labelActive) ?
|
||||||
|
options.labelActive : '\u00d7';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @private
|
||||||
|
* @type {Node}
|
||||||
|
*/
|
||||||
|
this.labelActiveNode_ = /** @type {Node} */ (goog.isString(labelActive) ?
|
||||||
|
goog.dom.createTextNode(labelActive) : labelActive);
|
||||||
|
|
||||||
var tipLabel = goog.isDef(options.tipLabel) ?
|
var tipLabel = goog.isDef(options.tipLabel) ?
|
||||||
options.tipLabel : 'Toggle full-screen';
|
options.tipLabel : 'Toggle full-screen';
|
||||||
var button = goog.dom.createDom(goog.dom.TagName.BUTTON, {
|
var button = goog.dom.createDom(goog.dom.TagName.BUTTON, {
|
||||||
'class': this.cssClassName_ + '-' + goog.dom.fullscreen.isFullScreen(),
|
'class': this.cssClassName_ + '-' + goog.dom.fullscreen.isFullScreen(),
|
||||||
'type': 'button',
|
'type': 'button',
|
||||||
'title': tipLabel
|
'title': tipLabel
|
||||||
});
|
}, this.labelNode_);
|
||||||
|
|
||||||
goog.events.listen(button, goog.events.EventType.CLICK,
|
goog.events.listen(button, goog.events.EventType.CLICK,
|
||||||
this.handleClick_, false, this);
|
this.handleClick_, false, this);
|
||||||
@@ -120,14 +139,11 @@ ol.control.FullScreen.prototype.handleFullScreen_ = function() {
|
|||||||
* @private
|
* @private
|
||||||
*/
|
*/
|
||||||
ol.control.FullScreen.prototype.handleFullScreenChange_ = function() {
|
ol.control.FullScreen.prototype.handleFullScreenChange_ = function() {
|
||||||
var opened = this.cssClassName_ + '-true';
|
|
||||||
var closed = this.cssClassName_ + '-false';
|
|
||||||
var anchor = goog.dom.getFirstElementChild(this.element);
|
|
||||||
var map = this.getMap();
|
var map = this.getMap();
|
||||||
if (goog.dom.fullscreen.isFullScreen()) {
|
if (goog.dom.fullscreen.isFullScreen()) {
|
||||||
goog.dom.classlist.swap(anchor, closed, opened);
|
goog.dom.replaceNode(this.labelActiveNode_, this.labelNode_);
|
||||||
} else {
|
} else {
|
||||||
goog.dom.classlist.swap(anchor, opened, closed);
|
goog.dom.replaceNode(this.labelNode_, this.labelActiveNode_);
|
||||||
}
|
}
|
||||||
if (!goog.isNull(map)) {
|
if (!goog.isNull(map)) {
|
||||||
map.updateSize();
|
map.updateSize();
|
||||||
|
|||||||
@@ -32,8 +32,7 @@ ol.control.ZoomToExtent = function(opt_options) {
|
|||||||
var className = goog.isDef(options.className) ? options.className :
|
var className = goog.isDef(options.className) ? options.className :
|
||||||
'ol-zoom-extent';
|
'ol-zoom-extent';
|
||||||
|
|
||||||
var label = goog.isDef(options.label) ?
|
var label = goog.isDef(options.label) ? options.label : 'E';
|
||||||
options.label : 'E';
|
|
||||||
var tipLabel = goog.isDef(options.tipLabel) ?
|
var tipLabel = goog.isDef(options.tipLabel) ?
|
||||||
options.tipLabel : 'Fit to extent';
|
options.tipLabel : 'Fit to extent';
|
||||||
var button = goog.dom.createDom(goog.dom.TagName.BUTTON, {
|
var button = goog.dom.createDom(goog.dom.TagName.BUTTON, {
|
||||||
|
|||||||
Reference in New Issue
Block a user