tweet_live: comparison web/fens_FabLab_Design_Metadata/polemicaltimeline.php

equal deleted inserted replaced

-:66fa89a3d42c
+:42aeb2bfc58e
 /**
 * include some common code (like we did in the 90s)
 * People still do this? ;)
 */
+include_once 'config.php';
 // configuration
 include 'common.php';
 // objet actuel
-include_once 'config.php';
+$url = (!empty($_SERVER['HTTPS'])) ? "https://".$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'] : "http://".$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'];
 ?>
 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 <html lang="<?php echo($actual); ?>">
 <head>
 	<meta name="robots" content="index, follow">
 	<!-- ICI : <?php echo($_SERVER['DOCUMENT_ROOT']); ?> -->
 	<!-- JAVASCRIPT -->
 	<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="../res/raphael/raphael-min.js"></script>
 	<script type="text/javascript" src="../res/jquery.fancybox/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
 	<script type="text/javascript" src="../res/niceforms/niceforms.js"></script>
+	<script type="text/javascript" src="../res/jquery.url/jquery.url.js"></script>
+	<script type='text/javascript' src='../res/metadataplayer/src/js/LdtPlayer.js'></script>
 	<!-- Framework CSS -->
 <link rel="stylesheet" href="../res/blueprint/screen.css" type="text/css" media="screen, projection">
 <link rel="stylesheet" href="../res/blueprint/print.css" type="text/css" media="print">
 	<link rel="stylesheet" href="../res/blueprint/plugins/fancy-type/screen.css" type="text/css" media="screen, projection">
 	<link href='http://fonts.googleapis.com/css?family=PT+Sans&subset=latin' rel='stylesheet' type='text/css'>
 	<link href='http://fonts.googleapis.com/css?family=Geo&subset=latin' rel='stylesheet' type='text/css'>
 	<style type="text/css">
 		.tweetButton{float:left;margin-right:5px;}
-		.videoLivePlayer{border:1px solid #c3c3c3;width:650px;height:638px;}
+		.videoLivePlayer{border:1px solid #c3c3c3;width:650px;height:748px;}
-		.videoLive{width:650px;height:640px;background:#fff;float:right;margin-top:20px;padding:5px;}
+		.videoLive{width:650px;height:750px;background:#fff;float:right;margin-top:20px;padding:5px;}
+		.tweetExplain{background-image:url(images/tweetExplainBgd.gif);width:250px;height:750px;padding:10px;position:absolute; margin-top:70px;}
-					.tweetExplain{background-image:url(../images/tweetExplainBgd.gif);width:250px;height:640px;padding:10px;position:absolute; margin-top:70px;}
+		.footer{margin-top:850px;width:960px;height:20px;position:absolute;text-align:center;}
-		.footer{margin-top:740px;width:960px;height:20px;position:absolute;text-align:center;}
 		.tooltip{
 			 z-index: 10000000000;
 		}
 		#tip{
 			 position : absolute;
 			padding-top: 0px;
 			z-index: 9;
 			position : absolute;
 		}
 	</style>
 	<script type="text/javascript">
+		// Configuration Polemical Timeline
-	  var _gaq = _gaq || [];
+		<?php
-	  _gaq.push(['_setAccount', 'UA-23581291-1']);
+		if(is_array($config['metadata'])):
-	  _gaq.push(['_trackPageview']);
+			reset($config['metadata']);
+		    $first_key = key($config['metadata']);
-	  (function() {
+		?>
-	    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+		var metadatas = jQuery.parseJSON('<?php echo(json_encode($config['metadata'])); ?>');
-	    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+		var url = jQuery.url();
-	    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+		var metadata_key = url.fparam('metadata');
-	  })();
+		if(typeof metadata_key === "undefined" || metadata_key.length === 0) {
+			metadata_key = "<?php echo($first_key);?>";
-	</script>
+		}
+		<?php else: ?>
+		var metadatas = { metadata: {url: "<?php echo($config['metadata'])?>", duration: <?php echo($config['duration'])?>} };
+		var metadata_key = "metadata";
+		<?php endif;?>
+		var config = {
+					target:"chartTimeline",
+					x:8,
+					y:418,
+					width:<?php echo($player_width); ?>,
+					height:<?php echo($player_height); ?>,
+					heightmax:<?php echo($player_height); ?>,
+					duration:metadatas[metadata_key].duration,
+					metadata:metadatas[metadata_key].url
+					};
+	</script>
+	<script type='text/javascript' src='../res/metadataplayer.polemic/src/js/polemic.js'></script>
 	<script type="text/javascript">
-		$(document).ready(function() {
+		jQuery.extend(__IriSP.lib,{jQueryToolTip:"../res/metadataplayer/res/js/jquery.tools.min.js"});
-			$("#Embeded").fancybox({
+		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,
 				'autoDimensions'	: false,
 				'transitionIn'		: 'none',
 				'transitionOut'		: 'none',
 				'type'				: 'iframe'
 			});
 		});
+	</script>
+	<script type="text/javascript">
+		var _gaq = _gaq || [];
+		_gaq.push(['_setAccount', 'UA-23581291-1']);
+		_gaq.push(['_trackPageview']);
+		(function() {
+		    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+		    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+		    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+		})();
 	</script>
 </head>
-<script type="text/javascript">
-	// Configuration Polemical Timeline
-	var config = {
-					target:"chartTimeline",
-					x:8,
-					y:418,
-					width:650,
-					height:480,
-					heightmax:480,
-					duration:<?php echo($config['duration']); ?>,
-					metadata:"<?php echo($config['metadata']); ?>"
-					};
-</script>
-<script type='text/javascript' src='../res/metadataplayer.polemic/src/js/polemic.js'></script>
 <body>
 <!-- tooltip -->
 <div id="tip">
 		   <?php print $translate->_("Accueil"); ?></a></li>
 		  <li class="menuUnderline"><a href="embed_form.php" class="menuLink" id="Embeded">
 		    <?php print $translate->_("Partager"); ?></a></li>
 		  <li >&nbsp;</li>
 	  </ul>
+	<?php if(is_array($config['metadata'])):?>
-	<ul class="menu lang" >
+	<ul id="content_select_ul" class="menu mdselect">
+	    <?php print $translate->_("changer de contenu"); ?><br/>
+	    <select id="mdselect">
+	    	<?php foreach ($config['metadata'] as $key => $value):?>
+	    	<option value="<?php echo($key); ?>" id="mdselect_<?php echo($key); ?>" ><?php echo($value['display']); ?></option>
+	    	<?php endforeach;?>
+	    </select>
+	</ul>
+	<ul class="menu shortlang" >
+	<?php else:?>
+	<ul class="menu lang" >
+	<?php endif;?>
 	  <li class="menuUnderline"><a href="<?php URL_ROOT ?>?lang=ja_JP" class="menuLink" >
 	       <img src='../images/flag_jp.gif'<?php if($actual!="ja_JP"){echo("style='opacity: .5;'"); } ?> />
 	        <?php print $translate->_("Japonais"); ?></a></li>
 	  <li class="menuUnderline"><a href="<?php URL_ROOT ?>?lang=fr" class="menuLink">
 	       <img src='../images/flag_fr.gif' <?php if($actual!="fr"){echo("style='opacity: .5;'"); } ?> />
 	  <div class="videoLive" >
 		<div class="videoLivePlayer">
+			<div id="chartTimeline"> </div>
-		<div id="chartTimeline"> </div>
+			<script type="text/javascript">
-		<script type="text/javascript">
+				var paper = Raphael(document.getElementById("chartTimeline"),config.width, config.height);
-			var paper = Raphael(document.getElementById("chartTimeline"),config.width, config.height);
+			</script>
-		</script>
+			<div id="player_project_embed" class="iri_player_embed"></div>
-		<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_13b0aa52-336b-11e0-b233-00145ea49a02_embed" class="iri_player_embed"> </div>
 			<script type="text/javascript">
 				var configMP = {
-						/*metadata:{
-							format:'cinelab',
-							src:'metadata.json',
-							load:'json'},*/
 						metadata:{
 							format:'cinelab',
-							src:'<?php echo($config['metadata']); ?>',
+							src:config.metadata,
 							load:'jsonp'},
 						gui:{
-							width:650,
+							width:config.width,
-							height:480,
+							height:config.height,
 							mode:'video',
-							container:'player_project_13b0aa52-336b-11e0-b233-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>
 		</div>
 	  </div>
 <div class="footer">
 		<hr>

changeset 220	42aeb2bfc58e
parent 200	df98bc033a67