WTT_AlotOfThought _ WebSiteContainsAlotOfSaudiandAlotOfSearchMashups | Application Programming Interface | Web Service


Author name – …………………………………….
King Saud University – IT department KSA – Riyadh email: ......................................

When internet users want to know about Saudi Arabia places, topics, or watching images and videos belongs to Saudi Arabia it well make they waste a lot of time searching in many sites to find what they looking for. A mash-up demo web site it is developed to serve this purpose. It is a set of two web pages. The first page is a mash-up that let the user to search Google, Flickr and Youtube in the same page. The second one is a mash-up of plotting markers on Saudi Arabia map to show the main Saudi’s cities for example, Makka. Also it contains information about the main places of Saudi Arabia. This project was named AlotOfThought. It contains two web pages. The first one is AlotOfSearch and the second AlotOfSaudi. The poster begins with a description of the mashups and how to create mashups. Then it represents the goal of creating AlotOfSearch and AlotOfSaudi mashups. Next, it describes the methodology of creating these mashups. Finally, it represents the results of these mashups. Keywords Search, Saudi, mash-up, Saudi map, demo, a lot of search, a lot of Saudi, Saudi Arabia

Mashups are inspiring a new generation of technology enthusiasts and programmers. Mashups enable experienced web ability programmers to integrate with the giants of the web 2.0 space . As the name implies, mashups mix and mash the programming interface from different web services to create new products and services [1]. AlotOfThought is a website contains two mashups web pages AlotOfSearch and AlotOfSaudi. It is to serve internet users to access these mashups. The idea of creating AlotOfSearch is to have a web search, image search and video search in the same page that require only one click. It is a mash-up that let the user to search Google, Flickr and Youtube in the same page. The characteristic of this mashup is combination. On the other hand, AlotOfSaudi is about displaying a Saudi map with more information about Saudi places. It is a visualization mash-up of plotting markers on Saudi Arabia map to show the main Saudi’s cities. Also it contains information about the main places of Saudi Arabia. I used Microsoft Popfly mashup editor to create these mashups. In the next section I present a brief concepts about mashups. In the third section, I present the objective of creating these mashups. After that, I explain my methodology of creating my mashups. Then, I present the results of my mashups . Finally, The conclusion of this poster.

A mashup combine content or data from different web sites into new applications. Wikipedia defines a mashup as "a web application that combines data from more than one source into a single integrated tool" [2]. Mashups have three characteristics combination, visualization and aggregation.

Figure 1: Mashups can be created using APIs from competing companies [4].

Creating mashups usually requires significant web development experience, as programmers must write source code in a programming language such as Java or C# to access APIs and web services from the various content providers, and then write the connecting software (the mashup “engine” or middleware) to “mash up” the data from the chosen applications. The mashup engine, such as Microsoft Popfly, is the middleware that is responsible for connecting the data sources to create the mashup, and then send back the results over the Internet to the user’s web browser so that the user can view or interact with them. One of the reasons why it is possible to combine data from different sources is because most of these services provide data in a standard XML-based format which can be easily transferred over the Internet. Content for mashups often comes from standard XML-formatted data that contains information about a series of specific items. Software developers might also make use of a content provider’s application programming interfaces (APIs) when creating mashup applications. Many organizations provide APIs that allow developers to access their data [3].

● ●

The main goal of creating AlotOfSearch mashup is to easily search web, image and video in the same page with only one click. The main goal of creating AlotOfSaudi mashup is to easily found the information about Saudi Arabia on the Saudi map.

Popfly mashups editor is a tool that lets users fit together pre-built blocks in order to mash together different web services and visualization tools [2]. It uses constructs called blocks to obtain, process, or display data [4]. You can consider of blocks in two sides. One side is to consider of them is as a component which provides some functionality. Blocks usually provide one or more of three types of functionality. Blocks that let you display stuff, blocks that wrap around a web site and let you access data from that site and blocks which do some sort of transformation on their input . Of course, there are a lot of blocks which don't fall into this categorization. Another side is to consider of them is as JavaScript code [5]. Web APIs usually consist of REST or SOAP web services that deliver XML or JSON. Scripting languages play an important role in mashup development as they often serve as the “glue” that connects data sources and UI components. [6]

The following is the steps of creating AlotOfSearch. Step one: collect data sources: As above, content used in mashups is obtained from a third party source via a public interface or API (web services) [2]. AlotOfSearch data sources are obtained from Google search API, Youtube API, and Flickr API. Popfly uses JavaScript to invoke the different methods from the Google search API, also Youtube and Flickr APIs

Figure 2: JavaScript code from Flickr block.

Step tow: make a mashup: After collecting the data source, which is in Popfly drag-drop blocks. the blocks by themselves aren't that powerful When we put these blocks together, we create what we call 'mashups', that’s why it must to connect these blocks together to make a mashup. The data being mashed are photo, video and web search results. It simply connect user input blocks ,that has getText operation to retrieves text typed in by the user, once the button is clicked, with all the other blocks. Now, we create alotofsearch mashup!.

The steps to create “alotofsearch” mashups using popfly mashup creator: 1. Create a new mashup in Popfly. 2. Drag a user input block, google search block, Flickr block and Youtube block to the design area. 3. Connect the user input block to all other blocks. 4. Drag carousel block then connect Flickr with carousel block. 5. Preview the mash up.

The following is the Steps of creating AlotOfSaudi. Step one: collecting data sources: AlotOfSaudi is about display a map and add information to it, so the first blocks to drag is Virtual earth to display the map. Virtual earth block has addpushpin operation to Adds a push pin to the map based on latitude and longitude. A latitude and longitude value comes from another block that is connecting with virtual earth block.

Figure 3: Virtual Earth block information.

Then, we drag a wikipedia block to add information about Saudi Arabia. A Wikipedia block has geoSearch operation that returns geo-tagged wikipedia entries found for the search term. The search term value was edited by me. Step tow: make a mashup: The second step is about connecting the blocks together to make a mashup. By connecting the wikipedia block with virtual earth block, we add wikipedia entries to virtual earth map. We have now a map with information on it! Because the information must be about Saudi Arabia, that’s why the search term value is Saudi Arabia.

Figure 4: Connecting Wikipedia block with virtual earth.

The steps to create “alotofsaudi” mashups using popfly mashup creator: 1.Create a new mashup in Popfly. 2. Drag a Virtual Earth block and Wikipedia block to the design area. 3. Connect the wikipedia block to virtual earth block. 4. Preview the mash up.

When starting to do a search using AlotOfSearch mashup you will find a text box to enter your search term then clicking the search button. The result becomes images, web search results and videos respectively. As example I use the Saudi Arabia search term to test AlotOfSearch mashup.

Figure 5: Images search results from Flickr.

Figure 6: Web search results from Google.

Figure 7: Video search result from Youtube.

5.2 AlotOfSaudi
On loading AlotOfSaudi mashup, it displays virtual earth map with pushpin which display on mouse hover a balloon that contain information from Wikipedia. Because the search term is about Saudi Arabia the most result is associated with Saudi Arabia map. As this figure shows Mecca city information on Saudi map.

Figure 8: Mecca city information on Saudi map.

Figure 9: Virtual Earth map has to way to view a map road or aerial view. Here switching to the road view.

The most benefit of creating mashups is to develop a new application from web services (APIs). AlotOfThought website contains two mashups. AlotOfSearch mashup provide many search results images, web search results and videos after typing the term of search then clicking to make a search. AlotOfSaudi mashup is about displaying information about Saudi Arabia on the map. My projects created by using Microsoft Popfly mashup editor which is a set of online visual tools for building mashups. AlotOfThought website is available over the internet at http://alotofthought.co.cc/.

[1]Foundations of Popfly: Rapid Mashup Development, By Eric Griffin, Published by Apress (2008), ISBN 1590599519, 9781590599518, 194 pages. [2]Mashup(web application hybrid, Wikipedia) http://en.wikipedia.org/wiki/Mashup_(web_application_hybrid) [3] Frydenberg, M. (2008), Earthquake Maps and Spinning Photos: What is a Mashup?, Computer Information Systems Department Bentley College, Waltham, MA. [4] Frydenberg, M. (2008), Getting Started with the Popfly Mashup Creator: Coming Soon to a Theater Near You, Computer Information Systems Department Bentley College, Waltham, MA. [5] the official Microsoft Popfly overview page http://www.popfly.com/Overview/Default.aspx [6] Bizer C, Cyganiak R, and Gaub T (2007). The RDF Book Mashup: From Web APIs to a Web of Data. Freie Universitat Berlin.

Sign up to vote on this title
UsefulNot useful