Facebook Connect iPhone SDK

March 20, 2009 § Leave a comment

Facebook Connect iPhone SDK is released on Mar 12th, 2009. Facebook includes a sample within SDK.

The sample contains Delegate ConnectAppDelegate.h and ConnectAppDelegate.m, and UIViewController SessionViewController.h and SessionViewController.m.

The sample also contains a xib file for UIViewController that handles FB Session.

SessionViewController.xib’s File’s Owner is connecting to four IB label and buttons that handle login, permission, and feed.
Interface Builder Outlets:

Received Action:

Facebook Connect Images are stored within FBConnect.bundle’s folder “image”
▪    close.png (FBC close button)
▪    fbicon.png (FBC icon)
▪    login.png (FB Connect button)
▪    login_down.png (FB Connect button touched state)
▪    login2.png (FB Connect with Facebook button)
▪    login2_down.png (FB Connect with Facebook button touched state)
▪    logout.png (Logout button)
▪    logout_down.png (Logout button touched state)


Fluffy Puffy Cloud Pets 3 Day Project

March 14, 2009 § Leave a comment

This is my first time participating at Weekend App. We formed a team on the spot and build a OpenSocial app in 3 days launching officially in MySpace.

Our “Fluffy Puffy Cloud Pets” app gained over 3,000 users in less than 7 days. This Virtual Pet social app is designed and integrated with Virtual Good and Virtual Currency from day 1. We did make $ on the first day.

I was invited to present our app at Asian Pacific Women Technology (APWT) event.

JSONP: JSON with Padding

March 6, 2009 § Leave a comment

JSONP is a technique allowing JavaScript-only calls to an external server without the need for a proxy to make the call.

JSONP is JSON with Padding. A JSONP call is made to manipulate the host web page’s DOM to dynamically add a script tag. This script tag will remove the server endpoint (REST/Web Service).

This process involves adding a callback method to the query string of the JSONP request. The Javascript method appends the callback method to the body response. The response is wrapped as a parameter to the callback method, similar to the concept of “padding”.

JSONP has many advantages over makeRequest call in MySpace OpenSocial APIs. makeRequest creates more network trips and may trigger multiple points of failure.

JSONP is restricted to GET call only on MySpace Canvas Surface only.. It is restricted to JSON data. JSONP is a hack that is quick and easy to make cross-domain requests from JavaScript.

The drawback is it is difficult to debug JSONP requests.

* Create a JSONP request
* @param {object} url
* @param {object} callback
function makeJsonpRequest (url, callback) {
var jsonpurl = url + “&callback=” + callback;
var e = document.getElementsByTagName (“jsonp”)[0];
var s = document.createElement(“script”);
s.src = jsonpurl;

Useful MySpace Application For Developers

February 20, 2009 § Leave a comment

These are useful applications you can install to test your MySpace application code. This is designed for MySpace developers.

OpenSocial v0.8 Editor

Code Sandbox

Creating a New MySpace Application

February 20, 2009 § Leave a comment

This is a very simple list of steps on how to create a new application on MySpace Platform

1.    Sign up MySpace Account
2.    Go to http://developer.myspace.com/community/ and select Build on navigation menu
3.    Select Create On-Site App
4.    Complete the form to create the app. Use a unique Application Title, a unique email address and password.
5.    Skip Uploaded Application XML and click “Skip This Step”
6.    On the <Edit App Information> tab section, enter the required fields: Application Title, Application Description, Primary Category
7.    Click on <Edit App Source> tab section.  On the defaulted sub-tab section <Canvas Surface>, you can enter codes using 3 different options 1) HTML/JavaScript Source 2) Inline Flash 3) External IFrame.
8.    Enter code for <Profile Surface> and <Home Surface>.
9.    Copy and paste the code into HTML/JavaScript Source window for Profile Surface.
10.    Click “Save Application Source”
Now you need to add the app on your developer account to gain access tot the app. Click “My Apps” on the navigation menu
1.    Click the logo left of Application name
2.    Click “Add this app” to your Developer Account
3.    Click “Add” on the popup window
4.    Click “App Gallery” on the navigation menu
5.    Click “View App” to verify the success of app installation

To run the app on MySpace OpenSocial v0.8 instead of v0.7

1.    Click on “My Apps” on the navigation menu
2.    Select your app
3.    Click on “Edit Source” Tab
4.    Insert the code into Canvas Surface
5.    Click on “Edit App Information”
6.    Go to the bottom of the page in “Other Settings” section
7.    Select v0.8 from the drop down menu on the “Preferred OpenSocial Version

Note: your app won’t run  properly if the Other Settings is on v0.7.

Designer should prepare:
▪    Small Icon 16×16
▪    Large Icon 64×64
▪    Flash file to upload for Canvas Surface, Profile Surface, Home Surface

Application Owner should prepare:
▪    Title of application
▪    Short description of the application
▪    Primary Category
▪    Secondary Category

Layout Details for Designer:
▪    Canvas Surface: Default Width: 100%. Default Display Height: 500 pixel.
▪    Profile Surface: Default Width: 300 pixel. Default Display Height: 190 pixel.
▪    Home Surface: Default Width: 290 pixel. Default Display Height: 190 pixel.

Where Am I?

You are currently browsing the Social Network category at Web Builders.