With 23 Video we (at 23 receive a large number of really, really large files every day. At times, we get files of several gigabytes transferred over a simple HTTP connection. Usually, this works out alright, but we’ve wanted to make better use of some new features in modern browsers to make uploads more stable — specifically, to allow users to pause their uploads and have the uploads automatically resume if the internet connection fails (either locally or to our servers).
This approach is fairly new and is only available in Chrome (11+) and Firefox (4+), so no one has packaged the feature-set we wanted nicely yet. This calls for open sourcing a few hundred lines of code and a victory lap:
Resumable.js is a JavaScript library built on top of the HTML5 File API to:
Allow selection or dropping of multiple files.
Handle queuing and progress indications during upload.
Uploads files in small chunks, rather than in a single big batch.
Automatically resume uploads if something fails, for example if the network connection drops.
The first two features have been available through Flash and relatedtools for quite a while, but I’m pretty excited about the latter two. Chunking and auto-resuming will allow for a degree of stability in HTTP uploading we haven’t seen before: Resumable.js will simply keep uploading until all the bits of a file has been sent. And it all happens transparently to the user.
The Resumable.js-based uploader will make its appearance in 23 Video later this summer, but we will also add support for this method in our API for direct browser uploads — in fact the prototype uses this API method behind the scenes.
The most frequently requested feature from developers over the past months has been the ability to control the size of thumbnails on 23 Video. Up until now, we’ve offered about 10 different built-in sizes, but obviously this has been a limitation when designers wanted full control over their grid.
We’ve seen a number of excellent hacks to overcome the problem, but from today designers can simply set the exact size they want. The hacks are obsolete.
To change make use of this feature, go to Design → Thumbnails and click the change the sizes and format of thumbnail photos link. When you’ve made the necessary changes, make sure to reprocess the thumbnails on your site by clicking the update all thumbnails link.
One of the biggest challenges in running an ever evolving platform is keeping integrators up to speed with the possibilities they have at hand. Therefore we’ve recently started the 23 Developer Training Programme where our partners’ developers can receive a thorough introduction into the realms of the platform.
At a recent developer training session we created an extensive slide deck displaying the current and near future state of the platform while also giving an introduction to the platform as an entirety. Feel free to have a look, and please hit us up if you’re interested in a day of training with us!
Quite a while ago we added support for oEmbed to 23 Video. This makes it easy to turn a URL from either service into a piece of HTML which is can be embedded into a web site or a blog. For example, this makes it easy to embed video into a WordPress blog post by simply pasting a link to a video into your editor.
I won’t dig too deeply into the technical stuff since there isn’t much to say: oEmbed allows a URL or a link to be turned into a full piece of HTML in a structured fashion, and the endpoint you’ll need to use is http://your.domain.com/oembed.
Interestingly, from WordPress 2.9 and onwards you can use oEmbed in your blog posts. For example, you can put in a link to a public video into the editor and have it be displayed not as a link, but as a video scaled to fit your design. For administrators of WordPress sites this trick is also a way to control which content can safely be embedded into posts — even if you don’t allow
To set this up, you’ll need to add a little piece of code to your WordPress installation; for example in the bottom of .wp-includes/media.php. The code line varies with the domain you’ve chosen for your video site, but something like this would do the trick:
