Add full screen control

css/ol.css

@@ -24,6 +24,43 @@
   position: absolute;
   border: 2px solid red;
 }
+.ol-full-screen {
+  background: rgba(255,255,255,0.4);
+  border-radius: 4px;
+  padding: 2px;
+  position: absolute;
+  right: 8px;
+  top: 8px;
+}
+@media print {
+  .ol-full-screen {
+    display: none;
+  }
+}
+.ol-full-screen a {
+  background: rgba(0,60,136,0.5);
+  color: white;
+  display: block;
+  font-family: 'Lucida Grande',Verdana,Geneva,Lucida,Arial,Helvetica,sans-serif;
+  font-size: 18px;
+  font-weight: bold;
+  height: 22px;
+  line-height: 19px;
+  margin: 1px;
+  padding: 0;
+  text-align: center;
+  text-decoration: none;
+  width: 22px;
+}
+.ol-full-screen div {
+  border-radius: 2px;
+}
+.ol-full-screen div a {
+  border-radius: 2px;
+}
+.ol-full-screen a:hover {
+  background: rgba(0,60,136,0.7);
+}
 .ol-logo {
   bottom: 0;
   left: 0;

src/objectliterals.jsdoc

@@ -112,6 +112,13 @@
  * @property {ol.control.ZoomOptions|undefined} zoomOptions Zoom options.
  */
 
+/**
+ * @typedef {Object} ol.control.FullScreenOptions
+ * @property {boolean|undefined} keys Full keyboard access.
+ * @property {ol.Map|undefined} map Map.
+ * @property {Element|undefined} target Target.
+ */
+
 /**
  * @typedef {Object} ol.control.LogoOptions
  * @property {ol.Map|undefined} map Map.

src/ol/control/fullscreencontrol.exports

@@ -0,0 +1 @@
+@exportClass ol.control.FullScreen ol.control.FullScreenOptions

src/ol/control/fullscreencontrol.js

@@ -0,0 +1,75 @@
+goog.provide('ol.control.FullScreen');
+
+goog.require('goog.asserts');
+goog.require('goog.dom');
+goog.require('goog.dom.TagName');
+goog.require('goog.dom.fullscreen');
+goog.require('goog.events');
+goog.require('goog.events.EventType');
+goog.require('ol.control.Control');
+goog.require('ol.css');
+
+
+
+/**
+ * @constructor
+ * @extends {ol.control.Control}
+ * @param {ol.control.FullScreenOptions=} opt_options Options.
+ */
+ol.control.FullScreen = function(opt_options) {
+
+  var options = goog.isDef(opt_options) ? opt_options : {};
+
+  var aElement = goog.dom.createDom(goog.dom.TagName.A, {
+    'href': '#fullScreen'
+  }, '\u00d7');
+  goog.events.listen(aElement, [
+    goog.events.EventType.CLICK,
+    goog.events.EventType.TOUCHEND
+  ], this.handleClick_, false, this);
+
+  var element = goog.dom.createDom(goog.dom.TagName.DIV, {
+    'class': 'ol-full-screen ' + ol.css.CLASS_UNSELECTABLE
+  }, aElement);
+
+  goog.base(this, {
+    element: element,
+    map: options.map,
+    target: options.target
+  });
+
+  /**
+   * @private
+   * @type {boolean}
+   */
+  this.keys_ = goog.isDef(options.keys) ? options.keys : false;
+
+};
+goog.inherits(ol.control.FullScreen, ol.control.Control);
+
+
+/**
+ * @param {goog.events.BrowserEvent} browserEvent Browser event.
+ * @private
+ */
+ol.control.FullScreen.prototype.handleClick_ = function(browserEvent) {
+  browserEvent.preventDefault();
+  var map = this.getMap();
+  if (goog.isNull(map)) {
+    return;
+  }
+  if (!goog.dom.fullscreen.isSupported()) {
+    return;
+  }
+  if (goog.dom.fullscreen.isFullScreen()) {
+    goog.dom.fullscreen.exitFullScreen();
+  } else {
+    var element = map.getTarget();
+    goog.asserts.assert(!goog.isNull(element));
+    if (this.keys_) {
+      goog.dom.fullscreen.requestFullScreenWithKeys(element);
+    } else {
+      goog.dom.fullscreen.requestFullScreen(element);
+    }
+  }
+};