mirror of
https://github.com/purplecabbage/phonegap-plugins.git
synced 2026-01-14 08:57:53 -05:00
87f3aaaa9f
ChildBrowser with Cordova only support. Intended to eliminate dual PhoneGap/Cordova naming moving forward.
183 lines
4.0 KiB
HTML
Executable File
183 lines
4.0 KiB
HTML
Executable File
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
|
<html>
|
|
<head>
|
|
<!-- Change this if you want to allow scaling -->
|
|
<meta name="viewport" content="width=default-width; user-scalable=no" />
|
|
|
|
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
|
|
|
|
<title>FBConnectBrowser</title>
|
|
|
|
<!-- iPad/iPhone specific css below, add after your main css >
|
|
<link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" />
|
|
<link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="iphone.css" type="text/css" />
|
|
-->
|
|
<script type="text/javascript" charset="utf-8" src="cordova-1.5.0.js"></script>
|
|
<script type="text/javascript" charset="utf-8" src="ChildBrowser.js"></script>
|
|
<script type="text/javascript" charset="utf-8" src="FBConnect.js"></script>
|
|
<script type="text/javascript" charset="utf-8" src="json2-min.js"></script>
|
|
<style>
|
|
|
|
* {
|
|
-webkit-touch-callout: none; /* prevent callout to copy image, etc when tap to hold */
|
|
/*-webkit-text-size-adjust: none; *//* prevent webkit from resizing text to fit */
|
|
-webkit-tap-highlight-color: rgba(0,0,0,0); /* make transparent link selection, adjust last value opacity 0 to 1.0 */
|
|
-webkit-user-select: none; /* prevent copy paste, to allow, change 'none' to 'text' */
|
|
|
|
margin:0;
|
|
padding:0;
|
|
}
|
|
|
|
body
|
|
{
|
|
background-color:#3B5998;
|
|
color:#FFF;
|
|
font-family: Helvetica, Verdana;
|
|
margin-bottom:20px;
|
|
}
|
|
|
|
#loading
|
|
{
|
|
z-index:1;
|
|
width:100%;
|
|
top:200px;
|
|
position:absolute;
|
|
text-align:center;
|
|
}
|
|
|
|
#gbWrap
|
|
{
|
|
overflow:hidden;
|
|
position:absolute;
|
|
top:60px;
|
|
bottom:0px;
|
|
}
|
|
|
|
.view
|
|
{
|
|
width:320px;
|
|
float:left;
|
|
clear:none;
|
|
|
|
}
|
|
|
|
|
|
#fbFriends li
|
|
{
|
|
list-style:none;
|
|
|
|
height:56px;
|
|
background:-webkit-gradient(
|
|
linear,
|
|
left top,
|
|
left bottom,
|
|
color-stop(0, rgba(0,0,0,0.1)),
|
|
color-stop(1, rgba(128,128,128,0.1))
|
|
)
|
|
}
|
|
|
|
#fbFriends li:active
|
|
{
|
|
background-color:rgba(255,255,255,0.5);
|
|
}
|
|
|
|
#fbFriends li img
|
|
{
|
|
margin:2px 12px;
|
|
min-height:48px;
|
|
min-width:48px;s
|
|
}
|
|
|
|
#fbFriends li span
|
|
{
|
|
position:relative;
|
|
top:-12px;
|
|
}
|
|
|
|
#details
|
|
{
|
|
position:absolute;
|
|
left:320px;
|
|
height:100%;
|
|
}
|
|
|
|
|
|
</style>
|
|
|
|
<script type="text/javascript" charset="utf-8">
|
|
|
|
|
|
// If you want to prevent dragging, uncomment this section
|
|
/*
|
|
function preventBehavior(e)
|
|
{
|
|
e.preventDefault();
|
|
};
|
|
document.addEventListener("touchmove", preventBehavior, false);
|
|
*/
|
|
|
|
var client_id = "91320880376";
|
|
var redir_url = "http://www.facebook.com/connect/login_success.html";
|
|
var friendsMap = {};
|
|
|
|
function onBodyLoad()
|
|
{
|
|
document.addEventListener("deviceready",onDeviceReady,false);
|
|
}
|
|
|
|
|
|
/* When this function is called, PhoneGap has been initialized and is ready to roll */
|
|
function onDeviceReady()
|
|
{
|
|
// do your thing!
|
|
var fb = FBConnect.install();
|
|
fb.connect(client_id,redir_url,"touch");
|
|
fb.onConnect = onFBConnected;
|
|
}
|
|
|
|
function onFBConnected()
|
|
{
|
|
document.getElementById("loading").innerHTML = "Connected! Getting your friends ...";
|
|
var req = window.plugins.fbConnect.getFriends();
|
|
req.onload = onGotFriends;
|
|
}
|
|
|
|
function onGotFriends(evt)
|
|
{
|
|
document.getElementById("loading").style.visibility = "hidden";
|
|
|
|
var json = JSON.parse(evt.target.responseText);
|
|
|
|
|
|
var listItems = [];
|
|
var template = "<li id='FBID' onclick='showUser(\"FBID\")'><img src='https://graph.facebook.com/FBID/picture'/><span>NAME</span></li>";
|
|
for(var n = 0, len = json.data.length; n < len; n++)
|
|
{
|
|
var friend = json.data[n];
|
|
friendsMap[friend.id] = friend;
|
|
listItems.push(template.replace(/FBID/g,friend.id).replace(/NAME/g,friend.name));
|
|
}
|
|
document.getElementById("fbFriends").innerHTML = listItems.join("");
|
|
}
|
|
|
|
function showUser(id)
|
|
{
|
|
// TODO: Do something with user id ...
|
|
alert(friendsMap[id].name);
|
|
}
|
|
|
|
|
|
|
|
</script>
|
|
</head>
|
|
<body onload="onBodyLoad()">
|
|
<h3 id="loading">Loading ...</h3>
|
|
|
|
<ul id="fbFriends">
|
|
<!-- Placeholder for later -->
|
|
</ul>
|
|
|
|
|
|
</body>
|
|
</html>
|