xxxxxxxxxx
// disclaimer: not my code, just using it to test code here [https://stackoverflow.com/questions/72435216/mobile-device-gyroscope-to-rotate-interior-of-3d-cube-in-p5js]
// deviceorientation event may be broken? [iphone 7 running ios 15]
var cam, fov = 0.5, rotX = 0, rotY = 0, rotZ = 0;
var dim = Math.floor(Math.min(window.innerWidth, window.innerHeight));
function setup() {
canvas = createCanvas(dim, dim, WEBGL);
canvas.id('p5canvas');
cam = createCamera();
}
function draw() {
perspective(PI * fov, 1, 0.01, 10 * dim);
cam.setPosition(0,0,0);
// set camera rotation
rotateX(rotX);
rotateY(rotY);
clear();
fill(255);
stroke(0);
strokeWeight(5);
box(100);
}
window.addEventListener('deviceorientation', function(e)
{
if (e.alpha) {
gyro = true;
rotY = -radians(parseFloat(e.alpha + e.gamma).toFixed(1));
rotX = map(parseFloat(e.beta).toFixed(2), 0, 180, -PI/2, PI/2);
}
});