This project (and the corresponding encoder) are no longer maintained.
This was an enormously fun project to create, but I never had adequate time for updates and it was made almost immediately obsolete by the adoption of auto-play HTML5 video in most mobile web browsers soon after it's initial release.
A new encoding system for playing inline videos on the mobile web.
-
Whitewater Player
A Javascript library for playing videos prepared by encoder (standard video files will not work). It offer a flexible API with playback methods, data about the current video and events.
-
Whitewater Encoder
A command line tool and Python module that encodes videos into a bundle of files that can be read by the player to recrate video in an HTML
<canvas>
tag.
- Can play, pause and stop video on mobile
- Can slow down video
- Can expose DOM events for developer use
- Can encode videos with various compression settings
- Can be used as a Python module in your own programs
- Cannot seek to arbitrary points within a video
- Cannot play in reverse
- Cannot play audio
- Download the latest build
- Unpack
whitewater.zip
it and copywhitewater.min.js
into your project files - Include
whitewater.min.js
at the end of your<body>
:<script src="path/to/whitewater.min.js"></script>
- Initialize an instance of
Whitewater()
.
Note: To play videos, they must first be encoded with Whitewater Encoder.
var video = new Whitewater(canvas, source [, options]);
Example
<canvas id="video"></canvas>
<script>
var canvas = document.getElementById('video');
var source = 'path/to/video/';
var options = {
autoplay: true,
loop: true,
controls: true
}
var video = new Whitewater(canvas, source, options);
</script>
→ Initialization options and usage details can be found in the Player Documentation.