From 448e300a0395004f1f1cf730fdf10decde429b79 Mon Sep 17 00:00:00 2001 From: Frederic Junod Date: Mon, 4 Feb 2013 09:59:38 +0100 Subject: [PATCH 1/7] Add ol.DeviceOrientation --- build.py | 1 + buildcfg/base.json | 3 +- buildcfg/ol-all.json | 3 +- buildcfg/ol-simple.json | 3 +- buildcfg/ol-whitespace.json | 3 +- buildcfg/ol.json | 3 +- examples/device-orientation.html | 58 ++++++++++++++++ examples/device-orientation.js | 29 ++++++++ externs/w3c_device_sensor_event.js | 89 ++++++++++++++++++++++++ src/ol/deviceorientation.exports | 1 + src/ol/deviceorientation.js | 104 +++++++++++++++++++++++++++++ 11 files changed, 292 insertions(+), 5 deletions(-) create mode 100644 examples/device-orientation.html create mode 100644 examples/device-orientation.js create mode 100644 externs/w3c_device_sensor_event.js create mode 100644 src/ol/deviceorientation.exports create mode 100644 src/ol/deviceorientation.js diff --git a/build.py b/build.py index 6320677344..731a05e37d 100755 --- a/build.py +++ b/build.py @@ -312,6 +312,7 @@ def examples_star_json(name, match): '../externs/oli.js', '../externs/proj4js.js', '../externs/tilejson.js', + '../externs/w3c_device_sensor_event.js', ], }) with open(t.name, 'w') as f: diff --git a/buildcfg/base.json b/buildcfg/base.json index 557581927e..f5588857ed 100644 --- a/buildcfg/base.json +++ b/buildcfg/base.json @@ -44,7 +44,8 @@ "../externs/geojson.js", "../externs/oli.js", "../externs/proj4js.js", - "../externs/tilejson.js" + "../externs/tilejson.js", + "../externs/w3c_device_sensor_event.js" ], "level": "VERBOSE", diff --git a/buildcfg/ol-all.json b/buildcfg/ol-all.json index 340936188c..a57165cf21 100644 --- a/buildcfg/ol-all.json +++ b/buildcfg/ol-all.json @@ -9,7 +9,8 @@ "../externs/geojson.js", "../externs/oli.js", "../externs/proj4js.js", - "../externs/tilejson.js" + "../externs/tilejson.js", + "../externs/w3c_device_sensor_event.js" ], "inherits": "base.json", diff --git a/buildcfg/ol-simple.json b/buildcfg/ol-simple.json index c21ae1528e..f0c6054618 100644 --- a/buildcfg/ol-simple.json +++ b/buildcfg/ol-simple.json @@ -18,7 +18,8 @@ "../externs/geojson.js", "../externs/oli.js", "../externs/proj4js.js", - "../externs/tilejson.js" + "../externs/tilejson.js", + "../externs/w3c_device_sensor_event.js" ], "inherits": "ol.json", diff --git a/buildcfg/ol-whitespace.json b/buildcfg/ol-whitespace.json index fb99f44cc3..63bc208d88 100644 --- a/buildcfg/ol-whitespace.json +++ b/buildcfg/ol-whitespace.json @@ -19,7 +19,8 @@ "../externs/geojson.js", "../externs/oli.js", "../externs/proj4js.js", - "../externs/tilejson.js" + "../externs/tilejson.js", + "../externs/w3c_device_sensor_event.js" ], "inherits": "ol.json", diff --git a/buildcfg/ol.json b/buildcfg/ol.json index cb689bbddc..670eb4c8ac 100644 --- a/buildcfg/ol.json +++ b/buildcfg/ol.json @@ -19,7 +19,8 @@ "../externs/geojson.js", "../externs/oli.js", "../externs/proj4js.js", - "../externs/tilejson.js" + "../externs/tilejson.js", + "../externs/w3c_device_sensor_event.js" ], "inherits": "base.json", diff --git a/examples/device-orientation.html b/examples/device-orientation.html new file mode 100644 index 0000000000..0423c68dc2 --- /dev/null +++ b/examples/device-orientation.html @@ -0,0 +1,58 @@ + + + + + + + + + + Device-Orientation example + + + +
+
+
+ OpenLayers 3 Examples +
    +
    • +
    • +
    • +
+
+
+
+ +
+ +
+
+
+
+
+ +
+ +
+

Device orientation example

+

α : rad

+

β : rad

+

γ : rad

+

Listen to DeviceOrientation events

+
+

See the device-orientation.js source to see how this is done.

+
+
orientation, openstreetmap
+
+ +
+ +
+ + + + + + diff --git a/examples/device-orientation.js b/examples/device-orientation.js new file mode 100644 index 0000000000..42f4836260 --- /dev/null +++ b/examples/device-orientation.js @@ -0,0 +1,29 @@ +goog.require('ol.DeviceOrientation'); +goog.require('ol.Map'); +goog.require('ol.RendererHints'); +goog.require('ol.View2D'); +goog.require('ol.layer.TileLayer'); +goog.require('ol.source.OSM'); + +var view = new ol.View2D({ + center: [0, 0], + zoom: 2 +}); +var map = new ol.Map({ + layers: [ + new ol.layer.TileLayer({ + source: new ol.source.OSM() + }) + ], + renderers: ol.RendererHints.createFromQueryData(), + target: 'map', + view: view +}); + +var deviceOrientation = new ol.DeviceOrientation(); + +deviceOrientation.on('changed', function() { + document.getElementById('alpha').innerHTML = deviceOrientation.getAlpha(); + document.getElementById('beta').innerHTML = deviceOrientation.getBeta(); + document.getElementById('gamma').innerHTML = deviceOrientation.getGamma(); +}); diff --git a/externs/w3c_device_sensor_event.js b/externs/w3c_device_sensor_event.js new file mode 100644 index 0000000000..ee3fba15b4 --- /dev/null +++ b/externs/w3c_device_sensor_event.js @@ -0,0 +1,89 @@ +/* + * Copyright 2013 The Closure Compiler Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +/** + * @fileoverview Definitions for W3C's device orientation and device motion + * events specification. + * This file depends on w3c_event.js. + * The whole file has been partially type annotated. + * Created from http://dev.w3.org/geo/api/spec-source-orientation. + * + * @externs + */ + +/** + * @constructor + * @extends {Event} + */ +function DeviceOrientationEvent() {} + +/** @type {?number} */ +DeviceOrientationEvent.prototype.alpha; + +/** @type {?number} */ +DeviceOrientationEvent.prototype.beta; + +/** @type {?number} */ +DeviceOrientationEvent.prototype.gamma; + +/** @type {boolean} */ +DeviceOrientationEvent.prototype.absolute; + +/** + * @constructor + */ +function DeviceAcceleration() {} + +/** @type {?number} */ +DeviceAcceleration.prototype.x; + +/** @type {?number} */ +DeviceAcceleration.prototype.y; + +/** @type {?number} */ +DeviceAcceleration.prototype.z; + +/** + * @constructor + */ +function DeviceRotationRate() {} + +/** @type {?number} */ +DeviceOrientationEvent.prototype.alpha; + +/** @type {?number} */ +DeviceOrientationEvent.prototype.beta; + +/** @type {?number} */ +DeviceOrientationEvent.prototype.gamma; + +/** + * @constructor + * @extends {Event} + */ +function DeviceMotionEvent() {} + +/** @type {?DeviceAcceleration} */ +DeviceMotionEvent.prototype.acceleration; + +/** @type {?DeviceAcceleration} */ +DeviceMotionEvent.prototype.accelerationIncludingGravity; + +/** @type {?DeviceRotationRate} */ +DeviceMotionEvent.prototype.rotationRate; + +/** @type {?number} */ +DeviceMotionEvent.prototype.interval; diff --git a/src/ol/deviceorientation.exports b/src/ol/deviceorientation.exports new file mode 100644 index 0000000000..4496aa24b9 --- /dev/null +++ b/src/ol/deviceorientation.exports @@ -0,0 +1 @@ +@exportSymbol ol.DeviceOrientation diff --git a/src/ol/deviceorientation.js b/src/ol/deviceorientation.js new file mode 100644 index 0000000000..24308fedff --- /dev/null +++ b/src/ol/deviceorientation.js @@ -0,0 +1,104 @@ +// FIXME: tracking property (same as ol.Geolocation) +// FIXME: event.absolute +goog.provide('ol.DeviceOrientation'); +goog.provide('ol.DeviceOrientationProperty'); + +goog.require('goog.events'); +goog.require('goog.math'); +goog.require('ol.Object'); + + +/** + * @enum {string} + */ +ol.DeviceOrientationProperty = { + ALPHA: 'alpha', + BETA: 'beta', + GAMMA: 'gamma' +}; + + + +/** + * @constructor + * @extends {ol.Object} + */ +ol.DeviceOrientation = function() { + + goog.base(this); + + if (ol.DeviceOrientation.SUPPORTED) { + goog.events.listen(window, 'deviceorientation', + this.orientationChange_, false, this); + } +}; +goog.inherits(ol.DeviceOrientation, ol.Object); + + +/** + * Is supported. + * @const + * @type {boolean} + */ +ol.DeviceOrientation.SUPPORTED = 'DeviceOrientationEvent' in window; + + +/** + * @private + * @param {goog.events.BrowserEvent} browserEvent Event. + */ +ol.DeviceOrientation.prototype.orientationChange_ = function(browserEvent) { + var event = /** @type {DeviceOrientationEvent} */ + (browserEvent.getBrowserEvent()); + if (goog.isDefAndNotNull(event.alpha)) { + this.set(ol.DeviceOrientationProperty.ALPHA, + goog.math.toRadians(event.alpha)); + } + if (goog.isDefAndNotNull(event.beta)) { + this.set(ol.DeviceOrientationProperty.BETA, + goog.math.toRadians(event.beta)); + } + if (goog.isDefAndNotNull(event.gamma)) { + this.set(ol.DeviceOrientationProperty.GAMMA, + goog.math.toRadians(event.gamma)); + } +}; + + +/** + * @return {number|undefined} alpha. + */ +ol.DeviceOrientation.prototype.getAlpha = function() { + return /** @type {number} */ ( + this.get(ol.DeviceOrientationProperty.ALPHA)); +}; +goog.exportProperty( + ol.DeviceOrientation.prototype, + 'getAlpha', + ol.DeviceOrientation.prototype.getAlpha); + + +/** + * @return {number|undefined} beta. + */ +ol.DeviceOrientation.prototype.getBeta = function() { + return /** @type {number} */ ( + this.get(ol.DeviceOrientationProperty.BETA)); +}; +goog.exportProperty( + ol.DeviceOrientation.prototype, + 'getBeta', + ol.DeviceOrientation.prototype.getBeta); + + +/** + * @return {number|undefined} gamma. + */ +ol.DeviceOrientation.prototype.getGamma = function() { + return /** @type {number} */ ( + this.get(ol.DeviceOrientationProperty.GAMMA)); +}; +goog.exportProperty( + ol.DeviceOrientation.prototype, + 'getGamma', + ol.DeviceOrientation.prototype.getGamma); From c431cc7f63c83b632cd11cb4ec01c7bd73966ac9 Mon Sep 17 00:00:00 2001 From: Frederic Junod Date: Tue, 16 Apr 2013 09:40:59 +0200 Subject: [PATCH 2/7] Add 'tracking' property to ol.DeviceOrientation --- examples/device-orientation.html | 9 ++-- examples/device-orientation.js | 3 ++ src/ol/deviceorientation.js | 70 +++++++++++++++++++++++++++++--- 3 files changed, 73 insertions(+), 9 deletions(-) diff --git a/examples/device-orientation.html b/examples/device-orientation.html index 0423c68dc2..1d00786255 100644 --- a/examples/device-orientation.html +++ b/examples/device-orientation.html @@ -37,9 +37,12 @@

Device orientation example

-

α : rad

-

β : rad

-

γ : rad

+ +

α :

+

β :

+

γ :

Listen to DeviceOrientation events

See the device-orientation.js source to see how this is done.

diff --git a/examples/device-orientation.js b/examples/device-orientation.js index 42f4836260..467d3dac9a 100644 --- a/examples/device-orientation.js +++ b/examples/device-orientation.js @@ -2,6 +2,7 @@ goog.require('ol.DeviceOrientation'); goog.require('ol.Map'); goog.require('ol.RendererHints'); goog.require('ol.View2D'); +goog.require('ol.dom.Input'); goog.require('ol.layer.TileLayer'); goog.require('ol.source.OSM'); @@ -21,6 +22,8 @@ var map = new ol.Map({ }); var deviceOrientation = new ol.DeviceOrientation(); +var track = new ol.dom.Input(document.getElementById('track')); +track.bindTo('checked', deviceOrientation, 'tracking'); deviceOrientation.on('changed', function() { document.getElementById('alpha').innerHTML = deviceOrientation.getAlpha(); diff --git a/src/ol/deviceorientation.js b/src/ol/deviceorientation.js index 24308fedff..e9e8000880 100644 --- a/src/ol/deviceorientation.js +++ b/src/ol/deviceorientation.js @@ -1,4 +1,3 @@ -// FIXME: tracking property (same as ol.Geolocation) // FIXME: event.absolute goog.provide('ol.DeviceOrientation'); goog.provide('ol.DeviceOrientationProperty'); @@ -14,7 +13,8 @@ goog.require('ol.Object'); ol.DeviceOrientationProperty = { ALPHA: 'alpha', BETA: 'beta', - GAMMA: 'gamma' + GAMMA: 'gamma', + TRACKING: 'tracking' }; @@ -27,14 +27,30 @@ ol.DeviceOrientation = function() { goog.base(this); - if (ol.DeviceOrientation.SUPPORTED) { - goog.events.listen(window, 'deviceorientation', - this.orientationChange_, false, this); - } + /** + * @private + * @type {?number} + */ + this.listenerKey_ = null; + + this.setTracking(false); + + goog.events.listen(this, + ol.Object.getChangedEventType(ol.DeviceOrientationProperty.TRACKING), + this.handleTrackingChanged_, false, this); }; goog.inherits(ol.DeviceOrientation, ol.Object); +/** + * @inheritDoc + */ +ol.DeviceOrientation.prototype.disposeInternal = function() { + this.setTracking(false); + goog.base(this, 'disposeInternal'); +}; + + /** * Is supported. * @const @@ -102,3 +118,45 @@ goog.exportProperty( ol.DeviceOrientation.prototype, 'getGamma', ol.DeviceOrientation.prototype.getGamma); + + +/** + * @return {boolean|undefined} tracking. + */ +ol.DeviceOrientation.prototype.getTracking = function() { + return /** @type {boolean} */ ( + this.get(ol.DeviceOrientationProperty.TRACKING)); +}; +goog.exportProperty( + ol.DeviceOrientation.prototype, + 'getTracking', + ol.DeviceOrientation.prototype.getTracking); + + +/** + * @private + */ +ol.DeviceOrientation.prototype.handleTrackingChanged_ = function() { + if (ol.DeviceOrientation.SUPPORTED) { + var tracking = this.getTracking(); + if (tracking && goog.isNull(this.listenerKey_)) { + this.listenerKey_ = goog.events.listen(window, 'deviceorientation', + this.orientationChange_, false, this); + } else if (!tracking && !goog.isNull(this.listenerKey_)) { + goog.events.unlistenByKey(this.listenerKey_); + this.listenerKey_ = null; + } + } +}; + + +/** + * @param {boolean} tracking Enable or disable tracking. + */ +ol.DeviceOrientation.prototype.setTracking = function(tracking) { + this.set(ol.DeviceOrientationProperty.TRACKING, tracking); +}; +goog.exportProperty( + ol.DeviceOrientation.prototype, + 'setTracking', + ol.DeviceOrientation.prototype.setTracking); From 15e5242611fdbdb4c93506cf4ee327e00e9e43af Mon Sep 17 00:00:00 2001 From: Frederic Junod Date: Tue, 16 Apr 2013 11:40:10 +0200 Subject: [PATCH 3/7] Add 'heading' property to ol.DeviceOrientation --- examples/device-orientation.html | 1 + examples/device-orientation.js | 1 + src/ol/deviceorientation.js | 23 ++++++++++++++++++++--- 3 files changed, 22 insertions(+), 3 deletions(-) diff --git a/examples/device-orientation.html b/examples/device-orientation.html index 1d00786255..dd1bb6215d 100644 --- a/examples/device-orientation.html +++ b/examples/device-orientation.html @@ -43,6 +43,7 @@

α :

β :

γ :

+

heading :

Listen to DeviceOrientation events

See the device-orientation.js source to see how this is done.

diff --git a/examples/device-orientation.js b/examples/device-orientation.js index 467d3dac9a..9b2fb247b4 100644 --- a/examples/device-orientation.js +++ b/examples/device-orientation.js @@ -29,4 +29,5 @@ deviceOrientation.on('changed', function() { document.getElementById('alpha').innerHTML = deviceOrientation.getAlpha(); document.getElementById('beta').innerHTML = deviceOrientation.getBeta(); document.getElementById('gamma').innerHTML = deviceOrientation.getGamma(); + document.getElementById('heading').innerHTML = deviceOrientation.getHeading(); }); diff --git a/src/ol/deviceorientation.js b/src/ol/deviceorientation.js index e9e8000880..4d27e163f4 100644 --- a/src/ol/deviceorientation.js +++ b/src/ol/deviceorientation.js @@ -1,4 +1,3 @@ -// FIXME: event.absolute goog.provide('ol.DeviceOrientation'); goog.provide('ol.DeviceOrientationProperty'); @@ -14,6 +13,7 @@ ol.DeviceOrientationProperty = { ALPHA: 'alpha', BETA: 'beta', GAMMA: 'gamma', + HEADING: 'heading', TRACKING: 'tracking' }; @@ -67,8 +67,12 @@ ol.DeviceOrientation.prototype.orientationChange_ = function(browserEvent) { var event = /** @type {DeviceOrientationEvent} */ (browserEvent.getBrowserEvent()); if (goog.isDefAndNotNull(event.alpha)) { - this.set(ol.DeviceOrientationProperty.ALPHA, - goog.math.toRadians(event.alpha)); + var alpha = goog.math.toRadians(event.alpha); + this.set(ol.DeviceOrientationProperty.ALPHA, alpha); + // event.absolute is undefined in iOS. + if (goog.isBoolean(event.absolute) && event.absolute) { + this.set(ol.DeviceOrientationProperty.HEADING, alpha); + } } if (goog.isDefAndNotNull(event.beta)) { this.set(ol.DeviceOrientationProperty.BETA, @@ -120,6 +124,19 @@ goog.exportProperty( ol.DeviceOrientation.prototype.getGamma); +/** + * @return {number|undefined} heading. + */ +ol.DeviceOrientation.prototype.getHeading = function() { + return /** @type {number} */ ( + this.get(ol.DeviceOrientationProperty.HEADING)); +}; +goog.exportProperty( + ol.DeviceOrientation.prototype, + 'getHeading', + ol.DeviceOrientation.prototype.getHeading); + + /** * @return {boolean|undefined} tracking. */ From b66b0be8b40a4a67d4436e295a5a88f795c83ccc Mon Sep 17 00:00:00 2001 From: Frederic Junod Date: Mon, 22 Apr 2013 09:08:31 +0200 Subject: [PATCH 4/7] Add options to ol.DeviceOrientation constructor --- src/objectliterals.jsdoc | 5 +++++ src/ol/deviceorientation.exports | 2 +- src/ol/deviceorientation.js | 10 +++++----- 3 files changed, 11 insertions(+), 6 deletions(-) diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index 47630acd77..f5be363af5 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -1,3 +1,8 @@ +/** + * @typedef {Object} ol.DeviceOrientationOptions + * @property {boolean|undefined} tracking Tracking. + */ + /** * @typedef {Object} ol.GeolocationOptions * @property {boolean|undefined} tracking Tracking. diff --git a/src/ol/deviceorientation.exports b/src/ol/deviceorientation.exports index 4496aa24b9..6988135399 100644 --- a/src/ol/deviceorientation.exports +++ b/src/ol/deviceorientation.exports @@ -1 +1 @@ -@exportSymbol ol.DeviceOrientation +@exportClass ol.DeviceOrientation ol.DeviceOrientationOptions diff --git a/src/ol/deviceorientation.js b/src/ol/deviceorientation.js index 4d27e163f4..99d405a50e 100644 --- a/src/ol/deviceorientation.js +++ b/src/ol/deviceorientation.js @@ -22,10 +22,9 @@ ol.DeviceOrientationProperty = { /** * @constructor * @extends {ol.Object} + * @param {ol.DeviceOrientationOptions=} opt_options Options. */ -ol.DeviceOrientation = function() { - - goog.base(this); +ol.DeviceOrientation = function(opt_options) { /** * @private @@ -33,11 +32,12 @@ ol.DeviceOrientation = function() { */ this.listenerKey_ = null; - this.setTracking(false); - goog.events.listen(this, ol.Object.getChangedEventType(ol.DeviceOrientationProperty.TRACKING), this.handleTrackingChanged_, false, this); + + goog.base(this, goog.isDef(opt_options) ? opt_options : {}); + }; goog.inherits(ol.DeviceOrientation, ol.Object); From 9b00967df056294e34d549cf308891a1e4470f2c Mon Sep 17 00:00:00 2001 From: Frederic Junod Date: Fri, 7 Jun 2013 11:51:08 +0200 Subject: [PATCH 5/7] Replace 'changed' with 'change' (see #694) --- examples/device-orientation.js | 2 +- src/ol/deviceorientation.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/examples/device-orientation.js b/examples/device-orientation.js index 9b2fb247b4..1238730663 100644 --- a/examples/device-orientation.js +++ b/examples/device-orientation.js @@ -25,7 +25,7 @@ var deviceOrientation = new ol.DeviceOrientation(); var track = new ol.dom.Input(document.getElementById('track')); track.bindTo('checked', deviceOrientation, 'tracking'); -deviceOrientation.on('changed', function() { +deviceOrientation.on('change', function() { document.getElementById('alpha').innerHTML = deviceOrientation.getAlpha(); document.getElementById('beta').innerHTML = deviceOrientation.getBeta(); document.getElementById('gamma').innerHTML = deviceOrientation.getGamma(); diff --git a/src/ol/deviceorientation.js b/src/ol/deviceorientation.js index 99d405a50e..f0c4b9528e 100644 --- a/src/ol/deviceorientation.js +++ b/src/ol/deviceorientation.js @@ -33,7 +33,7 @@ ol.DeviceOrientation = function(opt_options) { this.listenerKey_ = null; goog.events.listen(this, - ol.Object.getChangedEventType(ol.DeviceOrientationProperty.TRACKING), + ol.Object.getChangeEventType(ol.DeviceOrientationProperty.TRACKING), this.handleTrackingChanged_, false, this); goog.base(this, goog.isDef(opt_options) ? opt_options : {}); From ea8c970d6eadd04d947aee9e6a4f75f509c0c414 Mon Sep 17 00:00:00 2001 From: Frederic Junod Date: Fri, 7 Jun 2013 16:15:59 +0200 Subject: [PATCH 6/7] Better device orientation example --- examples/device-orientation.js | 33 +++++++++++++++++++++++---------- 1 file changed, 23 insertions(+), 10 deletions(-) diff --git a/examples/device-orientation.js b/examples/device-orientation.js index 1238730663..8e5b5b7f49 100644 --- a/examples/device-orientation.js +++ b/examples/device-orientation.js @@ -6,10 +6,6 @@ goog.require('ol.dom.Input'); goog.require('ol.layer.TileLayer'); goog.require('ol.source.OSM'); -var view = new ol.View2D({ - center: [0, 0], - zoom: 2 -}); var map = new ol.Map({ layers: [ new ol.layer.TileLayer({ @@ -18,16 +14,33 @@ var map = new ol.Map({ ], renderers: ol.RendererHints.createFromQueryData(), target: 'map', - view: view + view: new ol.View2D({ + center: [0, 0], + zoom: 2 + }) }); +var view = map.getView(); var deviceOrientation = new ol.DeviceOrientation(); var track = new ol.dom.Input(document.getElementById('track')); track.bindTo('checked', deviceOrientation, 'tracking'); -deviceOrientation.on('change', function() { - document.getElementById('alpha').innerHTML = deviceOrientation.getAlpha(); - document.getElementById('beta').innerHTML = deviceOrientation.getBeta(); - document.getElementById('gamma').innerHTML = deviceOrientation.getGamma(); - document.getElementById('heading').innerHTML = deviceOrientation.getHeading(); +deviceOrientation.on('change', function(event) { + document.getElementById('alpha').innerHTML = event.target.getAlpha(); + document.getElementById('beta').innerHTML = event.target.getBeta(); + document.getElementById('gamma').innerHTML = event.target.getGamma(); + document.getElementById('heading').innerHTML = event.target.getHeading(); +}); + +// tilt the map +deviceOrientation.on(['change:beta', 'change:gamma'], function(event) { + var center = view.getCenter(); + var resolution = view.getResolution(); + var beta = event.target.getBeta() || 0; + var gamma = event.target.getGamma() || 0; + + center[0] -= resolution * gamma * 25; + center[1] += resolution * beta * 25; + + view.setCenter(center); }); From 4d4a654a8e97e8cffb4c0945a466b2d74a9b43c2 Mon Sep 17 00:00:00 2001 From: Frederic Junod Date: Sat, 8 Jun 2013 09:53:06 +0200 Subject: [PATCH 7/7] Export ol.DeviceOrientation.SUPPORTED --- src/ol/deviceorientation.exports | 1 + src/ol/deviceorientation.js | 1 + 2 files changed, 2 insertions(+) diff --git a/src/ol/deviceorientation.exports b/src/ol/deviceorientation.exports index 6988135399..05be8f4887 100644 --- a/src/ol/deviceorientation.exports +++ b/src/ol/deviceorientation.exports @@ -1 +1,2 @@ @exportClass ol.DeviceOrientation ol.DeviceOrientationOptions +@exportSymbol ol.DeviceOrientation.SUPPORTED diff --git a/src/ol/deviceorientation.js b/src/ol/deviceorientation.js index f0c4b9528e..cd1126d76d 100644 --- a/src/ol/deviceorientation.js +++ b/src/ol/deviceorientation.js @@ -1,4 +1,5 @@ goog.provide('ol.DeviceOrientation'); +goog.provide('ol.DeviceOrientation.SUPPORTED'); goog.provide('ol.DeviceOrientationProperty'); goog.require('goog.events');