Move Logos in attributions

css/ol.css

@@ -209,10 +209,8 @@ button.ol-full-screen-true:after {
 .ol-attribution li:not(:last-child):after {
   content: " ";
 }
-.ol-attribution-bing-tos {
-  /* float:right; */
-  /* padding-left: .4em; */
-  /* line-height: 1.5em; */
+.ol-attribution img {
+  max-height: 2em;
 }
 .ol-attribution ul, .ol-attribution button {
   display: inline-block;
@@ -228,8 +226,12 @@ button.ol-full-screen-true:after {
   bottom: 0;
   right: 0;
   border-radius: 4px 0 0;
-  height: 1em;
-  line-height: .9em;
+  height: 1.1em;
+  line-height: 1em;
+}
+.ol-attribution.ol-uncollapsible img {
+  margin-top: -.2em;
+  max-height: 1.6em;
 }
 .ol-attribution.ol-uncollapsible button {
   display: none;

externs/olx.js

@@ -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}
  */
 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),

src/ol/control/attributioncontrol.js

@@ -38,6 +38,15 @@ ol.control.Attribution = function(opt_options) {
    */
   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
    * @type {boolean}
@@ -56,12 +65,22 @@ ol.control.Attribution = function(opt_options) {
     'role' : 'tooltip'
   }, tipLabel);
 
+  /**
+   * @private
+   * @type {string}
+   */
+  this.collapseLabel_ = goog.isDef(options.collapseLabel) ?
+      options.collapseLabel : '\u00BB';
+
   /**
    * @private
    * @type {string}
    */
   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
@@ -115,6 +134,12 @@ ol.control.Attribution = function(opt_options) {
    */
   this.attributionElementRenderedVisible_ = {};
 
+  /**
+   * @private
+   * @type {Object.<string, Element>}
+   */
+  this.logoElements_ = {};
+
 };
 goog.inherits(ol.control.Attribution, ol.control.Control);
 
@@ -232,12 +257,57 @@ ol.control.Attribution.prototype.updateElement_ = function(frameState) {
   }
 
   var renderVisible =
-      !goog.object.isEmpty(this.attributionElementRenderedVisible_);
+      !goog.object.isEmpty(this.attributionElementRenderedVisible_) ||
+      !goog.object.isEmpty(frameState.logos);
   if (this.renderedVisible_ != renderVisible) {
     goog.style.setElementShown(this.element, 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();
   goog.dom.classes.toggle(this.element, 'ol-collapsed');
   goog.dom.setTextContent(this.labelSpan_,
-      (this.collapsed_) ? '\u00D7' : this.label_);
+      (this.collapsed_) ? this.collapseLabel_ : this.label_);
   this.collapsed_ = !this.collapsed_;
 };