Enabling device motion manually Aframe 1.0.4 - aframe

I added device-orientation-permission-ui="enabled: false" to the a-scene as I wanted to handle the all the popups and loading screens myself.
After I request access to the motion sensors via:
$("#btn_enable").one("click", checkGyro);
function checkGyro() {
DeviceMotionEvent.requestPermission().then(permissionState => {
if (permissionState === 'granted') {
window.addEventListener('devicemotion', () => {});
}
});
.catch(console.error);
}
The device (iPad iOS 13.4 in mobile viewing mode) shows me the popup requesting access to the motion and orientation sensors which I allow, however the ability to look around the scene is disabled.
What am I missing to get this working?
I get this in the console:
webvr-polyfill.js:2584 TypeError: null is not an object (evaluating
'i.alpha')
(anonymous) # webvr-polyfill.js:2584
(anonymous) # webvr-polyfill.js:2560
(anonymous) # [native code]:1

Request permission has to be triggered by user action like click or a tap. It cannot be initiated by a page without user consent as per browser security and privacy policies.

Related

Telegram WebApp sendData method doesn't work on MacOS

I am trying to figure out how to correctly work with WebApp added to Telegram API.
So, I have a simple setup of a React app and Bot. React app has counter and all I need is send counter data back to bot using sendData method.
Bot returns keyboard button, as mentioned in telegram docs with link to my web-app
private async returnButton(ctx: Context<Update>): Promise<void | object> {
ctx.reply('Enter number', Markup.keyboard([
Markup.button.webApp('Open counter', 'https://75bc-185-115-37-241.eu.ngrok.io')
]).resize())
return {};
}
Here's part of React app:
useEffect(() => {
Telegram.WebApp.ready();
Telegram.WebApp.MainButton.isVisible = true;
setDebug(Telegram.WebApp.sendData.toString());
}, [])
useEffect(() => {
Telegram.WebApp.onEvent('mainButtonClicked', () => {
Telegram.WebApp.MainButton.text = 'Clicked!';
try {
Telegram.WebApp.sendData(JSON.stringify({ counter }));
setDebug(`Sent`);
} catch (e) {
setDebug(`${e}, ${JSON.stringify(e)}`)
}
})
}, [counter])
I've added setDebug(Telegram.WebApp.sendData.toString()) just to
make sure method is present. I didn't find any good ways for debugging, as I have no
access to smth like devtools in webapp window
So below gif shows what happens when I click button on Mac client. Debug data set to Sent and no errors pops out. But modal doesn't close as it should and most importantly bot doesn't receive any data from webapp.
Though using iOS/ipadOS telegram flow works fine. Window closes and data sent to bot.
I have tried to reinstall Telegram client, but still no changes. Did I miss something or this is Mac client bug?
to get data from the main button you need to open the app with your keyboard. This will not work with an inline keyboard.

TypeError: Cannot create property 'href' on string 'about:blank'

Ran into an error after testing the Firebase authentication with Google on ElectronJS.
Authentication used to work before, even though I haven't made any significant changes in my code that would affect the Google authentication part.
Authentication still works correctly when I am running my project in the browser (npm run serve). In Electron I can see the
TypeError: Cannot create property 'href' on string 'about:blank' when clicking on the Google authentication button.
TypeError: Cannot create property 'href' on string 'about:blank'
My code that is being executed on click -
googleLogin() {
fb.auth
.signInWithPopup(fb.googleProvider)
.then(credential => {
this.$store.commit("setCurrentUser", credential.user)
fb.usersCollection.doc(credential.user.uid).set({
}).then(() => {
this.$store.dispatch("fetchUserProfile")
this.updateGmailData()
this.$router.push("/dashboard")
}).catch(err => {
console.log(err)
})
}).catch(err => {
console.log(err);
});
},
On second click on the button, I can see another typeError -
TypeError: Cannot create property 'href' on string ''
Why does the authentication work on browser but not in Electron?
What is the cause of this issue?
see this issue https://github.com/firebase/firebase-js-sdk/issues/1334.
Electron is not officially supported by Firebase Auth. Since Electron is a combination of a browser and Node.js server environment, some features may not work as expected, such as signInWithPopup.
But #diggabyte (thx to him) seems to have found a way to handle it:
I was able to get it to work via signInWithRedirect + getRedirectResult
https://github.com/firebase/firebase-js-sdk/issues/1334#issuecomment-434094783

React Native: managing notification on RNFirebase

I have successfully implemented a basic notification feature using react-native-firebase library, everything is working as expected, information is properly received and ready to be used for a purpose I have yet to determine. My code currently look like this for the notification handling part:
componentDidMount() {
/**
* When app on foreground, rewrap received notification and re-send it as notification using channelId
* A workaround because channelId never set by default by FCM API so we need to rewrap to make sure it is
* shown on user's notification tray
*/
this.notificationListener = firebase.notifications().onNotification((notification) => {
//data object must have channelId props as a workaround for foreground notification on Android
console.log('Notif ', notification);
notification.android.setChannelId(notification.data.channelId);
firebase.notifications().displayNotification(notification);
});
//On Notification tapped, be it from foreground or background
this.notificationOpen = firebase.notifications().onNotificationOpened((notificationOpen) => {
//body and title lost if accessed from background, taking info from data object by default
const notification = notificationOpen.notification;
console.log('Open ', notification)
Alert.alert(notification.data.title, notification.data.body);
});
//When notification received when app is closed
this.initialNotification = firebase.notifications().getInitialNotification()
.then((notificationOpen) => {
//body and title lost if accessed this way, taking info from data object where info will persist
if (notificationOpen) {
const notification = notificationOpen.notification;
console.log('Initial ', notification)
Alert.alert(notification.data.title, notification.data.body);
}
});
}
componentWillUnmount() {
this.notificationListener();
this.initialNotification()
this.notificationOpen();
}
The above code let me use any information I sent from firebase console or a php server set up by my colleague from within the above scope (not sure how the server side implementation was done, but it gives me the exact same notification object on my end).
So that's good and all, but the problem is when I set badge on IOS from firebase console, the badge doesn't go away once I opened the notification.
I have been trying to figure out if there's any extra bit I have to add to the above block to programatically decrement the badge counter, but have no luck so far.
So if anyone here can show me how to manage these notification objects properly (especially explaining the nature and lifecycle of these objects -- i.e. which data on which property/method persists or is static within the scope of the notification object) on both Android and IOS, that would be greatly appreciated :)
Turns out a simple firebase.notifications().setBadge(0) on root componentDidMount() clears out the badge count whenever the app is opened.
May need to use firebase.notifications().removeAllDeliveredNotifications() or firebase.notifications().cancelAllNotifications() to remove them from notification tray too.
May be you have to set code for badge while creating a notification
this.notificationListener = firebase.notifications().onNotification((notification) => {
const localNotification = new firebase.notifications.Notification()
.setNotificationId(notification.notificationId)
.setTitle(notification.title)
.setSubtitle(notification.subtitle)
.setBody(notification.body)
.setData(notification.data)
.ios.setBadge(notification.ios.badge);
firebase.notifications()
.displayNotification(localNotification)
.catch(err => console.error(err));
}
Put this line in code .ios.setBadge(notification.ios.badge); while building a notification and try again

Error while taking pictures using MeteorCamera.getPicture() while testing on a laptop

I am working to add a photo ability to my app using Meteor's mdg:camera plugin. For now, I don't have any PhoneGap devices setup, so I am testing on my laptop. I thought I read somewhere that the Meteor implementation would fall-back and use a simple file dialog when a camera wasn't available, but when I try to run the following code on my laptop:
var cameraOptions = {
width: 800,
height: 600
};
MeteorCamera.getPicture(cameraOptions, function (err, data) {
if (err) {
console.log(err);
// TODO Need to handle the error
} else {
if (!this.photos) {
this.photos = [];
}
this.photos.push({ submitted_by: Meteor.userId(), submitted_on: new Date(), photo_data: data});
}
});
I get the error:
Meteor.makeErrorType.errorClass {error: "unknownError", reason: "There was an error while accessing the camera.", details: undefined, message: "There was an error while accessing the camera. [unknownError]", errorType: "Meteor.Error"…}
I would actually like for users to be able to upload photos via the same button when using a laptop. For what it's worth, I actually do have a camera built-in, and I am developing on a 15" MacBook Pro.
On browser client, the mdg:camera falls back on using navigator.getUserMedia to try to obtain a video stream from the webcam, it does not allow the user to upload a photo.
https://github.com/meteor/mobile-packages/blob/master/packages/mdg:camera/photo-browser.js#L41
Unfortunately as we are speaking getUserMedia lacks support on Safari, which is probably the browser you are using working on a MacBook.
http://caniuse.com/#feat=stream
Try your application on Google Chrome or Firefox instead.

FB.ui() giving error in Safari with asynchronous request when user is not already logged in

I'm trying to get have users be able to post to their Facebook walls on my external site.
I've encountered a problem in Safari. If the user isn't logged in, i.e. they have not gone through the flow that calls FB.login(), I get the following JS error when calling FB.ui():
TypeError: 'undefined' is not an object (evaluating 'b.fbCallID=a.id')
However, if they are logged in, the dialog appears just fine.
FB.ui() is called in a callback function -- I'm retrieving a unique url from my server, and then calling FB.ui(). If I call FB.ui() directly, it works fine, but not when it's asynchronous.
Here's the code:
retrieveUrl(param1, param2, function(result) {
FB.ui({ method: 'feed',
description: 'My Description',
display: 'dialog',
link: result.uniqueUrl,
picture: 'http://foo.com/bar.jpg'
}, function(response) {
if (response && response.post_id) {
//Posted message
} else {
//Not posted message
}
});
});
This works in other browsers, regardless of logged in state or not.
FB.login or FB.ui methods must be called on a user initiated action (click) in Safari for new window/popup/iframe to be rendered by FB.UIServer.
If you try calling these methods on a network callback event it will be blocked and the exception you described will occur:
TypeError: 'undefined' is not an object (evaluating 'b.fbCallID=a.id')
Can you retrieve the unique URL before the user interacts with the page and then present the feed dialog when they click on a button?

Resources