Kaltura HTML5 Update, brings New Features and Best In Class Performance – Kaltura Community Blog

The Kaltura HTML5 team has been hard at work on a major update to Kaltura’s HTML5. The HTML5 1.7 release brings many new features, enhancements, bug fixes, more robust device support and massive performance  enhancements. Built with laser focus on the shifting platform ecosystem, the library is trail blazing both desktop and mobile HTML5 many industry players only support mobile html5.  To help readers digest this massive update, this blog post is broken into three sections; Performance, Embedding and Features.

via Kaltura HTML5 Update, brings New Features and Best In Class Performance – Kaltura Community Blog.

Posted in html5, JavaScript, Kaltura, Kaltura Javascript, mwEmbed, Open Source, Open Standards | Leave a comment

HTML5 Dev Conf Recap

Earlier this week the second anual HTML5 dev conf took place in San Francisco. Speakers shared the trials and tribulations of developing for the HTML5 platform, and what we have in store for the future. You can check out the sessions on the HTML5 developers conference site, they should have videos and slides posted there shortly.

My talk was titled HTML5 Video Full Throttle; You can check out the slides and here is a summary of the talk: Continue reading

Posted in Uncategorized | Leave a comment

FOMS Workshop and the State of Open Web Video

The 2012  FOMS workshop took place in Paris, France. The working meeting consisted of focused sessions dedicated to bridging gaps among browser vendors and ensuing associative APIs meet the needs of developers that are making use of them. Browser vendors represented included Google Chrome, Mozilla Firefox, and Opera. Players platforms such as Youtube, BrightCove / VideoJS, Long tail / jwPlayer and of course Kaltura were also represented.

Organised by Siliva, the meeting has long severed as a great space to hack and ‘get things done‘ in the open media standards and software space. This year was no exception. In this post I highlight some of the sessions that took place and provide a rough summery of the state of associated web video APIs. Continue reading

Posted in Codecs, Firefox, html5, JavaScript, Microsoft, webRTC | Leave a comment

Watching Watchers; News Archive Video Wall with WebRTC and HTML5

The Internet archive yesterday unveiled their massive tv news archive. You can read all about in the ny times article or on boing boing. This 300K + hour archive of news programming opens up all sort of interesting mash-up possibilities.

In July in collaboration with mozilla ignite, the archive hosted a giabit meetup event over the course of 2 days; to build applications that take advantage of next generation Internet. In those two days were able to explore giabit apps and a preview version of the tv news archive.

The Video Wall — news archive mashup

A nice use for seemingly unlimited bandwidth was to build a ‘video wall’ comprising of politicly relevant content, per trending news articles on google news. Then this video wall would let you quickly dive into the news archive footage relevant to today’s headline.

We also wanted to explore aspects of symmetric high speed networks, so we added support for a web-sockets stream that highlighted in real-time which clip others were watching within the trending news item channel. Then for users of the chome canary  we could open a bidirectional video chat ( using webRTC ) for any time you were watching the same political news segment as any other participant. Letting you watch the watchers; and the watchers watch you. Instantly creating a space to discuss the media segment you are both watching.

You can access the video wall here on html5 video.org, and any instance of the video wall will connect to others via the web socket echo server on r-w-x.org

Source code for video wall. Video wall was created by Jan, Kate, and Michael.

Posted in CU-RTC-Web, html5, JavaScript, video | Leave a comment

Kaltura Community Hangout Tomorrow at 4pm Eastern

Join us during our first Google Hangout for the Kaltura Community.

During this meeting we’ll be talking with Andrew Davis and Michael Dale about best practices for including Kaltura videos in Web Apps, and Thomas Huzij will talk about using Kaltura APIs to build a Paypal pay per view website.

The Kaltura Community Office Hours are a great opportunity for developers to meet the core Kaltura team and ask questions about integration best practices that will help you write less code that does more. We have a loose but formal structure for the beginning of the meetings, but we open it up for general discussion afterwards. All questions are welcome—if you’re having an issue with any part of the Kaltura platform this is an excellent opportunity to tell the developers how we can better serve you.

Bring any questions you may have for Office Hours after the presentations.

Registration: http://site.kaltura.com/Kaltura_US_Google_Hangout_Registration.html
Live Stream: http://www.youtube.com/user/KalturaCorp
Google+ Page: https://plus.google.com/b/106504626342068252246/106504626342068252246/posts

Posted in Hangout, html5, JavaScript, Kaltura, Kaltura Javascript, mwEmbed, Open Source, Publishing, video, Webinar | Leave a comment

mwEmbed on GitHub

As part of a large scale migration of all our open source code from Kaltura.org SVN to Github, we are pleased to announce that all day to day development of the Kaltura Javascript Library for HTML5 Media, mwEmbed, has moved to Github.

https://github.com/kaltura/mwEmbed

Just check out how rapidly the library has been developing over the past months due to both the move to git’s feature based development branch model and the addition of new team members:

https://github.com/kaltura/mwEmbed/network

In other related news, we’ve revamped the html5video.org Testswarm to take advantage of Github’s Pull Request system and test pull requests in a sandboxed environment so that all additions to the development branch undergo integration tests to insure that no feature is overlooked while we continue to expand and improve the library. Of course we’re also testing all tagged revisions as well. Point your browsers at Testswarm and help us make sure that we’re testing on all modern web platforms.

Posted in html5, JavaScript, Kaltura Javascript, mwEmbed | Leave a comment

Quality Assurance Testing with TestSwarm and QUnit

Kaltura’s HTML5 Media Library is continuously tested upon each commit to the svn repository.
Testing is performed on Internet Explorer 7 through 9, Firefox 3.6 and the latest Firefox, the latest Google Chrome, Android 2.x, 3.x, and 4.x, the latest Safari, latest iPhone, and the latest iPad running on a private virtualization cluster.
Each revision to the library triggers a job submission to our TestSwarm server. Test results can be viewed at http://html5video.org/testswarm/user/html5video .

Please visit the html5video.org wiki for the most recent version of this document.

Running Tests

TestSwarm is a simple php application that anyone may visit with their browser and their browser will be added to the testing swarm, running any tests in the testing queue.
To add your browser to the testswarm, visit http://html5video.org/testswarm/run/html5video .
Once your browser loads the page, TestSwarm will continually run tests in an iFrame testrunner until the browser is closed.

Interpreting Test Results

The Kaltura HTML5 Video Library’s test results are stored at http://html5video.org/testswarm/user/html5video/ where testswarm provides a way to drill into test results and view errors and passes from test runs.
To open a specific test job, click on the Name of the job:
And this will open the job report for this commit.
Clicking on the svn revision number will take you to the ChiliProject repository browser where you may view the difference to the library that this revision contains. Clicking on the Name of a test will run the test in your browser, and clicking on a green, red, or black square will take you to the result page for specific browser and test combinations:

Writing Tests

Testing with QUnit

QUnit is a testing framework for JavaScript that jQuery uses to perform regression and unit testing on the jQuery library.
From the QUnit website:

QUnit is a powerful, easy-to-use, JavaScript test suite. It’s used by the jQuery project to test its code and plugins but is capable of testing any generic JavaScript code (and even capable of testing JavaScript code on the server-side).

QUnit runs any JavaScript and adds assertions that will pass or fail according to weather the code being tested operates as expected.
The following is a simple example with two tests.
test( "a basic test example", function() {
        ok( true, "this test is fine" );
        var value = "hello";
        equal( value, "hello", "We expect value to be hello" );
})
Here is the full source code for a web page that includes the previous tests and the appropriate javascript includes:
<!DOCTYPE html>
<html>
<head>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <link rel="stylesheet" href="http://code.jquery.com/qunit/git/qunit.css" type="text/css" media="screen" />
        <script type="text/javascript" src="http://code.jquery.com/qunit/git/qunit.js"></script>
        <script>
                $(document).ready(function(){
                        test("a basic test example", function() {
                                ok( true, "this test is fine" );
                                var value = "hello";
                                equal( value, "hello", "We expect value to be hello" );
                        });
                });
        </script>
</head>
<body>
        <h1 id="qunit-header">QUnit example</h1>
        <h2 id="qunit-banner"></h2>
        <div id="qunit-testrunner-toolbar"></div>
        <h2 id="qunit-userAgent"></h2>
        <ol id="qunit-tests"></ol>
        <div id="qunit-fixture">test markup, will be hidden</div>
</body>
</html>
Running this test will result in the following:

Automatic Test Selection

Each plugin that is stored in the svn repository lives in its own folder within the “modules” folder like http://www.kaltura.org/kalorg/html5video/trunk/mwEmbed/modules/KalturaSupport
Within the plugin folder there is a folder called tests that contains html files. If the file ends with .qunit.html then that file will be added to the testing queue upon each update to the svn repository.

Kaltura QUnit Implementation

Kaltura has built upon QUnit to test its HTML5 video library and made the creation of tests very straightforward. Merely include the qunit-bootstrap.js file and the mwEmbedLoader.php in your demonstration or testing page, and then add your tests in a JavaScript <script> block in a function called jsKalturaPlayerTest. The final step is adding the qunit-kaltura-bootstrap.js below any mw.setConfig and jsCallbackReady directives necessary to setup players and plugins for testing.
<script type="text/javascript" src="../../../tests/qunit/qunit-bootstrap.js"></script>
<script type="text/javascript" src="../../../mwEmbedLoader.php?debug=true"></script>
<script type="text/javascript">	
function jsKalturaPlayerTest( videoId ){
 
	var $iframe = $('#' + videoId + '_ifp').contents();
	var iframeContext = window.frames['kaltura_player_ifp'];
 
	test( "Iframe in DOM", function() {
		ok( $('#' + videoId + '_ifp').length , 'iframe found' );
		equal( typeof iframeContext, 'object', "iframe JavaScript context available" );
	});
}
</script>
<!-- qunit-kaltura must come after qunit-bootstrap.js and after mwEmbedLoader.php and after any jsCallbackReady stuff-->
<script type="text/javascript" src="resources/qunit-kaltura-bootstrap.js"></script>
Please view the source for the Basic Player Test and the tests folder for further examples.
Posted in Uncategorized | 1 Comment

Kaltura HTML5 Media Library v1.5 Released

We’re happy to announce the deployment of version 1.5 of the Kaltura HTML5 Video Library. This  release includes a number of enhancements in the playlist handler, the addition of QUnit tests for many player features and many additional plugins. This blog post will give you a high level overview of all the changes. For more in-depth coverage follow the html5video.org wiki.

The Kaltura library update has been deployed to both .org and .com to enable html5 links provided to you by the KMC and to the html5.kaltura.org/js location. Its important that if you’re a Kaltura customer you contact your project manager or Kaltura support to update your script includes to the .com hosted version of the library. The .org location will continue to host the latest version of the library and is a good way to play around with new features, but is less recommend for production sites.

Continue reading for the full release notes on this Kaltura html5 video library update:

Continue reading

Posted in Library Release | Tagged | Leave a comment

Adobe to forgo Flash plug-in for mobile devices

Our future work with Flash on mobile devices will be focused on enabling Flash developers to package native apps with Adobe AIR for all the major app stores.  We will no longer continue to develop Flash Player in the browser to work with new mobile device configurations (chipset, browser, OS version, etc.) following the upcoming release of Flash Player 11.1 for Android and BlackBerry PlayBook.”

via jvaughan: Adobe to forgo Flash plug-in for mobile devices.

Posted in Flash, html5 | Leave a comment

The Open Video Conference 2011: Getting Things Done

The Open Video Conference is an annual event that brings together video creators, intellectual property scholars, and developers for a weekend of creating, remixing, and hacking. The conference was combined with the Foundations of Open Media Software workshop which attracted the developers of Opera, Firefox, and Webkit (Perhaps Microsoft should keep an eye out for next year’s conference?).

2011’s OVC departed from last year’s monolithic format of session on top of session, opting for a smaller crowd with tracks devoted to getting things done. Around 400 of us were privileged to attend, and we were able to shift between the creative, copyright, and development tracks as needed to effectively share knowledge between these disparate but related fields–and did we get things done!

This post focuses on the development sessions at #ovc2011.
Stay tuned to our news feed for information more attuned to video
creators.

Popcorn.js

Popcorn.js was the focus of a few working groups. Over the past year Popcorn has graduated from Bocoup’s open source incubator and with the assistance of Mozilla it has become a project in its own right within the Mozilla Web Made Movies initiative.

Fork Popcorn.js on GitHub.

Popcorn Maker

Butter, the Popcorn authoring tool is being rewritten by Bobby Richter from the ground up and rebranded as the Popcorn Maker.

The Popcorn Maker expands on Butter to provide multitrack timeline editing for composing Google Maps, Wikipedia, Twitter, and other Popcorn plugin data assigned to html divs.

Try it now, or Fork the Popcorn Maker on GitHub.

Remixer

Jonathan McIntosh, Zohar Babin, and Boaz Sender began the conference with a development session geared toward making an HTML5/popcorn.js video version of the Gendered Advertising Remixer. McIntosh’s advertisement remixer uses the regimented timing of children’s toy advertisements to encourage viewers to swap audio and video from male and female ads–showcasing how gender is taught via mass media. Try the demo for yourself, and fork the project on GitHub to reuse it for your own projects.

Popcorn Kernel

Rick Waldron, Cole Gillespie, Drew Cimino, and I made use of the popcorn plugin sprint to begin outlining a simple development server for developers and content creators to quickly get up and running with the Node.js, web sockets, Popcorn Maker, media storage, and JSON metadata storage for popcorn scripts and plugin data.

Join the discussion on freenode channel #popcorn-kernel

WebRTC

Developers from CISCO, Mozilla, and Google put together an exciting demo and brainstorming session session for WebRTC (Real Time Communications). WebRTC aims to provide streaming access for data transfer between browsers with no server required–all communications are transferred between peers. Check the slides from the presentation

WebRTC has been in development for a year and it is expected to land in development versions of Opera, Mozilla, and Webkit by the end of September.

In order to begin developing with WebRTC, you need only use the Javascript API, but the WebRTC spec is open source, so you can integrate the protocol into any application.

Advanced Media Stream Manipulation in HTML5

There are many use cases for quickly switching video streams within a single video element: adaptive streaming requires that transitions from one bitrate stream to another be seamless, video editing within the browser will require the same, presenting transformative video in a gamified news paradigm, and content protection will be able to build on stream switching to allow securely transmuxing encrypted streams.

A few selected notes from the Adaptive Streaming Session:

  • Netflix is implementing the MPEGLA Dynamic Adaptive Streaming over HTTP (DASH) manifest format (download the draft spec here) for adaptive streaming and content protection.

    • multiple tracks / accessibility
    • trick modes (e.g. deal with fast forward by dropping to lower framerate)
    • 3D, multi-view, scalable video
    • protected content
  • webkitSourceAppend is a recenlty introduced addition to Chromium/Webkit that provides a similar funtionality to the video tag that Flash allows with it’s AppendBytes and NetStream.

    • Will require stream transmuxing to be handled by Javascript
    • Performing complex stream manipulation in Javascript before streaming the data to a video tag may use too much battery for mobile devices.
    • This implementation is weeks old and needs better error handling as well as extensive testing.

read more …

webGL

webGL has quickly become the preferred method of adding complex video filters to the video and canvas elements on top of its basic usage as a three dimensional modeling and gaming environment within the browser.

The reason for using webGL for advanced video processing is that it is the best way to take advantage of multicore graphical processing units on mobile and tablet devices. As in the case of providing adaptive streaming, being able to harness the incredible throughput of the GPU rather than the central processing unit saves clients battery power (as we move forward the CPU becomes used more for scheduling GPU rendering and processing than for performing complex calculations). And using the GPU to combine and render video elements saves video broadcasters bandwidth and provides viewers with a malleable viewing environment.

Check out these great demos in Firefox:

  • Seriously.js is a framework for applying video filters to video tags and and canvas element. Fork the project on GitHub.
  • No Comply is a demo of using video, the audio api, and webGL to provide an interactive music video with video game elements that the viewer controls.

And in addition to Seriously.js, check out these libraries for making use of webGL now:

  • THREE.js – Lightweight Javascript 3D engine “for dummies”
  • CubicVR.js – Javascript 3D engine (with physics!)

In Closing

OVC was a massive meeting of the minds for open video. A venue to tackle issues that can’t readably be addressed any other way. Google had a much more active showing this year, and it was incredibly valuable to have representatives from almost all the major browsers in the same room. More importantly innovative new features for video on the web could be vetted across not just other browser makers, but video platform providers, javascript hackers and innovative technology artists. This enabled an holistic exploration of features to address a wide range of open video needs.

It was very powerful to see the creative exchange of ideas for future web video applications taking place between OVC participants on one side of the room, at the same time that the technical, legal and political foundations for enabling these application was actively being built on the other. This fusion of creativity that takes place at OVC will continue to enable truly magical experiences on the web; from the mash up projects built at conference, to dreaming up web video applications of the future.

The task at hand for the Open Video Alliance its nothing short of ensuring web video as a medium continues its transcendence from the constrained heritage of TV and Film. With this conference we can see participants continue to rise to the challenge, making really cool experiences you won’t see on TV!

All session notes from the conference are conveniently stored on OpenEtherPad.org.

Posted in #ovc11, html5, Open Video Alliance, Open Video Conference, popcorn.js, webGL, webRTC | Leave a comment