Merge pull request #3135 from tsauerwein/control-label

Make changing the label of ZoomToExtent/FullScreen control consistent
This commit is contained in:
Tobias Sauerwein
2015-01-29 15:03:53 +01:00
7 changed files with 136 additions and 71 deletions

View File

@@ -69,32 +69,33 @@ ol.control.Attribution = function(opt_options) {
var tipLabel = goog.isDef(options.tipLabel) ?
options.tipLabel : 'Attributions';
/**
* @private
* @type {string}
*/
this.collapseLabel_ = goog.isDef(options.collapseLabel) ?
var collapseLabel = goog.isDef(options.collapseLabel) ?
options.collapseLabel : '\u00BB';
/**
* @private
* @type {string}
* @type {Node}
*/
this.label_ = goog.isDef(options.label) ? options.label : 'i';
var label = goog.dom.createDom(goog.dom.TagName.SPAN, {},
(this.collapsible_ && !this.collapsed_) ?
this.collapseLabel_ : this.label_);
this.collapseLabel_ = /** @type {Node} */ (goog.isString(collapseLabel) ?
goog.dom.createDom(goog.dom.TagName.SPAN, {}, collapseLabel) :
collapseLabel);
var label = goog.isDef(options.label) ? options.label : 'i';
/**
* @private
* @type {Element}
* @type {Node}
*/
this.labelSpan_ = label;
this.label_ = /** @type {Node} */ (goog.isString(label) ?
goog.dom.createDom(goog.dom.TagName.SPAN, {}, label) :
label);
var activeLabel = (this.collapsible_ && !this.collapsed_) ?
this.collapseLabel_ : this.label_;
var button = goog.dom.createDom(goog.dom.TagName.BUTTON, {
'type': 'button',
'title': tipLabel
}, this.labelSpan_);
}, activeLabel);
goog.events.listen(button, goog.events.EventType.CLICK,
this.handleClick_, false, this);
@@ -341,8 +342,11 @@ ol.control.Attribution.prototype.handleClick_ = function(event) {
*/
ol.control.Attribution.prototype.handleToggle_ = function() {
goog.dom.classlist.toggle(this.element, 'ol-collapsed');
goog.dom.setTextContent(this.labelSpan_,
(this.collapsed_) ? this.collapseLabel_ : this.label_);
if (this.collapsed_) {
goog.dom.replaceNode(this.collapseLabel_, this.label_);
} else {
goog.dom.replaceNode(this.label_, this.collapseLabel_);
}
this.collapsed_ = !this.collapsed_;
};

View File

@@ -3,7 +3,6 @@ goog.provide('ol.control.FullScreen');
goog.require('goog.asserts');
goog.require('goog.dom');
goog.require('goog.dom.TagName');
goog.require('goog.dom.classlist');
goog.require('goog.dom.fullscreen');
goog.require('goog.dom.fullscreen.EventType');
goog.require('goog.events');
@@ -37,13 +36,33 @@ ol.control.FullScreen = function(opt_options) {
this.cssClassName_ = goog.isDef(options.className) ?
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) ?
options.tipLabel : 'Toggle full-screen';
var button = goog.dom.createDom(goog.dom.TagName.BUTTON, {
'class': this.cssClassName_ + '-' + goog.dom.fullscreen.isFullScreen(),
'type': 'button',
'title': tipLabel
});
}, this.labelNode_);
goog.events.listen(button, goog.events.EventType.CLICK,
this.handleClick_, false, this);
@@ -120,14 +139,11 @@ ol.control.FullScreen.prototype.handleFullScreen_ = function() {
* @private
*/
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();
if (goog.dom.fullscreen.isFullScreen()) {
goog.dom.classlist.swap(anchor, closed, opened);
goog.dom.replaceNode(this.labelActiveNode_, this.labelNode_);
} else {
goog.dom.classlist.swap(anchor, opened, closed);
goog.dom.replaceNode(this.labelNode_, this.labelActiveNode_);
}
if (!goog.isNull(map)) {
map.updateSize();

View File

@@ -57,31 +57,33 @@ ol.control.OverviewMap = function(opt_options) {
var tipLabel = goog.isDef(options.tipLabel) ?
options.tipLabel : 'Overview map';
/**
* @private
* @type {string}
*/
this.collapseLabel_ = goog.isDef(options.collapseLabel) ?
var collapseLabel = goog.isDef(options.collapseLabel) ?
options.collapseLabel : '\u00AB';
/**
* @private
* @type {string}
* @type {Node}
*/
this.label_ = goog.isDef(options.label) ? options.label : '\u00BB';
var label = goog.dom.createDom(goog.dom.TagName.SPAN, {},
(this.collapsible_ && !this.collapsed_) ?
this.collapseLabel_ : this.label_);
this.collapseLabel_ = /** @type {Node} */ (goog.isString(collapseLabel) ?
goog.dom.createDom(goog.dom.TagName.SPAN, {}, collapseLabel) :
collapseLabel);
var label = goog.isDef(options.label) ? options.label : '\u00BB';
/**
* @private
* @type {Element}
* @type {Node}
*/
this.labelSpan_ = label;
this.label_ = /** @type {Node} */ (goog.isString(label) ?
goog.dom.createDom(goog.dom.TagName.SPAN, {}, label) :
label);
var activeLabel = (this.collapsible_ && !this.collapsed_) ?
this.collapseLabel_ : this.label_;
var button = goog.dom.createDom(goog.dom.TagName.BUTTON, {
'type': 'button',
'title': tipLabel
}, this.labelSpan_);
}, activeLabel);
goog.events.listen(button, goog.events.EventType.CLICK,
this.handleClick_, false, this);
@@ -427,8 +429,11 @@ ol.control.OverviewMap.prototype.handleClick_ = function(event) {
*/
ol.control.OverviewMap.prototype.handleToggle_ = function() {
goog.dom.classlist.toggle(this.element, 'ol-collapsed');
goog.dom.setTextContent(this.labelSpan_,
(this.collapsed_) ? this.collapseLabel_ : this.label_);
if (this.collapsed_) {
goog.dom.replaceNode(this.collapseLabel_, this.label_);
} else {
goog.dom.replaceNode(this.label_, this.collapseLabel_);
}
this.collapsed_ = !this.collapsed_;
// manage overview map if it had not been rendered before and control

View File

@@ -32,12 +32,22 @@ ol.control.Rotate = function(opt_options) {
var className = goog.isDef(options.className) ?
options.className : 'ol-rotate';
var label = goog.isDef(options.label) ?
options.label : '\u21E7';
/**
* @type {Element}
* @type {Node}
* @private
*/
this.label_ = goog.dom.createDom(goog.dom.TagName.SPAN,
'ol-compass', goog.isDef(options.label) ? options.label : '\u21E7');
this.label_ = null;
if (goog.isString(label)) {
this.label_ = goog.dom.createDom(goog.dom.TagName.SPAN,
'ol-compass', label);
} else {
this.label_ = label;
goog.dom.classlist.add(this.label_, 'ol-compass');
}
var tipLabel = goog.isDef(options.tipLabel) ?
options.tipLabel : 'Reset rotation';

View File

@@ -32,12 +32,13 @@ ol.control.ZoomToExtent = function(opt_options) {
var className = goog.isDef(options.className) ? options.className :
'ol-zoom-extent';
var label = goog.isDef(options.label) ? options.label : 'E';
var tipLabel = goog.isDef(options.tipLabel) ?
options.tipLabel : 'Fit to extent';
var button = goog.dom.createDom(goog.dom.TagName.BUTTON, {
'type': 'button',
'title': tipLabel
});
}, label);
goog.events.listen(button, goog.events.EventType.CLICK,
this.handleClick_, false, this);