“..centered on a fully editable Spotify music profile, with the ability to publish playlists, top artists and top tracks for public view. Discovering these profiles is simple as we’ve connected with Facebook so that you can instantly add your friends’ profiles“.

This is cool. I tried it out, but I was surprised about their implementation of the Facebook integration. in this blog post I´ll describe what I think is some weakness with this implementation, and would love to get some dialog/comments from you. Maybe it´s only me that thinks it´s a problem?

Connecting to Facebook

The first thing is to connect to Facebook. In the new Spotify you´ve got a profile located in the right column. The profile typically consists of your playlists (that is published) and your top artists and top tracks. All your friends on Facebook will be able to see this as default (but is possible to change). There are two ways to log into Facebook from Spotify. You may use the menu at your profile at the top right. Or you may choose to click on the bottom right button asking you to import your friends.

Choosing to connect to Facebook will prompt you to log in to your Facebook account (E-mail and Password). This is done through a new window inside Spotify. After you log in to your account on Facebook, you will have the following options:

What Spotify asks for is the following (to be able to connect Spotify to Facebook you must accept this )

• access to your information on Facebook (name, picture, list of friends etc)
• access to your wall (for posting of messages etc )
• acces to your news feed
• offline acces to your account (when you are not using Spotify)

Spotify takes full control over your wall

What happens when you accept? Well, go to Facebook and look at your profile. Spotify automatically posts to your wall that you have just activated Facebook for Spotify making it easier to find friends’ Spotify playlists. This is done without asking me. In my opinion this is a weakness with Spotify´s integration with Facebook. Spotify takes away my control over my own wall on Facebook. What they should have done, was to alert me that they where about to post to my wall, and let me choose not to do so if I did not want that information out. Another issue with this, is that everytime you disconnect Facebook from Spotify and connect again, this information is posted to your wall. Kind of make me feel like a big time spammer actually. Here is how it looks like:

When connected to Spotify my friends on Facebook that has also connected their account to Spotify appears in a list. Now you are able to dive into each of them and look at their profiles and information as described above. I found a published playlist from one of my friends and subscribed to it. What do you think is happening now? Well, let´s go over to my Facebook profile again. On my wall a new post from Spoitify has appeared. The action of subsribing to a playlist is announced on my wall. Again this is done without any warning or information. If you really work with your friends playlist, subsrcribe to many of them, I bet you will get a bit frustrated when looking at your Facebook wall seeing all your actions there.

For each action I should have been prompted with a question letting me decide to post or not. Here is how this post on my wall looks like:

Working with the settings

Since Spotify have no functionality that let us have control over what is actually posted to the wall – playing the “all or nothing” game, I have chosen to restrict Spotify´s access to my profile. You may do this in two ways. The easiest one is to just to disable the postings to Facebook inside the profile settings in Spotify. The other option is to go to your Facebook account, choosing Spotify from the application settings, and uncheck the Spotify´s ability to access your wall.

I really hope Spotify develops the functionality that let me choose from action to action what I will post on my wall. The implementation today is not user-friendly as far as I see this, but of course from Spotify´s view of it, it is a sneaky way to go viral on Facebook.

See also: Reflections after having implemented Facebook Connect and Google Friend Connect on my blog

First of all my goal was to use an existing web application, write a facebook integration module that communicates with the Facebook APIs, extracting some information/data and presenting them inside the existing web application. The web application I used is based on a j2ee framework (jsp, java). The architecture is much like Struts The first thing to do was to get the Developer Application to my existing Facebook account. Then I had to download the Client Library. I choosed the Java Library since my development environment was Java. When I extracted the Client Library, only the source files where included. So what I had to do first (besides looking into the source code), was to compile the java-files. I actually wrote an ant-task for this purpose, but a more easier way is just to use javac without using ant-framework. The next step was to take the output from the compile process and put it into an archived file (.jar). This is not necessary but I like to do it this way and the facebook.jar file I now had is easily dropped into my existing web application library. In my Facebook profile I had to create (set up) a new application. This is done by clicking the developer application that was installed earlier. Its some steps including getting a key (API key and secret key) that I used in my java-code but this process is straight forward. [% oiopub-banner-4-right %]

Ok, now lets start the coding process. Here is the java code controlling the session and authentication:

String apiKey = “something”;
String secretKey = “something”;

FacebookRestClient frc = null;
HttpSession session = request.getSession();
String sessionKey = (String) session.getAttribute(“facebookSession”);
String token = request.getParameter(“auth_token”);

try {

if (sessionKey != null && sessionKey.length() > 0) {

frc = new FacebookRestClient(apiKey, secretKey, sessionKey);
this.doTheThing(request, response, frc);
} else if (token != null) {
frc = new FacebookRestClient(apiKey, secretKey);
session.setAttribute(“facebookSession”, sessionKey);
sessionKey = frc.auth_getSession(token);
session.setAttribute(“facebookSession”, sessionKey);
this.doTheThing(request, response, frc);

} else {
response.sendRedirect(“http://www.facebook.com/login.php?api_key=” + apiKey + “&v=1.0″);
}
} catch (FacebookException fe) {
} catch (IOException ioe) {
…

The doTheThing method is extracting the information and looks like this:

int myid = frc.users_getLoggedInUser();
EnumSet<ProfileField> fields = EnumSet.of(com.facebook.api.ProfileField.NAME, com.facebook.api.ProfileField.PIC, com.facebook.api.ProfileField.PIC_BIG, com.facebook.api.ProfileField.PIC_SMALL);
Collection<Integer> users = new ArrayList();
users.add(myid);

// Get my information
Document d = frc.users_getInfo(users, fields);
String myname = d.getElementsByTagName(“name”).item(0).getTextContent();
String mypicture = d.getElementsByTagName(“pic”).item(0).getTextContent();

// Get my friends id
Document d2 = frc.friends_get();
String s = d2.toString();
NodeList userIDNodes = d2.getElementsByTagName(“uid”);
int fcount = userIDNodes.getLength();

Collection<Integer> friends = new ArrayList<Integer>();
for (int i = 0; i < fcount; i++) {
Node node = userIDNodes.item(i);
String idText = node.getTextContent();
Integer id = Integer.valueOf(idText);
friends.add(id);
}

List l = new ArrayList();
Map m = new HashMap();
Document d3 = frc.users_getInfo(friends, fields);

// Get my friends information
for (int j = 0; j < fcount; j++) {
String name2 = d3.getElementsByTagName(“name”).item(j).getTextContent();
String picture2 = d3.getElementsByTagName(“pic”).item(j).getTextContent();
String picture3 = d3.getElementsByTagName(“pic_small”).item(j).getTextContent();
String picture4 = d3.getElementsByTagName(“pic_big”).item(j).getTextContent();

m.put(“name”, name2);
m.put(“picture”, picture2);
m.put(“picture_small”, picture3);
m.put(“picture_big”, picture4);

l .add(m);
m = new HashMap();

}
request.setAttribute(“friends”, l);
request.setAttribute(“myname”, myname);
request.setAttribute(“mypicture”, mypicture);
request.setAttribute(“numFriends”, new Integer(fcount));

So all the information from Facebook is now added to the request and can be displayed in a JSP. The code above is not very elegant and is not optimized(!). Its just a pice of code done after half an hour of work and my goal was to implement an integration module for testing purpose.

Hope this blog post can help others looking for hints when getting started with Facebook application development/integration