Adding attribution control and attribution.

css/ol.css

@@ -117,7 +117,7 @@
     margin-top: -36px;
 }
 
-div.ol-control-zoom {
+.ol-control-zoom {
     position: absolute;
     top: 8px;
     left: 8px;
@@ -125,7 +125,7 @@ div.ol-control-zoom {
     border-radius: 4px;
     padding: 2px;
 }
-div.ol-control-zoom a {
+.ol-control-zoom a {
     display: block;
     margin: 1px;
     padding: 0;
@@ -142,19 +142,36 @@ div.ol-control-zoom a {
     background: rgba(0, 60, 136, 0.5);
     filter: alpha(opacity=80);
 }
-div.ol-control-zoom a:hover {
+.ol-control-zoom a:hover {
     background: #130085; /* fallback for IE */
     background: rgba(0, 60, 136, 0.7);
     filter: alpha(opacity=100);
 }
 @media only screen and (max-width: 600px) {
-    div.ol-control-zoom a:hover {
+    .ol-control-zoom a:hover {
         background: rgba(0, 60, 136, 0.5);
     }
 }
-a.ol-control-zoom-in {
+.ol-control-zoom-in {
     border-radius: 4px 4px 0 0;
 }
-a.ol-control-zoom-out {
+.ol-control-zoom-out {
     border-radius: 0 0 4px 4px;
-}
+}
+.ol-control-attribution {
+    position: absolute;
+    font-size: 10px;
+    text-align: right;
+    color: #eeeeee;
+    bottom: 0;
+    right: 0;
+    background: #130085; /* fallback for IE - IE6 requires background shorthand*/
+    background: rgba(0, 60, 136, 0.3);
+    filter: alpha(opacity=30);
+    font-family: 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
+    padding: 2px 4px;
+}
+.ol-control-attribution a {
+    color: white;
+    text-decoration: none;
+}

src/ol.js

@@ -2,6 +2,7 @@ goog.provide("ol");
 
 goog.require('ol.base');
 goog.require('ol.bounds');
+goog.require('ol.control.Attribution');
 goog.require('ol.control.Navigation');
 goog.require('ol.control.Zoom');
 goog.require('ol.event.Drag');

src/ol/Map.js

@@ -140,7 +140,7 @@ ol.Map.DEFAULT_TILE_SIZE = 256;
   @const
   @type {Array.<string>}
  */
-ol.Map.DEFAULT_CONTROLS = ["navigation", "zoom"];
+ol.Map.DEFAULT_CONTROLS = ["attribution", "navigation", "zoom"];
 
 /**
  * @return {ol.Loc} Map center in map projection.

src/ol/control/Attribution.js

@@ -0,0 +1,83 @@
+goog.provide('ol.control.Attribution');
+
+goog.require('ol.event');
+goog.require('ol.control.Control');
+
+goog.require('goog.dom');
+
+
+/**
+ * @constructor
+ * @extends {ol.control.Control}
+ * @param {boolean|undefined} opt_autoActivate
+ */
+ol.control.Attribution = function(opt_autoActivate) {
+
+    goog.base(this, opt_autoActivate);
+    
+    /**
+     * @type {Node}
+     */
+    this.container_ = null;
+
+    /**
+     * Activate this control when it is added to a map.  Default is true.
+     *
+     * @type {boolean} autoActivate
+     */
+    this.autoActivate_ =
+        goog.isDef(opt_autoActivate) ? opt_autoActivate : true;
+    
+};
+goog.inherits(ol.control.Attribution, ol.control.Control);
+
+/**
+ * @param {ol.Map} map
+ */
+ol.control.Attribution.prototype.setMap = function(map) {
+    this.container_ = goog.dom.createDom('div', 'ol-control-attribution');
+    var staticOverlay = map.getStaticOverlay();
+    if (!goog.isNull(this.container_) && !goog.isNull(staticOverlay)) {
+        goog.dom.append(staticOverlay, this.container_);
+    }
+    goog.base(this, 'setMap', map);
+};
+
+/** @inheritDoc */
+ol.control.Attribution.prototype.activate = function() {
+    var active = goog.base(this, 'activate');
+    if (active) {
+        this.map_.getEvents().register('addlayer', this.update, this);
+        this.update();
+    }
+    return active;
+};
+
+/** @inheritDoc */
+ol.control.Attribution.prototype.deactivate = function() {
+    var inactive = goog.base(this, 'deactivate');
+    if (inactive) {
+        this.map_.getEvents().unregister('addlayer', this.update, this);
+    }
+    return inactive;
+};
+
+ol.control.Attribution.prototype.update = function() {
+    var attribution = [],
+        layers = this.map_.getLayers(), layerAttribution;
+    for (var i=0, ii=layers.length; i<ii; ++i) {
+        layerAttribution = layers[i].getAttribution();
+        if (layerAttribution &&
+           !~goog.array.indexOf(attribution, layerAttribution)) {
+            attribution.push(layerAttribution);
+        }
+    }
+    this.container_.innerHTML = attribution.join(', ');
+};
+
+ol.control.Attribution.prototype.destroy = function() {
+    goog.dom.removeNode(this.container_);
+    goog.base(this, 'destroy');
+};
+
+ol.control.addControl('attribution', ol.control.Attribution);

src/ol/layer/Layer.js

@@ -4,4 +4,19 @@ goog.provide('ol.layer.Layer');
  * @constructor
  * @export
  */
-ol.layer.Layer = function() {};
+ol.layer.Layer = function() {
+    
+    /**
+     * @type {string}
+     * @protected
+     */
+    this.attribution_;
+    
+};
+
+/**
+ * @return {string}
+ */
+ol.layer.Layer.prototype.getAttribution = function() {
+    return this.attribution_;
+};

src/ol/layer/OSM.js

@@ -9,7 +9,12 @@ goog.require('ol.layer.XYZ');
  * @constructor
  * @extends {ol.layer.XYZ}
  */
-ol.layer.OSM = function() { 
+ol.layer.OSM = function() {
+    
+    //TODO Is this attribution still correct?
+    /** @inheritDoc */
+    this.attribution_ = "Data CC-By-SA by <a target='_blank' href='http://openstreetmap.org/'>OpenStreetMap</a>";
+    
     goog.base(this, 'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png');
 };