Twet Application

Twet

Maricel Caciula, Denis Recean, Lucian Nistor, Florin Ciobanu

Faculty of Computer Science, Al. I. Cuza University Iasi, Romania

[email protected], [email protected],

[email protected], [email protected]

Abstract. Twet is an application that offers search by pattern popular social

sites like Twitter, Flickr or Youtube for the latest related content. In order to

make the search more efficient we use the WordNet thesaurus to enlarge the

search pattern by adding synonyms. Using Bing Maps, it searches for the

location of the photos.

Keywords: mashup, wordnet, synset, twitter, flickr, geo-location

1 Introduction

The social web is, for many people, more real than reality itself. Every self

esteemed Internet user has an account on the hottest and coolest online social

networks. But besides being a way to spend a good time, social networks are great

sources of information and profit. Other critical resource in these high speed,

information overloaded social networks is time and ease to reach the desired items.

Being so many, these social networks are hard to manage so the idea of an application

that pools information from several environments and displays it in a unified form

becomes obvious.

The project that we developed and that will be discussed in this paperwork treats

exactly this problem, of mashing up the result of a search into several different social

networks into one web application. Specifically we give the user the possibility to

insert the desired search key and then give him the result from three different

platforms. We give him the latest tweeter messages, Flickr photos and YouTube

videos that are related to the input key. All the results are delivered in the same web

page. The search is done with the help of the public API available for each platform.

Before running the search we use WordNet library to find constructions with a similar

meaning with the initial input key. After the search is done and the results displayed a

new feature becomes available, the localization of the flicker videos on a live world

map.

In this paper we will speak about the technologies used to implement the

project, about the structure of the project and the way that the project interacts with all

the other platforms.

mailto:[email protected]




2 Maricel Caciula, Denis Recean, Lucian Nistor, Florin Ciobanu

2 Implementation technology

The project was developed using .NET Framework. The client side of the project

is a Silverlight 3 application. Microsoft Silverlight is a cross-browser, multi-

environment plug-in that delivers the next generation of Microsoft .NET–based media

experiences and rich interactive applications for the Web. In order to develop

applications for this plug-in, the Silverlight SDK is required.

The server was written in ASP.NET and is a web page that exposes a web service.

The web service and the classes that encapsulate the access to other platforms are

coded in C#.

3 Project presentation

3.1 Interface

The interface was developed in Silverlight. Only the client part of the project has

an UI. The UI is simple and intuitive. There is a search box with a search button

attached and tree regions, one for each social network environment (Tweeter, Flickr

and YouTube).

When the user types a search key and presses the search button the application will

start searching on all three platforms and the results will be automatically displayed in

the corresponding region of the page.

Twet 3

When a user clicks on a picture it is brought to front and enlarged, covering almost

all the page.

When a movie is selected from the YouTube results list the movie is brought in

front and the YouTube player is available for interaction.


If the Show on Map Button is pressed the location of each Flickr picture is showed

on a Glob Map using Blinko Maps.

3.2 Internal structure and design

The project is has two main parts the client, which is basically the UI and the

server that is in charge with linking together the API of the social platforms and the

WordNet.

3.2.1 Server

The server has one web service class and an ASP page that exposes the service to

external calls.

Twet 5

Server Class Diagram

The service class exposes 4 methods that do the same thing; they get a search key

in a string and return the search results. The difference between methods is that each

uses a different a different API call (Tweeter, Flickr, Vimeo or YouTube). Before

starting to detail on each API call we will explain the role and the way that WordNet

thesaurus is used in the project.

3.2.2 WordNet

WordNet is a large lexical database of the English language. Each word in the

database is interconnected with other words based on semantic and lexical relations.

To use it in our project we downloaded the library and we included in our project an

open source C# library called WordNetCommon which connects the C# environment

with the useful WordNet Functionality.


WordNet Class Diagram

We used WordNet in orther to get construct phrases that resamble semantically or

sintactically with the search phrase inserted by the user. The ideea is to give the user

as many userfull results as posible. After using the WordNet API on a phrase we will

end up with a regular expression formed disjunctions of each word with its synonims.

Lets consider the following phrase I like boats, one possible result, after using the

WordNet API will be I OR like OR love OR found of OR boats OR ships OR yachts.

At this point, if the API of the social network accepts regular expressions the results

for the search will cover more situations.

Here is the code for the private function of the web service that creates the regular

expresion:

private string SearchPhrase(string Phrase)

{

List<string> result = new List<string>();

string query = string.Empty;

if (Phrase.Trim().Equals(string.Empty))

return string.Empty;

string[] words = Phrase.Trim().Split(' ');

foreach (string word in words)

{

if (!Contains(result, word.Trim()))

{

result.Add(word.Trim());

if (!query.Equals(string.Empty))

Twet 7

query += " "+word.Trim();

else

query += word.Trim();

}

Dictionary<string, List<Definition>> definitions =

DictionaryHelper.GetDefinition(word);

foreach (string item in definitions.Keys)

{

string[] subWords = item.Trim().Split(',');

foreach (string subItem in subWords)

{

if (!Contains(result, subItem.Trim()))

{

result.Add(subItem.Trim());

query += " OR " + subItem.Trim();

}

}

}

}

return query;

}

This funciton is splitting the phrase into words then each word is passed to the

GetDefinition method of the DictionaryHelper class, which in turn finds the

synonims. The synonims are concatenated in the result string. Between two

consecutive words the OR particle is inserted.

Next step in the flow of the application, after finding setting the synonims for each

word in the phrase, is calling the foreign platform’s API to do the search. Each of the

API methods uses a special class that has the implementation of the API Search calls.

The idea is that the search results are stored into a list, but each list contains different

objects, depenting on what API was called. If the API was Tweeter’s thet the list will

contain stings with messages, if the API war YouTube’s the it will contain objects

with the detailes form the movie and so on. Other difference is made by the options

that are required from each type of answear. For instance for Flickr photos, besides

photo dimenssions and photo url, we request the geographical coordonates, if there

are any. When YouTube or Vimeo are introgated we also request the embed code.

Lets see the code for each method in the web service and for the method in the

special class where the communication with the API is done. The interesting parts of

the code will be explained a littele bit.


3.2.3 Tweeter

Twitter is a web application that allows users to post short messages on the Internet

about what they think is important to others to know. These messages can be sent

either from a computer connected to the Internet, or from a mobile phone. The last

option make it very userful to inform a list of persons that are interested in some

aspects.

The web service method that is used to get the tweeter API search result is

GetTweetMessages:

[WebMethod]

public TwetterMessage[] GetTweetMessages(string

expression)

{

return Twetter.Search(SearchPhrase(expression));

}

The interesting part of this funcition is that before calling the function that actualy

interogates the Tweet API, it uses the SearchPhase method to construct the … search

phrase.

Lest have a closer look at the Twetter.Search:

public static TwetterMessage[] Search(string expression)

{

List<TwetterMessage> result = new List<TwetterMessage>();

var scrubbed = HttpUtility.UrlEncode(expression);

var reader = XmlReader.Create(

string.Format("http://search.twitter.com/search.atom?lang

=en&rpp=100&q={0}", scrubbed));

var feed = SyndicationFeed.Load(reader);

foreach (SyndicationItem item in feed.Items)

{

result.Add(new TwetterMessage(item.Authors[0].Name,

item.Title.Text,item.Links[1].Uri.AbsoluteUri));

}

return result.ToArray();

}

In this function we create an xml stream that will be filled with the tweeter query.

This xml will be parsed item by item and the URI of each message will be added to

the resulted list.

Twet 9

3.2.4 Flickr

Flickr is a web apllication that allows users to upload pictures in order to be shared

with others. Using this web aplication you can stay in toutch with your friends wether

they are far away or not.

The web service method that is used to get the Flickr API search result is

GetFlickrImages:

[WebMethod]

public FlickrImages[] GetFlickrImages(string

expression,int page)

{

string query =

SearchPhrase(expression).Trim().Replace("OR ", ",");

return FlickrWr.ReturnImages(query,page);

}

This method has one more operation done with the search phase computed with

WordNet, it replaces the “OR” used to symbolize disjunction with “,” then it gets all

the images that are tagged with one of the words in the phrase.

The function that is doing the real API call is

public static FlickrImages[] ReturnImages(string query,

int page)

{

List<FlickrImages> result = new List<FlickrImages>();

string apikey = "ac08d85f818cfc0ede0046a2e1238076";

Flickr flickr = new Flickr(apikey);

PhotoSearchOptions searchOptions = new

PhotoSearchOptions();

searchOptions.Extras |= PhotoSearchExtras.Geo;

searchOptions.Tags = query;

searchOptions.Page = page;

searchOptions.PerPage = 25;

Photos microsoftPhotos =

flickr.PhotosSearch(searchOptions);


PhotoCollection allPhotos =

microsoftPhotos.PhotoCollection;

foreach (Photo photo in allPhotos)

{

result.Add(new

FlickrImages(photo.ThumbnailUrl,photo.MediumUrl,photo.Tit

le, photo.WebUrl, photo.Longitude, photo.Latitude));

}


}

This funcion is using the FlickrNet framework to communicate with the Flickr

API. This framework allows us to specify a series of extra information we want to

ghet with each picture, besides URL, like geographic coordinates, the fact that the

result will be paginated and that each page will contain 25 pictures.

3.2.5 Vimeo

Vimeo is a web application that wants to alow people to share creative videos made

by themselves. You can see very interesting videos on Vimeo.

The web service exposes the following method that returns Vimeo films:

[WebMethod]

public VimeoVideos[] GetVimeoVideos(string expression)

{

string query = SearchPhrase(expression).Trim().Replace("

OR","");

string[] searchTokens = query.Split(' ');

List<VimeoVideos> result = new List<VimeoVideos>();

List<Video> lstVideos =

Vimeo.ReturnVideos(searchTokens);

foreach (Video aVideo in lstVideos)

{

result.Add(new

VimeoVideos(aVideo.sVideoURL,aVideo.sOwnerLocation,aVideo

.sVideoTitle));

}


}

The particularity of vimeo, compared to all the other 3 APIs, is that its API doesn’t

allow regular expresion of any kind. The solution is to ask the result for a list of

tokens witch in turn will mean interogating the Vimeo API for each item separatly.

This is a very slow solution so we didn’t use the vimeo in the client but rather used

Twet 11

YouTube which also returns films but its API accepts regular expresions so the

interogatin si easier and faster.

public static List<Video> ReturnVideos(string[] sTag)

{

List<Video> lstVideos = RequestVideos(sTag);

foreach (Video aVideo in lstVideos)

{

GetVideoUrl(aVideo);

GetVideoOwnerLocation(aVideo);

}

return lstVideos;

}

This is the Vimeo.ReturnVideos method. Here we see better the fact

that if we want to obtain a satisfying result we need to make multiple calls to the

Vimeo API, but not only that, we need to do a series of coplicated operation to obtain

all the information required to do a complete API call.

3.2.6 YouTube

YouTube is a web streaming application that alows users to share movies with othe

people. The main differes between YouTube and Vimeo is that the last of them

focuses more on the creativity, but the first is more famous. In fact it is more popular

than television.

The web services’ YouTube interogation method is this.

[WebMethod]

public YouTubeVideo[] GetYouTubeVideos(string

expression,int page)

{

string query =

SearchPhrase(expression).Trim().Replace("OR ", " ");

return code.YouTube.Search(query,page);

}

Here we remove the “OR ” particle from the WordNet obtained phrase and replace

it with a white space. Then we will pass this new phrase to te YouTube.Search

method whici will yeld the result.

public static YouTubeVideo[] Search(string expression,int

page)

{


var scrubbed = HttpUtility.UrlEncode(expression);

string url = "http://gdata.youtube.com/feeds/videos?start-

index=" + (page*25+1).ToString() +"&max-results=25&q=" +

scrubbed;

XmlDocument document = null;

HttpWebRequest request =

(HttpWebRequest)WebRequest.Create(url);

using (HttpWebResponse response =

(HttpWebResponse)request.GetResponse())

{

using (Stream responseStream =

response.GetResponseStream())

{

document = new XmlDocument();

document.Load(responseStream);

}

}

if (document == null)

return null;

result.Clear();

parseMe(document.ChildNodes);


}

In this function we see something interesting. The YouTube API is called using

HttpWebReques a simplistic yet flexible method. The Flickr class still used web

request but it was trasparent to the final user.

3.2.7 Web Service

The web service serializes the information into xmls and sends it to the user using a

specific protocol.

Using the ASP.NET page we can manualy test the web service and see the form of

the result.

Here we have a fragmeng from the interogation of the Tweeter API with the key

word “lion.

<ArrayOfTwetterMessage> <TwetterMessage> <Author>superguts (Superguts)</Author> <Message> http://bit.ly/dkQdtg Huffpost - OBAMA Goes into Lion's Den and Mauls the Lions

Twet 13

</Message> <Image_uri> http://a3.twimg.com/profile_images/320055989/Copy_o

f_PB010004b_normal.jpg </Image_uri> </TwetterMessage> <TwetterMessage> <Author>fobsicle (Esai)</Author> <Message> @crimsonexe already watched Lion King on Thursday,

but def gonna put Toy Story on my list!! :D </Message> <Image_uri> http://a1.twimg.com/profile_images/528868912/shiri_

normal.jpg </Image_uri> </TwetterMessage> </ArrayOfTwetterMessage>

3.3 Client

Besides the usability map presented in the Interface part of this paper the client has

three interesting code parts.

But first we will present a Class Diagram that shows us the fact that te client has

copied the web service class on his own program.


3.3.1 Embeded YouTube video

When a user select a youtube video from the list a new window containig the

youtub player loaded with the current movie is created. The player is fully functional.

To make this thing possible the folowing c# conbinet with javascrpt snipet was used:

HtmlPage.Window.Invoke("showMovie",

Api.YouTubeVideo)((sender as ListBox).SelectedItem)).Embeded

);

3.3.2 Displaying the flicker images on Bing Live Maps.

Being a Microsoft projects Bing maps are well integrated into .NET framework.

Here we have a piece of code from the function that puts the pictures on the map:

MapLayer myLayer = null;

if (FlickerPageIndex == 1)

{

myLayer = new MapLayer();

sr.FlickrResult.Clear();

}

else

{try

{

myLayer = (MapLayer)map.Children[0];

} catch (Exception){}

}

foreach (Api.FlickrImages item in e.Result)

{

sr.FlickrResult.Add(item);

Image image = new Image();

image.Source = new BitmapImage(new Uri(item.ThumbUrl));

image.Opacity = 0.8;

image.Stretch = Stretch.None;

Location location;

if (item.Latitude == 0 && item.Longitude == 0)

{}

else

{

location = new Location() { Latitude =

(double)item.Latitude, Longitude = (double)item.Longitude };

myLayer.AddChild(image, location);

}

}

Twet 15

3.3.3 Panel animation

When the Live Map button is pressed the main panel turs 180 degrees from right to

left exposing the other face, eithe the one with the search results or the one with the

live map. <Storyboard x:Name="RotateAnimation">

<DoubleAnimationUsingKeyFrames BeginTime="00:00:00"

Storyboard.TargetName="ForListGrid"

Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.Rotat

ionY)">

<EasingDoubleKeyFrame KeyTime="00:00:00" Value="0"/>

<EasingDoubleKeyFrame KeyTime="00:00:00.7000000" Value="180">

<EasingDoubleKeyFrame.EasingFunction>

<CubicEase EasingMode="EaseInOut"/>

</EasingDoubleKeyFrame.EasingFunction>

</EasingDoubleKeyFrame>

</DoubleAnimationUsingKeyFrames>


Storyboard.TargetName="ForGoogleEarthGrid"


ionY)">

<EasingDoubleKeyFrame KeyTime="00:00:00" Value="0"/>







</Storyboard>

<Storyboard x:Name="BackRotateAnimation">


Storyboard.TargetName="ForGoogleEarthGrid"


ionY)">

<EasingDoubleKeyFrame KeyTime="00:00:00" Value="180">












Storyboard.TargetName="ForListGrid"


ionY)">

<EasingDoubleKeyFrame KeyTime="00:00:00" Value="180">












</Storyboard>

4 Conclusion and development

A mashup application is very useful because it gives rapid acces to multiple

platforms allowing someone to find quick infomation. The .Net platform give us the

posibility to develop an aplication without having to learn a new programing language

or to be forcet to learn the APIs that we used in a deep sense.

As a further development task for this application we willl mention the integration

of other online ontology in order to enlarge the search results area. The utilisation of

ontologies will allow the application to search and analise word from other languages

besides english.

Twet 17

5 Bibliography

Silverlight Bing Maps, www.bing.com/maps/explore

WordNet.NET, http://opensource.ebswift.com/WordNet.Net/

Bing Maps Silverlight Control SDK

http://www.microsoft.com/downloads/details.aspx?&FamilyID=beb29d27-6f0c-494f-

b028-1e0e3187e830

http://www.bing.com/maps/explore

http://opensource.ebswift.com/WordNet.Net/

http://www.microsoft.com/downloads/details.aspx?&FamilyID=beb29d27-6f0c-494f-b028-1e0e3187e830

http://www.microsoft.com/downloads/details.aspx?&FamilyID=beb29d27-6f0c-494f-b028-1e0e3187e830

Education

Twet Application