Jean-Yves Didier

refactoring mapper for inertial

arcs_module(function (ARCS) {
var Inertial = ARCS.Component.create( function() {
var self = this;
var screenOrientation = false;
import ARCS from '../build/arcs.js';
// here, we should correct orientation
var handleOrientation = function (event) {
if (screenOrientation) {
var orientation = screen.msOrientation
|| screen.mozOrientation || screen.orientation;
event.alpha -= (orientation)?orientation.angle:0;
}
self.emit("sendOrientation",event);
};
var handleMotion = function(event) {
self.emit("sendAcceleration",event.acceleration);
self.emit("sendAccelerationIncludingGravity", event.accelerationIncludingGravity);
self.emit("sendRotationRate",event.rotationRate);
};
let Inertial = ARCS.Component.create( function() {
var self = this;
var screenOrientation = false;
// here, we should correct orientation
var handleOrientation = function (event) {
if (screenOrientation) {
var orientation = screen.msOrientation
|| screen.mozOrientation || screen.orientation;
event.alpha -= (orientation)?orientation.angle:0;
}
self.emit("sendOrientation",event);
};
var handleMotion = function(event) {
self.emit("sendAcceleration",event.acceleration);
self.emit("sendAccelerationIncludingGravity", event.accelerationIncludingGravity);
self.emit("sendRotationRate",event.rotationRate);
};
this.start = function() {
if (window.DeviceOrientationEvent) {
console.log("Device orientation capability detected");
window.addEventListener("deviceorientation", handleOrientation, false);
} else {
console.log("[Inertial]","no device orientation API");
}
if (window.DeviceMotionEvent) {
console.log("Device motion capability detected");
window.addEventListener("devicemotion", handleMotion, true);
} else {
console.log("[Inertial]","no device motion API");
}
this.start = function() {
if (window.DeviceOrientationEvent) {
console.log("Device orientation capability detected");
window.addEventListener("deviceorientation", handleOrientation, false);
} else {
console.log("[Inertial]","no device orientation API");
}
if (window.DeviceMotionEvent) {
console.log("Device motion capability detected");
window.addEventListener("devicemotion", handleMotion, true);
} else {
console.log("[Inertial]","no device motion API");
}
};
};
this.setScreenOrientation = function(flag) {
screenOrientation = flag;
};
},
["start","setScreenOrientation"],
["sendOrientation","sendAcceleration","sendAccelerationIncludingGravity", "sendRotationRate"]
);
this.setScreenOrientation = function(flag) {
screenOrientation = flag;
};
},
["start","setScreenOrientation"],
["sendOrientation","sendAcceleration","sendAccelerationIncludingGravity", "sendRotationRate"]
);
return { Inertial : Inertial };
});
export default { Inertial : Inertial };
......
arcs_module(
function(ARCS) {
var InertialWidget;
InertialWidget = ARCS.Component.create(
function(fields) {
console.log("fields", fields);
if (fields) {
var alpha = document.getElementById(fields[0].alpha);
var beta = document.getElementById(fields[0].beta);
var gamma = document.getElementById(fields[0].gamma);
}
//var accx = document.getElementById(fields.
this.updateOrientation = function(orientation) {
if (alpha)
alpha.innerHTML = orientation.alpha;
if (beta)
beta.innerHTML = orientation.beta;
if (gamma)
gamma.innerHTML = orientation.gamma;
};
},
["updateOrientation"],
[]
);
return { InertialWidget : InertialWidget};
}
);
\ No newline at end of file
......@@ -10,7 +10,7 @@ UIMapper = ARCS.Component.create(
const mapFunction = function(param, field, format) {
let fields = field.split('.');
let params = param.split('.');
let eltField = document.getElementById(fields[0]);
let eltField = document.querySelector(fields[0]);
for(let i=1; i < fields.length-1; i++) {
eltField = eltField[fields[i]];
}
......
......@@ -5,9 +5,9 @@
"geolocator": {"type":"GeoLocator"},
"positionWidget": { "type": "UIMapper", "value": {
"updatePosition" : [
{ "param" : "0.coords.longitude", "field" : "lon.innerHTML", "format": "e=>e.toFixed(6)" },
{ "param" : "0.coords.latitude", "field" : "lat.innerHTML", "format": "e=>e.toFixed(6)" },
{ "param" : "0.coords.accuracy", "field" : "acc.innerHTML", "format": "e=>e.toFixed(2)" }
{ "param" : "0.coords.longitude", "field" : "#lon.innerHTML", "format": "e=>e.toFixed(6)" },
{ "param" : "0.coords.latitude", "field" : "#lat.innerHTML", "format": "e=>e.toFixed(6)" },
{ "param" : "0.coords.accuracy", "field" : "#acc.innerHTML", "format": "e=>e.toFixed(2)" }
]
}},
"statemachine" : {
......
{
"context" : {
"libraries" : [ "components/inertial","components/inertialwidget"],
"libraries" : [ "../components/inertial.js","../components/uimapper.js"],
"components" : {
"inertial": {"type":"Inertial"},
"inertialWidget": { "type": "InertialWidget", "value": [
{ "alpha": "alpha", "beta":"beta", "gamma":"gamma" }
] },
"inertialWidget": { "type": "UIMapper", "value": {
"updateOrientation": [
{ "param" : "0.alpha", "field": "#alpha.innerHTML"},
{ "param" : "0.beta", "field": "#beta.innerHTML"},
{ "param" : "0.gamma", "field": "#gamma.innerHTML"}
]
}
},
"statemachine" : {
"type": "StateMachine",
"value" : {
......@@ -35,4 +40,4 @@
}
}
}
\ No newline at end of file
......
<html>
<head>
<title>Orientation with ARCS</title>
<script data-main="../../build/arcs_browser"
data-base-url="../.."
data-arcsapp="arcsapp.json"
src="../../deps/requirejs/require.js">
<script type="module"
data-base-url="../.."
data-arcsapp="arcsapp.json"
src="../../build/arcs_browser.js">
</script>
<link rel="stylesheet" href="geoloc.css">
</head>
......