media/test/data/eme_player.html - chromium/src - Git at Google

 <!DOCTYPE html>
 <html lang='en-US'>
   <head>
     <title>EME playback test application</title>
   </head>
   <body style='font-family:"Lucida Console", Monaco, monospace; font-size:14px'>
     <i>Clearkey works only with content encrypted using bear key.</i><br><br>
     <table>
     <tr title='URL param mediaFile=...'>
       <td><label for='mediaFile'>Encrypted video URL:</label></td>
       <td><input id='mediaFile' type='text' size='64'></td>
     </tr>
     <tr title='URL param licenseServerURL=...'>
       <td><label for='licenseServer'>License sever URL:</label></td>
       <td><input id='licenseServer' type='text' size='64'></td>
     </tr>
     <tr title='URL param keySystem=...'>
       <td><label for='keySystemList'>Key system:</label></td>
       <td><select id='keySystemList'></select></td>
     </tr>
     <tr title='URL param mediaType=...'>
       <td><label for='mediaTypeList'>Media type:</label></td>
       <td><select id='mediaTypeList'></select></td>
     </tr>
     <tr title='URL param usePrefixedEME=1|0'>
       <td><label for='usePrefixedEME'>EME API version:</label></td>
       <td><select id='usePrefixedEME'></select></td>
     </tr>
     <tr title='URL param useMSE=1|0'>
       <td><label for='useMSE'>Load media by:</label></td>
       <td>
         <select id='useMSE'>
           <option value='true' selected='selected'>MSE</option>
           <option value='false'>src</option>
         </select>
       </td>
     </tr>
     </table>
     <br>
     <button onclick='Play();'>Play</button>
     <br><br>
     Decoded fps: <span id='decodedFPS'></span>
     <br>
     Dropped fps: <span id='droppedFPS'></span>
     <br>
     Total dropped frames: <span id='droppedFrames'></span>
     <br><br>
     <table>
     <tr>
       <td valign='top'><span id='video'></span></td>
       <td valign='top'>
         <label for='logs' onclick="toggleDisplay('logs');"><i>Click to toggle logs visibility (newest at top).</i><br></label>
         <div id='logs' style='overflow: auto; height: 480px; width: 480px; white-space: nowrap; display: none'></div>
       </td>
     </tr>
     </table>
     <div></div>
   </body>
   <script src='eme_player_js/app_loader.js' type='text/javascript'></script>
   <script type='text/javascript'>
     var testConfig = new TestConfig();
     testConfig.loadQueryParams();
     // Update document with test configuration values.
     var emeApp = new EMEApp(testConfig);

     function onTimeUpdate(e) {
       var video = e.target;
       if (video.currentTime < 1)
         return;
       // For loadSession() tests, addKey() will not be called after
       // loadSession() (the key is loaded internally). Do not check keyadded
       // and heartbeat for these tests.
       if (!testConfig.sessionToLoad) {
         // keyadded may be fired around the start of playback; check for it
         // after a delay to avoid timing issues.
         if (testConfig.usePrefixedEME && !video.receivedKeyAdded)
           Utils.failTest('Key added event not received.');
         if (testConfig.keySystem == EXTERNAL_CLEARKEY &&
             !video.receivedHeartbeat)
           Utils.failTest('Heartbeat keymessage event not received.');
       }
       video.removeEventListener('ended', Utils.failTest);
       Utils.installTitleEventHandler(video, 'ended');
       video.removeEventListener('timeupdate', onTimeUpdate);
     }

     function Play() {
       // Update test configuration with UI elements values.
       var video = emeApp.createPlayer().video;
       Utils.resetTitleChange();
       // Ended should not fire before onTimeUpdate.
       video.addEventListener('ended', Utils.failTest);
       video.addEventListener('timeupdate', onTimeUpdate);
       video.play();
     }

     function toggleDisplay(id) {
       var element = document.getElementById(id);
       if (!element)
         return;
       if (element.style['display'] != 'none')
         element.style['display'] = 'none';
       else
         element.style['display'] = '';
     }
     Play();
   </script>
 </html>
	<!DOCTYPE html>
	<html lang='en-US'>
	<head>
	<title>EME playback test application</title>
	</head>
	<body style='font-family:"Lucida Console", Monaco, monospace; font-size:14px'>
	<i>Clearkey works only with content encrypted using bear key.</i><br><br>
	<table>
	<tr title='URL param mediaFile=...'>
	<td><label for='mediaFile'>Encrypted video URL:</label></td>
	<td><input id='mediaFile' type='text' size='64'></td>
	</tr>
	<tr title='URL param licenseServerURL=...'>
	<td><label for='licenseServer'>License sever URL:</label></td>
	<td><input id='licenseServer' type='text' size='64'></td>
	</tr>
	<tr title='URL param keySystem=...'>
	<td><label for='keySystemList'>Key system:</label></td>
	<td><select id='keySystemList'></select></td>
	</tr>
	<tr title='URL param mediaType=...'>
	<td><label for='mediaTypeList'>Media type:</label></td>
	<td><select id='mediaTypeList'></select></td>
	</tr>
	<tr title='URL param usePrefixedEME=1\|0'>
	<td><label for='usePrefixedEME'>EME API version:</label></td>
	<td><select id='usePrefixedEME'></select></td>
	</tr>
	<tr title='URL param useMSE=1\|0'>
	<td><label for='useMSE'>Load media by:</label></td>
	<td>
	<select id='useMSE'>
	<option value='true' selected='selected'>MSE</option>
	<option value='false'>src</option>
	</select>
	</td>
	</tr>
	</table>
	<br>
	<button onclick='Play();'>Play</button>
	<br><br>
	Decoded fps: <span id='decodedFPS'></span>
	<br>
	Dropped fps: <span id='droppedFPS'></span>
	<br>
	Total dropped frames: <span id='droppedFrames'></span>
	<br><br>
	<table>
	<tr>
	<td valign='top'><span id='video'></span></td>
	<td valign='top'>
	<label for='logs' onclick="toggleDisplay('logs');"><i>Click to toggle logs visibility (newest at top).</i><br></label>
	<div id='logs' style='overflow: auto; height: 480px; width: 480px; white-space: nowrap; display: none'></div>
	</td>
	</tr>
	</table>
	<div></div>
	</body>
	<script src='eme_player_js/app_loader.js' type='text/javascript'></script>
	<script type='text/javascript'>
	var testConfig = new TestConfig();
	testConfig.loadQueryParams();
	// Update document with test configuration values.
	var emeApp = new EMEApp(testConfig);

	function onTimeUpdate(e) {
	var video = e.target;
	if (video.currentTime < 1)
	return;
	// For loadSession() tests, addKey() will not be called after
	// loadSession() (the key is loaded internally). Do not check keyadded
	// and heartbeat for these tests.
	if (!testConfig.sessionToLoad) {
	// keyadded may be fired around the start of playback; check for it
	// after a delay to avoid timing issues.
	if (testConfig.usePrefixedEME && !video.receivedKeyAdded)
	Utils.failTest('Key added event not received.');
	if (testConfig.keySystem == EXTERNAL_CLEARKEY &&
	!video.receivedHeartbeat)
	Utils.failTest('Heartbeat keymessage event not received.');
	}
	video.removeEventListener('ended', Utils.failTest);
	Utils.installTitleEventHandler(video, 'ended');
	video.removeEventListener('timeupdate', onTimeUpdate);
	}

	function Play() {
	// Update test configuration with UI elements values.
	var video = emeApp.createPlayer().video;
	Utils.resetTitleChange();
	// Ended should not fire before onTimeUpdate.
	video.addEventListener('ended', Utils.failTest);
	video.addEventListener('timeupdate', onTimeUpdate);
	video.play();
	}

	function toggleDisplay(id) {
	var element = document.getElementById(id);
	if (!element)
	return;
	if (element.style['display'] != 'none')
	element.style['display'] = 'none';
	else
	element.style['display'] = '';
	}
	Play();
	</script>
	</html>