​

function setup() {

  createCanvas(windowWidth, windowHeight);

  btn = createButton("Motion");

  btn.mousePressed(function() {

    DeviceOrientationEvent.requestPermission();

  });

}

​

function draw() {

  background(255);

  fill(value,0,0);

  rect(0, 0, width, height);

}

​

/* The deviceMoved() function is called when the device is moved by more than the threshold value along X, Y or Z axis. The default threshold is set to 0.5. The threshold value can be changed using setMoveThreshold().*/

​

function deviceMoved() {

  value = value + 5;

  if (value > 255) {

    value = 0;

  }

}