The Developer's Guide to Social Programming: Application Discovery, Tabbed Navigation, and the Facebook JavaScript Library
- Application Dashboards and Counters
- Navigating and Showcasing Your Application Using Tabs
- Dynamic Content and the Facebook JavaScript (FBJS) Library
- Summary
This chapter is from the book
This chapter is from the book
This chapter is from the book
Facebook can be used as a mechanism for sharing content, commenting, and stream publishing, as you learned in Chapter 7, "Using Facebook Connect for Sharing, Commenting, and Stream Publishing." However, the Facebook environment contains three other ways in which users and their friends can interact: application dashboards, which focus on the discovery and reengagement of games and applications; counters, for alerting users that they need to take action on an application or game (perhaps taking their next turn) or that a report is ready for them to view; and application tabs, which can be shown on a user's profile alongside other profile information. These three channels can be used by a Facebook Platform application to engage users both within and outside of Facebook.
This chapter explores how you can use dashboards in your Facebook Platform application through the Dashboard API. Through the Dashboard API, you can post news items to a user's dashboard, promote friends' activities, and utilize activity counters. The second part of this chapter focuses on application tabs as a way of sharing your application's information with users and their friends. Following the deprecation of profile boxes, application tabs are the only mechanism for enabling users to personalize their profiles and showcase their favorite applications. This section includes details about how to configure, install, and develop an application tab through the use of "Mock AJAX". The final section showcases Facebook JavaScript (FBJS) and how you can use it for events, animations, and Facebook dialogs.
Application Dashboards and Counters
Because of the popularity of social gaming applications on Facebook, their recent redesigns have started to put more emphasis on highlighting specific features for games. There are now two types of "dashboards": Games (http://www.facebook.com/?sk=games) and Applications (http://www.facebook.com/?sk=apps). These are accessible via a user's home page alongside bookmarks. The goal of each of the dashboards is to make it easier for Facebook users to access games or applications that they or their friends have recently used and to discover new applications through their friends or the Application Directory (see Figure 8.1).
)
Figure 8.1 Screenshot of the Games dashboard.
Various key features are available within the dashboards:
- Recently used applications or games display right at the top so that users can quickly and easily find applications they use on a daily basis. The number of friends who also use the application is also highlighted next to each application's title.
- News items can be used to allow applications to communicate with users either to display news to all users or alert individual users that they need to take action. For example, a game news item may say "It's your turn to play, Mark!" You can also use news items to mention a user's friends and invite them to play a game with you.
- A user's friends' recent activity is shown, which is used to promote applications and games that a user might not have installed. This can also be toggled to display the activities that an individual has recently completed, which can be privacy controlled.
- A list is maintained of all friends who recently interact with applications that appear below the activities. These take the form of a list and are updated dynamically based on usage.
- The legacy Facebook Application Directory is displayed right at the bottom of the dashboards for searching for applications in particular categories. When submitting your own application to the directory, this will be the category or categories that you have provided.
- Facebook also runs features on particular applications or sponsored applications, which are shown to the right side of a profile. These are generated by combining a users' and their friends' activities to suggest the most suitable applications or games to their profile.
- Counters can be shown alongside an application's name for games or applications that a user has bookmarked. These are discussed further in the "Games and Applications Counters" section, later in this chapter.
When submitting an application to the directory, a developer will choose whether the application should be listed as a "game" or as a regular "application." This designation dictates which dashboard it will be placed within. Both dashboards contain the same functionality and so differ only in content. A new Dashboard API was released in February 2010 to encompass all the features of dashboards (the subject of the remainder of this section), including adding to news and activity streams and updating counters.
News and Activity Streams
As you have seen in the Games and Application dashboards, Facebook has concentrated a lot of their efforts on keeping users updated as to what they and their friends are up to. One of the main ways in which this is achieved is through activity streams. Activities are reported on the Games and Application dashboards in two distinct ways, through news and activities:
- News items can be set to display global and personal items to an individual or set of individuals. These could be that a new feature has been added to your game or application or if a friend has initiated an action involving a particular user.
- Activity items display actions performed specifically by the individual that appear in that individual's stream but could also reference one of their friends. In which case, that individual's activity will also appear in a friend's news items.
The methods for each of these streams are similar to those regarding stream publishing discussed in Chapter 7. The only real difference here is that news and activities are restricted to the dashboards rather than the user's stream, which helps to reduce unnecessary clutter.
Working with News Items
News items are a way of sharing announcements with your users or for indicating that a friend has performed an activity that has referenced them. There are two types of news items, global and personal, depending on what method was called to create the item. Facebook displays just two news items within either the Games or Applications dashboard, and so they also provide a convenient method to clear news items from a user's stream.
Adding News Items
News items can be added using the following methods either individually, globally, or for multiple individuals using the following:
- dashboard.addNews
- dashboard.addGlobalNews
- dashboard.multiAddNews
Each method requires a slightly different set of parameters, such as providing a uid (which is that of the user whose dashboard you are updating) for individual news and which is not required for global news items. For updating multiple users, an array of uids is required instead. This array contains a number of user identifiers that require updating. Note that you cannot set multiple messages for each of these individuals, so each news item will be the same for each of the identifiers you provide. An array of up to eight news items is also required. This must contain a message and an optional action_link that includes text and a href. If you want, you can also supply an optional image parameter. This must be an absolute URL that is formatted as a 64x64px square. An example of each method is shown here:
$user = $facebook->get_loggedin_user();
$users = array("1", "2", "3");
$news = array(
array(
"message" => "Hey, {*actor*}. Your friend @ just invited
you to play chess.",
"action_link" => array (
"text" => "Play Now!",
"href" => "http://myfacebookapp.com/?game=chess"
)
)
);
$global_news = array(
array(
"message" => "Hey, {*actor*}. There is a new game to play, chess.",
"action_link" => array (
"text" => "Play Chess!",
"href" => "http://myfacebookapp.com/?game=chess"
)
)
);
$image = "http://29.media.tumblr.com/avatar_abad48dbd089_96.png";
$individual_news = $facebook->api_client->dashboard_addNews($user, $news,
$image);
$global_news = $facebook->api_client-
>dashboard_addGlobalNews($global_news, $image);
$multi_news = $facebook->api_client->dashboard_multiAddNews($users, $news, $image);
If successful, the $global_news and $individual_news items will return a news_id if the call succeeds, and the $multi_news item will return an associative array of uid keys that contain either a news_id if successful or false if unsuccessful. These news_id values are important and should be stored because they will be required if news items need to be cleared from a dashboard. In addition, two conventions were demonstrated in the message values: You can use the {*actor*} token, which is also available within stream attachments, to be rendered as the user whose dashboard is being updated; and you can use <<USER_ID>>, where <<USER_ID>> can be replaced by any user identifier. In your own applications, this would form part of a two-stage process of updating an individual's activity stream but also updating the news streams of that user's friends that he or she was playing against or wanting to update.
Clearing News Items
As with adding news items, three methods enable you to clear updates that have already been created by an application. Clearing individual news will not remove global news and vice versa, and so these methods may be used alongside each other:
- dashboard.clearNews
- dashboard.clearGlobalNews
- dashboard.multiClearNews
All of an individual's news items can be removed by using the dashboard.clearNews method and supplying their uid as the single required parameter or by additionally passing in an array of news_id values. For global news, the dashboard.clearGlobalNews method can be called without any parameters to remove all news or can include an array of news_id values similar to the individual news item method. Clearing multiple individuals' news items is slightly more complex. Here is an example assuming that the $multi_news parameter that was presented in the "Adding News Items" section above returned the following:
$multi_news = array(
"1" => 111,
"2" => 222,
"3" => 333
);
$ids = array(
"1" => array("111"),
"2" => array("222"),
"3" => array()
);
$removed_multi_news = $facebook->api_client->dashboard_multiClearNews($ids);
A successful response from the individual and global methods is an associative array of news_id keys and Boolean values depending on whether the news item has been removed. When you are removing multiple individuals' news items, an associative array will be returned equivalent to the individual and global methods if news_id values were supplied. Otherwise, if no news_id values were supplied (such as the last $ids parameter), an associative array will be returned containing the uid as the key and a Boolean value of whether the news item was removed or not.
Getting News Items
The final sets of methods are used to extract a user's or group of users' news streams. Simply put, these methods provide you with the original news and image values that were set when adding news items. The method names are as follows:
- dashboard.getNews
- dashboard.getGlobalNews
- dashboard.multiGetNews
These methods prove particularly useful should you not want to store news_id values within your database of file stores.
Working with Activity Items
Unlike news items, activity items are an experimental feature and may be removed by Facebook in the future. Activity streams are used to broadcast to a user's friends what that user been up to within a game or application (for example, posting high scores or whether the user has uploaded new files or photos). There are only three methods for working with activity items, and these cannot be called for multiple individuals like news items:
dashboard.getActivity
This method will return the latest 100 activities recorded for the current user. The method can be called with an optional activity_ids array if you have recorded each activity_id for your users.
dashboard.publishActivity
This method works in exactly the same way as dashboard.addNews, but rather than being a news object, it is an activity. The same conventions for using {*actor*} and <<USER_ID>> tokens can be used when setting activity items. Successful publishing of an activity will return a numeric activity_id.
dashboard.removeActivity
Activities can be removed by supplying an array of activity_id values, which will return an associative array of activity_id keys and a Boolean value indicating success or failure.
When setting up your application in Chapter 5, "An Overview of Facebook Platform Website Integration," you may have noticed a setting called Hide User Activity within the "Advanced" tab. This setting can be checked if you think that your application will generate activities that a user might want to keep private and not share with friends. Although further details were not available at the time of this writing, Facebook intends to give users sufficient control over which news and activity items they both send and receive. Like items being posted to their stream, it may be that they want to inform certain friends of their activities but exclude others.
Games and Applications Counters
Before an application or game can utilize counters, it must first be bookmarked by the user. This can be done from within Facebook using the links provided on each of the dashboards. However, it can also be facilitated through embeddable <fb:bookmark> FBML and XFBML tags. A bookmark URL must be set. You can find this within the "Basic" tab of an application; otherwise, the application's connect URL or canvas page URL will be used. For Facebook Platform applications, you can set the type attribute of the button to off-facebook, which will render a blue button in place of the standard gray used within canvas applications. Upon clicking the button, users are prompted with a dialog box to add the application to their profile (see Figure 8.2).
)
Figure 8.2 Example bookmark dialog for theTest Tube application.
If a user has already bookmarked your application, the button will not appear. You can also check this by querying the permissions FQL table, as follows:
$bookmarked = $facebook->api_client->fql_query('
SELECT uid, bookmarked
FROM permissions
WHERE uid = "'.$official_user.'"
');
The result of this FQL query will be either a 1 or a 0 that can be extracted by using $bookmarked[0]["bookmarked"]. New bookmarks will appear underneath the links to the Games and Applications dashboards and can be rearranged by users after clicking the "More" link below their bookmarks. After an application has been bookmarked, you can start exploiting the features of counters via the Dashboard API.
There are two types of counter methods. One type of method enables you to update an individual's counter. The other type of method can be used to update a number of individuals' counters. Users could utilize this to let a group of friends know of an action they've taken in a game and that it is now their turn. There are four methods for updating the first type of counter for individuals:
- dashboard.decrementCount
- dashboard.getCount
- dashboard.incrementCount
- dashboard.setCount
These methods can be run either using the logged-in user's credentials or by supplying a uid alongside your application secret. Unlike internal Facebook applications or games, when using website integration you must ensure that every time a user visits your bookmark URL that the user's counter is reset to zero. For applications that want to update a group of individuals' counters at the same time, the second type of counter method, a number of batch methods are available:
- dashboard.multiDecrementCount
- dashboard.multiGetCount
- dashboard.multiIncrementCount
- dashboard.multiSetCount
These batch methods all request that an array of uids be supplied and will return an array of uids as the key and a Boolean value for whether the request was successful. It is suggested that when users visit your application, either on a canvas page or via an external website, that their counter is set to zero to ensure that users do not get confused as to what actions they are required to take.