mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-19 03:32:21 +08:00
Device motion
This commit is contained in:
@ -1,4 +1,4 @@
|
||||
import {IonicView} from 'ionic/ionic';
|
||||
import {IonicView, DeviceMotion} from 'ionic/ionic';
|
||||
|
||||
|
||||
@IonicView({
|
||||
@ -10,9 +10,38 @@ import {IonicView} from 'ionic/ionic';
|
||||
<ion-title>Device Motion</ion-title>
|
||||
</ion-navbar>
|
||||
<ion-content class="padding">
|
||||
<button primary outline (click)="doDeviceMotion()">Get Device Motion</button>
|
||||
<div *ng-if="accel">
|
||||
x: <b>{{accel.x}}</b><br>
|
||||
y: <b>{{accel.y}}</b><br>
|
||||
z: <b>{{accel.z}}</b><br>
|
||||
</div>
|
||||
<button primary outline (click)="doDeviceMotionWatch()">Track Device Motion</button>
|
||||
<div *ng-if="accelTrack">
|
||||
x: <b>{{accelTrack.x}}</b><br>
|
||||
y: <b>{{accelTrack.y}}</b><br>
|
||||
z: <b>{{accelTrack.z}}</b><br>
|
||||
</div>
|
||||
</ion-content>
|
||||
`
|
||||
})
|
||||
export class DeviceMotionPage {
|
||||
|
||||
doDeviceMotion() {
|
||||
let device = DeviceMotion.getCurrentAcceleration().then((resp) => {
|
||||
console.log('Device motion', resp);
|
||||
this.accel = resp.accelerationIncludingGravity;
|
||||
}, (err) => {
|
||||
console.log('Device err', err);
|
||||
});
|
||||
console.log('Got device', device);
|
||||
}
|
||||
doDeviceMotionWatch() {
|
||||
let device = DeviceMotion.watchAcceleration().source.subscribe((resp) => {
|
||||
console.log('Device motion track', resp);
|
||||
this.accelTrack = resp.accelerationIncludingGravity;
|
||||
}, (err) => {
|
||||
console.log('Device err', err);
|
||||
});
|
||||
console.log('Got device', device);
|
||||
}
|
||||
}
|
||||
|
@ -1,4 +1,4 @@
|
||||
import {IonicView} from 'ionic/ionic';
|
||||
import {IonicView, Device} from 'ionic/ionic';
|
||||
|
||||
|
||||
@IonicView({
|
||||
|
@ -11,21 +11,33 @@ import {Platform} from '../../platform/platform';
|
||||
}
|
||||
})
|
||||
export class DeviceMotion {
|
||||
getCurrentAcceleration() {
|
||||
static _wrap(result) {
|
||||
// Mimic the DeviceMotionEvent
|
||||
return {
|
||||
acceleration: result,
|
||||
accelerationIncludingGravity: result,
|
||||
rotationRate: 0,
|
||||
interval: 0,
|
||||
native: true
|
||||
}
|
||||
}
|
||||
|
||||
static getCurrentAcceleration() {
|
||||
return new Promise((resolve, reject) => {
|
||||
if(navigator.accelerometer) {
|
||||
navigator.accelerometer.getCurrentAcceleration(function (result) {
|
||||
resolve(result);
|
||||
}, function (err) {
|
||||
reject(err);
|
||||
});
|
||||
} else if(window.DeviceMotionEvent || ('listenForDeviceMovement' in window)) {
|
||||
if(window.DeviceMotionEvent || ('listenForDeviceMovement' in window)) {
|
||||
var fnCb = function fnCb(eventData) {
|
||||
console.log('Event', eventData);
|
||||
resolve(eventData);
|
||||
window.removeEventListener('devicemotion', fnCb);
|
||||
}
|
||||
window.addEventListener('devicemotion', fnCb);
|
||||
} else {
|
||||
} else if(navigator.accelerometer) {
|
||||
navigator.accelerometer.getCurrentAcceleration(function (result) {
|
||||
resolve(DeviceMotion._wrap(result));
|
||||
}, function (err) {
|
||||
reject(err);
|
||||
});
|
||||
else {
|
||||
this.pluginWarn();
|
||||
reject('The Device does not support device motion events.');
|
||||
return;
|
||||
@ -33,8 +45,29 @@ export class DeviceMotion {
|
||||
});
|
||||
}
|
||||
|
||||
watchAcceleration(options) {
|
||||
if(navigator.accelerometer) {
|
||||
static watchAcceleration(options) {
|
||||
if(window.DeviceMotionEvent || ('listenForDeviceMovement' in window)) {
|
||||
let watchID;
|
||||
|
||||
let source = Rx.Observable.create((observer) => {
|
||||
|
||||
var fnCb = function fnCb(eventData) {
|
||||
console.log(eventData);
|
||||
observer.onNext(eventData);
|
||||
};
|
||||
|
||||
window.addEventListener('devicemotion', fnCb);
|
||||
|
||||
});
|
||||
|
||||
return {
|
||||
source: source,
|
||||
watchID: watchID,
|
||||
clear: () => {
|
||||
window.removeEventListener('devicemotion', cbFn);
|
||||
}
|
||||
}
|
||||
} else if(navigator.accelerometer) {
|
||||
let watchID;
|
||||
|
||||
let source = Rx.Observable.create((observer) => {
|
||||
@ -54,26 +87,6 @@ export class DeviceMotion {
|
||||
navigator.accelerometer.clearWatch(watchID);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
let watchID;
|
||||
|
||||
let source = Rx.Observable.create((observer) => {
|
||||
|
||||
var fnCb = function fnCb(eventData) {
|
||||
observer.onNext(eventData);
|
||||
};
|
||||
|
||||
window.addEventListener('devicemotion', cbFn);
|
||||
|
||||
});
|
||||
|
||||
return {
|
||||
source: source,
|
||||
watchID: watchID,
|
||||
clear: () => {
|
||||
window.removeEventListener('devicemotion', cbFn);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user