43 lines
1.1 KiB
JavaScript
43 lines
1.1 KiB
JavaScript
"use strict";
|
|
|
|
(() => {
|
|
const ctx = canvas.getContext("2d");
|
|
const scale = Math.min(canvas.width, canvas.height) / 2;
|
|
ctx.setTransform(
|
|
scale, 0,
|
|
0, -scale,
|
|
canvas.width / 2, canvas.height / 2
|
|
);
|
|
|
|
ctx.fillStyle = util.rgb(1, 0, 0);
|
|
ctx.fillRect(-0.5, -0.5, 1, 1);
|
|
|
|
perm.addEventListener("click", e => {
|
|
util.getGyroPermission()
|
|
.then((response) => {
|
|
window.addEventListener("deviceorientation", e => {
|
|
const alpha = util.deg2rad(e.alpha);
|
|
const beta = util.deg2rad(e.beta);
|
|
const gamma = util.deg2rad(e.gamma);
|
|
|
|
const [screenNormal, phi, theta] = util.toPolarCoordinates(alpha, beta, gamma);
|
|
const theta_ = Math.abs(theta - Math.PI / 2) / Math.PI * 2;
|
|
const phi_ = phi - Math.PI / 2;
|
|
|
|
ctx.clearRect(-1, -1, 2, 2);
|
|
|
|
const g = theta_;
|
|
ctx.fillStyle = util.rgb(255, g, g);
|
|
ctx.fillRect(-1, -1, 2, 2);
|
|
|
|
ctx.strokeStyle = "black";
|
|
ctx.lineWidth = 0.01;
|
|
ctx.beginPath();
|
|
ctx.moveTo(0, 0);
|
|
ctx.lineTo(Math.cos(phi_), Math.sin(phi_));
|
|
ctx.stroke();
|
|
});
|
|
});
|
|
}, { once: true });
|
|
})();
|