<!DOCTYPE HTML> <html> <head> <style> #video { min-width: 100%; max-width: 100%; min-height: 100%; max-height: 100%; } </style> </head> <body style="margin: 0px;"> <video id='video' name='media'> <source src='test.mp4' type='video/mp4'> </video> </body> <script type="text/javascript"> var can_play = false; var script_ready = false; var finished_seeking = false; var error_status = false; (function() { video.addEventListener('canplay', function(event) { can_play = true; }, false); })(); (function() { video.addEventListener('error', function(event) { error_status = true; }, false); })(); (function() { video.addEventListener('seeked', function(event) { finished_seeking = true; }, false); })(); (function() { video.addEventListener('seeking', function(event) { finished_seeking = false; }, false); })(); function loadVideoSource(video_source_path) { video.src = video_source_path; return true; } function canplay() { return can_play; } function finishedSeeking() { return finished_seeking; } function play() { video.play(); } function pause() { video.pause(); } function currentTime() { return video.currentTime; } function errorDetected() { return error_status; } function setControls() { video.setAttribute("controls", "true"); } script_ready = true; </script> </html>