# iOS15: How to use rotationX, accelerationX

**URL:** <https://discourse.processing.org/t/ios15-how-to-use-rotationx-accelerationx/36278>\
**Category:** Beginners\
**Created:** [April 11, 2022, 10:54am UTC](https://discourse.processing.org/t/ios15-how-to-use-rotationx-accelerationx/36278 "2022-04-11T10:54:34Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ingo](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/ingo/32/2363_2.png) [@Ingo](https://discourse.processing.org/u/Ingo)\
**Post date:** [April 11, 2022, 10:54am UTC](https://discourse.processing.org/t/ios15-how-to-use-rotationx-accelerationx/36278/1 "2022-04-11T10:54:34Z")

</div>

Hi,

I’d like to write some webapps with my students, but the old code doesn’t work anymore, because of security reasons, I think. So found this video: [https://www.youtube.com/watch?v=AbB9ayaffTc](https://www.youtube.com/watch?v=AbB9ayaffTc) and tried it, but it doesn’t work because of the following error near line 13 (" DeviceOrientationEvent.requestPermission().catch(() =\> { ") with “SyntaxError: invalid arrow-function arguments (parentheses around the arrow-function may help)”

This my code and a link to it [https://editor.p5js.org/ingo.bartling/sketches/lrU8VeAmC](https://editor.p5js.org/ingo.bartling/sketches/lrU8VeAmC)

Any help and tipps would be great.

Thanks in advance,  
Ingo

```auto
let permissionGranted = false;
let cx, cy;

function setup() {
  createCanvas(windowWidth, windowHeight);
  
  cx = width/2;
  cy = height/2;
  
  if (typeOf(DeviceOrientationEvent) !== 'undfined' && typeOf(DeviceOrientationEvent.requestPermission) === 'function') {
  	//iOS13+
  	DeviceOrientationEvent.requestPermission().catch(() => {
  		//permission dialog
  		let button = createButton("Click to allow sensors");
  		button.style("font-size","24px");
  		button.center();
  		button.mousePressed(requestAccess);
  		throw error;
  	  })
  	  .then() => {
  		permissionGranted = true;
  	  }
  } else {
  	textSize(48);
  	text("no IOS13+ device");
  }
}

function requestAccess() {
	DeviceOrientationEvent.requestPermission()
		.then(response => {
			if (response == 'granted') {
				permissionGranted = true;	
			} else {
				permissionGranted = false;	
			}
		})
		.catch(console.error);
	this.remove();
}

function draw() {
	if (!permissionGranted) return;

	background(255);
	const dx = constrain(rotationX,-3,3);
	const dy = constrain(rotationY,-3,3);
	
	cx += dx;
	cy += dy;
	
	ellipse (cx,cy,200,200);
}

```

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [April 11, 2022, 1:07pm UTC](https://discourse.processing.org/t/ios15-how-to-use-rotationx-accelerationx/36278/2 "2022-04-11T13:07:05Z")

</div>

> [@Ingo](#):
>
> ```auto
> .then() => {
> permissionGranted = true;
> }
> 
> ```

You’re invoking method Promise::**then()** empty, w/o passing any callback parameters to it:

> **[Promise.prototype.then() - JavaScript | MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/then)**
>
> The then() method of Promise instances takes up to two arguments: callback functions for the fulfilled and rejected cases of the Promise. It immediately returns an equivalent Promise object, allowing you to chain calls to other promise methods.

Instead your fat-arrow function gotta be inside Promise::**then()**'s parentheses:

```auto
      .then(() => permissionGranted = true)

```

> [@Ingo](#):
>
> ` if (typeOf(DeviceOrientationEvent) !== 'undfined' && typeOf(DeviceOrientationEvent.requestPermission) === 'function') {`

There’s no builtin function called **typeOf()** in JS. Instead JS has a unary operator called `typeof`:

> **[typeof - JavaScript | MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)**
>
> The typeof operator returns a string indicating the type of the operand's value.

Also ‘undfined’ isn’t 1 of the 8 possible strings. Rather it’s ‘undefined’:  
`typeof DeviceOrientationEvent != 'undefined'`

```auto
if (typeof DeviceOrientationEvent != 'undefined' && DeviceOrientationEvent.requestPermission) {

```

> [@Ingo](#):
>
> ```auto
> .then(response => {
> if (response == 'granted') {
> permissionGranted = true;	
> } else {
> permissionGranted = false;	
> }
> })
> 
> ```

The code block above can be significantly shortened like this:

```auto
    .then(response => permissionGranted = response == 'granted')

```

---

<div class="post-metadata">

**Author:** ![Ingo](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/ingo/32/2363_2.png) [@Ingo](https://discourse.processing.org/u/Ingo)\
**Post date:** [April 11, 2022, 2:34pm UTC](https://discourse.processing.org/t/ios15-how-to-use-rotationx-accelerationx/36278/3 "2022-04-11T14:34:29Z")

</div>

Thank you! Looks great. I’ll give it a try.