19.08.2013 Views

Vmoox: Cross-platform Video Publishing Solution ... - pace university

Vmoox: Cross-platform Video Publishing Solution ... - pace university

Vmoox: Cross-platform Video Publishing Solution ... - pace university

SHOW MORE
SHOW LESS

Create successful ePaper yourself

Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.

<strong>Vmoox</strong><br />

cross-<strong>platform</strong> video publishing solution for<br />

mobile devices<br />

A Thesis Presented to the Faculty of<br />

the Department of Computer Science<br />

Pace University<br />

In Partial Fulfillment<br />

of the Requirements for the Degree of<br />

Master of Science<br />

in<br />

Software Development and Engineering<br />

by<br />

Lior D. Shefer<br />

October, 2009<br />

Under the Direction of<br />

Professor Francis Marchese<br />

- 2 -


Table Of Content<br />

Table Of Content 3<br />

List Of Figures 6<br />

I. Introduction 7<br />

1. No Longer Science Fiction – Ubiquitous Computing And The Smart<br />

Phone Explosion.<br />

2. All Hail The King - The Rise Of The iPhone 9<br />

3. Watch It Online – <strong>Video</strong> On The Internet 9<br />

4. It's Not Me, It's You – The Flash Problem 10<br />

II. H.264/AVC Smartphone Support 12<br />

III. FFmpeg/libavcodec 14<br />

IV. Software as a Service (SaaS) 15<br />

V. XStream 16<br />

VI. <strong>Vmoox</strong> Requirements 17<br />

1. Publisher Service Interface 17<br />

a. Account Setup 17<br />

b. Content Input 17<br />

c. Pre-Roll Content Input 17<br />

d. Content Update 18<br />

e. Thumbnail Creation 18<br />

f. Customize Smart Phone Web or Native Application 18<br />

2. Transcoder 19<br />

a. Initial Transcode 19<br />

b. Requested Transcode 19<br />

3. <strong>Video</strong> Encoding Decision Algorithm (VEDA) 19<br />

a. Fully Transcoded <strong>Video</strong>s 20<br />

b. Partially Transcoded <strong>Video</strong>s 20<br />

4. Database 20<br />

a. Original Content Files 20<br />

b. Meta-Data (including thumbnails) 20<br />

c. Fully Transcoded <strong>Video</strong> Files 20<br />

d. Partially Transcoded <strong>Video</strong> Files 20<br />

e. Pre-Roll Content 20<br />

- 3 -<br />

8


5. Web Service/ API 21<br />

a. Featured <strong>Video</strong> List 21<br />

b. <strong>Video</strong> Playlist 21<br />

c. Search List 21<br />

6. Ad Engine 21<br />

7. Front End Application (native and/or web based) 21<br />

a. Featured View 22<br />

b. <strong>Video</strong> View 22<br />

c. Play View 22<br />

8. Loosely Coupled Modular Architecture 22<br />

VII. <strong>Vmoox</strong> Design 23<br />

1. <strong>Vmoox</strong> Design Overview 23<br />

2. VPSI - Design 26<br />

3. Transcoder - Design 28<br />

a. Initial Transcode 28<br />

b. Requested Transcode 28<br />

4. <strong>Video</strong> Encoding Decision Algorithm (VEDA) 29<br />

5. <strong>Vmoox</strong> Database - Design 31<br />

6. <strong>Vmoox</strong> Web Service / API - Design 33<br />

7. Ad Engine - Design 35<br />

8. Front End Application - Design 36<br />

VIII. <strong>Vmoox</strong> Implementation 39<br />

1. <strong>Vmoox</strong> Implementation Overview 39<br />

2. VPSI - Implementaion 39<br />

a. The Model Objects 39<br />

b. Publisher Service 42<br />

c. Downloader 43<br />

3. Transcoder - Implementation 45<br />

a. Transcoding Using FFmpeg 46<br />

4. VEDA - Implementation 49<br />

5. Database - Implementation 51<br />

a. <strong>Video</strong> 51<br />

- 4 -


. H264 51<br />

c. Ad 52<br />

6. <strong>Vmoox</strong> Web Service 55<br />

Id<br />

a. Implementing Get Network <strong>Video</strong>s Service 56<br />

b. Implementing Get List of <strong>Video</strong>s Media URLs for a Given <strong>Video</strong><br />

c. Ad Serving 59<br />

7. iPhone Native and Web App 60<br />

a. Web Based App 60<br />

i. The Model 60<br />

ii. The Controller 61<br />

iii. The View 62<br />

IX. Summary and Future Work 69<br />

X. References 70<br />

- 5 -<br />

59


List of Figures<br />

Figure 1: Pre-iPhone: BellSouth/IBM Simon Personal Communicator<br />

(1993)<br />

Figure 2: H.264 Wide Range of Implementations. 11<br />

Figure 3: Top US Smartphones Web Traffic. 12<br />

Figure 4: Supported Formats of Popular Smart Phones in the US 12<br />

Figure 5: Typical Publisher Implementation. 24<br />

Figure 6: A Sample XML Submitted by Client Including Content Meta-<br />

Data<br />

Figure 7: ! ! ! ! ! !Transcoder - Initial Transcoding Overview 27<br />

Figure 8: Transcoder - Real Time Transcoding Overview 28<br />

Figure 9: Services VEDA Provides to VPSI 29<br />

Figure 10: VEDA Chapter Name Creation 29<br />

Figure 11: Services VEDA Provides to <strong>Vmoox</strong> Web Service 30<br />

Figure 12: Services <strong>Vmoox</strong> Web Service Provides to the iPhone App 33<br />

Figure 13: <strong>Vmoox</strong> Web Service JSON Formatted Response to a Get<br />

<strong>Video</strong>s’ Media URLs Request, With an “ads” Array<br />

Figure 14: MVC Design Pattern 35<br />

Figure 15: <strong>Vmoox</strong> Controller 36<br />

Figure 16: <strong>Video</strong> Object UML 39<br />

Figure 17: <strong>Video</strong> Chapter Object UML 40<br />

Figure 18: Ad Object UML 40<br />

Figure 19: VPSI UML 41<br />

Figure 20: Transformation Class Services 44<br />

Figure 21: <strong>Vmoox</strong> DB(s) Overview 52<br />

Figure 22: Featured <strong>Video</strong>s View 62<br />

Figure 23: <strong>Video</strong> View 65<br />

Figure 24: A <strong>Video</strong> is Being Played by the iPhone Native Media Player 67<br />

- 6 -<br />

7<br />

22<br />

34


I. Introduction<br />

This thesis introduces <strong>Vmoox</strong> [1] - a cross-<strong>platform</strong> video publishing solution for<br />

mobile devices. It will detail the need, timeliness and profit potential of a real-time<br />

video transcoding solution for mobile devices as well as the suggested<br />

implementation. While this model is intended for use in all smart phones, the<br />

current prototype implementation is for the iPhone. This implementation can be<br />

modified to fit other and future smart phones.<br />

1. No Longer Science Fiction – Ubiquitous Computing And The<br />

Smart Phone Explosion<br />

The term Ubiquitous Computing has been growing in popularity in recent years,<br />

as has the phenomena it attempts to describe. Simply put, this means that<br />

computers are everywhere. More than ever before, computers have ceased to<br />

stand alone as “computing devices” but rather, have been integrated into<br />

everyday items to help them become “smarter”. We now use computers in our<br />

offices, homes, stores, cars, banks, hospitals, kitchens and gyms. From washing<br />

machines to coffee makers, to car alarms to defibrillators; like it or not, it is hard<br />

to deny that computers have made their way into nearly every aspect and activity<br />

of our modern lives.<br />

Similarly, the Internet, which 30 [2] years ago seemed to most of us the stuff of<br />

science fiction, has become an inseparable part of our lives and culture. As a<br />

society, especially in the United States, we have come to expect and rely a great<br />

deal on both computers and the Internet. Perhaps the greatest manifestation of<br />

this phenomenon is the smart phone explosion.<br />

IBM introduced the first smart phone in 1993 [3]. Its then revolutionary features<br />

included games, a pager, send and receive fax capabilities, a calculator and a<br />

notepad. Costing around $900 [4], this was a gadget that was far from<br />

ubiquitous. But it was the beginning of a trend that would change the way we<br />

access and use information.<br />

- 7 -


Figure 1: Pre-iPhone: BellSouth/IBM Simon Personal Communicator (1993)<br />

In 2001, RIM introduced the first Blackberry - a device optimized for wireless<br />

email use. By June 2007 over 8 million people were hooked. In the 8 years since<br />

Blackberries came on to the scene, we have witnessed incredible advances in<br />

both the number and functions of smart phones. Today, the vast majority of<br />

cellular phones are not just phones. A recent survey showed that around the<br />

world, one out of ten phones is a smart phone [5], a number that is expected to<br />

double by 2013 [6]. Smart phones have changed the way we access and use<br />

information in a drastic way. They have become all-in-one devices that we rely<br />

on for a great deal of information, accessible at all times. Email servers, clocks<br />

and calendars, maps and navigation software, photo and movie cameras, video<br />

games, music players and calculators are just a few of the features that now<br />

come standard in every smart phone. Many of these features rely on the Internet<br />

to function. It’s the Internet that tells the calendar feature what day and time it is<br />

if, lets say, your phone’s battery died last night at 3 am. When your Blackberry<br />

buzzes with a new email, it’s because your phone connected to the Internet and<br />

retrieved that email from your email server. Until recently, smart phones relied on<br />

the Internet for purely ‘behind the scenes’ assistance. Until the iPhone changed<br />

everything.<br />

2. All Hail The King – The Rise Of The iPhone<br />

Within the smart phone revolution, one major player is widely acknowledged as a<br />

game changer – the iPhone. While the Blackberry allowed users to access email<br />

on their cell phone, the iPhone brought the Internet in all its glory into the palm of<br />

our hand. In no small part thanks to Apple’s signature user-friendly design and<br />

aggressive marketing, the iPhone turned the smart phone from a tech-y solution<br />

for workaholics, into the must-have gadget for everyone.<br />

- 8 -


But behind what is, depending on your point of view, either brilliant design or<br />

overrated hype was the true technological revolution of the iPhone – the Internet<br />

was no longer a background player. It was front and center, just as we were used<br />

to seeing it on our desktop computers. On the iPhone, our maps look like the<br />

maps we are used to using when looking up directions to our favorite restaurant;<br />

we can watch our favorite you Tube videos, check the weather and Google just<br />

like we’re used to. The iPhone was no longer a phone with extra capabilities - it<br />

was the Internet, in the palm of your hand.<br />

Besides being a miniature version of our desktop computers (with a phone and<br />

music player built in) the iPhone changed our technological landscape by<br />

copying the Internet not only in form but also in concept, it was a device<br />

specifically designed for growth and the sharing of information. The iPhone’s true<br />

genius lies in its 'apps'. With over 25,000 different downloadable applications and<br />

more than 800 million downloads [7], the AppStore allows the community of<br />

users to continuously devise and implement new functions for the iPhone.<br />

But for all its brilliance, the iPhone (along with its smart-phone counterparts) has<br />

hit a major stumbling block as it intersects with the other major Internet revolution<br />

of recent years – video content.<br />

3. Watch It Online – <strong>Video</strong> On The Internet<br />

In recent years, online video content has skyrocketed. As of November of 2008,<br />

Americans spent 12.5 percent of their time online viewing videos [8], watching<br />

over 14 billion clips a month [9]. You Tube’s ‘most watched’ clip has more than<br />

123 million views [10] compared to 2008’s record setting Super Bowl which<br />

managed a ‘modest’ audience of 97.5 million [11]. Fifty-seven percent of all<br />

Americans now have high-speed Internet access at home, a number that is<br />

expected to rise to ninety percent by 2012 [12]. With Americans increasingly<br />

connected to an ever more powerful network, it seems that the appetite for online<br />

video will continue to grow in the coming years. And there is certainly no<br />

shortage of content producers and owners willing and able to satisfy that<br />

appetite. From major television networks to bloggers with a webcam, video is<br />

being uploaded almost as fast as it can be consumed.<br />

It is only natural, therefore, that the mobile computing and online video<br />

revolutions intersect. Just as people have come to expect their Internet in the<br />

palm of their hand, they want to be able to use it in the same way they use their<br />

desktop browser. But, in the video market, mobile devices still have a long way to<br />

go. And the major hurdle they face at the moment is Flash.<br />

- 9 -


4. It's Not Me, It's You – The Flash Problem<br />

Flash has become an online video favorite mainly due to its high-quality/low<br />

bitrate (small file size) capabilities. As a result, nearly ninety-nine percent of<br />

users are now able to view Flash files, which in turn leads most of the newly<br />

created online video content to be predominantly flash-based [13][14].<br />

Due to the nature of mobile devices, where power consumption is a major factor<br />

[15], Flash enabled video files, are not supported. The iPhone, for example,<br />

supports video playing in H.264/AVC [16] format, an alternative to Flash which is<br />

not nearly as popular (yet!).<br />

Several solutions are currently available which attempt to address this<br />

incompatibility problem. Sorenson Media’s Sorenson 360 <strong>Video</strong> Delivery Network<br />

provides users the ability to convert any media into an H.264/AVC video format<br />

[17] and publish on their sites.Sorenson 360 also provides additional features like<br />

management and reports that help users track and analyze their users' video<br />

consumption. However, Sorenson 360 is an offline solution i.e., users first need<br />

to upload their videos and perform the transcoding themselves. When dealing<br />

with a large amount of media that is constantly being changed and updated, this<br />

solution is overly cumbersome and without the ability to automate becomes<br />

unfeasible to most large-scale web publishers.<br />

Encoding.com also provides a video encoding <strong>platform</strong>. Customers send in their<br />

source content in any popular format, and receive encoded media at a location of<br />

their choice, in the format of their choice [18]. However, Encoding.com is also an<br />

offline solution, users need to request a transcoding action and manage the new<br />

iPhone enabled video themselves. One advantage Encoding.com has over<br />

Sorenson 360 is that Encoding.com provides the option to automate portions of<br />

the process by offering an API to their services.<br />

Despite their usefulness for certain purposes, these solutions and others like<br />

them currently being offered, are not optimal for large-scale video publishers, like<br />

television networks or online video sites. They require manual management of<br />

files which is both time consuming and costly. In order to fully address the Flash<br />

compatibility problem, these publishers need a cost-effective, fully automated<br />

solution, which can operate in real time and convert large amounts of video in a<br />

relatively short amount of time. <strong>Vmoox</strong> aims to offer this sort of solution - a realtime,<br />

cost effective conversion tool to bridge the format gap between flash video<br />

content on the web and mobile devices.<br />

<strong>Vmoox</strong> uses a SaaS [19] (Software as a Service) model in which publishers pay<br />

- 10 -


per conversion. This allows both small and large publishers to use the<br />

transcoding services in a cost-effective manner. Alternately, a publisher who<br />

anticipates very large volumes of transcoding could purchase the software at a<br />

flat rate. Another way in which the <strong>Vmoox</strong> solution helps publishers keep costs<br />

low is by allowing them to keep their existing Flash-based infrastructure in place.<br />

Publishers can keep their web-services the same (Flash-based) while reaching<br />

new audiences in the smart phone market.<br />

The <strong>Vmoox</strong> system offers a full service solution - from real time transcoding of<br />

video content through thumbnail generation all the way to a customized smart<br />

phone app.<br />

Publishers will submit their video meta-data content to the <strong>Vmoox</strong> system. This<br />

content will include information about the video such as the title, description,<br />

duration and a link to the original video file. <strong>Vmoox</strong> will then run an offline<br />

process adding those videos to its database and transcoding the first 3 minutes<br />

of each clip. Publishers will receive a customized smart phone application, which<br />

they can distribute to their users. For the publisher, this is a simple, one-step<br />

process which makes it both time and cost effective.<br />

Another one of the main advantages of <strong>Vmoox</strong> is the ability to decide in real time<br />

if transcoding is needed. Many publishers offer a very large amount of content,<br />

not all of which is accessed equally frequently. The <strong>Vmoox</strong> system offers a<br />

'smart' solution, which avoids wasted server s<strong>pace</strong> and computation resources<br />

by only performing a full transcode on files which are actually viewed. As<br />

mentioned above, the system initially transcodes only the first 3 minutes of each<br />

clip. The remainder of the clip will begin its transcode as soon as the file is<br />

accessed by a user, the initially transcoded 3 minutes providing the buffer with<br />

which to avoid any wait time on the user-end. Simply put, while the user watches<br />

the first 3 minutes of the clip, the rest of the clip is transcoding in the background.<br />

Although this duration is configurable, 3 minutes is the recommended setting as<br />

this allows enough time for the transcoding process to stay ahead of the user.<br />

<strong>Vmoox</strong> video encoding decision algorithm (VEDA) will decide if and when a<br />

video needs to be encoded. More on information on VEDA, developed<br />

specifically for <strong>Vmoox</strong>, is provided in section VII2.<br />

Research has shown that the average duration of video consumption on mobile<br />

device is 3.2 minutes [13]. Future versions of <strong>Vmoox</strong> and VEDA will include a<br />

feature which will stop the transcoding (even if it has not finished) if the user has<br />

stopped watching the clip, thus saving even more resources.<br />

- 11 -


II. H.264/AVC Smartphone Support<br />

Though <strong>Vmoox</strong> is designed as a multi-codec transcoding tool, the prototype<br />

application demonstrates conversion from Flash <strong>Video</strong> Files - the most popular<br />

internet video format - to H.264/AVC, an emerging codec supported by the<br />

majority of smart phones currently on the US market.<br />

H.264 is an open standard developed by ITU-T <strong>Video</strong> Coding Experts Group [20]<br />

[21]. In recent years, H.264 has become an industry standard in wide range of<br />

applications [22], from home DVR and TV services to mobile devices. Of note is<br />

also the fact that Apple has adopted the H.264 codec as a preferred codec and<br />

it's popular Quicktime application and all its plugins use it heavily[23].<br />

The main benefits of H.264 are:<br />

1. High quality, with relatively small file sizes (lower bit rates) – H.264 uses<br />

an advanced video compression technology that enables the creation of<br />

files with very high quality (comparable to MPEG-2 files), but up to half the<br />

data rate.<br />

2. Wide range of implementation opportunities – H.264 reaches great<br />

compressions effectiveness for a large range of application types.<br />

Figure 2: illustrates H.264 Wide Range of Implementations [23]<br />

Smartphones are gaining increasing shares in the handset market. A recent<br />

survey showed that around the world, one out of ten phones is a smart phone [5],<br />

and this dominace is growing each month. The major players in this market today<br />

include Apple’s iPhone, RIM’s Blackberry line, Palm’s Pre and HTC’s G1 with<br />

Google. All of these devices support playback of the H.264/AVC codec. Figure 3<br />

shows top US Smartphones web traffic according to a research by AdMob Mobile<br />

Metric - February 2009[23] .<br />

- 12 -


Figure 3: Top US Smartphones web traffic according to a research by AdMob<br />

Mobile Metric.<br />

Figure 4: Supported Formats of Popular Smart Phones in the US<br />

Device Supported Formats<br />

RIM BlackBerry Storm MPEG4 H.263, MPEG4 Part 2 Simple Profile, H.264,<br />

WMV [25].<br />

Apple iPhone H.264 video, up to 1.5 Mbps, 640 by 480 pixels, 30<br />

frames per second, Low-Complexity version of the<br />

H.264 Baseline Profile with AAC-LC audio up to 160<br />

Kbps, 48kHz, stereo audio in .m4v, .mp4, and .mov file<br />

formats; H.264 video, up to 2.5 Mbps, 640 by 480 pixels,<br />

30 frames per second, Baseline Profile up to Level 3.0<br />

with AAC-LC audio up to 160 Kbps, 48kHz, stereo audio<br />

in .m4v, .mp4, and .mov file formats; MPEG-4 video, up<br />

to 2.5 Mbps, 640 by 480 pixels, 30 frames per second,<br />

Simple Profile with AAC-LC audio up to 160 Kbps,<br />

48kHz, stereo audio in .m4v, .mp4, and .mov file formats<br />

[16]<br />

Google Android OS based on Packet<strong>Video</strong>'s OpenCORE; the libraries<br />

support playback and recording of many popular audio<br />

and video formats, as well as static image files, including<br />

MPEG4, H.264, MP3, AAC, AMR, JPG, and PNG [26].<br />

- 13 -


Palm Pre MPEG-4, H.263, H.264 [27].<br />

As demonstrated in the above data, all four major players in the smart phone<br />

market support the H.264 codec. In accordance with this market trend, <strong>Vmoox</strong><br />

will provide a solution based on the H.264/AVC format. As it's core technology,<br />

<strong>Vmoox</strong> will perform real time H.264/AVC video transcoding.<br />

III. FFmpeg/libavcodec<br />

Several of <strong>Vmoox</strong>'s key features will be implemented using the FFmpeg and<br />

Libavcodec tools.<br />

FFmpeg defines itself as “ a complete, cross-<strong>platform</strong> solution to record, convert<br />

and stream audio and video. It includes libavcodec - the leading audio/video<br />

codec library. [28]"<br />

Libavcodec is an open source free software licensed under LGPL that includes<br />

video decoders and encoders for a variety of video formats including flash video<br />

and H.264/AVC formats [29].<br />

FFmpeg based projects include among others, the popular VLC media player<br />

from <strong>Video</strong>Lan - which provides a cross-<strong>platform</strong> media player as well as a<br />

streaming solution [30] [31], and Perian, an open source plug-in to Apple’s<br />

QuickTime. Perian enables users to play a range of video formats that are not<br />

natively supported by QuickTime for example: FLV (i.e, flash video), Divx, 3ivx<br />

and much more [32].<br />

<strong>Vmoox</strong> will utilize FFmpeg and libavcodec to transcode flash video files to H.264/<br />

AVC, create thumbnails of video files, create chapters within the original video<br />

files and obtain information about the files themselves.<br />

IV. Software as a Service (SaaS)<br />

<strong>Vmoox</strong> will be designed and implemented using the Software as a Service<br />

(SaaS) model.<br />

SaaS is model in which users pay by "action", as opposed to a larger one-time<br />

- 14 -


licensing fee. This model is ideal for smaller or gradual users as it avoids the<br />

need to pay large sums in advance of future usage of the [33]. The main<br />

advantages of adopting SaaS model are [34] [35]:<br />

1. Centralized feature updating– SaaS providers can push new features and<br />

functionality easily. Since the software 'lives' with the creator and is<br />

accessed by the user, there are no updates to install and bugs can be<br />

addressed easily on the provider's side.<br />

2. Low-Risk – Customers can avoid the heavy costs and risks of<br />

implementing or paying high licensing fee for services that don't work for<br />

them. Because the business model of SaaS is an on-demand model i.e.,<br />

pay per user or pay per request customers can keep cost effective<br />

features and terminate other services.<br />

3. Fast Implementation – In most SaaS applications customers can easily<br />

sign up and start using the service. There is no need to install, deploy and<br />

configure any software.<br />

<strong>Vmoox</strong>'s SaaS model will function as follows:<br />

Publishers will sign an agreement with <strong>Vmoox</strong> that includes a one-time setup fee<br />

and receive a customized smart phone app (prototype version is an iPhone app),<br />

and then be charged per video - i.e. each new video added will incur a charge as<br />

will each access request from a user. Publishers anticipating a large amount of<br />

data will be able to pay a flat licensing rate to be determined by their expected<br />

usage.<br />

V. XStream<br />

<strong>Vmoox</strong> customers (publishers) will receive a smart phone app with which their<br />

users will be able to view their content. Communication between the smart phone<br />

application and the <strong>Vmoox</strong> server will be via the JSON format. The XStream will<br />

be used to serialize the Java objects coming from the <strong>Vmoox</strong> server (video and<br />

ad content) into the JSON format.<br />

Xstream is an open source library that serializes Java objects to XML and JSON<br />

and vise versa [36]. When designing a web service it is often required to<br />

- 15 -


implement several end-points to your services. For example: some clients will<br />

prefer to interact with the service’s data thru XML while other types of<br />

applications will prefer JSON or pure Java objects thru RPC or SOAP. XStream<br />

provides an abstraction layer on top of your business logic rules layer by<br />

separating business rules and presentation. This helps your web service design<br />

to be loosely coupled i.e., business rules are separated with the output<br />

presentation format such as XML, JSON or Java objects.<br />

The main advantages of Xstream are:<br />

1. Ease of use – Xstream provides an abstraction layer on top of object<br />

serialization. Common use-cases are easy to implement and use.<br />

2. No complicated object mapping - most objects can be serialized without<br />

need for specifying mappings.<br />

3. Performance – Xstream serelization is fast and low memory consumption<br />

is a cure requirement in the design and implementation of Xstream.<br />

<strong>Vmoox</strong>'s web service will utilize XStream in order to provide clients a JSON/<br />

JSONP RESTful [37] service. <strong>Vmoox</strong> web service will respond to a HTTP GET<br />

request and will generate java object using Hibernate [38]. XStream will then<br />

serialize these Java objects into JSONP and post it back to the Request.<br />

- 16 -


VI. <strong>Vmoox</strong> Requirements<br />

The goal of the <strong>Vmoox</strong> system is to enable web publishers to distribute their<br />

video content on mobile devices that don't support Flash. In order to do this,<br />

<strong>Vmoox</strong> will follow the "Software as a Service" (SaaS) model and implement the<br />

following requirements:<br />

1. Publisher Service Interface<br />

As part of the SaaS model, <strong>Vmoox</strong> will provide an interface where publishers can<br />

input original content. This will be the "entry point" of the content into the <strong>Vmoox</strong><br />

system and include the following features:<br />

(a) Account Setup<br />

This one-time process will generate an internal <strong>Vmoox</strong> Customer ID for the<br />

publisher. This Customer ID will identify the content provider (publisher) as well<br />

as the video’s meta-data in the <strong>Vmoox</strong> database(s). Once <strong>Vmoox</strong> provides the<br />

client with a Customer ID, they can start initializing the account.<br />

(b) Content Input<br />

As soon as a client has set up an account, they can begin inputing content into<br />

the <strong>Vmoox</strong> system. Publishers can choose to store content internally or<br />

externally. In an internal integration, the <strong>Vmoox</strong> service will "live" in the<br />

publisher's data center but information about the content will be stored in the<br />

<strong>Vmoox</strong> database. In an external integration content and information will "live" on<br />

the <strong>Vmoox</strong> server. Publishers will provide the location of the original content and<br />

the VPSI will import either the data or files and data into the <strong>Vmoox</strong> database and<br />

then pass the video on to the Transcoder for an initial transcode.<br />

(c) Pre-Roll Content Input<br />

Publishers will have the option to inject an advertisement (or any other content of<br />

thier choosing) into the pre-roll section of their video. In order to do this a<br />

publisher must input the pre-roll content into the <strong>Vmoox</strong> system and define it as<br />

such. Publishers must also define criteria for pairing Pre-Roll and primary<br />

content.<br />

- 17 -


(d) Content Update<br />

An existing client will be able to add or update content in the <strong>Vmoox</strong> system.<br />

(e) Thumbnail Creation<br />

When new content is input into the <strong>Vmoox</strong> system, the VPSI will create a<br />

thumbnail for each clip that will serve as the icon the user sees for the clip as part<br />

of the Front End Application. These thumbnails will also be stored in the <strong>Vmoox</strong><br />

(or client) database and linked to the appropriate video file.<br />

(f) Customize Smart Phone Web or Native Application<br />

As part of the initializing process, the publisher will define criteria for the<br />

customized smart phone application for the device(s) of their choosing. The<br />

publisher will be able to choose between a native app (specific to a particular<br />

device) or a web app (runs on the browser of any device but requires web<br />

browsing capabilities) or both. This information will be used to create the Front<br />

End Application which will be delivered to the publisher and can be distributed<br />

directly by the publisher or by a third party. The prototype implemented as part of<br />

this thesis is an iPhone app for CNN. More requirements related to the iPhone<br />

application will be described in section 5.<br />

- 18 -


2. Transcoder<br />

<strong>Vmoox</strong> will perform offline as well as real-time transcoding. The main<br />

functionality requirement of the <strong>Vmoox</strong> system is the ability to transform Flashbased<br />

video content to the H.264/AVC codec, which users can access directly on<br />

their smart-phones. The Transcoder will peform the following functions in the<br />

following instances:<br />

(a) Initial Transcode<br />

Any time a publisher inputs content into the <strong>Vmoox</strong> system, whether a new client<br />

performing an initial input or an existing client updating/ adding content, the<br />

Transcoder will transcode the first section of each clip. The length of the initial<br />

section should be a configurable variable (i.e., each publisher should be able to<br />

detrmine how long of a section they would like transcoded) but the default is 3<br />

minutes. This allows a user to begin watching a video with no wait/ load time<br />

while still optimizing storage/ server s<strong>pace</strong> by only transcoding fully those videos<br />

that have been requested.<br />

(b) Requested Transcode<br />

When a user requests a video for the first time via the Front-End App, the<br />

Transcoder will receive a request from VEDA (see below) to begin transcoding<br />

the remainder of the clip in 3 minute (or other duration determined by publisher)<br />

increments- called Chapters. Each Chapter will be named according to a list<br />

generated by VEDA.<br />

3. <strong>Video</strong> Encoding Decision Algorithm (VEDA)<br />

The <strong>Video</strong> Encoding Decision Algorithm (VEDA) plays a crucial role in the<br />

conservation of resources - a major advantage of the <strong>Vmoox</strong> system. VEDA<br />

recieves a request from a user via the Front End Application and Web Service/<br />

API and immediately determines whether a video is fully transcoded or needs to<br />

be transcoded. Based on that determination it routes the videos to the<br />

appropriate actions:<br />

- 19 -


(a) Fully Transcoded <strong>Video</strong>s<br />

<strong>Video</strong>s that have either been viewed once already or are up to 3 minutes in<br />

length are retrieved from the Database and delivered directly to the user via the<br />

Front End App.<br />

(b) Partially Transcoded <strong>Video</strong>s<br />

<strong>Video</strong>s that have never been viewed and are over 3 minutes in length are sent to<br />

the Transcoder. Asynchronously, VEDA assigns chapter names to each 3 minute<br />

(or other length as determined by the client) increment of the clip and sends a<br />

Playlist of chapters to the Front End Application and to the Transcoder. The<br />

result is that at the moment a user selects a video to view, the Front End<br />

Application begins playing a series of video chapters, only the first of which is an<br />

existing file (the rest are virtual) with no wait time on the user end. By the time<br />

the first chapter (3 minute section) has finished playing, and the Front End<br />

Application goes to retrieve the second section, the Transcoder has already<br />

finished creating it and it is no longer virtual, but actually exists and can be<br />

retrieved, and so on with all subsequent chapters.<br />

4. Database<br />

All content will be referenced in the <strong>Vmoox</strong> Database. There are essentially 5<br />

types of content:<br />

(a) Original Content Files<br />

Flash or other non-smart-phone compatible files coming directly from the<br />

publisher.<br />

(b) Meta-Data (including thumbnails)<br />

Information about a clip including: title, description, duration, keywords, publisher,<br />

thumbnail image.<br />

(c) Fully Transcoded <strong>Video</strong> Files<br />

A collection of 3-minute chapters making up the whole.<br />

(d) Partially Transcoded <strong>Video</strong> Files<br />

(e) Pre-Roll Content<br />

- 20 -


5. Web Service/ API<br />

The Web Service facilitates communication between the Front End Application<br />

and the Back End Components (VEDA, Transcoder, Database, Ad Engine)<br />

The Web Service will output JSON/JSONP data format, or XML and provide the<br />

following services, which correspond with the functions of the Front End App:<br />

(a) Featured <strong>Video</strong> List<br />

A list of the latest (or preferred) video content from the publisher. Criteria for<br />

inclusion in the Featured List can be determined by the publisher (i.e., newest or<br />

most popular videos). In the Featured List, the following will be provided for each<br />

video: thumbnail URL, title, duration, video ID and description.<br />

(b) <strong>Video</strong> Playlist<br />

Information about an individual clip including: thumbnail URL, title, duration,<br />

video ID and description; as well as a list of chapters (3 minute segments) and<br />

Pre-Roll content.<br />

(c) Search List<br />

A list of videos including the search term in thier meta-data. For each video the<br />

following will be provided: thumbnail URL, title, duration, video ID and<br />

description.<br />

6. Ad Engine<br />

This component pairs a publisher's Pre-Roll content with its Primary content<br />

based on criteria defined by the publisher. The Pre-Roll content will play before<br />

the primary content and the user will not be able to skip or fast-forward it. This<br />

component will also ensure that the same pre-roll ad does not repeat on the<br />

same user session, unless defined otherwise by the publisher.<br />

7. Front End Application (native and/or web based)<br />

A major component of <strong>Vmoox</strong> is the Front End Application. This is the means of<br />

delivery of the transcoded content to the smart-phone user. Publishers can<br />

customize the Front End Application in both appearance (to fit thier brand identity<br />

and traget audience) as well as functionality. Publishers can choose to create<br />

either a native smart-phone application (specific to a particular device) or a web<br />

application (runs on the browser of any device but requires browsing<br />

- 21 -


capabilities), or both.<br />

The basic template, which can be expanded or revised by the publisher, will<br />

include the following 3 modes, or Views:<br />

(a) Featured View<br />

The Featured View is the first view a user sees when launching the application.<br />

The Featured View includes the latest (or preferred) video content from the<br />

publisher. Criteria for inclusion in the Featured view can be determined by the<br />

publisher (i.e., newest or most popular videos). In the Featured View, the<br />

following should be displayed for each video: thumbnail, title, duration, and a link<br />

to the video view. The user selects a video and is taken to the <strong>Video</strong> View.<br />

(b) <strong>Video</strong> View<br />

After selecting a video from the list, users will be taken to the <strong>Video</strong> View - where<br />

the thumbnail and information for their selected video is displayed. Clicking on<br />

the video thumbnail (or adjacent button) initiates the video content - playing first<br />

any pre-roll content and then the actual video.<br />

(c) Play View<br />

In this view users watch first the pre-roll content as determined by the publisher,<br />

and then the actual video. There is no load or wait time on the user end. (See<br />

explanation in VEDA section)<br />

The prototype Front End Application will be a native iPhone application for CNN<br />

(sample publisher).<br />

8. Loosely Coupled Modular Architecture<br />

<strong>Vmoox</strong> will be designed as a loosely coupled collection of modules. Each of the<br />

above components will interact with each other through an API regardless of how<br />

each component is implemented.[39] This will improve maintainability and<br />

readability of the software [40] as well as open <strong>Vmoox</strong> to third-parties who may<br />

use <strong>Vmoox</strong> in combination with their own software applications.<br />

- 22 -


VII. <strong>Vmoox</strong> Design<br />

1. <strong>Vmoox</strong> Design Overview<br />

The goal of the <strong>Vmoox</strong> system is to provide a customizable, scalable video<br />

transcoding and publishing solution for web publishers. In order to accomplish<br />

this goal, <strong>Vmoox</strong> provides publishers with a generic yet powerful integration<br />

interface, a loosely coupled Trancoder and Encoding Decision Algorithm and a<br />

customizable Front End Application which can be integrated with the publisher's<br />

brand identity and functionality requirements.<br />

The <strong>Vmoox</strong> solution includes the following components:<br />

a. <strong>Vmoox</strong> Publisher Service Interface (VPSI) - provides the entry point for<br />

data from the publisher (video content and information). This component<br />

receives incoming content and data, classifies and routes it appropriately.<br />

b. Transcoder - recieves video content, transcodes it into the desired format<br />

and creates thumbnails for each clip which will be used to identify it in the<br />

Front End Application.<br />

c. VEDA (<strong>Video</strong> Encoding Decision Algorithm) - identifies whether videos<br />

have or have not been transcoded.<br />

d. Database - stores and classifies all data.<br />

e. Web Service/API - serves as a bridge between the front-end applications<br />

and the back-end components.<br />

f. Ad Engine - provides a pre-roll ad before video clip.<br />

g. Front End Application - enables users to consume publisher video<br />

content on a mobile device (native or web-based).<br />

The components interact with each other using a loosely coupled architecture<br />

model, where each component operates independently and communicates with<br />

the other components via an API.<br />

The typical flow of the <strong>Vmoox</strong> system (illustrated in Figure 5) is:<br />

1. A publisher sets up an account with <strong>Vmoox</strong> via the <strong>Vmoox</strong> Publisher Service<br />

Interface (VPSI); creates a user ID and password, defines criteria for Front End<br />

Application and Pre Roll content pairing and provides the location of content.<br />

Publisher recieves a customized Front End Application per specifications and<br />

distributes to users directly or via third-party (offline).<br />

- 23 -


2. VPSI retrieves content from the specified location, updates the <strong>Vmoox</strong> Database<br />

and sends videos to the Transcoder for initial transcoding.<br />

3. Transcoder recieves video content, performs an initial transcode (ie.<br />

transcodes the first three minutes of each clip), creates a thumbnail image for<br />

each clip.<br />

4. VPSI delivers initially transcoded materials and meta-data to Database.<br />

5. User activates Front End Application and selects a video for viewing.<br />

6. Front End Application sends request for video via the JSON/API Web Service<br />

7. VEDA recieves the request via the JSON/API Web Service and determines<br />

whether the requested clip has been transcoded or not.<br />

8a. If a clip has already been transcoded, VEDA sends the Front End Application<br />

a list of chapters (3-minute segments) that make up the clip to be retrieved from<br />

the Database and delivered to the user via the JSON/API Web Service.<br />

8b. If a clip has not yet been transcoded (first time viewed), VEDA will generate a<br />

(virtual) list of chapters (3-minute segments) based on the clip's length. VEDA will<br />

send this list to both the Front End Application and the Transcoder. Asynchronously,<br />

the Front End Application will begin playing the chapters in sequence and<br />

the Transcoder will create the chapters and deposit them in the Database. The<br />

result is that by the time the Front End Application attempts to retrieve a chapter<br />

file, it will have already been created. The initially transcoded first chapter provides<br />

the buffer which results in zero wait/load time on the user end. Chapter files<br />

will be deilvered to the user through the Front End Application via the JSON/API<br />

Web Service.<br />

9. As the first chapter of each clip is being retrieved, the Ad Engine will select an<br />

appropriate Pre-Roll content and deliver it to the Front End Application via the<br />

JSON/API Web Service to be played before the first chapter of the user selected<br />

primary content.<br />

10. User enjoys his selected video content on his mobile device preceeded by<br />

the Pre-Roll content selected by the publisher.<br />

- 24 -


Figure 5: Typical Publisher Implementation<br />

- 25 -


2. VPSI - Design<br />

The <strong>Vmoox</strong> Publisher Service Interface (VPSI) is the "entry point" of the content<br />

into the <strong>Vmoox</strong> system. When fully implemented, the VPSI will allow clients to<br />

perform the following actions via a web-based application: Account Setup; Content<br />

Input; Pre-Roll Content Input, Content Update and Smart Phone App Customization<br />

Requirements. In the implementation for this thesis, the client was a<br />

virtual one (CNN was used as a model but without it's official participation). As a<br />

result, only the input and update components were implemented.<br />

Figure 6 presents a sample case (simulated) wherein a client "provided" <strong>Vmoox</strong><br />

with an XML of meta-data for the content it "wanted" included in it's smart-phone<br />

app.<br />

Figure 6: A Sample XML Submitted by Client Including Content Meta-Data<br />

- 26 -


- 27 -


3. Transcoder - Design<br />

<strong>Vmoox</strong> performs offline as well as real-time transcoding. In this implementation,<br />

videos are transcoded from Flash to the H.264/AVC codec.<br />

The transcoder provides transcoding services in the following 2 instances:<br />

(a) Initial Transcode<br />

A request for this service comes from the VPSI. When new content is input, the<br />

VPSI sends all files to the Transcoder and the Transcoder transcodes the first<br />

section of each clip. The length of the initial section is a configurable variable<br />

(i.e., each publisher is able to detrmine how long of a section they would like<br />

transcoded) in this implementation the duration is 3 minutes.<br />

(b) Requested Transcode<br />

A request for this service comes from VEDA. When VEDA receives a requese for<br />

a video that has not yet been fully transcoded, it routes this file to the Transcoder<br />

for a full transcode. As part of the request, VEDA sends the transcoder a list of<br />

chapters to generate.<br />

Figure 7: Transcoder - Initial Transcoding Overview<br />

- 28 -


Figure 8: Transcoder - Real Time Transcoding Overview<br />

4. <strong>Video</strong> Encoding Decision Algorithm (VEDA)<br />

VEDA identifies whether or not a video is fully transcoded. During the initial<br />

transcode, files are flagged as partially transcoded. After a clip has been watched<br />

once and fully encoded, VEDA marks it as such.<br />

VEDA receives requests from the Web Service and differentiates between fully<br />

and partially transcoded files. It routes fully transcoded files (previously viewed or<br />

shorter than 3 minutes) directly to the Front End App via the Web Service, and<br />

sends partially transcoded files to the Transcoder for a full transcode.<br />

When a partially transcoded file is sent to the Transcoder, VEDA also generates<br />

a list of chapter names for the Transcoder to generate. This list is simultaneously<br />

sent to the Front End App via the Web Service and serves as a Playlist. The<br />

Playlist instructs the Front End App of the order in which the chapters should be<br />

played. This design eliminates wait/load time on the user end, by using the<br />

initially transcoded first chapter as a buffer while the rest of the video is being<br />

transcoded.<br />

Figure 9: Services VEDA Provides to VPSI<br />

- 29 -


Figure 10: VEDA Chapter Name Creation<br />

Figure 11: Services VEDA Provides to <strong>Vmoox</strong> Web Service<br />

- 30 -


5. <strong>Vmoox</strong> Database - Design<br />

The <strong>Vmoox</strong> Database supports and contains information about all the <strong>Vmoox</strong><br />

components. 3 types of objects are described in the database: <strong>Video</strong>, Vide Chapter<br />

(H264) and Ad. Each object is represented by a table that mirrors the object's<br />

properties and contains the information which helps each component perform as<br />

specified.<br />

(a) <strong>Video</strong><br />

The table for the <strong>Video</strong> object reflects the following properties:<br />

(i) Network Id - Each publisher is assigned a unique number which<br />

identifies its content. VPSI appends this information the object as video files are<br />

- 31 -


imported into the system. This helps assure that the correct videos are<br />

channelled to the publisher's Front-End App.<br />

(ii) Title - Provided by the Publisher. Delivered by the Web Service<br />

to the Front End App which displays the title to the User along with the video.<br />

(iii) Description - Provided by the Publisher. Delivered by the Web<br />

Service to the Front End App which displays the description to the User in the<br />

<strong>Video</strong> View.<br />

(iv) Image - Reference to a file created by the Transcoder during<br />

the Initial Transcode and stored on the <strong>Vmoox</strong> Server. Delivered by the Web<br />

Service to the Front End App and used as the representation of the video to the<br />

user in the Featured and <strong>Video</strong> Views.<br />

(v) Original Media URL - Used by VPSI to deliver the files to the<br />

transcoder module.<br />

(vi) Original Media - Reference to a file created by the Transcoder<br />

during the Initial Transcode and stored on the <strong>Vmoox</strong> Server.<br />

(vii) Insert Date - Generated by the DB. Represent a video insert<br />

date to <strong>Vmoox</strong> DB.<br />

(viii) H264 Ready (Y/N) - A flag that indicates if a video is fully<br />

transcoded i.e., H264 ready or not.<br />

(ix) Duration (in sec) - The duration in seconds of a video. This<br />

value is being calculated by the Transcoder module.<br />

(x) H264 Media URL - Reference to a file created by the<br />

Transcoder during the Initial Transcode and stored on the <strong>Vmoox</strong> Server.<br />

Delivered by the Web Service to the Front End App and used as the the first<br />

video chapter.<br />

(xi) Has Chapters (Y/N) - A flag that indicates if a video has<br />

chapters or not.<br />

(b) H264<br />

The table for the <strong>Video</strong> Chapter object reflects the following properties:<br />

(i) <strong>Video</strong> Id - Reference to a video entry in the <strong>Video</strong> table. Each video<br />

entry can have multiple instances in the H264 table indicates the video has multiple<br />

chapters.<br />

(ii) H264 Media - Reference to a file created by the Transcoder in<br />

real time and stored on the <strong>Vmoox</strong> Server. Delivered by the Web Service to the<br />

- 32 -


Front End App and used as the the video chapters.<br />

(iii) Image - Reference to a file created by the Transcoder during<br />

the the real time Transcode and stored on the <strong>Vmoox</strong> Server. Delivered by the<br />

Web Service to the Front End App and used as the representation of the video<br />

chapter to the user in the <strong>Video</strong> View.<br />

(iv) Title - Provided by the Publisher. Delivered by the Web Service<br />

to the Front End App which displays the title of a chapter to the User.<br />

(v) Duration (in sec) - The duration in seconds of a video. This<br />

value is being calculated by the Transcoder module.<br />

(c) Ad<br />

The table for the Ad object reflects the following properties:<br />

(i) H264 Media - Provided by the Publisher. Delivered by the Web<br />

Service to the Front End App and used as the the pre- roll video ad.<br />

(ii) Duration (in sec) - Provided by the Publisher. The duration in<br />

seconds of a video ad.<br />

6. <strong>Vmoox</strong> Web Service / API - Design<br />

The <strong>Vmoox</strong> Web Service provides services to both the web and native iPhone<br />

applications. The web service provides information for the following criterias:<br />

a. List of randomly selected video’s meta-data such as: title, description,<br />

duration and image.<br />

b. Relevant meta-data for a given video id.<br />

c. List of video’s meta-data that contain a given keyword in the video title<br />

and/or description – this will support the search functionality.<br />

d. List of videos’ media URLs for a given video id.<br />

e. Media ad URL for a given video id.<br />

- 33 -


Figure 12: Services <strong>Vmoox</strong> Web Service Provides to the iPhone App<br />

As illustrated in Figure 12 <strong>Vmoox</strong> web service uses an Ad serving algorithm<br />

module to append a pre-roll video ad before serving the publisher content.<br />

When a request of type “Get videos’ media URLs” enters the <strong>Vmoox</strong> web<br />

service, the web service uses VEDA in order to decide if an asynchronies real<br />

time transcoding is needed and to generate the list of videos’ chapters (including<br />

the pre-roll ad).<br />

The mentioned requests are HTTP GET requests, when the response for these<br />

requests is also an HTTP JSON/JSONP formatted response. This will enable the<br />

clients to easily read and manipulate data on the client side.<br />

There are several benefits of using JSON/JSONP web service as <strong>Vmoox</strong> web<br />

service protocol:<br />

1. The use of web service as the data delivery mechanism reinforces a good<br />

software engineering design practice when components are loosely coupled [41].<br />

2. JSON/JSONP is a lightweight protocol that enables developers to easily<br />

- 34 -


connect to <strong>Vmoox</strong>’s web service and to use <strong>Vmoox</strong>’s data in their own<br />

applications. JSON is a data format that is more naturally fit for browser data<br />

consumption [42], because it is a subset to JavaScript and can be easily parsed<br />

by the browser. Also Objective-C the iPhone programming language provides<br />

easy integration with JSON enabled web service [43].<br />

7. Ad Engine - Design<br />

<strong>Vmoox</strong> provides publishers with the ability to generate revenue from their<br />

content. According to eMarketer by 2010 one in ten dollars devoted to Internet<br />

advertising will go towards video placements [44]. This means that publishers will<br />

have the inventory and the advertisement budget to sponsor further video<br />

distribution of content. As illustrated in figure 12 when a request to get videos’<br />

media URLs enters vmoox web service, the web service in addition to get the<br />

relevant videos chapters generate a request to the ad serving engine to receive<br />

the proper ad(s).<br />

The following JSON formatted text i.e., Figure 13 illustrates how vmoox web<br />

service response to a request to get videos’ media URLs for the video Id =<br />

11246. The “ads” property in this JSON response demonstrates how the client<br />

application can append this video to the publisher video content.<br />

Figure 13: <strong>Vmoox</strong> Web Service JSON Formatted Response to a Get <strong>Video</strong>s’ Media<br />

URLs Request, with an “ads” Aray.<br />

[{"video":{"id":11246,"title":"Quest's Profitable Moment-6\/<br />

11","image":"Quest_s_Profitable_Moment_6_11_0_72.jpg","h264Media":"Quest_<br />

s_Profitable_Moment_6_11_0_72.mp4","h264Ready":false,"hasChapters":false,"<br />

duration":72,"networkId":1,"insertDate":"2009-06-11<br />

17:46:14.0","ads":{"com.vmoox.model.Ad":[{"id":3,"h264Media":"BMW_z4_30_3D<br />

tag.mp4","duration":30}]}}}]<br />

In order to maximize ads efficiency and provide better user experience the ads<br />

serving engine randomly selects ads. This will enable the application to offer<br />

different pre-roll video for different vides, and to allow a better diversity. This of<br />

course is not only a technical challenge, but also a marketing/sales challenge to<br />

insure the publisher has a sufficient number of ads inventory.<br />

- 35 -


8. Front End Application - Design<br />

The <strong>Vmoox</strong> Front End application delivers the transcoded content from <strong>Vmoox</strong><br />

servers to the end users. While designing the Front End application several key<br />

attributes were considered:<br />

1. Customization - Each publisher will be able to customize the Front End<br />

application in both appearance to fit their brand identity and target audience as<br />

well as functionality. Some publisher would prefer controlling the videos<br />

presented in the Featured view, while other could prefer a random selection of<br />

videos. Another example is the ability to control the amount and content of preroll<br />

ad before each video.<br />

2. Platform - Publishers will have the ability to receive either a native smartphone<br />

application (specific to a particular device) or a web application (runs on<br />

the browser of any device but requires browsing capabilities), or both. All these<br />

<strong>platform</strong> share most of the code base i.e., <strong>Vmoox</strong> Web Service provides services<br />

to all these <strong>platform</strong>s and <strong>Vmoox</strong> other modules VEDA and the Transcoder are<br />

<strong>platform</strong> independent.<br />

3. Following MVC design pattern -<br />

The Front End application’s architecture uses the MVC design / architecture<br />

pattern.<br />

Figure 14: MVC Design Pattern<br />

The benefit of using MVC design pattern is the ability to create an independency<br />

- 36 -


etween component. Data access code, business logic code and presentation<br />

code are all separated. This allow us to create different views for different<br />

publishers according to their specific specifications. Keeping low coupling<br />

between different types of classes or decoupling data access code, business<br />

logic code and presentation code will make classes easier to maintain and reuse<br />

[49].<br />

(a) The Model Objects:<br />

The same model objects are used by VPSI, VEDA, <strong>Vmoox</strong> Web Service and<br />

<strong>Vmoox</strong> Front End Application (web based)<br />

These objects are Ad.java, <strong>Video</strong>.java and <strong>Video</strong>Chapter.java<br />

(b) The Controller Objects: (Web Based app)<br />

The controller needs to do the heavy lifting of getting the data and building the<br />

model that will be displayed. The sequence of events for the controller starts<br />

when a user starts the application. The controller then gets information related to<br />

the specific publisher from <strong>Vmoox</strong> Web Service. This logic is implemented in the<br />

main controller class <strong>Vmoox</strong>.java. This class implements two interfaces the<br />

EntryPoint interface which indicates this is the entry point of the application, and<br />

the <strong>Vmoox</strong>Listener.<br />

The following UML describes this relationship:<br />

Figure 15: <strong>Vmoox</strong> Controller<br />

- 37 -


(c) The View Objects: (Web Based app)<br />

The view objects purpose is to create and display to the user three views:<br />

(i) Featured View<br />

The Featured View is the first view a user sees when launching the application.<br />

The Featured View includes the latest (or preferred) video content from the<br />

publisher. Criteria for inclusion in the Featured view can be determined by the<br />

publisher (i.e., newest or most popular videos). In the Featured View, the<br />

following should be displayed for each video: thumbnail, title, duration, and a link<br />

to the video view. The user selects a video and is taken to the <strong>Video</strong> View.<br />

(ii) <strong>Video</strong> View<br />

After selecting a video from the list, users will be taken to the <strong>Video</strong> View - where<br />

the thumbnail and information for their selected video is displayed. Clicking on<br />

the video thumbnail (or adjacent button) initiates the video content - playing first<br />

any pre-roll content and then the actual video.<br />

(iii) Play View<br />

In this view users watch first the pre-roll content as determined by the publisher,<br />

and then the actual video. There is no load or wait time on the user end. (See<br />

explanation in VEDA section)<br />

- 38 -


VIII. <strong>Vmoox</strong> Implementation<br />

1. <strong>Vmoox</strong> Implementation Overview<br />

The main development language that was used to implement <strong>Vmoox</strong> was Java.<br />

VPSI, VEDA, <strong>Vmoox</strong> Web Service, and the iPhone web application were all implemented<br />

utilizing Java and open source projects. The <strong>Vmoox</strong> native iPhone<br />

app was implemented using apple's iPhone SDK OS 3.0 [47].<br />

The following open source frameworks were used to implement <strong>Vmoox</strong>:<br />

1. Hibernate: "Relational Persistence for Java and .NET" [38].<br />

2. MySql: "The world's most popular open source database" [45].<br />

3.FFmpeg: "A complete, cross-<strong>platform</strong> solution to record, convert and<br />

stream audio and video" [30]. For more details see section III of this paper.<br />

4. libavcodec: "A library of codecs for encoding and decoding video and<br />

audio data" [29].<br />

5. Xstream: "A simple library to serialize objects to XML and back again"<br />

[36]. For more details see section V of this paper.<br />

6. GWT: "An open source framework that allows web developers to build<br />

rich internet application using the Java language. GWT cross-compiles<br />

Java source code into optimized JavaScript that automatically works on<br />

all major browsers" [46].<br />

2. VPSI - Implementaion<br />

VPSI provides web publishers an interface to <strong>Vmoox</strong> system. Publishers can<br />

easily provide VPSI an XML feed with the data to be published. Web Publishers<br />

should not be concern how <strong>Vmoox</strong> implements this integration process. Also<br />

changes in this specific implementation are not visible to publishers.<br />

(a) The Model Objects:<br />

The same model objects are used by VPSI, VEDA and <strong>Vmoox</strong> Web Service.<br />

These objects are Ad.java, <strong>Video</strong>.java and <strong>Video</strong>Chapter.java<br />

- 39 -


Figure 16: <strong>Video</strong> Object UML<br />

<strong>Video</strong><br />

private int id;<br />

private String title;<br />

private String description;<br />

private String image;<br />

private String originalMedia;<br />

private String originalMediaLocalName;<br />

private String h264Media;<br />

private Boolean h264Ready;<br />

private Boolean hasChapters;<br />

private Integer duration;<br />

private int networkId;<br />

private Timestamp insertDate;<br />

private List videoChapters;<br />

private List ads;<br />

public int getId()<br />

public void setId(int id)<br />

public String getTitle()<br />

public void setTitle(String title)<br />

public String getDescription()<br />

public void setDescription(String description)<br />

public String getImage()<br />

public void setImage(String image)<br />

public String getOriginalMedia()<br />

public void setOriginalMedia(String originalMedia)<br />

public String getOriginalMediaLocalName()<br />

public void setOriginalMediaLocalName(String originalMediaLocalName)<br />

public String getH264Media()<br />

public void setH264Media(String media)<br />

public boolean isH264Ready()<br />

public void setH264Ready(boolean ready)<br />

public boolean isHasChapters()<br />

public void setHasChapters(boolean hasChapters)<br />

public Integer getDuration()<br />

public void setDuration(Integer duration)<br />

public int getNetworkId()<br />

public void setNetworkId()<br />

public Timestamp getInsertDate()<br />

public void setInsertDate(Timestamp insertDate)<br />

public List get<strong>Video</strong>Chapters()<br />

public void set<strong>Video</strong>Chapters(List videoChapters)<br />

public List getAds()<br />

public void setAds(List ads)<br />

public <strong>Video</strong> getToJSONObj()<br />

public int hashCode()<br />

public boolean equals(Object obj)<br />

The <strong>Video</strong> object holds information about a video. This information includes an<br />

internal video Id, the video title, description, link to the original flash video file, link<br />

to a thumbnail, a link to a H.264/AVC video, the duration of the video and if the<br />

video was fully transcoded to H.264/AVC or not.<br />

Figure 17: <strong>Video</strong> Chapter Object UML<br />

- 40 -


<strong>Video</strong>Chapter<br />

private int id;<br />

private int videoId;<br />

private String title;<br />

private String image;<br />

private String h264Media;<br />

private Integer duration;<br />

public int getId()<br />

public void setId(int id)<br />

public int get<strong>Video</strong>Id()<br />

public void set<strong>Video</strong>Id(int videoId)<br />

public String getTitle()<br />

public void setTitle(String title)<br />

public String getH264Media()<br />

public void setH264Media(String media)<br />

public Integer getDuration()<br />

public void setDuration(Integer duration)<br />

The <strong>Video</strong> Chapter object is not been used by VPSI, but it is an important data<br />

structure. A <strong>Video</strong> object holds a reference to its video chapters. A video has<br />

video chapters if its duration is longer then three minutes.<br />

Figure 18: Ad Object UML<br />

Ad<br />

private int id;<br />

private String h264Media;<br />

private Integer duration;<br />

public int getId()<br />

public void setId(int id)<br />

public String getH264Media()<br />

public void setH264Media(String media)<br />

public Integer getDuration()<br />

public void setDuration(Integer duration)<br />

The Ad object is also currently not been used by VPSI. If required a publisher<br />

can integrate his ads. In this cases the Ad data structure will be used by VPSI.<br />

- 41 -


<strong>Vmoox</strong> Web Service uses the Ad object in order to provide the client app a list<br />

of pre-roll video ads.<br />

Figure 19: VPSI UML<br />

(b) Publisher Service<br />

The PublisherService.java is an abstract class that holds a reference to the<br />

Downloader class and the Transformation class. Classes that extends this class<br />

must implement the abstract run method.<br />

The PublisherService in its constructor assign its local verbal transformation using<br />

the static getInstance() method:<br />

public abstract class PublisherService {<br />

protected Downloader downloader;<br />

protected Transformation transformation;<br />

public PublisherService() {<br />

super();<br />

downloader = Downloader.getInstance();<br />

- 42 -


}<br />

}<br />

transformation = Transformation.getInstance();<br />

public abstract void run();<br />

Implementing the run() method:<br />

The class CNNService extends PublisherService therefore it must implement the<br />

abstract run() method. The purpose of this method is to connect to the publisher<br />

XML service and create a list of <strong>Video</strong> objects. Once all videos objects are available<br />

this method checks which videos are new and which are already available in<br />

the <strong>Vmoox</strong> system. Then new videos are download and the transcoding process<br />

begins.<br />

(c) Downloader<br />

The only purpose of the Downloader class is to download a remote file and save<br />

it locally. This class has one important method i.e., download(String local-<br />

FileName) that receives a string that specify what is the local file name to be<br />

created. The method uses Java's URL and URLConnection objects in order to<br />

connect to the remote site, and save the byte array into a local buffer. When the<br />

entire file is available locally the method writes the byte array into a file using<br />

Java's PrintWriter class. Below you can see Downloader's download method<br />

public String download(String localFileName) {<br />

BufferedInputStream in = null;<br />

ByteArrayOutputStream baOut = null;<br />

try {<br />

URL url = new URL(urlStr);<br />

URLConnection urlConn = (URLConnection)<br />

url.openConnection();<br />

in = new<br />

BufferedInputStream(urlConn.getInputStream());<br />

baOut = new ByteArrayOutputStream();<br />

byte[] buffer = new byte[50 * 1024]; // 50K buffer<br />

while (true) {<br />

int n = in.read(buffer);<br />

- 43 -


}<br />

if (n == -1)<br />

break;<br />

baOut.write(buffer, 0, n);<br />

}<br />

localFileName = Utils.formatText(localFileName);<br />

localFileName += ".flv";<br />

String outPutFile = localMediaPath+localFileName;<br />

PrintWriter out = new PrintWriter(new BufferedWriter(<br />

new FileWriter(outPutFile)));<br />

out.print(baOut);<br />

out.flush();<br />

out.close();<br />

baOut.flush();<br />

baOut.close();<br />

return localFileName;<br />

} catch (Exception e) {<br />

//handle exception<br />

} finally {<br />

if (in != null)<br />

try {<br />

in.close();<br />

} catch (Exception e) {<br />

}<br />

if (baOut != null)<br />

try {<br />

baOut.close();<br />

} catch (Exception e) {<br />

}<br />

}<br />

return "";<br />

Once a file was downloaded using the Downloader class VPSI uses the Transformation<br />

class in order to initialize a first 3 minutes off-line transcoding action.<br />

The last step of VPSI is updating the <strong>Vmoox</strong> database. VPSI uses the DBProxy<br />

class that provides generic reading and writing operation on the database. When<br />

VPSI needs to decide if a video that comes from the publisher interface is new,<br />

VPSI uses the DPProxy class to retrieve all publishers videos, and checks if new<br />

videos are needed to be added to <strong>Vmoox</strong>'s DB.<br />

The following is this logic implementation:<br />

- 44 -


DBProxy dbProxy = DBProxy.getInstance();<br />

boolean new<strong>Video</strong> = false;<br />

List videosFromDB = dbProxy.getAll<strong>Video</strong>s();<br />

List videosToProcess = new ArrayList();<br />

for(<strong>Video</strong> new<strong>Video</strong> : videos){<br />

for(<strong>Video</strong> video : videosFromDB){<br />

if(video.equals(new<strong>Video</strong>)){<br />

new<strong>Video</strong> = false;<br />

break;<br />

}else{<br />

videosToProcess.add(new<strong>Video</strong>);<br />

}<br />

}<br />

new<strong>Video</strong> = false;<br />

}<br />

3. Transcoder - Implementation<br />

The transcoder module responsibility is to perform partially or full video transcoding.<br />

VPSI and <strong>Vmoox</strong> Web Service uses this module by interfacing with the<br />

Transformation class.<br />

Figure 20: Transformation Class Services<br />

Transformation<br />

<strong>Video</strong> transform(<strong>Video</strong> video, boolean fullTransformation,Integer chapterDuration)<br />

List get<strong>Video</strong>Chapters(<strong>Video</strong> video)<br />

List get<strong>Video</strong>ChaptersAndStartTransformation(<strong>Video</strong> video)<br />

String getThumbnail(<strong>Video</strong> video)<br />

Integer get<strong>Video</strong>Duration(String fileName)<br />

Integer getChapterDuration(String fileName)<br />

String generateChapter(String inputFileName,Integer from,Integer duration)<br />

(a) Transcoding Using FFmpeg<br />

- 45 -


VEDA uses ffmpeg in order to transcode flash videos to H.264/AVC videos.<br />

Below is the implementation of generateChapter(final String inputFile-<br />

Name,final Integer from, final Integer duration) method. This method<br />

as input receives the path to the original flash video file, the from and duration of<br />

the transcoding. As output this method returns the path to the new H.264/AVC<br />

video file.<br />

private String generateChapter(final String inputFileName,<br />

final Integer from, final Integer duration) {<br />

ArrayList cmdList = new ArrayList();<br />

cmdList.add(h264Transformation+"./h264_h");<br />

cmdList.add(localMediaPath + inputFileName);<br />

cmdList.add(duration.toString());<br />

cmdList.add(from.toString());<br />

cmdList.add(h264MediaPath + inputFileName.replace(".flv",<br />

"") + "_"<br />

+ from + "_" + duration + "." +<br />

fileOutPutExtension);<br />

Runtime rt = Runtime.getRuntime();<br />

Process proc = rt.exec(cmdList.toArray(new String[0]));<br />

// any error message?<br />

StreamGobbler errorGobbler = new StreamGobbler(proc<br />

.getErrorStream(), "ERROR");<br />

}<br />

// any output?<br />

StreamGobbler outputGobbler = new StreamGobbler(proc<br />

.getInputStream(), "OUTPUT");<br />

errorGobbler.start();<br />

outputGobbler.start();<br />

return inputFileName.replace(".flv", "") + "_" + from + "_"<br />

+ duration;<br />

This method uses Java's RunTime and Process classes in order to execute a<br />

shell script that class the ffmpeg program. Below is the implementation of the<br />

h264_h shell script:<br />

/opt/local/bin/ffmpeg -y -threads 0 -i $1 -vcodec libx264 -s<br />

480x272 -flags +loop -cmp +chroma -deblockalpha 0 -deblockbeta 0 -<br />

- 46 -


crf 24 -bt 256 -refs 1 -coder 0 -me_range 16 -subq 5 -partitions<br />

+parti4x4+parti8x8+partp8x8 -g 250 -keyint_min 25 -level 30 -qmin<br />

10 -qmax 51 -trellis 2 -sc_threshold 40 -i_qfactor 0.71 -acodec<br />

libfaac -ab 96k -ar 48000 -ac 2 -t $2 -ss $3 $4<br />

This script as an input receives the original flash video file name (i.e.,-i $1), the<br />

duration of the transcoding to perform (i.e., -t $2), the time stamp to start the<br />

transcoding from (i.e., -ss $3) and the output file name (i.e., $4). The video codec<br />

that is being uses is specified in the -vcodec flag (i.e., -vcodec libx264).<br />

The Transformation class use the singleton design pattern. The single design<br />

pattern insures that only one instance of a class is created, provides a global<br />

point of access to the object and also allow multiple instances in the future without<br />

affecting a singleton class's clients [48]. Below is the first few lines of Transformation.java<br />

that illustrates the singleton design patten in action.<br />

public class Transformation {<br />

private Properties properties;<br />

private String localMediaPath;<br />

private String h264MediaPath;<br />

private String h264Transformation;<br />

private String fileOutPutExtension;<br />

private Integer chaptherDuration;<br />

}<br />

private static Transformation instance = null;<br />

public static Transformation getInstance() {<br />

if (instance == null) {<br />

instance = new Transformation();<br />

}<br />

return instance;<br />

}<br />

protected Transformation() {<br />

//implementation...<br />

}<br />

The constructor visibility of this class is protected, this insure that clients of this<br />

class are able to access it only through its static getInstance() method.<br />

As described above the VPSI module uses the Transcoding class to perform an<br />

initial transcoding. If a video duration is less then three minutes then the<br />

- 47 -


transcoding interface transcode the video and signal that the file is H.264 ready.<br />

If the video duration is more then three minutes then the transcoding interface<br />

generates a list of chapters for the video and transcode the first one.<br />

Below is this logic implementation:<br />

public <strong>Video</strong> transform(<strong>Video</strong> video, boolean fullTransformation,<br />

Integer chapterDuration) {<br />

final String sourceFileName =<br />

video.getOriginalMediaLocalName();<br />

Integer videoDurationInSeconds =<br />

get<strong>Video</strong>Duration(sourceFileName);<br />

video.setDuration(videoDurationInSeconds);<br />

final List chapterNames = new ArrayList();<br />

if (!fullTransformation) {<br />

if (videoDurationInSeconds >= chapterDuration) {<br />

chapterNames.add(generateChapter(sourceFileName,<br />

0,chapterDuration));<br />

} else {<br />

chapterNames.add(generateChapter(sourceFileName,<br />

0,videoDurationInSeconds));<br />

video.setH264Ready(true);<br />

}<br />

video.setH264Media(chapterNames.get(0) + "." +<br />

fileOutPutExtension);<br />

video.setImage(getThumbnail(video));<br />

return video;<br />

}<br />

This method is also used when the VEDA in real-time decides if a full<br />

transformation is needed. In this case the parameter fullTransformation is<br />

passed with a 'true' value.<br />

- 48 -


4. VEDA - Implementation<br />

VEDA identifies whether or not a video is fully transcoded. During the initial<br />

transcode, files are flagged as partially transcoded. After a clip has been watched<br />

once and fully encoded, VEDA marks it as such.<br />

VEDA receives requests from the Web Service and differentiates between fully<br />

and partially transcoded files. It routes fully transcoded files (previously viewed or<br />

shorter than 3 minutes) directly to the Front End App via the Web Service, and<br />

sends partially transcoded files to the Transcoder for a full transcode.<br />

When a user requests a video, VEDA in real time decides if real time encoding is<br />

needed. If this is the case the service generates the chapters name, start an<br />

asynchronous job that transcode the video and immediately returns the output<br />

the the client. This insures that users will be able to immediately start to watch<br />

the video when in the background a transcoding task is being executed.<br />

Below is part of this logic implementation:<br />

if (video.isH264Ready()) {<br />

if (video.isHasChapters()) {<br />

video.set<strong>Video</strong>Chapters(get<strong>Video</strong>Chapters(video));<br />

}<br />

video.setAds(getAd(video));<br />

jsonResult.append(xstream.toXML(video.getToJSONObj()));<br />

} else {<br />

video<br />

.set<strong>Video</strong>Chapters(get<strong>Video</strong>ChaptersAndStartTransformation(video));<br />

video.setAds(getAd(video));<br />

jsonResult.append(xstream.toXML(video.getToJSONObj()));<br />

}<br />

At first the code checks if the file is already H264 ready. This can be the case if a<br />

user already watched the video, thus the video was already transcoded, or if the<br />

original video duration was less them 3 minutes. If the video needs further<br />

transcoding them the code calls get<strong>Video</strong>ChaptersAndStartTransformation(video).<br />

This method as you can see below start a new thread that transcode<br />

the file and immediately return the video chapters names:<br />

- 49 -


private List<br />

get<strong>Video</strong>ChaptersAndStartTransformation(<br />

final <strong>Video</strong> video) {<br />

final Transformation transformation =<br />

Transformation.getInstance();<br />

video.set<strong>Video</strong>Chapters(transformation.get<strong>Video</strong>Chapters(video));<br />

// start transformation<br />

Thread t = new Thread(new Runnable() {<br />

public void run() {<br />

video.set<strong>Video</strong>Chapters(transformation<br />

.get<strong>Video</strong>ChaptersAndStartTransformation(video));<br />

video.setH264Ready(true);<br />

video.setHasChapters(true);<br />

DBProxy.getInstance().update<strong>Video</strong>(video);<br />

DBProxy.getInstance().update<strong>Video</strong>Chapters(video);<br />

}<br />

});<br />

t.start();<br />

return video.get<strong>Video</strong>Chapters();<br />

}<br />

After the video was fully transcoded the method change the state of the video object<br />

by indicating that the video is H.264 read and it has chapters and updates<br />

the DB with the new video setting and the new video chapters that was just<br />

created.<br />

- 50 -


5. Database - Implementation<br />

<strong>Vmoox</strong>'s schema contains three tables.<br />

(a) <strong>Video</strong><br />

(b) H264<br />

- 51 -


(c) Ad<br />

DBProxy class uses Hibernate in order to map the model objects (i.e., <strong>Video</strong>,<br />

<strong>Video</strong>Chapter, Ad) to the above database tables. Below are the relevant mapping<br />

specified in the Hibernate configuration file:<br />

<br />

<br />

<br />

<br />

This mapping declarations indicate that the above resources files are used to<br />

map objects to tables.<br />

For example the following is the XML that describes the mapping between the<br />

<strong>Video</strong>.java class and the DB table video:<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

- 52 -


<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

From this XML file one can see how the <strong>Video</strong> class properties are mapped to<br />

the <strong>Video</strong> table columns.<br />

Two components uses <strong>Vmoox</strong> DB(s). VPSI reads and updates the DB as already<br />

described above, and <strong>Vmoox</strong> Web Service reads from the DB and provide web<br />

services to client applications. (i.e., the iPhone apps).<br />

Figure 21: <strong>Vmoox</strong> DB(s) Overview<br />

VPSI<br />

<strong>Vmoox</strong><br />

DB(s)<br />

<strong>Vmoox</strong> Web Service<br />

DBPoxy.java provides updates and reads services for VPSI and <strong>Vmoox</strong> Web<br />

Service.<br />

Below you can find the implementation of the method insert-<br />

New<strong>Video</strong>s(List videos):<br />

- 53 -


public void insertNew<strong>Video</strong>s(List videos){<br />

if(all<strong>Video</strong>s == null){<br />

loadAllVidoesFromDB();<br />

}<br />

Transaction tx = null;<br />

Session session = null;<br />

session = HibernateUtil.getSessionFactory().openSession();<br />

try {<br />

for(<strong>Video</strong> video : videos){<br />

if(!all<strong>Video</strong>s.contains(video)){<br />

tx = session.beginTransaction();<br />

session.save(video);<br />

tx.commit();<br />

}<br />

}<br />

} catch (HibernateException e) {<br />

e.printStackTrace();<br />

if (tx != null && tx.isActive())<br />

tx.rollback();<br />

}<br />

finally {<br />

session.close();<br />

}<br />

}<br />

This method provided services to VPSI and insures that only new videos will be<br />

added to the DB. (i.e., no duplicates).<br />

- 54 -


6. <strong>Vmoox</strong> Web Service<br />

As describes in the design section of this document <strong>Vmoox</strong> Web Service provides<br />

services to both the web and native iPhone applications. <strong>Vmoox</strong> Web Service<br />

provides two entry points to it services. Those two end-point are defined in<br />

the web application web.xml file:<br />

<br />

JSONServlet<br />

com.vmoox.web.server.JSONServiceImpl<br />

<br />

<br />

JSONServlet<br />

/web/videos<br />

<br />

<br />

getPlayListServlet<br />

com.vmoox.web.server.JSONPlayListServiceImpl<br />

<br />

<br />

getPlayListServlet<br />

/web/video<br />

<br />

The first service <strong>Vmoox</strong> Web Service provides is retrieving a publisher videos<br />

data. Client can submit a request by generating the following HTTP GET request:<br />

http://www.vmoox.com/web/videos?networkId=PUBLISHER_NETWORK_ID<br />

The response to this request will be a JSON format data as follow:<br />

[{"video":{"id":11259,"title":"SOTU_Help in the Hardest<br />

Times","image":"SOTU_Help_in_the_Hardest_Times_0_180.jpg","h264Media":"S<br />

OTU_Help_in_the_Hardest_Times_0_180.mp4","h264Ready":false,"hasChapter<br />

- 55 -


s":false,"duration":245,"networkId":1,"insertDate":"2009-08-09<br />

11:45:01.0"}},{"video":{"id":11260,"title":"SOTU Oregon<br />

Diner","image":"SOTU_Oregon_Diner_0_180.jpg","h264Media":"SOTU_Oregon_<br />

Diner_0_180.mp4","h264Ready":false,"hasChapters":false,"duration":225,"netwo<br />

rkId":1,"insertDate":"2009-08-09 11:25:17.0"}},{"video":{"id":11257,"title":"The<br />

'public<br />

option'","image":"The__public_option__0_180.jpg","h264Media":"The__public_op<br />

tion__0_180.mp4","h264Ready":false,"hasChapters":false,"duration":522,"networ<br />

kId":1,"insertDate":"2009-07-28 17:28:22.0"}}...]<br />

This request returns a randomly selected video’s meta-data such as: title, description,<br />

duration and image per network Id.<br />

The second service <strong>Vmoox</strong> Web Service provides is retrieving a videos' play list<br />

data. Client can submit a request by generating the following HTTP GET request:<br />

http://www.vmoox.com/web/video?videoId=VIDEO_ID<br />

The response to this request will be a JSON format data as follow:<br />

[{"video":{"id":11246,"title":"Quest's Profitable Moment-6\/<br />

11","image":"Quest_s_Profitable_Moment_6_11_0_72.jpg","h264Media":"Quest_<br />

s_Profitable_Moment_6_11_0_72.mp4","h264Ready":false,"hasChapters":false,"<br />

duration":72,"networkId":1,"insertDate":"2009-06-11<br />

17:46:14.0","ads":{"com.vmoox.model.Ad":[{"id":5,"h264Media":"Sprint_Wireless_<br />

Wedding.mp4","duration":30}]}}}]<br />

This response also contains a pre-roll Ad that can be played before the publisher<br />

video plays.<br />

(a) Implementing Get Network <strong>Video</strong>s Service<br />

As defined in the web.xml configuration file specified above the class that implements<br />

this service is JSONServiceImpl.<br />

This class extends Java's HttpServlet class and overrides the following method:<br />

void doGet(HttpServletRequest req, HttpServletResponse res)<br />

The class in the doGet method retrieves the request parameters map and decides<br />

which request is being made. If the the request parameters map contains<br />

- 56 -


the parameter networkId then this method calls the private List<br />

get<strong>Video</strong>s(String key, String value) method. This method then uses Hibernate<br />

to access the DB and retrieve a list of <strong>Video</strong> objects. Below is the implementation<br />

of this method:<br />

private List get<strong>Video</strong>s(String key, String value) {<br />

List videos = null;<br />

Session session = null;<br />

try {<br />

session =<br />

HibernateUtil.getSessionFactory().openSession();<br />

Criteria criteria = null;<br />

if (key.equals("networks") && value.equals("true")) {<br />

criteria = session.createCriteria(Network.class);<br />

} else if (key.equals("featured") &&<br />

value.equals("true")) {<br />

criteria =<br />

session.createCriteria(Featured<strong>Video</strong>.class);<br />

} else {<br />

criteria = session.createCriteria(<strong>Video</strong>.class);<br />

criteria.addOrder(Order.desc("insertDate"));<br />

}<br />

if (key.equals("videoId")) {<br />

criteria.add(Restrictions.eq("id", new<br />

Integer(value)));<br />

} else if (key.equals("title")) {<br />

criteria.setFirstResult(0);<br />

criteria.setMaxResults(maxResult);<br />

criteria.add(Restrictions.like("title", "%" +<br />

value + "%"));<br />

} else if (key.equals("description")) {<br />

criteria.setFirstResult(0);<br />

criteria.setMaxResults(maxResult);<br />

criteria.add(Restrictions<br />

.like("description", "%" + value + "%"));<br />

} else if (key.equals("networkId")) {<br />

criteria.setFirstResult(0);<br />

criteria.setMaxResults(maxResult);<br />

criteria.add(Restrictions.eq("networkId", new<br />

Integer(value)));<br />

- 57 -


}<br />

}<br />

videos = criteria.list();<br />

if (key.equals("featured")) {<br />

// shuffle the result<br />

Collections.shuffle(videos);<br />

}<br />

} catch (HibernateException e) {<br />

} finally {<br />

session.close();<br />

}<br />

return videos;<br />

This is a generic method that all <strong>Vmoox</strong>'s supported requests uses in order to access<br />

the DB and retrieve <strong>Video</strong>s objects. These requests include for example a<br />

get video by Id or get videos by a keyword in the video title or description.<br />

As mentioned before the response that <strong>Vmoox</strong> Web Service outputs is in a JSON<br />

format and that was implemented using Xstream. In order to serialize the <strong>Video</strong><br />

object to JSON one needs to create an instanse of the XStram object passing a<br />

JettisonMappedXmlDriver driver:<br />

XStream xstream = new XStream(new JettisonMappedXmlDriver());<br />

Then we need to set the right class alias:<br />

xstream.alias("video", <strong>Video</strong>.class);<br />

and in order to output the JSON format data structure we need to call the XStram's<br />

toXML method and write it to the request object:<br />

PrintWriter out = res.getWriter();<br />

StringBuilder jsonResult = new StringBuilder();<br />

jsonResult.append(xstream.toXML(video.getToJSONObj()));<br />

out.print(jsonResult.toString());<br />

This will generate a JSON format data structure like the example below.<br />

- 58 -


(b) Implementing Get List of <strong>Video</strong>s Media URLs for a Given<br />

<strong>Video</strong> Id<br />

As defined in the web.xml configuration file specified above the class that implements<br />

this service is JSONPlayListServiceImpl.<br />

This class extends Java's HttpServlet class and overrides the following method:<br />

void doGet(HttpServletRequest req, HttpServletResponse res)<br />

The class in the doGet method retrieves the request parameters map and decides<br />

which video Id is being request. Then the service needs to decide if all the<br />

video chapters are available or if a real time transcoding is necessary. The code<br />

that implement this logic was already discussed under the VEDA implementation<br />

in this chapter.<br />

(c) Ad Serving<br />

When <strong>Vmoox</strong> Web Service generates a list of videos' chapters for a given video,<br />

the service append to the video play list a video Ad. This logic is part of the get<br />

videos play list service request. The following method retrieve an Ad per three<br />

vides' chapters:<br />

private List getAd(<strong>Video</strong> video) {<br />

int size =1;<br />

// for each 3 chapters add an ad<br />

if(video.get<strong>Video</strong>Chapters()!=null){<br />

if(video.get<strong>Video</strong>Chapters().size()>3){<br />

size = video.get<strong>Video</strong>Chapters().size()/3;<br />

}<br />

}<br />

List ads = DBProxy.getInstance().getAd(video,size);<br />

return ads;<br />

}<br />

- 59 -


7. iPhone Native and Web App<br />

The last part of the <strong>Vmoox</strong> system is a Front End app that delivers the transcoded<br />

content from <strong>Vmoox</strong> servers to the end users. As explained in the requirement<br />

and design sections of this paper users are not aware that not all videos are<br />

"ready" to be played, and an additonal transcoding in real time is needed. Users<br />

are able to browse the publisher video catalog and click on a video and instantly<br />

start watching it.<br />

(a) Web Based App<br />

The app was implementing using GWT and follows the MVC design pattern [49].<br />

(i) The Model<br />

The model objects of this app are the same objects as described in VPSI implementation<br />

i.e., <strong>Video</strong>, <strong>Video</strong>Chapter and Ad objects in addition to a <strong>Video</strong>Tag object<br />

that help with generating a QuickTime HTML tag.<br />

Below you can see how the class generates this tag using the class properties:<br />

String posterUrl, String width, String height, String h264Uri,<br />

List chapters and List ads.<br />

private void set<strong>Video</strong>Tag(){<br />

StringBuilder sb = new StringBuilder("


}<br />

for(<strong>Video</strong>Chapter videoChapter : chapters){<br />

sb.append(" qtnext");<br />

sb.append(new Integer(i++).toString());<br />

sb.append("=''");<br />

}<br />

}<br />

sb.append("");<br />

setHTML(sb.toString());<br />

(ii) The Controller<br />

The controller of this app provides the necessary data to the application views<br />

which then displays the featured videos and generates the QuickTime tag that<br />

lets users play the video<br />

public interface <strong>Vmoox</strong>Listener {<br />

public void getFeatured<strong>Video</strong>s();<br />

public void get<strong>Video</strong>Tag(int videoId);<br />

}<br />

The controller users <strong>Vmoox</strong> Web Service in order to retrieve the data in JSON<br />

format, parse the data structure and generate a list of <strong>Video</strong>s that will be passed<br />

to the view in order to generate the user interface. Below is part of the controller<br />

implementation:<br />

public void asyncGetFeatured<strong>Video</strong>s() {<br />

StringBuilder jsonUri = new StringBuilder();<br />

jsonUri.append(GWT.getHostPageBaseURL() + "web/<br />

videos?networkId=1");<br />

jsonUri.append("&callback=");<br />

JSONRequest.get(jsonUri.toString(), new<br />

JSONRequestHandler() {<br />

public void onRequestComplete(JavaScriptObject json) {<br />

JSONObject jsonObj = new JSONObject(json);<br />

handle<strong>Video</strong>sData(jsonObj);<br />

}<br />

});<br />

- 61 -


}<br />

This method builds the request parameters and generate an HTTP GET request<br />

to <strong>Vmoox</strong> Web Service. When a request is completed a new JSONObject<br />

instance is crated and a call to handle<strong>Video</strong>sData is being executed. This<br />

method then parse the JSONObject data structure and send the result to the<br />

View:<br />

for (int i = 0; i < 20; i++) {<br />

JSONValue v = jsonObject.get(new<br />

Integer(i).toString());<br />

JSONObject collectionJSONObject = v.isObject();<br />

JSONValue videoBeanJSONValue = null;<br />

videoBeanJSONValue = collectionJSONObject.get("video");<br />

videoObj = videoBeanJSONValue.isObject();<br />

String posterUrl = "h264/"+ (String)<br />

JSONValueMappingUtil.getJsonValue(<br />

videoObj, "image",JsonValueType.stringType);<br />

String title = (String) JSONValueMappingUtil<br />

.getJsonValue(videoObj, "title",JsonValueType.stringType);<br />

int duration = (Integer) JSONValueMappingUtil<br />

.getJsonValue(videoObj, "duration",<br />

JsonValueType.intType);<br />

int videoId = (Integer) JSONValueMappingUtil<br />

.getJsonValue(videoObj, "id",JsonValueType.intType);<br />

video = new <strong>Video</strong>();<br />

video.setTitle(title);<br />

video.setImage(posterUrl);<br />

video.setDuration(duration);<br />

video.setId(videoId);<br />

videos.add(video);<br />

}<br />

(iii) The View<br />

The app has three different views. This first view displays a randomly selected<br />

list of twenty videos for a given publisher. Each video section contains the video<br />

thumbnail, title and duration of the video.<br />

- 62 -


Figure 22: Featured <strong>Video</strong>s View<br />

This view is being generated by Featured<strong>Video</strong>sView.java class.<br />

Below is the implementation of void loadFeaturedView(List<br />

videos) This method as in input received a list of videos and then generate the<br />

display.<br />

- 63 -


public void loadFeaturedView(List videos){<br />

for(final <strong>Video</strong> video : videos){<br />

HorizontalPanel hubRow1Panel = new HorizontalPanel();<br />

hubRow1Panel.setStyleName("videoPanel");<br />

HorizontalPanel videoPanel = new HorizontalPanel();<br />

videoPanel.setWidth("100%");<br />

Image image = new Image(video.getImage());<br />

image.setSize("100px", "75px");<br />

VerticalPanel metaDataPanel = new VerticalPanel();<br />

metaDataPanel.setStyleName("metaDataPanel");<br />

metaDataPanel.setSpacing(4);<br />

HTML videoTitle = new HTML(video.getTitle());<br />

videoTitle.setStyleName("videoTitle");<br />

int durationInSeconds = video.getDuration();<br />

int minutes = durationInSeconds/60;<br />

int seconds = durationInSeconds - (60*minutes);<br />

String duration = "";<br />

if(seconds==0){<br />

duration = new Integer(minutes).toString()+":00";<br />

}else if(seconds


arrowPanel.add(arrow);<br />

videoPanel.add(arrowPanel);<br />

hubRow1Panel.add(videoPanel);<br />

mainHubPanel.add(hubRow1Panel);<br />

}<br />

contents.add(mainHubPanel);<br />

This method generates twenty horizontal panels each panel containe an image<br />

(the video thumbnail), two HTML objects (a GWT wrapper class of the HTML DIV<br />

element) and a blue arrow (another image) that when a user clicks on it the app<br />

loads the <strong>Video</strong>View :<br />

arrow.addClickHandler(new ClickHandler(){<br />

public void onClick(ClickEvent event) {<br />

load<strong>Video</strong>View(video);<br />

}<br />

});<br />

The <strong>Video</strong>View displays a QuickTime tag that contains a video poster (i.e., the<br />

same thumbnail image) and a playlist of videos. The view also includes two<br />

HTML elements that displays the video title and duration.<br />

- 65 -


Figure 23: <strong>Video</strong> View<br />

This view is being generated by <strong>Video</strong>sView.java class.<br />

Below is the implementation of public void load<strong>Video</strong>View(<strong>Video</strong>Tag<br />

videoTag) This method as in input received a <strong>Video</strong>Tag object and build the<br />

view:<br />

public void load<strong>Video</strong>View(<strong>Video</strong>Tag videoTag){<br />

- 66 -


}<br />

VerticalPanel vp = new VerticalPanel();<br />

HorizontalPanel hubRow1Panel = new HorizontalPanel();<br />

hubRow1Panel.setStyleName("videoPanel");<br />

HorizontalPanel videoPanel = new HorizontalPanel();<br />

VerticalPanel metaDataPanel = new VerticalPanel();<br />

metaDataPanel.setStyleName("metaDataPanel");<br />

HTML videoTitle = new HTML(video.getTitle());<br />

videoTitle.setStyleName("videoTitle");<br />

int durationInSeconds = video.getDuration();<br />

int minutes = durationInSeconds/60;<br />

int seconds = durationInSeconds - (60*minutes);<br />

String duration = "";<br />

if(seconds==0){<br />

duration = new Integer(minutes).toString()+":00";<br />

}else if(seconds


Figure 24: A <strong>Video</strong> is Being Played by the iPhone Native Media Player<br />

- 68 -


IX. Summary and Future Work<br />

While the CNN native iPhone application works well as a prototype, some<br />

changes to the design of the <strong>Vmoox</strong> system will be made as individual publishers<br />

purchase the service. Each client has a unique set of requirements and both the<br />

application and service will be modified slightly in each case to fit those. One of<br />

the major components of this prototype is the division into 3 - minute chapters, a<br />

feature that may change per client needs and specifications.<br />

In this prototype the decision to break video files up into 3 - minute chapters<br />

comes from a desire avoid wasting server s<strong>pace</strong> and computation resources by<br />

only performing a full transcode on files which are actually viewed. The initially<br />

transcoded section provides the buffer with which to avoid any wait time on the<br />

user- end. Simply put, while the user watches the first 3 minutes of the clip, the<br />

rest of the clip is transcoding in the background. In order to improve efficiency<br />

even more, a future modification of the <strong>Vmoox</strong> algorithm will include a “stop<br />

transcode” feature which will identify when a user has stopped viewing a clip and<br />

instruct the system to cease transcoding any remaining chapters. This is<br />

significant because recent research indicates that the average duration of video<br />

consumption on mobile devices is 3.2 minutes [13]. Data collected by publishers<br />

about their individual audiences may impact the way the <strong>Vmoox</strong> service interacts<br />

with their content (i.e., CNN viewers might have a lower or higher average<br />

view time, calling for an adjustment to chapter lengths). We believe that<br />

customization is a key part of <strong>Vmoox</strong>’s potential for success. Though several<br />

transcoding solutions exist in the market, we have not yet found one that offers a<br />

customizable ‘one-stop-shop’ approach to content management, transcoding<br />

and delivery.<br />

- 69 -


X. References<br />

[1] http://www.vmoox.com<br />

[2] Scott Ruthfield. "The Internet's History and Development From Wartime Tool<br />

to the Fish-Cam". http://www.acm.org/crossroads/xrds2-1/inet-history.html<br />

[3] Schneidawind, J: "Big Blue unveiling", USA Today, November 23, 1992, page<br />

2B<br />

[4] PC World Staff (PC World) 19/09/2007. "In Pictures: A History of Cell<br />

Phones". http://www.pcworld.idg.com.au/article/194761/<br />

pictures_history_cell_phones?img=486&ssid=1<br />

[5] Alana Semuels: "Smartphones now have one-third of market share globally,<br />

report says", March 24, 2009. http://latimesblogs.latimes.com/technology/<br />

2009/03/android-smartph.html<br />

[6] SCOTTSDALE, Ariz: "Smartphones Will Double Their Share of the Handset<br />

Market by 2013", March 2, 2009. http://www.instat.com/<br />

press.asp?ID=2465&sku=IN0804050WHFigure<br />

[7] "The Ongoing Smartphone Revolution", March 23, 2009. http:/<br />

/seekingalpha.com/article/127294-the-ongoing-smartphone-revolution<br />

[8] Sarah Radwanick: "The 2008 Digital Year in Review", comScore Whitepaper,<br />

January 30, 2009. http://www.comscore.com/Press_Events/<br />

Presentations_Whitepapers/2009/2008_Digital_Year_in_Review<br />

[9] A2/M2 Three Screen Report: "Television Internet and Mobile Usage in the<br />

U.S.", 1st Quarter 2009. http://blog.nielsen.com/nielsenwire/wp-content/uploads/<br />

2009/05/nielsen_threescreenreport_q109.pdf<br />

[10] "Evolution of Dance". http://www.youtube.com/browse?s=mp&t=a&c=0&l=<br />

[11] Paul Thomasch: "Giants and Patriots draw record Super Bowl audience",<br />

February 4, 2008. http://www.reuters.com/article/topNews/<br />

idUSN0420266320080204<br />

[12] Nielsen "An Overview of Home Internet Access in the U.S.",<br />

December, 2008. http://blog.nielsen.com/nielsenwire/wp-content/uploads/<br />

- 70 -


2009/03/overview-of-home-internet-access-in-the-us-jan-6.pdf<br />

[13] "U.S. Online <strong>Video</strong> Viewing Surges 13 Percent in Record-Setting December<br />

", comScore Press Release, February 4, 2009. http://www.comscore.com/<br />

Press_Events/Press_Releases/2009/2/US_Online_<strong>Video</strong>_Viewing_Sets_Record<br />

[14] Serge Jespers: "Flash <strong>Video</strong> market share continues to grow", February 5,<br />

2009. http://www.webkitchen.be/2009/02/05/flash-video-marketshare-continuesto-grow/<br />

[15] University Of Gottingen: "Approaches to Reduce Energy Consumption of<br />

WLAN Devices", September, 2004. http://whitepapers.techrepublic.com.com/<br />

abstract.aspx?docid=175825<br />

[16] iPhone Technical Specifications, August, 2009. http://www.apple.com/<br />

iphone/specs.html<br />

[17] Seronia media, August, 2009. http://www.sorensonmedia.com/videodelivery-network/<br />

[18] Cameron Christoffers: "Encoding.com Relaunches as SaaS <strong>Video</strong> Encoding<br />

Platform", June 26, 2008. http://www.techcrunchit.com/2008/06/26/encodingcomrelaunches-as-saas-video-encoding-<strong>platform</strong>/<br />

[19] Wikipedia: "Software as a service", August 2009. http://en.wikipedia.org/wiki/<br />

Software_as_a_service<br />

[20] ITU Corporate Strategy Newslog: "ITU Corporate Strategy Newslog", April<br />

29, 2005. http://www.itu.int/osg/spu/newslog/<br />

ITU+H264+The+Advanced+<strong>Video</strong>+Coding+Standard.aspx<br />

[21] ITU-T H.264 The Advanced <strong>Video</strong> Coding Standard: "New opportunities for<br />

video communication". http://www.itu.int/itudoc/gs/promo/tsb/87066.pdf<br />

[22] Wikipedia: "List of video services using H.26", August 2009. http:/<br />

/en.wikipedia.org/wiki/Software_as_a_service<br />

[23] QuickTime Technologies - H264: " H.264: Stunning clarity from 3G to HD.",<br />

August, 2009. http://www.apple.com/quicktime/technologies/h264/<br />

[24] Erick Schonfeld: "iPhone Makes Up 50 Percent of Smartphone Web Traffic<br />

In U.S., Android Already 5 Percent", March 24, 2009. http://www.techcrunch.com/<br />

2009/03/24/iphone-now-50-percent-of-smartphone-web-traffic-in-the-us/<br />

- 71 -


[25] BlackBerry Storm Specification, August, 2009. http://na.blackberry.com/eng/<br />

devices/blackberrystorm/storm_specifications.jsp<br />

[26] What is Android, August, 2009. http://developer.android.com/guide/basics/<br />

what-is-android.html<br />

[27] Palm Pre: "Details", August, 2009. http://www.palm.com/us/products/phones/<br />

pre/<br />

[28] FFmpeg: "Project Description", August, 2009. http://ffmpeg.org/<br />

[29] Wikipedia: "libavcodec", August, 2009. http://en.wikipedia.org/wiki/<br />

Libavcodec<br />

[30] FFmpeg, August, 2009. http://wiki.videolan.org/Ffmpeg<br />

[31] <strong>Video</strong>Lan: "Streaming", August, 2009. http://www.videolan.org/vlc/<br />

streaming.html<br />

[32] Perian: "The swiss-army knife for QuickTime", August, 2009. http:/<br />

/perian.org/<br />

[33] Bennett, Keith; et al: "Service-based software: the future for flexible<br />

software" (PDF), December, 2000. Seventh Asia-Pacific Software Engineering<br />

Conference, 2000. APSEC 2000.. Proceedings: Seventh Asia-Pacific Software<br />

Engineering.<br />

[34] Sahil Parikh: "Going SaaS? The pros & cons", September 17, 2008. http:/<br />

/www.saasburst.com/tag/saas-advantages/#http://www.saasburst.com/tag/saasadvantages/<br />

[35] Traudt, Erin; Amy Konary: "2005 Software as a Service Taxonomy and<br />

Research Guide 7", June, 2005 IDC.<br />

[36] Xstream: "About Xstream", August, 2009. http://xstream.codehaus.org/<br />

[37] Wikipedia: "Representational State Transfer (REST) ", August, 2009. http:/<br />

/en.wikipedia.org/wiki/Representational_State_Transfer<br />

[38] Hibernate: "Relational Persistence for Java and .NET", August, 2009. https:/<br />

/www.hibernate.org/<br />

[39] Wikipedia: "Coupling (computer science)", August 2009. http:/<br />

- 72 -


en.wikipedia.org/wiki/Coupling_(computer_science)<br />

[40] Joanne M. Atlee: "Software Engineering: Theory and Practice, Third Edition"<br />

[41] Lawrence Wilkes: "ROI - The Costs and Benefits of Web Services and<br />

Service Oriented Architecture". http://roadmap.cbdiforum.com/reports/roi/<br />

[42] Regina Lynch: "Article: JSON for Ajax Web services", October 19, 2006.<br />

http://www.theserverside.com/news/thread.tss?thread_id=42722<br />

[43] json-framework: "A strict JSON parser/generator for Objective-C", August,<br />

2009. http://code.google.com/p/json-framework/<br />

[44] CornerWorld: "Online <strong>Video</strong> Advertising Will Gain Considerable Market<br />

Share", April 26, 2009. http://cornerworld.com/online-video-advertising-will-gainconsiderable-market-share/<br />

[45] MySql: "The world's most popular open source database", August, 2009.<br />

http://www.mysql.com/<br />

[46] GWT: "Write AJAX apps in the Java language, then compile to optimized<br />

JavaScript", August, 2009. http://code.google.com/webtoolkit/overview.html<br />

[47] iPhone SDK 3.0: "Developing for iPhone OS 3.0", August, 2009. http:/<br />

/developer.apple.com/iphone/<br />

[48] David Geary: "Simply Singleton, Navigate the deceptively simple Singleton<br />

pattern", April 25, 2003. http://www.javaworld.com/javaworld/jw-04-2003/jw-0425designpatterns.html<br />

[49] MVC: "Model-View-Controller", August, 2009. http://java.sun.com/blueprints/<br />

patterns/MVC.html<br />

- 73 -

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!