<?php

/**
 * include some common code (like we did in the 90s)
 * People still do this? ;)
 */
$rep = $_REQUEST['rep'];
include_once dirname(__FILE__).'/'.$rep.'/config.php';
// configuration 
include 'common.php';
 // objet actuel 
$baseurl = URL_ROOT;

$div_height = 640;
if(isset($config['div_height'])) {
	$div_height = $config['div_height'];	
}
$tweet_explain_background = URL_ROOT.'images/tweetExplainBgd.gif';
if(file_exists(dirname(__FILE__)."/$rep/images/tweetExplainBgd.gif")) {
	$tweet_explain_background = URL_ROOT.$rep.'/images/tweetExplainBgd.gif';
}


$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 http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Polemic tweet - <?php echo($config['title']); ?></title>
	<meta name="keywords" content="<?php echo($config['keywords']); ?>"><!-- add timestampedmetadata -->
	<!--<meta name="description" content="PoelmicTweet.fr : debate mapping, opinion, conference, video">-->
	<meta name="description" content="<?php echo($config['description']); ?>">
	<meta name="robots" content="index, follow">
	
	<!-- ICI : <?php echo($_SERVER['DOCUMENT_ROOT']); ?> -->
	<!-- JAVASCRIPT --> 
	<script type="text/javascript" src="<?php echo(registry_url('json-js','js'));?>"></script>
	<script type="text/javascript" src="<?php echo(registry_url('jquery','js'));?>"></script>
	<script type="text/javascript">	
		$.noConflict();
	</script>
	<script type="text/javascript" src="<?php echo(registry_url('raphael','js'));?>"></script>
	<script type="text/javascript" src="<?php echo(registry_url('fancybox','js'));?>"></script>
	<script type="text/javascript" src="<?php echo(registry_url('jquery-url','js'));?>"></script>
	<script type="text/javascript" src="<?php echo(registry_url('ldtplayer','js'));?>"></script>
		
	<!-- Framework CSS -->
    <link rel="stylesheet" href="<?php echo(registry_url('blueprint-screen','css'));?>" type="text/css" media="screen, projection"/>
    <link rel="stylesheet" href="<?php echo(registry_url('blueprint-print','css'));?>" type="text/css" media="print"/>
    <!--[if lt IE 8]><link rel="stylesheet" href="<?php echo(registry_url('blueprint-ie','css'));?>" type="text/css" media="screen, projection"><![endif]--> 
	<link rel="stylesheet" href="<?php echo(registry_url('blueprint-plugins-fancy-type','css'));?>" type="text/css" media="screen, projection"/>
	<link rel="stylesheet" href="<?php echo(registry_url('custom','css'));?>" type="text/css" media="screen, projection"/>
	<link rel="stylesheet" href="<?php echo(registry_url('fancybox','css'));?>" media="screen"/>
	
	<!-- FONT -->
	<link href='<?php echo(registry_url('PT-Sans_Narrow','font'));?>' rel='stylesheet' type='text/css'/>
	<link href='<?php echo(registry_url('PT-Sans','font'));?>' rel='stylesheet' type='text/css'/>
	<link href='<?php echo(registry_url('Geo','font'));?>' rel='stylesheet' type='text/css'/>
	
	<style type="text/css"> 
		.tweetButton{float:left;margin-right:5px;}
		.videoLivePlayer{border:1px solid #c3c3c3;width:650px;height:<?php echo($div_height-2);?>px;}
		.videoLive{width:650px;height:<?php echo($div_height); ?>px;background:#fff;float:right;margin-top:20px;padding:5px;}					
		.tweetExplain{background-image:url(<?php echo($tweet_explain_background);?>);width:250px;height:<?php echo($div_height)?>px;padding:10px;position:absolute; margin-top:70px;}
		.footer{margin-top:<?php echo($div_height+100);?>px;width:960px;height:20px;position:absolute;text-align:center;}
		.tooltip{
			 z-index: 10000000000;
		}
		#tip{
			 position : absolute;
			 padding : 3px;
			 z-index: 10000000000;
			 max-width: 200px;
		}	
		#tip {
				display: none;
				background: transparent url("<?php echo($baseurl);?>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: 0px;
			z-index: 9;
			position : absolute;
		}

	</style>	
	<script type="text/javascript">
  		// Configuration Polemical Timeline
  		<?php
  		if(is_array($config['metadata'])):
  			reset($config['metadata']);
  		    $first_key = key($config['metadata']);
  		?>
  		var metadatas = jQuery.parseJSON('<?php echo(json_encode($config['metadata'])); ?>');
  		var url = jQuery.url();
  		var metadata_key = url.fparam('metadata');
  		if(typeof metadata_key === "undefined" || metadata_key.length === 0) {
  			metadata_key = "<?php echo($first_key);?>";
  		} 
  		<?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($config['player_width']); ?>,
					height:<?php echo($config['player_height']); ?>,
					heightmax:<?php echo($config['player_height']); ?>,
					duration:metadatas[metadata_key].duration,
					metadata:metadatas[metadata_key].url
					};
  	</script>
	<script type='text/javascript' src='<?php echo(URL_ROOT);?>res/metadataplayer.polemic/src/js/polemic.js'></script>
	<script type="text/javascript">
		jQuery.extend(__IriSP.lib,{
			jQueryToolTip:"<?php echo(registry_url('jquery-tools','js'));?>",
			jQueryUI:"<?php echo(registry_url('jquery-ui','js'));?>",
			swfObject:"<?php echo(registry_url('swfobject','js'));?>",
			cssjQueryUI:"<?php echo(registry_url('jquery-ui','css'));?>"			
		});
		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','<?php echo(URL_ROOT.$rep);?>/embed_form.php?metadata='+metadata_key);
			});
			if(metadata_key !== "metadata") {
				jQuery("#Embeded").attr('href','<?php echo(URL_ROOT.$rep);?>/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']);
		_gaq.push(['_setAllowAnchor', true]); 
	  
		(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>
  <body>
  <div id="sendUsFeedBack"><a href="<?php echo($C_feedback_form_url); ?>" target="_blank"><img src="<?php echo(URL_ROOT); ?>images/sendusfeedback.png"></a></div>

  <!-- tooltip --> 
  <div id="tip">
  <div id="tipcolor" style="height:10px;width:10px"></div>
  <div id="tiptext"></div>
  </div>

    <div class="container">
      <img src="<?php echo(URL_ROOT."$rep/$config[head_logo]");?>" class="logo">
      <div id="minilogo" style="margin-left:85px;height:5px;top:5px;"></div>
	  <ul class="menu"> 
		  <li class="menuUnderline"><a href="<?php echo(URL_ROOT)?>" class="menuLink" id="Accueil">
		   <?php print $translate->_("Accueil"); ?></a></li>
		  <li class="menuUnderline"><a href="<?php echo(URL_ROOT.$rep)?>/embed_form.php" class="menuLink" id="Embeded">
		    <?php print $translate->_("Partager"); ?></a></li>
		  <li >&nbsp;</li>
	  </ul>
	  <ul class="menu">
	  <li class="menuUnderline"><a href="<?php echo(URL_ROOT); ?>archives.php" class="menuLink">
	  <?php print $translate->_("Archives"); ?></a></li>
	  </ul>
	  	  
	<?php if(is_array($config['metadata'])): ?>
	<ul id="content_select_ul" class="menu mdselect">
	    <span><?php print $translate->_("changer de contenu"); ?></span><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 echo(URL_ROOT.$rep);?>/polemicaltimeline.php?lang=ja_JP" class="menuLink" >
	       <img src="<?php echo(URL_ROOT)?>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 echo(URL_ROOT.$rep) ?>/polemicaltimeline.php?lang=fr" class="menuLink">
	       <img src="<?php echo(URL_ROOT)?>images/flag_fr.gif" <?php if($actual!="fr"){echo("style='opacity: .5;'"); } ?> />
	       <?php print $translate->_("Français"); ?></a></li>
	  <li ><a href="<?php echo(URL_ROOT.$rep) ?>/polemicaltimeline.php?lang=en" class="menuLink">
	       <img src="<?php echo(URL_ROOT)?>images/flag_en.gif" <?php if($actual!="en"){echo("style='opacity: .5;'"); } ?> />
	       <?php print $translate->_("Anglais"); ?></a></li>
	  </ul>	
	
	<!-- EXPLICATION  -->
	  <div class="tweetExplain"  >
		<h3 class="tweetWriterTitle"><?php print $translate->_("ClientTitle1 :"); ?> </h3><br/>
		<?php print $translate->_("ExplicationPT"); ?>
	  </div>
	 
	  
	  <!-- INFOS SUR LA CONF 
	  	<div class="tweetExplain"  >
		<h3 class="tweetWriterTitle"><?php echo($config['title']); ?></h3><br/>
			<?php echo($config['description']); ?>
	  </div>
	  -->




	  <div class="videoLive" >
		<div class="videoLivePlayer">
			<div id="chartTimeline"> </div>
			<script type="text/javascript">
				var paper = Raphael(document.getElementById("chartTimeline"),config.width, config.height);
			</script>
			<div id="player_project_embed" class="iri_player_embed"></div>
			<script type="text/javascript">
				var configMP = {
						metadata:{
							format:'cinelab',
							src:config.metadata,
							load:'jsonp'},
						gui:{
							width:config.width,
							height:config.height,
							mode:'video',
							container:'player_project_embed',
							debug:false,
							css:'../res/css/LdtPlayer.css'},
			
						player:{
							type:'jwplayer',
							src:'../res/metadataplayer/res/swf/player.swf'}
					};
				__IriSP.init(configMP);
			</script>
		</div>
	  </div>

 
      <div class="footer">
		<hr>
			<?php echo($config['partenaires']); ?>
	  </div>   
	
    </div>

  </body>
</html>
