Web Development Blog

For iPhone / iPad (iOS)

Prerequsites
- Install ChildBrowser Phonegap plugin
- Copy FBConnectExample/FBConnect.js into your www folder and include it in your HTML file
- Read and follow the instructions from How to post to the Facebook wall in an iPhone app with phonegap, FaceBook Connect and ChildBrother plugin by MosaCrea

The Javascript(jQuery) code:

$('#share-facebook').live("touchstart touchend", function() {
	var url = $(this).attr("rel");
	try {
		shareonfacebook(" likes Web Development Blog by Ei Sabai.", "http://eisabainyo.net/weblog/wp-content/uploads/2010/11/profile-small.gif", url);
	} 
	catch(err) {
		console.log(err);
	}	
	return false;
});

function shareonfacebook(text, image, url) {
	var client_id = "xxxxxxxxxxxxx"; // Your Facebook Client ID
	var redir_url = "http://www.facebook.com/connect/login_success.html";

	if (typeof fbPlugin === 'undefined') {
		fbPlugin = FBConnect.install();
	}
	fbPlugin.connect(client_id, redir_url, "touch");
    fbPlugin.onConnect = function() {
	    window.plugins.fbConnect.postFBWall(text, url, image, function() {
			navigator.notification.alert(
				'Thank you for sharing on Facebook.',  
				function() {},         
				'Thank you',     
				'OK'                 
			);
		});
	};
}

For Android

Prerequsites
- Install Facebook for Android Phonegap plugin
- Copy facebook.js into your www folder and include it in your HTML file

The Javascript(jQuery) code:

$('#share-facebook').live("touchstart touchend", function() {
	var url = $(this).attr("rel");
	try {
		shareonfacebook(" likes Web Development Blog by Ei Sabai.", "http://eisabainyo.net/weblog/wp-content/uploads/2010/11/profile-small.gif", url);
	} 
	catch(err) {
		console.log(err);
	}	
	return false;
});

function postonfacebook(text, image, url, token) {
	$.ajax({
		   type: 'POST',
		   url: "https://graph.facebook.com/me/feed",
		   data: {
				message: text,
				picture: image,
				link: url,
				access_token: token,
				format: "json"
		   },
		   success: function (data) {
			   navigator.notification.alert(
					'Thank you for sharing on Facebook.',  
					function() {},         
					'Thank you',     
					'OK'                 
				);
		   },
		   dataType: "json",
		   timeout: 10000
	});
}

function shareonfacebook(text, image, url) {
	var client_id = "xxxxxxxxxxxxx"; // Your Facebook Client ID

	window.plugins.facebook.authorize(client_id, function(res){
		if (res.token !== undefined) {
			postonfacebook(text, image, url, res.token)
		} else {
			// call authorization method
			window.plugins.facebook.getAccess(function(res) {
				if (res.token !== undefined) {
					postonfacebook(text, image, url, res.token)
				}
			});
		}
	});
}

Usage (for both iPhone and Android):

<a href="#" rel="http://eisabainyo.net/weblog/" id="share-facebook">Share on Facebook</a>

Found this article useful? Share it with your friends: