Webm fallback for Vimeo with JavaScript and PHP

webm-vimeo-fallback.php

<?php 

// First check is the 'vimeo' cookie exists
if(!isset($_COOKIE['vimeo'])) {

// The cookie doesn't exists, we need JavaScript to feature detect soem things
?>



<!-- Flash detection is done with SWF Object -->
<script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>



<script>
	var doc = document;
	var vid = doc.createElement( "video" );

	if (!swfobject.hasFlashPlayerVersion("9")) {
		if(!vid.canPlayType( "video/mp4;")) {
		// If no flash 9 or higher AND no support for MP4 we set the cookie to 'no'.
			doc.cookie='vimeo=no; path=/';
			if (doc.cookie.indexOf('vimeo') != -1) {
				location.reload(true);
			}
		}
	}
</script>



<?php 
}
// Cookies set, back to the server



// Actually, cookies are not set if JavaScript is not available. 
$vimeo = !empty($_COOKIE['vimeo']) ? $_COOKIE['vimeo'] : 'yes'; 
// If no cookie is set we assume Vimeo will work and set the cookie to 'yes'. You may change this.



if($vimeo == 'no') {
// If there's no vimeo support, you serve the Webm version
?>



<video controls>
	<source src="video.webm" type='video/webm; codecs="vp8.0, vorbis"'>
	<p>You can <a href="video.webm">download the movie right here</a>.</p>
</video>



<?php 
} else {
// else you serve the Vimeo embed code
?>



<iframe src="http://player.vimeo.com/video/32377917?byline=0&amp;portrait=0&amp;color=ffffff" width="640" height="360" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>



<?php
} 
// That's it. Not thoroughly tested, feel free to enhance
?>