Are the Videos We are Watching Online Media Fragment Ready?

The Media Fragments URI (basic) has been published as a W3C recommendation since Sep, 2012. It's pretty excited to see that many use cases have already come about to use media fragments for better linking and indexing of multimedia resources. A recent webniar given by one of the chairs of W3C Media Fragments Working Group, Raphael Troncy, has pointed out that YouTube and Dailymotion has partially implemented the specification (See the slices below).What really interest me now is how many "big players" in this area have actually implemented or partially implemented this specification, i.e. are they "media fragment ready"? So I spent a couple of days to investigate the video sharing applications online. If you are not interested in how I did the experiment, you can jump directly to see the result.

Describing Media Assets: Media Fragment Specification and Description from Raphael Troncy

The Methdology

First things first, I needed to find out a list of websites I want to take a look at. Fortunately, I found a wikipedia page with a list of major video sharing platforms in different countries. In my opinion, some "major" players are not listed there, such as videolectures.net and ted.com. So I add them into the list and removed a couple of them as they are not public video sharing services or they are severing adult content. You can see all the 59 websites I investigated in the final result.

Honestly, what I did next was not contacting all the websites one by one and asking them "can you give me a URI that points to a certain time or spatial area of the video resources hosting on your website?". I just went to each website and tried the following steps to find out the answer:

1. Open a desktop browser. I used Google Chrome for this investigation.
2. Go to the landing page of a random video. Login if necessary.
3. Right click on the player, of course it must be a flash player, and see if there is an selection called something like "Get video url at the current time".
4. On the landing page, find out whether there is any social sharing button (including the buttons emerged after you pause the video player) allowing you to share the video at a certain time point.
5. Go to Twitter and search whether any video fragment has been shared recently.
6. If none of the above works, I would make the conclusion that this website doesn't support media fragments, at least doesn't support W3C Media Fragment (basic) Specification.

The methodology is not flawless and I may have missed something. So if you find anything that is not correct in the result table, please feel free to make comments and I will mend it.

The Result Table

Table 1 and 2 are my investigation results. Table 1 shows the name of the website, their implementation status of temporal and spatial fragments and the page views per day. The page views per day is obtained by myself from manually searching http://www.websiteoutlook.com/ . I am not 100% sure if they have provided the accurate data. But compared it with the site traffic data from wikipedia, they seem more or less match. So currently I just trust websiteoutlook.com. All the site views data is valid in Oct,2013.

Table 1. Media Fragment Compatibility on Video Hosting Services

Hoster	t	xywh	PageViews/Day	Notes
56.com	Partially	No	7,142,857	Chinese→
Archive.org	No	No	5,978,260
AfreecaTV	Unknown	Unknown	91,674	Korean→
Blip.tv	No	No	214,174
BlogTV	No	No	33,475	Now at www.younow.com/
Break.com	No	No	804,681
Buzznet	No	No	120,733
Comedy.com	No	No	3,520
Crackle	No	No	344,611
DaCast	No	No	2,897	Online Video Streaming. Haven't tried.
Dailymotion	Partially	No	11,702,127
EngageMedia	No	No	3,426
ExpoTV	No	No	34,042
Facebook	No	No	18,600,000	video since 2007. Estimated based on this report.
Funnyordie.com	No	No	506,678
Funshion	No	No	601,300	Chinese→ Page views according to http://www.websitelooker.net/
Fotki	No	No	139,611
GodTube	No	No	68,909	formerly Tangle.com
Hulu	Partially	No	3,142,857	Area restriction→
Lafango	No	No	11,620
LeTV	No	No	3,459,119	Chinese→
Liveleak	No	No	1,929,824
Mail.ru	No	No	0	Page views unknown as the video section is a subset of the whole website, and there is no relevant data about video views online.
Mefeedia	No	No	173,803	Area Restriction→
Metacafe	No	No	1,127,049
Mevio	No	No	52,276
Mobento	No	No	1,014	Focus on video search
Myspace	No	No	0	No data about the video views.
MyVideo	No	No	553,319
MUZU.TV	No	No	13,801
Nico Nico Douga	No	No	7,746,478	Japanese
Openfilm	No	No	8,810
Photobucket	No	No	0	Mainly sharing photoes (5,263,157 views per day). Not sure about video views.
RuTube	No	No	601,750	Russian
Sapo Videos	No	No	0	Portuguese. Sapo.pt is a portal website, not sure about the video views everyday.
SchoolTube	No	No	9,893
ScienceStage	No	No	10,314
Sevenload	No	No	7,291
SmugMug	No	No	542,138
Tape.tv	Unknown	Unknown	41,323	Area Restrictions→
TED.com	No	No	722,733	only music videos
Trilulilu	No	No	68,293	Romanian
Tudou	Partially	No	6,010,928	Chinese→
Vbox7	Partially	No	319,303	Bulgarian→
Veoh	No	No	359,359
Vevo	No	No	685,358
Viddler	No	No	122,073
Videojug	No	No	86,901
Videolog	No	No	79,687	Portuguese
videolectures.net	No	No	6,697	So few views? I thought it should be more.
Vidoosh	No	No	3,786
Viki.com	No	No	203,628	Allow timed comments
Vimeo	Partially	No	19,680,000
Vuze	No	No	54,380
Wildscreen.tv	No	No	987
Wistia	No	No	153,331
Yahoo! Video	No	No	10,000,000	video since 2008. Estimated based on this report.
Youku	Partially	No	15,277,777	Chinese→
YouTube	Partially	No	366,666,666

Table 2. The Supported Media Fragment Syntax in Different Video Hosting Services

Hoster	Example url	Fragment variable
56.com	http://www.56.com/u92/v_OTgwMTk4NDk.html#st=737
Dailymotion	http://www.dailymotion.com/video/xjwusq&start=120 (is this a bug?) http://www.dailymotion.com/video/xjwusq?start=120	"start" query in seconds
Hulu	http://www.hulu.com/embed.html?eid=sepr2dtbsyn7idlhbuzlbw&et=135&st=13&it=i91	st query as start time and et query as end time.
Viddler	http://www.viddler.com/v/bb2a72e9?offset=12.083&secret=32758627	"offset" query in seconds
Vimeo	http://vimeo.com/812027#t=214 http://vimeo.com/812027?t=214	"t" query or hash in seconds
Tudou	http://www.tudou.com/listplay/H9hyQbAj4NM/2tzZHTtq4GA.html?lvt=30	"lvt" query in seconds
Youku	http://v.youku.com/v_show/id_XNjE2OTQ0MTI4.html?ev=5&firsttime=147	"firsttime" query in seconds
YouTube	http://www.youtube.com/watch?v=Wm15rvkifPc#t=120 http://www.youtube.com/watch?v=Wm15rvkifPc?t=120 http://www.youtube.com/watch?v=Wm15rvkifPc&t=1h9m20s http://www.youtube.com/watch?v=Wm15rvkifPc#t=1h9m20s	"t" query or hash in seconds or DDhDDmDDs format

Discussions

I have examined totally 59 websites, but only 8 of them have implemented some notion of media fragments in their system. The syntax (at least the variable) in each website are different and most of them represent the time fragments in seconds. In addition, none of them actually expose the spatial fragment. From this point of view, the result might be a little bit disappointed (see Figure 1).

Then, let's consider more about the page views per day. In my opinion, this is a very important reference. It shows how many videos, which users actually watch, can be further exposed by media fragments and furthermore, could be shared via social media, indexed by search engines and even linked to named entities on fragment level.

Clearly, in Figure 2. we can see that only 12.2% of the views of the video are not related to media fragments. It's really excited to know that most videos we watched are already (at least partially) media fragment ready. This information can be interpreted in several ways. If I am a user and I want to share only part of the video with my friends, nearly 9 out of 10 chances, I can do it. More importantly, most videos that we watched, can be further indexed on fragment level. This new SEO possibility will definitely bring more traffic to websites whoever implement it. Please keep in mind that, there are still "big players" like Hulu that I haven't investigated yet. So the potential media fragment ready videos could be even larger.

Language Barrier and Area Restrictions

I cannot access some of the websites as they are limited to a certain countries and regions. And some of them are in another language other than English and Chinese. So I don't know how to proceed the methodology to find out the media fragments. Please drop me a comment if you have any update about those websites.

Media Fragment in China

I am glad to see that the largest three video sharing or delivering services in China, Tudou (土豆网), Youku(优酷) and LeTV (乐视) have already partially supported media fragments. Unlike YouTube or Dailymotion, Chinese guys give media fragments a very fashionable name "Chuanyue (穿越)", which means you can magically move something from one place to another. This calling seems confused, but what they (actually "we") want to say is that you can watch the video on any of your device, pause at any time, and start to watch from that time on any other device. So it looks like the video has been moved from one device to another and the status of the video is kept through.

Conclusions and Future Work

In this post, I presented some media fragments URI compatibility investigation for video sharing applications online. The result shows that even though the number of websites who implemented media fragments specification is not large, the major players in this area has already developed the notion of media fragments into their systems, even though they follow different syntax. It's very encouraging to see that nearly 90% of our daily watched videos are "media fragment ready".

Of course, there are many things we need to improve for this investigation, especially collecting more relevant and accurate data:

1. It's better if we can get the video viewing data instead of page viewing data. After all, you can browser channels on YouTube without actually watching the video.
2. Find out how many videos each site host. That will be the potential videos that could be exposed by media fragments and indexed on fragment level. Well, not all of them will be treated equally because many of them may not be watched as frequently as others.
3. It will be also interesting to investigate which website can make timed comments, i.e. comments aligned with the timeline of the video. I know we can do that on YouTube and Viki. So theoretically, if they have timed comments enabled, they should have implemented the player api of jumping to a certain time point of the video. But they may not have exposed it as part of the video landing page url.

This is only a kick start of a more comprehensive and maybe scientific investigation on the media fragment readiness for the video sharing services online. Now, take a wide guess of how we can use the data presented in Table 1 and Table 2. Maybe you have already got some thoughts? Leave me a comment then.

P.S. I again need to mention my work about Synote and the Media Fragment Enricher. They are complete compatible with Media Fragment URI Specification for the video landing page :=)

Synote Media Fragment Player v1.0: A hack of sharing media fragments on Tumblr

We have just released a new version of Synote Media Fragment Player (smfplayer) v1.0. Compared with the v1.0-alpha, we fixed a few bugs and did more tests on different platforms. In this blog, I am trying to explain how to use smfplayer in Tumblr, and make it possible to share and highlight media fragments in your Tumblr blog.

The problems of sharing media fragments on social networks

See the following twitter message I have sent last year. I only shared a media fragment in the tweet.

In this case, the video server must be able to handle the media fragment, i.e. parsing the fragment URI and highlight the video fragment. YouTube and Dailymotion has partially implemented this function. If you write click on the YouTube Flash player, you will see a link "copy URL at current time". Unfortunately, the string format of those URL are not compatible with the W3C Media Fragment Specification (basic) and they cannot highlight spatial fragments.

That is the reason we designed Synote Media Fragment Player (smfplayer). In the previous blog, I explained how to use smfplayer in Blogger.com. Theoretically, this method could be extend to other blogging or CMS systems such as WordPress, where you have a fully control of the web-page template and the rendering of the template.

Well, I have to admit that smfplayer doesn't work on Twitter and Facebook as the user doesn't have any control of how Twitter and Facebook rendering the embedded video code at all. However, Tumblr is a kind of exception.

Some words about Tumblr

For anyone who doesn't know Tumblr very well, Tumblr is a new microblogging and social network platform. It's sort of like Twitter+Facebook, where you can easily share multimedia posts (images, audio and video) around your followers. You have a blog page, where all your blogs can be viewed, and you can get updates about other users' new sharings on the Dashborad. The blogs on Tumblr are usually short (one sentence, one image, etc) compared with Blogger.

Video sharing is very straight forward on Tumblr. You can embed video code or upload a video yourself. The challenge for me is that is it possible to use smfplayer in Tumblr?

How To?

It's not difficult, but you need to know some programming skills. Firstly, you need to customize your theme and add the smfplayer css and javascript files into the header:

<link href="http://smfplayer.synote.org/smfplayer/build/mediaelementplayer.min.css" rel="stylesheet" type="text/css"></link>
<link href="http://smfplayer.synote.org/smfplayer/build/smfplayer.css" rel="stylesheet" type="text/css"></link>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="http://smfplayer.synote.org/smfplayer/build/mediaelement-and-player.min.js" type="text/javascript"></script>
<script src="http://smfplayer.synote.org/smfplayer/build/smfplayer.min.js" type="text/javascript"></script>

Then the next question will be how can I initialise smfplayer, in the template. This is the tricky part! If you look at the html code of the template, you will see that all the posts, such as text, image, audio, chat and audio, they are placed in {block:something} tag. For example, this is the code for Photo block:

{block:Photo}
<div class="media">{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" />{LinkCloseTag}</div>
    {block:Caption}<div class="copy">{Caption}</div>{/block:Caption}
{/block:Photo}

The code is similar to Video block. So one straight forward thinking will be that we create a video/photo post first, and then replace the div media with smfplayer. But how can we locate the correct div with media class for the video as there might be many such divs? And how can we pass the media fragment URI to initialise smfplayer? To solve these two problems, we need to make full use of the div class="copy" and the HTML editor provided by Tumblr.

Whenever you publish a photo or video post, you can add "caption" for the post and you are allowed to embed HTML into the caption. So I can create a post like this:

The div class="smf-placehoder" specifies that the media embedded in this post needs to be replaced by smfplayer. We also use HTML5 data api to define the actual "mfuri" that will be used to replace the media div. This is because embedding video in Tumblr from YouTube or other resources will result in an iframe, which will depend on the video providers. So it's difficult to traverse the DOM node and find the exact URI of the video. Then, we can add the following code into the html head:

$(document).ready(function(){
    var placeholders = $(".smf-placeholder");
    if(placeholders.size() >0)
    {
        $.each(placeholders,function(index,placeholder){
              var smf_div = $(placeholder).closest(".copy").prev(".media");
              var mfuri = $(placeholder).data("mfuri");
              if(mfuri!==undefined){
                 smf_div.empty();
                 var player = smf_div.smfplayer({
                       mfURI:mfuri, 
                       autoStart:false,
                       width:480,
                       height:320
                 });
                            
              }
        });
    }
});

The code will find the nearest div media and initialise the smfplayer. The following image is a screenshot of the blogpost on tumblr. You can also goto example1 and example2 to see it yourself.

Known Issue

One serious problem of this solution is that Tumblr actually depends much on "Dashboard", which has nothing to do with the template. So your followers won't be able to see any video playing on your blogpost from their Dashboard. What they can see are only captions :( As a temporary solution, we can upload a thumbnail image as a photo post and add a link "View Media Fragment" to lead users to open the actual blog page. This will also be a problem for users on tablets and mobile phones. 

The template of Tumblr may vary from users to users. So the code that is working for my template doesn't necessarily work in your template. However, the basic idea is that you use caption and html data api to save the media fragment uri and initialise smfplayer from javascript.

Conclusions

In this blog, I introduced a way to share media fragments on Tumblr. This solution is still a hack, but should work well as a demo to explore new ways of sharing videos. Again, a more sophisticated solution is that the social network platforms can support the sharing of media fragments natively following the W3C Media Fragment specification.