I am using this code for getting player photo but response always standard photo url like this: https://platform-lookaside.fbsbx.com/platform/instantgames/profile_pic.jpg?igpid=2740003129452224&height=256&width=256&ext=1585811827&hash=AeSTzH9PG8LqK8se
What is the problem with this coding?
window.onload = function() {
FBInstant.initializeAsync().then(function() {
FBInstant.startGameAsync().then(function() {
FBInstant.player.getSignedPlayerInfoAsync().then(function (result) {
console.log(FBInstant.player.getPhoto());
});
});
});
}
Related
I am trying to build a progressive web app that utilizes the device camera to take pictures but want it to save to their Photos gallery without being prompted to download like the native camera app does..Is this even possible..I haven't discovered a way yet and not much info on google about it would it be different if it was uploaded to the cloud?
Thanks
The link at https://whatwebcando.today/photos.html suggests that this may be possible.
capturer = ImageCapture(streamVideoTrack)
Creates an image capturer out of the Media Stream Video Track.
capturer.takePhoto()
Returns a Promise resolved with the photo taken with the current settings.
capturer.setOptions(photoSettings)
Configures the photoSettings for subsequent captures; if visible, the effects of the configuration can be seen in the Track used as input.
This is the example code:
function getUserMedia(options, successCallback, failureCallback) {
var api = navigator.getUserMedia || navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia || navigator.msGetUserMedia;
if (api) {
return api.bind(navigator)(options, successCallback, failureCallback);
}
}
var theStream;
function getStream() {
if (!navigator.getUserMedia && !navigator.webkitGetUserMedia &&
!navigator.mozGetUserMedia && !navigator.msGetUserMedia) {
alert('User Media API not supported.');
return;
}
var constraints = {
video: true
};
getUserMedia(constraints, function (stream) {
var mediaControl = document.querySelector('video');
if ('srcObject' in mediaControl) {
mediaControl.srcObject = stream;
mediaControl.src = (window.URL || window.webkitURL).createObjectURL(stream);
} else if (navigator.mozGetUserMedia) {
mediaControl.mozSrcObject = stream;
}
theStream = stream;
}, function (err) {
alert('Error: ' + err);
});
}
function takePhoto() {
if (!('ImageCapture' in window)) {
alert('ImageCapture is not available');
return;
}
if (!theStream) {
alert('Grab the video stream first!');
return;
}
var theImageCapturer = new ImageCapture(theStream.getVideoTracks()[0]);
theImageCapturer.takePhoto()
.then(blob => {
var theImageTag = document.getElementById("imageTag");
theImageTag.src = URL.createObjectURL(blob);
})
.catch(err => alert('Error: ' + err));
}
So it seems like you can take a photo... I can't see anywhere to indicate that you can then persist this photo in the users storage though. I'd love to be wrong.
I have tried numerous ways of adding a cast button to video.js player but cannot do this for the life of me. Can anyone help?
I'm using the hellovideo cms for videos and need plugins added but have no idea about jquery etc.. so please if anyone can help?
There is a really nice plugin for this: https://github.com/kim-company/videojs-chromecast
Just follow the setup instructions (adding the js and css to your page).
I tried kim-company/videojs-chromecast. It only works with an older version of videojs, I used 5.4.6. It's quite buggy. Another I tried was benjipott/video.js-chromecast, which claims to work with newer videojs, but I didn't like it at all. So I gave up on videojs, I always found the native HTML5 video player more reliable and easier to work with (videojs just wraps this anyway). For the chromecast stuff, I provide a nearby button that links to chromecast.link, where I wrote a full web chromecast sender app. Pass the video and poster URL in the fragment, per this example:
https://chromecast.link/#content=http://host/some.mp4,poster=http://host/poster.jpg,subtitles=http://host/webvtt.srt
I recently answered this question, you can check it out here: How to implement chromecast support for html5 player for more information
var session = null;
$( document ).ready(function(){
var loadCastInterval = setInterval(function(){
if (chrome.cast.isAvailable) {
console.log('Cast has loaded.');
clearInterval(loadCastInterval);
initializeCastApi();
} else {
console.log('Unavailable');
}
}, 1000);
});
function initializeCastApi() {
var applicationID = chrome.cast.media.DEFAULT_MEDIA_RECEIVER_APP_ID;
var sessionRequest = new chrome.cast.SessionRequest(applicationID);
var apiConfig = new chrome.cast.ApiConfig(sessionRequest,
sessionListener,
receiverListener);
chrome.cast.initialize(apiConfig, onInitSuccess, onInitError);
};
function sessionListener(e) {
session = e;
console.log('New session');
if (session.media.length != 0) {
console.log('Found ' + session.media.length + ' sessions.');
}
}
function receiverListener(e) {
if( e === 'available' ) {
console.log("Chromecast was found on the network.");
}
else {
console.log("There are no Chromecasts available.");
}
}
function onInitSuccess() {
console.log("Initialization succeeded");
}
function onInitError() {
console.log("Initialization failed");
}
$('#castme').click(function(){
launchApp();
});
function launchApp() {
console.log("Launching the Chromecast App...");
chrome.cast.requestSession(onRequestSessionSuccess, onLaunchError);
}
function onRequestSessionSuccess(e) {
console.log("Successfully created session: " + e.sessionId);
session = e;
}
function onLaunchError() {
console.log("Error connecting to the Chromecast.");
}
function onRequestSessionSuccess(e) {
console.log("Successfully created session: " + e.sessionId);
session = e;
loadMedia();
}
function loadMedia() {
if (!session) {
console.log("No session.");
return;
}
var videoSrc = document.getElementById("myVideo").src;
var mediaInfo = new chrome.cast.media.MediaInfo(videoSrc);
mediaInfo.contentType = 'video/mp4';
var request = new chrome.cast.media.LoadRequest(mediaInfo);
request.autoplay = true;
session.loadMedia(request, onLoadSuccess, onLoadError);
}
function onLoadSuccess() {
console.log('Successfully loaded video.');
}
function onLoadError() {
console.log('Failed to load video.');
}
$('#stop').click(function(){
stopApp();
});
function stopApp() {
session.stop(onStopAppSuccess, onStopAppError);
}
function onStopAppSuccess() {
console.log('Successfully stopped app.');
}
function onStopAppError() {
console.log('Error stopping app.');
}
I want to integrate the facebook login button into my website. A user can log in using his/her facebook account only. I'm not interested in any other information about the user.
But I'm a little confused... I read the official facebook documentation, and I did not understand what i need. I'm undecided if I need to use the Graph API or the Login-Button of the Social Plugin
Can you please help me solve my doubts?
Many thanks!
To use this in flash, you have to use the javascript sdk through some ExternalInterface calls. This is how I always do it.
AS3
public function FBconnect():void {
ExternalInterface.addCallback("onLogin", onLogin);
ExternalInterface.addCallback("onError", onError);
ExternalInterface.call("requestLogin");
}
private function onError():void {
dispatchEvent(new DataEvent(DataEvent.ERROR));
}
public function logout():void {
ExternalInterface.call("FB.logout", null);
}
private function onLogin():void {
debugTools.trace("FB LOGIN");
connectUser();
}
private function connectUser():void {
ExternalInterface.addCallback("loadUser", userCallback);
ExternalInterface.call("connectUser");
}
private function userCallback(data:Array):void {
debugTools.trace("FB USER LOADED");
var userData:Object = data[0];
_FBuser = new FBUser(userData.id);
_FBuser.firstName = userData.first_name;
_FBuser.lastName = userData.last_name;
_FBuser.email = userData.email;
dispatchEvent(new DataEvent(DataEvent.SUCCESS));
}
JS
window.fbAsyncInit = function() {
FB.init({
appId: YOUR_APP_ID,
status: false,
cookie: true,
xfbml: false
});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
function connectUser() {
FB.api('/me', function(response) {
if(response) {
var usrs = new Array();
usrs.push(response);
document.getElementById('flashObj').loadUser(usrs);
} else {
document.getElementById('flashObj').onError();
}
});
};
function requestLogin() {
FB.login(function(response) {
if (response.authResponse) {
document.getElementById('flashObj').onLogin();
} else {
document.getElementById('flashObj').onError();
}
}, {scope:'email'});
}
So to break it down.
We load in the javascript sdk in our webpage, check the docs on facebook on how to do itn if you don't know.
Next, through the ExternalInterface, we call FB.login in the JS and on response we call an AS3 function through document.getElementById (to access your swf).
Then we do the same thing to use the Graph API to get the info on our user.
In my experience, this is the best workflow to facebook connect your user to your flash Application.
I'm getting familiar with Titanium mobile, and now I'm developing iOS app with it.
I want to create custom login button.
I followed some instructions on the web, but still its not working.
The code is below.
var win = Ti.UI.currentWindow;
Titanium.Facebook.appid = "APP ID";
Titanium.Facebook.permissions = ['permissions here'];
var login = Ti.UI.createButton({
backgroundImage:'facebooklogin.png',
width:250,
height40:
});
win.add(login);
login.addEventListener('click', function(e) {
Titanium.Facebook.authorize();
});
Titanium.Facebook.addEventListener('login', function(e) {
if (e.success) {
Titanium.Facebook.requestWithGraphPath('me', {}, 'GET', function(e) {
if (e.success) {
var data= JSON.parse(e.result);
Ti.API.info("Name:"+data.name);
Ti.API.info("email:"+data.email);
Ti.API.info("facebook Id:"+data.id);
} else if (e.error) {
alert(e.error);
} else {
alert('Unknown response.');
}
});
}else{
if(e.error){
alert(e.error);
}else{
alert("Unkown error while trying to login to facebook.");
}
}
});
}
Dose anybody show me solutions?
thanks.
If you are already Authorized the Ti.Facebook.authorize method wont do anything. Try clearing your app data from the device, and start over.
I am having a rough time with getting the facebook javascript SDK workflow to work. The requirement was to offer a "login" link, not a facebook icon. To do this, I improvised a bit. So far it works really well but the session is not persisting from page to page. I am figuring that the session gets set after the login method but it doesn't look like that. Here is login / logout which works fine:
function login() {
FB.login(function(response) {
if (response.session) {
FB.api('/me', function(response) {
document.getElementById('socialauth').innerHTML = "<span>Welcome, " + response.name + " </span>"
+ "(logout)";
});
} else {
}
}, { perms: 'email,publish_stream' });
return false;
}
function logout() {
FB.logout(function(response) {
document.getElementById('socialauth').innerHTML = "login";
});
}
And here is what I am testing with which doesn't fire:
$(document).ready(function() {
FB.getLoginStatus(function(response) {
if (response.status == "connected") {
// logged in and connected user, someone you know
alert("ok - 5 seconds has passed");
} else {
// no user session available, someone you dont know
alert("not ok");
}
});
});
I am also trying "javascript:document.cooike" in my URL box and see not evidence of the FB session.
Kindly advise?
You need to make sure your loading the Facebook SDK on each page as well. For a simple solution that uses jQuery check out https://github.com/xocialhost/jquery.xocialCore.js
The first two functions in the plugin deal with initializing FB and authentication.
Using the provided function you'd do something like this:
$(document).ready(function() {
$.xcInitFacebook = function({appId:'yourappid',callback:function() {
FB.getLoginStatus(function(response) {
if (response.status === 'connected') { alert('logged in'); }
else { alert('not logged in'); }
} });
});