Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
interaction-device.js
//////////////////////////////////////////////////////////////////////
// mouseX, mouseY
function setup() {
createCanvas(windowWidth, windowHeight);
}
function draw() {
background(200, 20, 20, 10);
ellipse(mouseX, mouseY, 50, 50);
}
//////////////////////////////////////////////////////////////////////
// prevent scrolling
// add these lines below to sketch to prevent scrolling
function mousePressed(e) {
return false;
}
document.addEventListener('gesturestart', function (e) {
e.preventDefault();
});
//////////////////////////////////////////////////////////////////////
// accelerationX, accelerationY, accelerationZ
function setup() {
createCanvas(windowWidth, windowHeight);
noStroke();
}
function draw() {
background(255, 10);
fill('magenta');
ellipse(width/2, height/2, accelerationX, accelerationX);
fill('cyan');
ellipse(width/2, height/2, accelerationY, accelerationY);
fill('yellow');
ellipse(width/2, height/2, accelerationZ, accelerationZ);
}
//////////////////////////////////////////////////////////////////////
// rotationX, rotationY, rotationZ
function setup(){
createCanvas(windowWidth, windowHeight, WEBGL);
}
function draw(){
background(250);
normalMaterial();
rotateX(rotationX * 0.05);
rotateY(rotationY * 0.05);
rotateZ(rotationZ * 0.05);
box(100, 100, 100);
}
//////////////////////////////////////////////////////////////////////
// deviceMoved()
function setup(){
createCanvas(windowWidth, windowHeight);
textAlign(CENTER);
textSize(20);
//setMoveThreshold(10);
}
function deviceMoved(){
background(random(255), random(255), 255);
text('I WAS MOVED!', width/2, height/2);
}
//////////////////////////////////////////////////////////////////////
// deviceShaken()
var shakes = 0;
function setup(){
createCanvas(windowWidth, windowHeight);
//setShakeThreshold(10);
}
function deviceShaken(){
background(shakes);
shakes = shakes + 1;
}
//////////////////////////////////////////////////////////////////////
// deviceTurned()
var flip = true;
function setup(){
createCanvas(windowWidth, windowHeight);
textAlign(CENTER);
textSize(20);
}
function deviceTurned(){
flip = !flip;
if (flip == true) {
background(0);
} else {
background(255);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment