How to detect if WebGL is on Facebook Canvas - unity3d

Im currently facing an issue where I am using the Facebook plugin v.7.1.0 for Unity. Im distributing through WebGL, but my app needs to be running both on Facebook, but also outside Facebook. When using FB.Init I get a successful callback, which is what I used to use for testing whether on Facebook canvas or not when deploying for WebPlayer.
So my question is, how do I detect whether the WebGL player is on the facebook canvas or not?

This solution is just posted for anyone who would like the same solution as I used.
The solution was to use a jslib plugin as described here http://docs.unity3d.com/Manual/webgl-interactingwithbrowserscripting.html
var FacebookCanvasChecker = {
GetSite: function()
{
var url = document.URL;
var returnStr = "";
if (url.indexOf("apps.facebook.com") > -1)
returnStr = "facebook";
else
{
// try with referer
if(document.referrer)
{
url = document.referrer;
if (url.indexOf("apps.facebook.com") > -1)
returnStr = "facebook";
else
returnStr = url;
}
else
returnStr = url;
}
var buffer = _malloc(returnStr.length + 1);
writeStringToMemory(returnStr, buffer);
return buffer;
}
};
mergeInto(LibraryManager.library, FacebookCanvasChecker);

In Unity's WebGL, you can communicate with javascript. link
So, I call a javascript function to check current url by
C#
Application.ExternalCall("GetCurrentUrlType");
JS
function GetCurrentUrlType(){
var url = document.URL;
if (url.indexOf("apps.facebook.com") > -1)
SendMessage("GameObject", "CheckURL", "facebook");
}
Hope this help!!!

Related

Detecting requests from PWA in standalone mode

I'm attempting to implement PWA server-side detection by altering all links on a page to add a query parameter if in standalone mode. Like this:
if (window.matchMedia('(display-mode: standalone)').matches) {
// #todo: this code breaks ios app.
$('a').each(function() {
var href = $(this).attr('href');
href += (href.match(/\?/) ? '&' : '?') + 'mode=pwa';
$(this).attr('href', href);
});
}
This seems to work fine on Android devices, but for some reason, breaks JS on iOS devices. Does anyone know why this code doesn't work on iOS? Or is there a better way?
Thanks, Joe
To do this with cookies:
// JS side.
if (window.matchMedia('(display-mode: standalone)').matches) {
document.cookie = 'deviceMode=pwa';
}
else {
document.cookie = 'deviceMode=mobile';
}
// PHP Side.
if ($_COOKIE['deviceMode'] == 'pwa') {
// Do something.
}
elseif ($_COOKIE['deviceMode'] == 'mobile') {
// Do something else.
}
else {
// And something else.
}

Integrate Facebook Sign In in Intel XDK

hope that some body answer.. thanks in advance
I trying to integrate Facebook Sign In in Intel XDK but I only gets a blank screen and a button Cancel on top... any help here is my code
function facebook_login(){
document.addEventListener("intel.xdk.facebook.login",function(e){
if (e.success == true)
{
var facebookUserID = "me"; //me = the user currently logged into Facebook
document.addEventListener("intel.xdk.facebook.request.response",function(e) {
console.log("Facebook User Friends Data Returned");
if (e.success == true) {
var data = e.data.data;
var outHTML = "";
for (var r=0; r< data.length; r++) {
outHTML += "<img src='http://graph.facebook.com/"
+ data[r]["id"]
+ "/picture' info='"
+ data[r]["name"] + "' />";
}
alert(outHTML);
document.removeEventListener("intel.xdk.facebook.request.response");
}
},false);
}
else
{
console.log("Unsuccessful Login");
}
}, false);
intel.xdk.facebook.login("publish_stream, publish_actions, offline_access");
}
I'm not 100% sure but if you look at the end of this page : https://software.intel.com/en-us/html5/articles/integrating-facebook-functionality-into-hybrid-apps-using-the-intel-xdk
You'll see that you need to register your app through facebook and then build it.
Bye.
The intel.xdk.facebook library only works in the Legacy Builds that can be generated from the XDK IDE. It will not work in the XDK emulator, AppPreview, or Cordova Builds. Below is the forum link where IntelJohn points this out. I have confirmed this with independent testing.
https://forums.html5dev-software.intel.com/viewtopic.php?f=34&t=6444&sid=5b50fedfdfcb924a3f69579af01285c1
If your application will rely on any Cordova plugins (meaning you'll have to use the Cordova build) it would be better for you to drop use of the intel.xdk.facebook library and install the Cordova Facebook Plugin (https://github.com/Wizcorp/phonegap-facebook-plugin).

How can I redirect viewers who are blocked from social networking to an alternative page

I've looked at this Check if Facebook is blocked then redirect to try and help me solve this problem.
I have a web page that has an iframe in that contains my tumblr page. What I want is if someone is at work and social networking is blocked it won't try and load the tumblr in the src of the iframe but load my own page tumblr.htm instead.
so I got this far and realise I don't know what I'm doing really.
function isSiteOnline(url,callback) {
// try to load favicon
var timer = setTimeout(function(){
// timeout after 5 seconds
callback(false);
},5000)
var img = document.createElement("img");
img.onload = function() {
clearTimeout(timer);
callback(true);
}
img.onerror = function() {
clearTimeout(timer);
callback(false);
}
img.src = url+"/favicon.ico";
}
isSiteOnline("http://www.tumblr.com",function(found){
if(found) {
// site is online
window.location.href = 'http://my_page.tumblr.com/';
}
else {
// site is offline (or favicon not found, or server is too slow)
window.location.href = 'tumblr.htm';
}
}
Would this work and what would I put in the src of the iframe tag? would it be src="isSiteOnline" ? and that's where the problem is there are several others on one page (twitter etc.) so I'm fighting a losing battle through lack of experience. Can anyone help?

How can i redirect all http to https facebook pages?

I want to force all parent windows of my application from this url:
http://apps.facebook.com/app_name/
to this:
https://apps.facebook.com/app_name/
(http to https)
How can i do this?
Thanks!
You can use something like this (be warned that this will leave your application without signed_request):
if (document.location.protocol=='http:'){
document.location.protocol = 'https:';
}
If you do want the parent frame (Facebook itself) to be switched to HTTPS as well than you'll need to know the URL of your page within application:
if (document.location.protocol=='http:'){
window.top.location = 'https://YOUR_APPLICATION_PAGE_URL'
}
You probably know the URL pattern for your application and do know the Canvas URL of it, so something like this may fit:
if (document.location.protocol=='http:'){
var applicationUrl = 'https://facebook.com/example-application';
var canvasURL = 'http://example.com/facebook-canvas';
var currentAppPageUrl = (document.location+'').replace(canvasURL, applicationUrl);
window.top.location = currentAppPageUrl;
}
Canvas app is at your domain and top is at Facebook domain, so calling window.top.location inside Facebook Canvas app causes cross domain URL access from iframe.
All you need is to catch the exception via try catch block.
if (document.location.protocol=='http:'){
var applicationUrl = 'https://facebook.com/example-application';
var canvasURL = location.protocol+'//'+location.host+location.pathname;
var currentAppPageUrl = (document.location+'').replace(canvasURL, applicationUrl);
try {
window.top.location = currentAppPageUrl;
} catch (e) {
}
}

Uploading files with PhoneGap + iPhone

I understand that PhoneGap applications are largely (if not entirely) HTML5 + CSS + JavaScript. Natively, the iPhone doesn't provide controls to upload files.
Does PhoneGap provide any mechanisms that allow users to upload files? (images / video, in the case of the iPhone)
I know Titanium allows users to do this, but it's a different animal with its compiled Javascript and proprietary APIs. Thanks for your advice/input.
I believe you might be able to read the files using the PhoneGap API and the upload them using and AJAX post if the server application supported it.
The other option is to write a custom module/Plugin in PhoneGap that could specific to your needs.
Here are some Example Plugins
You can do an xmlhttprequest to the file on a local drive.
I'm not 100% sure if it will work on the iPhone, but webkit should support it.
function getImageBinaries(url) { //synchronous binary downloader for firefox2
var req = new XMLHttpRequest();
req.open("GET", url, false);
req.overrideMimeType('text/plain; charset=x-user-defined');
req.send("");
if (req.status != 200) {
return "";
}
var t = req.responseText || "" ;
var ff = [];
var mx = t.length;
var scc= String.fromCharCode;
for (var z = 0; z < mx; z++) {
ff[z] = scc(t.charCodeAt(z) & 255);
}
var b = ff.join("");
return b;
}
Succes,
Erik