Updating to Modern iOS Support

[antgiant]

Apple devices now require a new permission request to access compass (orientation) data. This adds the required permission request. I also went ahead and fixed the orientation and offset issues on Apple. So this pull request also Closes #7 Closes #8 Closes #9 Closes #11 Closes #12

[suysh]

On Android there is still an offset by 180deg like on your latest readme example page https://compass.wooleys.us/ Device orientation (landscape/portrait) has been taken into account correctly.

My friend with an Iphone 11pro reported the compass website also as not working. Any ideas why?

Regards, Hans

[antgiant]

Hmm, Is the iPhone 180° offset as well or is it just not working at all? If it is the second have your friend touch the screen. That triggers the second permission prompt that Apple requires to access compass data.

As for your Android I would like to fix that but I cannot replicate it currently. Any chance you are in the Southern (or Eastern) Hemisphere? Maybe this code has an assumption of being in the Northern Hemisphere somewhere? Or Perhaps the Western Hemisphere?

[suysh]

I don't have an Iphone to test, but the wooleys.us was reported completely not working. OK, I will ask again to test and tap the screen for second permission.

For the android, I'm in Belgium (51°N 4°E), could this explain the offset?

[suysh]

Update from the Iphone-side : all is working fine after tapping the screen : Great job !

[antgiant]

Glad to hear that the iPhone is working right!

Now to figure out the Android issue. I didn't modify the Android code, so I assume your issue exists on the main repo too? I'll look around and see if I can find anything to test. Will report back here.

[suysh]

I think you need for Android: window.addEventListener("deviceorientationabsolute", handler, true); And for Iphone: window.addEventListener("deviceorientation", handler, true);

So, in total (can be you need to add 90deg)

var userAgent = navigator.userAgent.toLowerCase();
var isAndroid = userAgent.indexOf("android")>-1;
if (isAndroid==false) { window.addEventListener("deviceorientation", handler, true); }
else { window.addEventListener("deviceorientationabsolute", handler, true); }

function handler(e) {
      heading = e.webkitCompassHeading || Math.abs(e.alpha - 360);
      plot_compas(heading);
}

[antgiant]

Ok I updated https://compass.wooleys.us/ to include your suggested changes. Does it work correctly for you now?

(See https://github.com/antgiant/compass/commit/3b8c0b1dce101fc643d5d88cd5f1574744397d64 and https://github.com/antgiant/compass/commit/055b249fd10787b55673855abcfbffaa6d5929e0 for code changes.)

[suysh]

That's working on my side. Also the orientation from portrait and landscape is fine. Great Job ! I hope this is now working on all types of phones and browsers.

[antgiant]

Thanks for catching the issue. I have added the fix to this pull request. I can confirm that these changes did not break iPhone support. So, hopefully this now works even better for all devices. :-)

[suysh]

I was checking the compatibility on other browsers and found that the location is not working on Firefox for Android. In the original https://compass.wooleys.us/ it’s working fine. Any idea why?

[antgiant]

Just to be clear https://lamplightdev.github.io/compass is the original. https://compass.wooleys.us is my updated version. (This pull request would make them both the same.)

Which version is not working with Firefox?

[suysh]

I downloaded the latest commit and placed it on my site : https://www.dehemen.be/antgiant To compare I used https://compass.wooleys.us

On Google Chrome for Android both sites are working, orientation = OK, location = OK

I testen on my phone : Firefox For Android 99.2.0 (2022-04-12T04:32:43.163454) dehemen : compass = 90deg off, location = N/A wooleys : compass = 90deg off, location = OK

Firefox For Windows 99.0.1 : The location is working, compass don't know (no compass on my laptop)

[antgiant]

Sorry I do not know. The two immediate possibilities I can think of are

1. Some of the APIs require https but you have a very so it shouldn't be that.
2. A browser permission not being given.

Hmm I just tested Firefox on a iPhone and there neither your site nor mine shows the location but both show compass data. Maybe Firefox uses a different location API?

I have not touched the location code at all. Guess I'll need to dig in there later.

[suysh]

Hey,

I was checking the compatibility on other browsers and found that the location is not working on Firefox for Android. In the original https://compass.wooleys.us/ it’s working fine. Any idea why?

Kind Regards, Hans

From: antgiant @.> Sent: vrijdag 29 april 2022 14:24 To: lamplightdev/compass @.> Cc: Hans @.>; Comment @.> Subject: Re: [lamplightdev/compass] Updating to Modern iOS Support (PR #13)

Thanks for catching the issue. I have added the fix to this pull request. I can confirm that these changes did not break iPhone support. So, hopefully this now works even better for all devices. :-)

— Reply to this email directly, view it on GitHubhttps://github.com/lamplightdev/compass/pull/13#issuecomment-1113251292, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AKIDAZBCNXLRECJEQPEPXZTVHPIFJANCNFSM5KYJMCJA. You are receiving this because you commented.Message ID: @.@.>>