Move Logos in attributions
This commit is contained in:
14
css/ol.css
14
css/ol.css
@@ -209,10 +209,8 @@ button.ol-full-screen-true:after {
|
|||||||
.ol-attribution li:not(:last-child):after {
|
.ol-attribution li:not(:last-child):after {
|
||||||
content: " ";
|
content: " ";
|
||||||
}
|
}
|
||||||
.ol-attribution-bing-tos {
|
.ol-attribution img {
|
||||||
/* float:right; */
|
max-height: 2em;
|
||||||
/* padding-left: .4em; */
|
|
||||||
/* line-height: 1.5em; */
|
|
||||||
}
|
}
|
||||||
.ol-attribution ul, .ol-attribution button {
|
.ol-attribution ul, .ol-attribution button {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
@@ -228,8 +226,12 @@ button.ol-full-screen-true:after {
|
|||||||
bottom: 0;
|
bottom: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
border-radius: 4px 0 0;
|
border-radius: 4px 0 0;
|
||||||
height: 1em;
|
height: 1.1em;
|
||||||
line-height: .9em;
|
line-height: 1em;
|
||||||
|
}
|
||||||
|
.ol-attribution.ol-uncollapsible img {
|
||||||
|
margin-top: -.2em;
|
||||||
|
max-height: 1.6em;
|
||||||
}
|
}
|
||||||
.ol-attribution.ol-uncollapsible button {
|
.ol-attribution.ol-uncollapsible button {
|
||||||
display: none;
|
display: none;
|
||||||
|
|||||||
@@ -685,11 +685,16 @@ olx.control.AttributionOptions.prototype.tipLabel;
|
|||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Text label to use for the attributions button. Default is `i`
|
* Text label to use for the collapsed attributions button. Default is `i`
|
||||||
* @type {string|undefined}
|
* @type {string|undefined}
|
||||||
*/
|
*/
|
||||||
olx.control.AttributionOptions.prototype.label;
|
olx.control.AttributionOptions.prototype.label;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Text label to use for the expanded attributions button. Default is `»`
|
||||||
|
* @type {string|undefined}
|
||||||
|
*/
|
||||||
|
olx.control.AttributionOptions.prototype.collapseLabel;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @typedef {{element: (Element|undefined),
|
* @typedef {{element: (Element|undefined),
|
||||||
|
|||||||
@@ -38,6 +38,15 @@ ol.control.Attribution = function(opt_options) {
|
|||||||
*/
|
*/
|
||||||
this.ulElement_ = goog.dom.createElement(goog.dom.TagName.UL);
|
this.ulElement_ = goog.dom.createElement(goog.dom.TagName.UL);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @private
|
||||||
|
* @type {Element}
|
||||||
|
*/
|
||||||
|
this.logoLi_ = goog.dom.createElement(goog.dom.TagName.LI);
|
||||||
|
|
||||||
|
goog.dom.appendChild(this.ulElement_, this.logoLi_);
|
||||||
|
goog.style.setElementShown(this.logoLi_, false);
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @private
|
* @private
|
||||||
* @type {boolean}
|
* @type {boolean}
|
||||||
@@ -56,12 +65,22 @@ ol.control.Attribution = function(opt_options) {
|
|||||||
'role' : 'tooltip'
|
'role' : 'tooltip'
|
||||||
}, tipLabel);
|
}, tipLabel);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @private
|
||||||
|
* @type {string}
|
||||||
|
*/
|
||||||
|
this.collapseLabel_ = goog.isDef(options.collapseLabel) ?
|
||||||
|
options.collapseLabel : '\u00BB';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @private
|
* @private
|
||||||
* @type {string}
|
* @type {string}
|
||||||
*/
|
*/
|
||||||
this.label_ = goog.isDef(options.label) ? options.label : 'i';
|
this.label_ = goog.isDef(options.label) ? options.label : 'i';
|
||||||
var label = goog.dom.createDom(goog.dom.TagName.SPAN, {}, this.label_);
|
var label = goog.dom.createDom(goog.dom.TagName.SPAN, {},
|
||||||
|
(collapsible && !this.collapsed_) ?
|
||||||
|
this.collapseLabel_ : this.label_);
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @private
|
* @private
|
||||||
@@ -115,6 +134,12 @@ ol.control.Attribution = function(opt_options) {
|
|||||||
*/
|
*/
|
||||||
this.attributionElementRenderedVisible_ = {};
|
this.attributionElementRenderedVisible_ = {};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @private
|
||||||
|
* @type {Object.<string, Element>}
|
||||||
|
*/
|
||||||
|
this.logoElements_ = {};
|
||||||
|
|
||||||
};
|
};
|
||||||
goog.inherits(ol.control.Attribution, ol.control.Control);
|
goog.inherits(ol.control.Attribution, ol.control.Control);
|
||||||
|
|
||||||
@@ -232,12 +257,57 @@ ol.control.Attribution.prototype.updateElement_ = function(frameState) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
var renderVisible =
|
var renderVisible =
|
||||||
!goog.object.isEmpty(this.attributionElementRenderedVisible_);
|
!goog.object.isEmpty(this.attributionElementRenderedVisible_) ||
|
||||||
|
!goog.object.isEmpty(frameState.logos);
|
||||||
if (this.renderedVisible_ != renderVisible) {
|
if (this.renderedVisible_ != renderVisible) {
|
||||||
goog.style.setElementShown(this.element, renderVisible);
|
goog.style.setElementShown(this.element, renderVisible);
|
||||||
this.renderedVisible_ = renderVisible;
|
this.renderedVisible_ = renderVisible;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.insertLogos_(frameState);
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {?olx.FrameState} frameState Frame state.
|
||||||
|
* @private
|
||||||
|
*/
|
||||||
|
ol.control.Attribution.prototype.insertLogos_ = function(frameState) {
|
||||||
|
|
||||||
|
var logo;
|
||||||
|
var logos = frameState.logos;
|
||||||
|
var logoElements = this.logoElements_;
|
||||||
|
|
||||||
|
for (logo in logoElements) {
|
||||||
|
if (!(logo in logos)) {
|
||||||
|
goog.dom.removeNode(logoElements[logo]);
|
||||||
|
delete logoElements[logo];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
var image, logoElement, logoKey;
|
||||||
|
for (logoKey in logos) {
|
||||||
|
if (!(logoKey in logoElements)) {
|
||||||
|
image = new Image();
|
||||||
|
image.src = logoKey;
|
||||||
|
var logoValue = logos[logoKey];
|
||||||
|
if (logoValue === '') {
|
||||||
|
logoElement = image;
|
||||||
|
} else {
|
||||||
|
logoElement = goog.dom.createDom(goog.dom.TagName.A, {
|
||||||
|
'href': logoValue,
|
||||||
|
'target': '_blank'
|
||||||
|
});
|
||||||
|
logoElement.appendChild(image);
|
||||||
|
}
|
||||||
|
goog.dom.appendChild(this.logoLi_, logoElement);
|
||||||
|
logoElements[logoKey] = logoElement;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
goog.style.setElementShown(this.logoLi_, !goog.object.isEmpty(logos));
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
@@ -249,6 +319,6 @@ ol.control.Attribution.prototype.handleToggle_ = function(pointerEvent) {
|
|||||||
pointerEvent.browserEvent.preventDefault();
|
pointerEvent.browserEvent.preventDefault();
|
||||||
goog.dom.classes.toggle(this.element, 'ol-collapsed');
|
goog.dom.classes.toggle(this.element, 'ol-collapsed');
|
||||||
goog.dom.setTextContent(this.labelSpan_,
|
goog.dom.setTextContent(this.labelSpan_,
|
||||||
(this.collapsed_) ? '\u00D7' : this.label_);
|
(this.collapsed_) ? this.collapseLabel_ : this.label_);
|
||||||
this.collapsed_ = !this.collapsed_;
|
this.collapsed_ = !this.collapsed_;
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user