Correct metadataplayer embed
authorYves-Marie Haussonne <1218002+ymph@users.noreply.github.com>
Fri, 01 Jul 2011 10:06:01 +0200
changeset 205 dfda2d71838b
parent 204 911d38a8cf95
child 206 6d642d650470
Correct metadataplayer embed
web/mashup/embed_form.php
web/mashup/player_embed.php
web/mashup/polemicaltimeline.php
--- a/web/mashup/embed_form.php	Thu Jun 30 02:10:38 2011 +0200
+++ b/web/mashup/embed_form.php	Fri Jul 01 10:06:01 2011 +0200
@@ -14,11 +14,7 @@
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     <title>embed Configuration</title>
 	
-	<!-- JAVASCRIPT --> 
-	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
-	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>
-	<script type="text/javascript" src="res/raphael/raphael-min.js"></script>
-	
+	<!-- JAVASCRIPT --> 	
 	<link rel="stylesheet" href="../res/css/custom.css" type="text/css" media="screen, projection">
 	
 	<!-- FONT -->
@@ -32,35 +28,6 @@
 			background-image:none;
 			width:300px;
 			padding:5px;		}
-		.tooltip{
-			 z-index: 10000000000;
-		}
-		#tip{
-			 position : absolute;
-			 padding : 3px;
-			 z-index: 10000000000;
-			 max-width: 200px;
-		}	
-		#tip {
-			display: none;
-			background: transparent url("../images/white_arrow_long.png");
-			font-size: 12px;
-			height: 125px;
-			width: 180px;
-			padding: 10px;
-			padding-left: 15px;
-			padding-top: 15px;
-			padding-right: 15px;
-			color: black;
-			z-index: 10000000000;
-			font-family: "Trebuchet MS", "Helvetica", "Arial", "Verdana", "sans-serif";
-			overflow:hidden;
-		}
-		#chartTimeline{
-			padding-top: <?php echo($player_height-70); ?>px;
-			z-index: 100000;
-			position : absolute;
-		}
 		textarea {
 			margin-left:3px;
 			height: 150px;
@@ -92,7 +59,7 @@
   <h1 class="tweetWriterTitle" style="width:300px;" > <?php print $translate->_("EmbedTitle"); ?></h1>
   
   <p style="font-size:12px;width:300px;"><?php print $translate->_("EmbedText"); ?> </p>
-  <textarea cols="10" rows="10"><iframe src="<?php echo($config['root'].$config['rep']); ?>/player_embed.php" width="<?php echo($player_width); ?>" height="<?php echo($player_height); ?>" frameborder="0"></iframe><p><a href="<?php echo($config['root'].$config['rep']); ?>"><?php echo($config['title']); ?></a> from <a href="<?php echo($config['link']); ?>">RSLN</a>on <a href="<?php echo($config['root']); ?>">Polemical Tweet</a>.</p>
+  <textarea cols="10" rows="10"><iframe src="<?php echo($config['root'].$config['rep']); ?>/player_embed.php<?php echo(array_key_exists("metadata",$_GET)?"?metadata=".$_GET["metadata"]:"") ?>" width="<?php echo($player_width); ?>" height="<?php echo($player_height); ?>" frameborder="0"></iframe><p><a href="<?php echo($config['root'].$config['rep']); ?>"><?php echo($config['title']); ?></a> from <a href="<?php echo($config['link']); ?>">RSLN</a>on <a href="<?php echo($config['root']); ?>">Polemical Tweet</a>.</p>
   </textarea>
 
   </body>
--- a/web/mashup/player_embed.php	Thu Jun 30 02:10:38 2011 +0200
+++ b/web/mashup/player_embed.php	Fri Jul 01 10:06:01 2011 +0200
@@ -19,9 +19,13 @@
     <title>RSLN  - Polemic player embed page</title>
 	
 	<!-- JAVASCRIPT --> 
-	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
+	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>		
+	<script type="text/javascript">	
+		$.noConflict();
+	</script>
 	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>
 	<script type="text/javascript" src="../res/raphael/raphael-min.js"></script>
+	<script type='text/javascript' src='../res/metadataplayer/src/js/LdtPlayer.js'></script>
 	
 	<!-- FONT -->
 	<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow&subset=latin' rel='stylesheet' type='text/css'>
@@ -63,6 +67,41 @@
 
 	</style>
 	<script type="text/javascript">
+	  		// Configuration Polemical Timeline
+  		<?php
+  		if(is_array($config['metadata'])) {
+  		    if(!$metadata_key) {
+  		    	reset($config['metadata']);
+  		    	$metadata_key = key($config['metadata']);
+  		    }
+  		    
+  		    $duration = $config['metadata'][$metadata_key]['duration'];
+  		    $url = $config['metadata'][$metadata_key]['url'];
+  		}
+  		else {
+  			$duration = $config['duration'];
+  		    $url = $config['metadata'];  		    
+  		}
+  		?>
+  		
+		var config = {
+					target:"chartTimeline",
+					x:8,
+					y:418,
+					width:<?php echo($player_width); ?>,
+					height:<?php echo($player_height); ?>,
+					heightmax:<?php echo($player_height); ?>,
+					duration:<?php echo($duration); ?>,
+					metadata:<?php echo($metadata); ?>
+					};
+	</script>
+	
+  	<script type='text/javascript' src='../res/metadataplayer.polemic/src/js/polemic.js'></script>
+  	<script type="text/javascript">
+  		jQuery..extend(__IriSP.lib,{jQueryToolTip:"../res/metadataplayer/res/js/jquery.tools.min.js"});
+	</script>
+  	
+	<script type="text/javascript">
 	
 	  var _gaq = _gaq || [];
 	  _gaq.push(['_setAccount', 'UA-23581291-1']);
@@ -75,23 +114,7 @@
 	  })();
 	
 	</script>
-  </head>
-  
-  <script type="text/javascript">
-  	// Configuration Polemical Timeline
-	var config = {
-					target:"chartTimeline",
-					x:8,
-					y:418,
-					width:<?php echo($player_width); ?>,
-					height:<?php echo($player_height); ?>,
-					heightmax:<?php echo($player_height); ?>,
-					duration:<?php echo($config['duration']); ?>,
-					metadata:"<?php echo($config['metadata']); ?>"
-					}
-  </script>
-  <script type='text/javascript' src='../res/metadataplayer.polemic/src/js/polemic.js'></script>
-  
+  </head>  
   <body>
   <!-- tooltip --> 
   <div id="tip">
@@ -106,28 +129,25 @@
 			var paper = Raphael(document.getElementById("chartTimeline"),config.width, config.height);
 		</script>
 		<script type='text/javascript' src='../res/metadataplayer/src/js/LdtPlayer.js'></script>
-		<script type="text/javascript">
-			$.extend(__IriSP.lib,{jQueryToolTip:"../res/metadataplayer/res/js/jquery.tools.min.js"});
-		</script>
-		<div id="player_project_843fff80-6b50-11e0-8aef-00145ea49a02_embed" class="iri_player_embed"> </div>
+		<div id="player_project_embed" class="iri_player_embed"> </div>
 		
 			<script type="text/javascript">
 				var configMP = {
 						metadata:{
 							format:'cinelab',
-							src:'<?php echo($config['metadata']); ?>',
+							src:config.metadata,
 							load:'jsonp'},
 						gui:{
-							width:<?php echo($player_width); ?>,
-							height:<?php echo($player_height); ?>,
+							width:config.width,
+							height:config.height,
 							mode:'video',
-							container:'player_project_843fff80-6b50-11e0-8aef-00145ea49a02_embed',
+							container:'player_project_embed',
 							debug:false,
 							css:'../res/css/LdtPlayer.css'},
 	
 						player:{
 							type:'jwplayer',
-							src:'http://www.iri.centrepompidou.fr//dev/ldt/static/ldt/swf/player.swf'}
+							src:'../res/metadataplayer/res/swf/player.swf'}
 					};
 				__IriSP.init(configMP);     
 			</script>
--- a/web/mashup/polemicaltimeline.php	Thu Jun 30 02:10:38 2011 +0200
+++ b/web/mashup/polemicaltimeline.php	Fri Jul 01 10:06:01 2011 +0200
@@ -118,7 +118,18 @@
 		jQuery.extend(__IriSP.lib,{jQueryToolTip:"../res/metadataplayer/res/js/jquery.tools.min.js"});
 
 		jQuery(document).ready(function() {
-		
+			
+			jQuery("#mdselect_"+metadata_key).attr("selected","selected");
+			jQuery("#mdselect").change(function() {
+				var metadata_key = this.options[this.selectedIndex].value;
+				window.location.hash = "#metadata="+metadata_key;
+				window.location.href = window.location.href;
+				window.location.reload(true);
+				jQuery("#Embeded").attr('href','embed_form.php?metadata='+metadata_key);
+			});
+			if(metadata_key !== "metadata") {
+				jQuery("#Embeded").attr('href','embed_form.php?metadata='+metadata_key);
+			}
 			jQuery("#Embeded").fancybox({
 				'width'				: 360,
 				'height'			: 360,
@@ -127,15 +138,7 @@
 				'transitionOut'		: 'none',
 				'type'				: 'iframe'
 			});
-
 			
-			jQuery("#mdselect_"+metadata_key).attr("selected","selected");
-			jQuery("#mdselect").change(function() {
-				var metadata_key = this.options[this.selectedIndex].value;
-				window.location.hash = "#metadata="+metadata_key;
-				window.location.href = window.location.href;
-				window.location.reload(true);
-			});
 		});
 	</script>	
 	<script type="text/javascript">