test/integration/youtube.htm
author hamidouk
Tue, 29 Nov 2011 11:09:08 +0100
branchpopcorn-port
changeset 345 8a088f7daa66
parent 227 0eb060a3b656
child 342 d42377159e37
child 457 fbcb991cc595
permissions -rw-r--r--
rollover over the interface buttons now works as expected. Also changed the width of the buttons to the correct size. Resized the width and height of the sprites to be the same as the boxes we display them in.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html dir="ltr" xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml" lang="fr">

<head>

</head>

<body>

	<div style="width:650px;font-family: 'Trebuchet MS', 'Helvetica', 'Arial',  'Verdana', 'sans-serif';">
	<h1>MetaDataPlayer </h1>
	Test d'intégration du widget du player avec Popcorn (Youtube).
	</div>
	
	
 <!-- START Integration  ###################################### -->
 <!-- SIMPLE PLAYER EXPERIMENTATION -->
	<script type="text/javascript" src="../../build/LdtPlayer-release.js"></script> 
	<script src="../../res/js/jquery.min.js"></script>
	<script src="../../res/js/jquery.tools.min.js"></script>
	<script src="../../res/js/jquery-ui.min.js"></script>
	<div id="LdtPlayer"></div>
	
	<script  type="text/javascript">
		$(document).ready(function() {
		var config = {						
				gui:{
						width:650,
						height:2100,							
						container:'LdtPlayer',
						css:'../../src/css/LdtPlayer.css',
					  widgets: [					  	
						{type: "PlayerWidget", // please note that type refers directly to the constructor of the widget.
						 mode: "radio",
						 metadata:{
						  format:'cinelab',
						  src:'../test.json',
						  type:'json'}
						},
            {type: "SliderWidget",
						 metadata:{
						  format:'cinelab',
						  src:'../test.json',
						  type:'json'}
						},
						
						{type: "SegmentsWidget", // please note that type refers directly to the constructor of the widget.
						 mode: "radio",
						 metadata:{
						  format:'cinelab',
						  src:'../test.json',
						  type:'json'}
						},
						
						{type: "AnnotationsWidget", // please note that type refers directly to the constructor of the widget.
						 mode: "radio",
						 metadata:{
						  format:'cinelab',
						  src:'../test.json',
						  type:'json'}
						},
					  	
					  ]
			  },
			player:{
				type:'youtube', // player type
				  // the rest is player-dependent configuration options.
				  video: "http://www.youtube.com/watch?v=rrkrvAUbU9Y",
				  height: 400, 
				  width: 640, 
				  provider: "rtmp" 
				}
		};
		
		IriSP.loadLibs(IriSP.lib, config.gui.css, 
			function() { 	
							var layoutManager = new IriSP.LayoutManager(config.gui.container);
							var pop = IriSP.configurePopcorn(layoutManager, config.player);
							
							var widgets = IriSP.configureWidgets(pop, layoutManager, config.gui); });
		
		});	
	</script>
<div id='Ldt-Root'>
	<div id='Ldt-PlaceHolder'>
	</div>
</div>	
<!-- END  ################  ###################################### -->
 </body>
 </html>