Packaging skins / default skin

[jeroen]

For the HTML5 player, packing skins in CSS with base64 images might be a good idea:

• XML files cannot be crossdomain loaded (no crossdomain skin loading)
• The separate PNG files to delay loading of a skin.
• We can include a default skin in the player.

How does this work?

For Perl, here's the command ( more info):

perl -MMIME::Base64 -e' open(FILE, $ARGV[0]) or die "$!";while
(read(FILE, $buf, 60*57)) {print encode_base64($buf);}' file.png

This should also be  possible in Java.

In CSS / JS, we can then do  something like:

.button{background:url("data:image/png;charset=utf-8;base64,BASE64_ENCODED_OUTPUT")

Or  something like:

<img src="data:image/gif;base64,BASE64_ENCODED_OUTPUT" alt="Base64 encoded image" width="150" height="150"/>

No IE

The biggest issue seems to be that BASE64 is not supported by IE6 / IE7. IE8 does support (and so will IE9 probably - the first browser with HTML5 support).

Using this functionality would imply that we render the display/controlbar also in Flash for non HTML5 browsers.

[pablo]

Not sure this is the way to go - seems like it would be difficult to get it working across browsers, and it breaks away from the Flash player's skinning model. Designers would have to create two versions of the same skin if they wanted it to be used in both Flash and HTML5.

[pablo]

This might work nicely for the default skin however.

[jeroen]

I'd rather see this as a simple script that converts an unpacked (or zip) skin into a packed one. We'd never drop support for the unpacked XML skinning.

Perhaps unzipping in JS does work fine and we don't need an alternative like this to package skins for HTML5.

[jeroen]

This should probably be broken out in two tickets later on:

1. Build a default skin into the player (base64 strings). This implies we use the Flash fallback to draw the chrome as well, since IE6/IE7  don't support base64 images.
2. Support packaged skins in some way. This would significantly speed up loading ánd make skins work crossdomain. Agree with Pablo that ZIP is preferred to maintain compatibility. If that totally doesn't work, we should look at rendering e.g. CSS sheets with base64 images included using a simple, free-for-all packaging tool.

XML skins should keep on working though.

[zach]

Default skins work and have a build script. Won't work in IE6/7, but this doesn't matter because the HTML5 player will never be used there.

The Flash player will need to be updated to support this.