Hi5 Developer Center

Recently in OpenSocial Category

hi5 is teaming up with Google, Globant and others to present OpenSocial Week in Buenos Aires, Argentina, from Monday, April 28 – Saturday, May 3. During the festivities, we’ll share information about using OpenSocial on the hi5 Platform to build applications for our 80 million registered members around the globe, including our large user base in South and Central America. I'll be there personally May 2-3 to talk at a couple universities and present at a hackathon.
 
The complete schedule of each day’s event is located on the OpenSocial API blog here. We look forward to meeting hi5 developers in Argentina face-to-face. Let us know if you’d like to set up some one-to-one meetings to discuss the success of your apps on hi5!
There were some requests that I put up the slides from my talk at web 2.0 expo yesterday. Ask and you shall receive:

http://docs.google.com/Presentation?id=dxpbvz6_141gnxn58d8
UPDATE: Monday, March 31st 04:30 PST - Release has progressed as planned, and we now have 53 applications approved for launch tomorrow. If you got us your userids before about midnight, you can access the platform on www.hi5.com now. Currently the platform is open only to whitelisted users. Release to the rest of our users will proceed as planned starting at 12:00 pm PST today. If you were late getting your application submitted or getting your ids whitelisted, not to worry, contact us at platform-help@hi5.com and we'll do our best to accommodate you as soon as possible.


The hi5 Platform is set to launch tomorrow. Details of the rollout plan are as follows.

We will rollout to percentages of our user base based on userid ranges. In addition to that we have implemented a user whitelist to allow developers with apps that are launching and hi5 developers to see the platform regardless of rollout percentage. If you are a developer with an app launching and have not yet sent us ids to whitelist for the launch please send your developers' hi5 ids to platform-help@hi5.com and we'll add them to the whitelist.

Tonight, Sunday March 30th
We will be reviewing and approving applications, which will then be live in production to whitelisted accounts only. At this point developers will be able to review and test their applications in production. This is not a hard deadline for approving apps. If you miss tonight and your app is ready, just send an email to platform-help@hi5.com and we'll review and approve as soon as possible.

Monday March 31st
We will start opening up the platform to our userbase. The tentative plan is to open up to 1% of users at 12:00 PST, and roll out to as much as 10% over the course of the day depending on performance and bug reports.

After Monday, we will continue rolling out as quickly as possible, again depending on perfomance and bug reports. We will roll to 100% as quickly as possible, but are tentatively planning to allow 2 weeks. If we can reach 100% sooner, we will. We will be patching often, so please report bugs to us at platform-help@hi5.com as the rollout progresses. We will also be opening up our bug tracking system in the coming days to provide a better way for reporting and tracking issues, we'll blog when that happens.

Throughout this period the hi5 platform team will continue to be available on our irc channel at irc.freenode.net #hi5dev. We encourage you to escalate any serious issues to us there as well.

Viral Channels During Rollout
During the rollout period EMAIL will be disabled, as it's difficult to control sending emails only to users in the release pool. requestSendMessage with type=EMAIL will return a NOT_IMPLEMENTED response with an explanation that it's disabled for rollout during this period.

All other viral channels will be on and functioning as normal. Notifications, Friend Updates, and Application Invites will be delivered to all users. However, users not in the release pool will not see them until they enter the pool. So, a user entering the pool later this week who has received any of these items prior to entering the pool, will have them waiting for them with alerts on their homepage to that effect.

A big thank you to all the developers who have been hard at work preparing for launching applications with us tomorrow. We're all very excited at hi5 about tomorrow's launch and the tremendous value we expect your applications to provide to our users.
UPDATE: See Notifications and Emails sections. We have decided not to support VIEWER_FRIENDS and OWNER_FRIENDS as recipients but do continue to support an array of userids of up to 100 users.

On March 31st, a complete set of viral channels will be released, making it easier for developers to distribute applications to the hi5 community. Please note that policies on viral distribution are subject to change, so please check the wiki page regularly for more information.
 
Invitations
 
Invitations appear under the “Requests” header, at the top left corner of a user’s homepage. A user of an application has the ability to invite their friends to install the application. There are no limits to how many friends a user can invite. We have built a standard User Interface for selecting friends. Friends who receive an invitation have the option to block an application or report it as spam. A user can only receive an invitation to an application from the same friend once. Any installed application has Invite links on the profile module and the top of the canvas page. An application may also request to forward the user to the invite page at any point via the OpenSocial requestShareApp method.

opensocial.requestShareApp(recipients, reason, opt_callback)

Notes:
  • The only valid value for recipients is opensocial.DataRequest.Group.VIEWER_FRIENDS. There is no limit to the number of friends a user may select to invite, but there is no Select All feature in the form.
  • As noted in the spec, containers should either refresh the application or call the requested callback on completion of this request. Since we always refresh the gadget, the callback is ignored.
  • reason should be of type opensocial.Message, and the text should be in the BODY field. If set, the reason will be displayed in the invite form.
Example:

requestShareApp(opensocial.DataRequest.Group.VIEWER_FRIENDS, opensocial.newMessage('Gifts are more fun with friends!'));
 

Notifications
 
Notifications appear under the “Requests” header, on the top left corner of a user’s homepage. Here, all notifications are aggregated and displayed as a single number. If an application triggers a notification (e.g. “You have received a gift from John”), this will be sent to the recipient of the action. Notifications can be sent to users who have the application installed and users who don’t have the application installed as yet. Notifications will be limited to 5 per application per recipient per day.
 
Notifications are sent via the OpenSocial requestSendMessage method, with TYPE=NOTIFICATION

Notes:
  • The recipients field may be a user id, an Array of user ids, OWNER, or VIEWER. OWNER_FRIENDS and VIEWER_FRIENDS will not be implemented at this time.
  • The notification will only be sent to recipients that either have the app installed or are friends with the viewer.
  • The array of userids passed as recipient may contain at most 100 ids.
  • HTML content in notifications is sanitized. Only 'a' and 'br' tags are currently allowed.
Example:
var recipients = new Array();
recipients[0] = 1000;
recipients[1] = 1001;
var messageParams = {};
messageParams[opensocial.Message.Field.TYPE] = opensocial.Message.Type.NOTIFICATION;
var message = opensocial.newMessage('Notification text', messageParams);
opensocial.requestSendMessage(recipients, message, handleNotificationResponse);

 
E-mail messages
 
Applications can send email messages to users as long as the user has the application installed and the user has given the application the permission to do so. Currently, the e-mail limit is 1 email message per app per recipient per day. The user will have the option to unsubscribe from the email message.
 
Notifications are sent via the OpenSocial requestSendMessage method, with TYPE=EMAIL

Notes:
  • The recipients field may be a user id, an Array of user ids, OWNER, or VIEWER. OWNER_FRIENDS and VIEWER_FRIENDS will not be implemented at this time.
  • The notification will only be sent to recipients that either have the app installed or are friends with the viewer.
  • The array of userids passed as recipient may contain at most 100 ids.
  • HTML content in emails is sanitized. Only 'a','br', and 'strong' tags are currently allowed.
Example:
var messageParams = {};
messageParams[opensocial.Message.Field.TYPE] = opensocial.Message.Type.EMAIL;
messageParams[opensocial.Message.Field.TITLE = 'Subject of email';
var message = opensocial.newMessage('Body of email', messageParams);
opensocial.requestSendMessage(opensocial.DataRequest.PersonId.OWNER, message, handleEmailResponse);

 
Friend Updates
 
Application developers have direct access to the friend updates on hi5. When a friend update is generated by a user, that update is displayed both on the generating user's profile page in the Recent Updates section, and on the generating user's friends' homepages in the Friend Updates section. Not all updates are published to all friends, but the publication rate is quite high. Currently we support 1 update at any given time per generating user per application, meaning a user could see at most the same number of updates on their homepage from an application as they have friends. We plan on supporting activity templates in a follow-up release, which will allow for better matching and aggregation and will allow us to change this limit.
 
Friend Updates are created via the OpenSocial requestCreateActivity method

Notes:
  • hi5 currently supports the following fields: TITLE, BODY, MEDIA_ITEMS, FAVICON_URL, and URL
  • USER_ID, APP_ID, and POSTED_TIME are inferred from the request and if set are ignored by hi5
  • Priority, although required by the OpenSocial spec, is currently ignored by hi5
  • FAVICON_URL is used as the icon in the Friend Updates feed if specified. If unspecified, we will use the icon specified in the application's ModulePrefs. If that is also unspecified, we will use the standard hi5 gear icon.
  • An update may have up to 5 MediaItems associated with it.
  • hi5 support an additional MediaItem field, hi5.ActivityMediaItemField.LINK. This allows for individual MediaItems to have links to content.
  • If the BODY is set, the URL field is a link attached to it. This URL supports view-params to an app canvas page. If unspecified and the BODY is set, this link defaults to the generating user's canvas page with no view-params.
  • HTML content is sanitized. Only 'a' tags are currently allowed.
Example:

    var activityParams = {};
    activityParams[opensocial.Activity.Field.TITLE] = title;
   
    var mediaItems = {};
    var mediaItem = opensocial.newActivityMediaItem(opensocial.Activity.MediaItem.Type.IMAGE, viewer.getField(opensocial.Person.Field.THUMBNAIL_URL));
    // Add a media item link if supported
    if(gadgets.util.hasFeature('hi5') && opensocial.getEnvironment().supportsField(opensocial.Environment.ObjectType.ACTIVITY_MEDIA_ITEM, hi5.ActivityMediaItemField.LINK)) {
      mediaItem.setField(hi5.ActivityMediaItemField.LINK, viewer.getField(opensocial.Person.Field.PROFILE_URL));
    }
    mediaItems.push(mediaItem);
    activityParams[opensocial.Activity.Field.MEDIA_ITEMS] = mediaItems;
   
    var activity = opensocial.newActivity(activityParams);
    opensocial.requestCreateActivity(activity, opensocial.CreateActivityPriority.HIGH);


General Notes

  • All viral channels are monitored and may be subject to spam control.
  • All viral requests are limited to the 'canvas' view. Requests from 'profile' or 'preview' views will return an opensocial.ResponseItem with error code set to to opensocial.ResponseItem.Error.NOT_IMPLEMENTED.
  • Users have the option of disallowing applications from sending Friend Updates, Notifications, and Emails on their behalf.
  • If an application is blocked by the user, none of the viral channels will reach the user.
  • Successful requestSendMessage requests will return an opensocial.ResponseItem whose data field will contain a list of users who received the message. This is not yet available in sanbox but is expected to be ready for launch, details to come.

As mentioned above, these policies are subject to change, and feedback is appreciated at this time. You can find us on our irc channel at irc.freenode.net #hi5dev, and we'll have Feature Request submissions available on our developer site soon as well.

 
appshome.pngAs we proceed towards our OpenSocial release, we've spent a lot of time polishing up the user interface. In a number of places we display your application name along with an icon.

Up to now we've used a small gear. In our next developer release, you'll be able to change your icon. You need to modify the icon attribute of the ModulePrefs tag. You should specify a URL of a 15x15 image; note that while .ico does not work on IE6, so .gif or .png is required. To make things really easy you can just add a reference to your existing favicon file, in the appropriate format.  Here's a snippet of code that shows how to specify the icon:

  <ModulePrefs
         [other attributes]
         icon="http://images.hi5.com/images/favicon.gif"/>

Once you add your icon attribute, use the developer console to 'Refresh' your application.  After that, your icon will appear in many places throughout the hi5 site.




UPDATE 02/05/08: Adding style params from hi5 skins to this app so it looks nicer on the profile page. Note that there will be more formal OpenSocial support for this in the near future as well.

UPDATE 02/02/08: This app makes more sense showing the owner's journal, so it's been updated to fetch both owner and viewer with the initial request, show the owner's journal, and create an activity stream entry about the viewer reading the owner's journal, with links to content.

I wanted to post a sample OpenSocial app that works with our current sandbox. I'll keep updating this as our sandbox evolves, and there are comments within to explain what's going on. Basically, this app just displays the viewer's hi5 journal, so it demonstrates:

a) getting and using Hi5AuthToken
b) fetching the Viewer and displaying their name and photo, and 
c) making an external request using _IG_FetchXmlContent (to be replaced with opensocial.makeRequest soon).


<?xml version="1.0" encoding="UTF-8"?>
<Module>
  <ModulePrefs title="My Journal" description="Display the Owner's hi5 Journal" title_url="http://www.hi5.com" author="Lou Moore" author_email="lou@hi5.com" author_affiliation="hi5" author_location="San Francisco, CA">
    <Require feature="dynamic-height"/>
    <Require feature="opensocial-0.6"/>
  </ModulePrefs>
  <Content type="html">
    <![CDATA[

      <!-- Text fields go here -->
      <div id="journal" style="margin: 4px">
        <div id="user"></div>
        <div id="body"></div>
      </div>

      <script>

        var Hi5AuthToken = null;

        /**
         * Store the Hi5AuthToken and load the viewer when the page loads
         */
        var init = function() {

          var env = opensocial.getEnvironment();
          var p = env.getParams();
          Hi5AuthToken = p['Hi5AuthToken'];

          loadUsers();
        }

        // Call the init function onLoad
        _IG_RegisterOnloadHandler(init);

        /**
         * Fetch the Viewer with an opensocial dataRequest
         */
        function loadUsers() {
          var req = opensocial.newDataRequest();
          req.add(req.newFetchPersonRequest('OWNER'), 'owner');
          req.add(req.newFetchPersonRequest('VIEWER'), 'viewer');
          req.send(onLoadUsers);
        }

        /**
         * After the Owner is loaded, fetch their journal from the hi5 api server
         * _IG_FetchContent and _IG_FetchXmlContent should be used to fetch external
         * data until opensocial.makeRequest is available
         */
        function onLoadUsers(dataResponse) {
          var owner = dataResponse.get('owner').getData();
          var viewer = dataResponse.get('viewer').getData();
          var ownerId = owner.getField(opensocial.Person.Field.ID);

          // Create HTML for the user summary
          var userHtml = '<a href="' + owner.getField(opensocial.Person.Field.PROFILE_URL) + '"><img border="0" width="50" src="' + owner.getField('thumbnailUrl') + '"/></a> <a href="' + owner.getField('profileUrl') + '">' + owner.getField(opensocial.Person.Field.NAME) + '</a>: ' + owner.getField(opensocial.Person.Field.AGE) + ',' + owner.getField(opensocial.Person.Field.GENDER);
          document.getElementById('user').innerHTML = userHtml;

          // Fetch the journal feed and parse it
          _IG_FetchXmlContent('http://api.hi5.com/rest/feed/journal/'+ownerId, function (xmlDoc) {
            parseAtom(xmlDoc);
          });

          // Request an activity stream entry
          createActivity(viewer, owner);
        }

        /**
         * Request an activity stream entry, with links to owner and viewer and application canvas page
         */
        function createActivity(viewer, owner) {
          var activity = opensocial.newActivity("<a href='" + viewer.getField(opensocial.Person.Field.PROFILE_URL) + "'>" + viewer.getField(opensocial.Person.Field.NAME) + "</a> viewed <a href='" + owner.getField(opensocial.Person.Field.PROFILE_URL) + "'>" + owner.getField(opensocial.Person.Field.NAME) + "'s</a> journal with the <a href='/friend/apps/displayAppCanvas.do?appId=192&userid=" + owner.getField(opensocial.Person.Field.ID) + "'>MyJournal</a> application");
          activity.setField(opensocial.Activity.Field.STREAM_FAVICON_URL, 'http://images.hi5.com/images/icons/_/update_widget.png');

          var priority = opensocial.CreateActivityPriority['HIGH'];
          opensocial.requestCreateActivity(activity, priority);
        }

        /**
         * Naive parser, just get the titles and content and display the journal by setting innerHTML
         * of the 'journal' div created above
         */
        function parseAtom(xmlDoc) {
          var html = "";
          var titles = new Array();;

          // Get titles
          var items = xmlDoc.getElementsByTagName('title');
          for(var i = 0; i < items.length; i++) {
            if(i > 0) {
              var title = items.item(i).firstChild.nodeValue;
              titles[i-1] = title;
            }
          }

          // Get bodies
          items  = xmlDoc.getElementsByTagName('content');
          for(var i = 0; i < items.length; i++) {
            var body = items.item(i).firstChild.nodeValue;
            html += "<div style='margin-bottom:10px;font-weight: bold;'>" + titles[i] + "</div><div style='margin-bottom:10px;>" + body + "</div>";
          }

          // Set html and styles
          document.getElementById("body").innerHTML = html;
          document.getElementById("journal").style.backgroundColor = _args()["appBgColor"];
          document.getElementById("journal").style.backgroundImage = "url(" + _args()["appBgImg"] + ")";
          document.getElementById("journal").style.backgroundPosition = _args()["appBgPos"];
          document.getElementById("journal").style.backgroundRepeat = _args()["appBgRep"];
          document.getElementById("journal").style.color = _args()["appColor"];

          // Call this method to adjust the app's IFrame height if necessary
          _IG_AdjustIFrameHeight();
        }

      </script>

    ]]>

  </Content>
</Module>
If you've played around in sandbox.hi5.com before, you'll notice a few changes when you login tonight.  There's a new developer console that's geared to make your OpenSocial app development and release process a whole lot more streamlined.

First log into sandbox.hi5.com with your hi5 account, and you'll be prompted to register as a developer.  Once you're finished, you'll see the new developer console (below). 

DeveloperHome.jpg



























Create your first app and enter the url of your OpenSocial xml.


DeveloperAddApp.jpg
















Once you've submitted your app, you'll see a link to display your app working inside hi5 and also one to refresh your xml from its location.

DeveloperPostAddUrl.jpg

















Click the View About Page to see your app in action.

DeveloperHelloWorld.jpg

















Your OpenSocial app will appear in the new hi5 Gallery on sandbox.  We'll be adding new features to the console over the next few weeks and allowing you to publish your apps to the live Gallery from here soon, so stay tuned. 

Hack hard,
Dave






Another new feature in our latest sandbox release is Application Invites. While we haven't gotten to the point of implementing OpenSocial 0.7's requestShareApp method, we have the backend for it in place and have launched a built-in flow that every application in the sandbox will have. It starts with the profile module, which will always have an Invite Friends link:

profile_header.pngClicking on this link will take the user to the invite page:

app_invite.png

The invited friends will then receive a request on their homepage.

app_invites_home.pngFinally, clicking on the Application Invites link will take the user to their message center, where they may choose to add the application:

app_invite_msgctr.png
Enjoy!

We'll have our initial Activity Stream support live in our sandbox tonight. Here's some sample code for requesting an Activity Stream entry:

// Create the activity item with a title - the title is a required field and the main text of the item
var activity = opensocial.newActivity("Something awesome just happened.");
// You can set the icon url, this field is optional
activity.setField(opensocial.Activity.Field.STREAM_FAVICON_URL, 'http://images.hi5.com/images/icons/_/update_widget.png');
// This actually creates the activity item. Currently priorities are treated the same, and all requests should be allowed
opensocial.requestCreateActivity(activity, opensocial.CreateActivityPriority['HIGH']);

Supported Fields:
  • STREAM_FAVICON_URL
  • TITLE
Partial Support
  • APP_ID - setting this does nothing, but the appId is pulled from the Hi5AuthToken
  • USER_ID - this also is pulled from the Hi5AuthToken currently, so it is always the logged in user, or viewer
  • POSTED_TIME - this is assumed to be the time the request is received

Next Steps:
  • Complete support for 0.6 fields
    • BODY - additional text
    • MEDIA_ITEMS - images
    • STREAM_SOURCE_URL, STREAM_URL, URL
  • Move on to OpenSocial 0.7
    • TITLE_ID, BODY_ID, TEMPLATE_PARAMS - support for activity stream templates

We're happy to announce that hi5 now has a place to test OpenSocial applications. The feature set is limited, but we will be rapidly upgrading and supporting all features of the OpenSocial specification.

Gaining Access
All developers are welcome to test OpenSocial on hi5.   To access our beta server you will need to create a hi5 account and then join the hi5 platform development group.

Once you've done that you can access our OpenSocial implementation by doing the following:

  1. Visit http://developer.hi5.com/
  2. Log in with your hi5 account, if you are not already logged in.
  3. Click on Add hi5 Developer Application
  4. If you aren't registered as a developer, you will have to first do so (even if you already have a hi5 account.)
You will now be in the hi5 Developer Website. There are a few sample applications and some Google Gadgets. This page also allows you to add any application -- just paste the URL of your OpenSocial xml file into the provided form.

What Works
Only basic functionality works at the moment. You can get profile data for viewer/owner and friends lists of the same. Currently this is restricted to only retrieving publicly available information. We are working on a comprehensive solution to validating application requests and auto-registering API keys on the fly.

Most of the basic Google Gadget functionality works.  Our proxy injects the correct JavaScript into your gadget and passes it off to gmodules.com for further processing.

Our container supports both html (iframe) and html-inline gadgets.

You can add gadgets to your profile page or your home page.  Canvas pages are available by clicking on the title of the application in either of these pages.

What's Broken
Well, just about everything else. Until we have a decent security model in place, we will not be supporting application persistence, updating feeds, or retrieving private data for the viewer. Some of these features are mocked up, which means the calls may be successful, but data will not persist.

We've been testing exclusively on Firefox during this time.  IE support may or may not work.  Also, please consider installing firebug, just in case some debug code finds it's way to the javascript we publish.

Some iGoogle/Google Gadgets features may or may not work.  We know that frame resizing is broken.

We also do not support the RESTful API at all.  We plan to skip AuthSub and move straight to OAuth authentication. Furthermore our API server does not support the URL layout of the OpenSocial Data API.  This is being addressed via the following bug reports:

JETTISON-26
ENUNCIATE-98

Roadmap
What we work on will be heavily influenced by developer partners.  Here's a short prioritized list of our plans to make OpenSocial work with hi5:

  • Security model to allow applications to securely read/write private information.
  • Add read-only activity data feeds.
  • Add application data storage methods.
  • Add writing to activity feed.
  • Add all of the various filtering methods.
  • Extend the amount of data we provide.
Our container logic is also public as the hi5-opensocial project, hosted on Google Code at:

http://code.google.com/p/hi5-opensocial/

We hope that container authors will be able to consult what we've done and use that as a basis for creating their own containers. Furthermore, we hope that this is an interim step to a full, generic open-source container project.

Simultaneously we are working on implementing the RESTful Data API as part of the hi5 API server.

Get Involved
The developers here at hi5 are going to do our best to support all developers. To make this efficient, please use the following avenues:

Thanks, we're all looking forward to working together to build a great OpenSocial experience.  (Oh by the way, if you find this type of stuff exciting and are looking for a career change, contact us -- we're hiring!)

© 2008 hi5Networks