web/rsln/index.php
author Yves-Marie Haussonne <1218002+ymph@users.noreply.github.com>
Mon, 07 Feb 2011 14:43:29 +0100
changeset 40 49140e9ee14f
parent 35 0f40d68e7618
child 42 d191777f1bed
permissions -rw-r--r--
add link to video

<?php

/**
 * include some common code (like we did in the 90s)
 * People still do this? ;)
 */
include_once './common.php';

/**
 * Do we already have a valid Access Token or need to go get one?
 */
if (!isset($_SESSION['TWITTER_ACCESS_TOKEN']) && isset($_GET['CONNECT']) ) {
    /**
     * Guess we need to go get one!
     */
    $token = $consumer->getRequestToken();
    $_SESSION['TWITTER_REQUEST_TOKEN'] = serialize($token);

    /**
     * Now redirect user to Twitter site so they can log in and
     * approve our access
     */
    $consumer->redirect();
}

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>RSLN  - Live Video and Annotation</title>
	<meta http-equiv="X-UA-Compatible" content="IE=8" /> 

    <!-- 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">
    <!--[if lt IE 8]><link rel="stylesheet" href="blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->

    <!-- Import fancy-type plugin for the sample page. -->
    
	<link rel="stylesheet" href="res/blueprint/plugins/fancy-type/screen.css" type="text/css" media="screen, projection">
	<link rel="stylesheet" href="custom.css" type="text/css" media="screen, projection">
	<link rel="stylesheet" type="text/css" href="res/jquery.fancybox/fancybox/jquery.fancybox-1.3.4.css" media="screen">
	<link rel="stylesheet" type="text/css" href="res/niceforms/niceforms-custom.css" media="screen" >

	<!-- 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://cdn.jquerytools.org/1.2.5/jquery.tools.min.js"></script>
	<script type="text/javascript" src="res/jquery.fancybox/fancybox/jquery.mousewheel-3.0.4.pack.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 src="http://widgets.twimg.com/j/2/widget.js"></script>
	
	<!-- FONT -->
	<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow&subset=latin' rel='stylesheet' type='text/css'>
	<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'>

	<script type="text/javascript">	
	$(document).ready(function() {

			doTimer();
			//$("txt").hide();
			$(".loginbutton").click(function() {
				document.location.href="<?php URL_ROOT ?>?CONNECT=true";
			});
			$("#IDENTIFIER").click(function() {
				document.location.href="<?php URL_ROOT ?>?CONNECT=true";
			});
			
			$("#messageSuccess").hide();
			$("#messageFailed").hide();
			$("#txt").hide();
			
			// BUTTONS
			$("#positive").click(function(){
				var MyValue = $('#status').attr("value");
				 $('#status').attr("value",MyValue+"++ ");
			});
			$("#negative").click(function(){
				var MyValue = $('#status').attr("value");
				$('#status').attr("value",MyValue+"-- ");
			});
			$("#reference").click(function(){
				var MyValue = $('#status').attr("value");
				$('#status').attr("value",MyValue+"== ");
			});
			$("#question").click(function(){
				var MyValue = $('#status').attr("value");
				$('#status').attr("value",MyValue+"?? ");
			});
			
			// SEND TWEETS 
			$("#sendTweet").click(function(){
				var MyStatus = $('#status').attr("value");
				$.post('tweet_ajax.php', {status:MyStatus}
				,function(data) {
				
					if(data=="true"){
						$("#messageSuccess").show('fast');
						$("#messageSuccess").delay(800).hide('slow');
						$('#status').attr("value","#rsln");
						//$('#status').css("background-image","images/greenTweet.png");
						//$('#status').delay(800).css("background-image","images/tweetWriterBgdTxtArea.gif");
					}else{
						$("#error").text(data);
						$("#messageFailed").show('fast');
						$("#messageFailed").delay(800).hide('slow');
						//$('#status').css("background-image","images/redTweet.png");
						//$('#status').delay(800).css("background-image","images/tweetWriterBgdTxtArea.gif");
					}
					
				});
				
			});			
			
			$(".timeFrame").tooltip();
			/*
			*   Lightbox button 
			*/
			$("#About").fancybox({
				'titlePosition'		: 'inside',
				'transitionIn'		: 'none',
				'transitionOut'		: 'none',
				'enableEscapeButton': 'none',
				'margin' 			: 1,
				'padding' 			: 0
			}<?php if (!isset($_SESSION['TWITTER_ACCESS_TOKEN'])){echo(").trigger('click');");}else{echo(");");} ?>
			
			
			$("#Program").fancybox({
				'width'				: '75%',
				'height'			: '75%',
				'autoScale'			: false,
				'transitionIn'		: 'none',
				'transitionOut'		: 'none',
				'type'				: 'iframe'
			});

			$("#Video_ldt").fancybox({
				'width'				: 1021,
				'height'			: 651,
				'autoScale'			: false,
				'transitionIn'		: 'none',
				'transitionOut'		: 'none',
				'type'				: 'iframe'
			});
			
			$("#ACCES").click(function() {
				$.fancybox.close();
			});
			
			// Buttons 
			$("#tf0").click(function() {
				
				$(".videoLiveProgramTitle").html("<b>9h30- 13h00 :</b> Imaginaires Industriels et hyperminiaturisation");
				$(".videoLiveProgramDescription").html("En partant de la Loi de Moore, premier story-telling mondial, on analysera comment les road-maps, et notamment celles des  entreprises liées aux nanotechnologies, structurent le temps de  l’innovation en construisant des récits du futur. On examinera dans quelle mesure ces récits font émerger un nouvel imaginaire  industriel.<br><br><b>9h30-12h30</b><br>Introduction de Bernard Stiegler (IRI)<br>Intervenants : Sacha Loeve (Paris I),<br>Françoise Roure (Ministère de l’Industrie)<br><b>12h30-13h00</b><br>Table ronde animée par Sacha Loeve (Paris I)");
			});
			
			$("#tf1").click(function() {
				$(".videoLiveProgramTitle").html("<b>13h00- 14h30 :</b> Pause déjeuner");
				$(".videoLiveProgramDescription").html("");
			});
			
			$("#tf2").click(function() {
				$(".videoLiveProgramTitle").html("<b>14h30- 16h50 :</b> Imaginaires Scientifiques");
				$(".videoLiveProgramDescription").html("Les imaginaires scientifiques sont, dans le champ des nanotechnologies, une composante en soi de la recherche et héritent de généalogies différentes. Ces imaginaires ne sont pas qu’une affaire de « perception » des sciences et des technologies : ils s’élaborent dès le laboratoire par l’invention de nouvelles manières de produire des images de l’invisible. Nous proposons d’appréhender ces imaginaires : d’une part, par le truchement des objets de laboratoire, médiateurs obligés de nos rapports au « nanomonde » ; d’autre part, par  le vecteur de la production/diffusion des images.<br><br><b>Introduction : </b><br> Sacha Loeve (Paris I),<br><br><b>Dialogues : </b><br>Andrew Mayne (Univ. Paris Sud) et Catherine AllamelRaffin (Univ. de Strasbourg)<br>Christian Joachim (CEMES) et Sacha Loeve (Paris I)<br>Laurent Gouzènes (Consultant) et Jean-Luc Beylat (Alcatel Bell)");
			});
				
			$("#tf3").click(function() {
				$(".videoLiveProgramTitle").html("<b>17h00- 19h00 :</b> Imaginaires Anthropologiques");
				$(".videoLiveProgramDescription").html("L’homme est un être prothétique : il s’est humanisé en se projetant dans des outils. Son évolution s’est faite dans le sens d’une extériorisation de ses différentes fonctions biologiques. Or, les nanobiotechnologies – vecteurs médicamenteux, nanodispositifs de type biopuce, nanoimplants – nous confrontent à une situation inédite : qu’en est-il du sens de l’évolution humaine dès lors que les artefacts investissent le corps ? On s’appuiera sur des recherches en cours pour interroger les représentations de l’homme futur et la prothéticité.<br><br><b>17h00-18h30</b><br>Introduction & Modération par  Xavier Guchet (Paris I)<br>Intervenants : Daniela Cerqui (Univ. de Lausanne), José-Alain <br>Sahel (Institut de la vision), Patrick Couvreur (Collège de France)<br><br><b>18h30-19h00</b><br>Table-ronde animée par Xavier Guchet et Bernard Stiegler");
				
			});
			
			$("#tf4").click(function() {
				$(".videoLiveProgramTitle").html("<b>19h00- 22h00 :</b> Soirée");
				$(".videoLiveProgramDescription").html("<b>19h00</b><br>Présentation d’initiatives relatives au débat sur les nanotechnologies et de projets et outils innovants pour le débat public en ligne. Une collaboration IRI, VivAgora, Carrefours des possibles de la FING<br><b>20h30 Forum –1</b><br>Rencontres avec les porteurs de projets innovants.");
				
			});
			
			// ----
			// day 2
			
			$("#tf5").click(function() {
				$(".videoLiveProgramTitle").html("<b>9h30- 12h30 :</b> Design et outils de représentation");
				$(".videoLiveProgramDescription").html("Les nanos posent des questions inédites aux designers. Ceux-ci sont confrontés, d’une part, à un renouvellement des rapports habituels entre forme et matière : en effet, si le design est l’art et la manière de donner forme aux objets, à la nano-échelle, la matière se présente comme un ensemble de formes, d’information et de processus qu’il faut associer à la démarche désignante.  D’autre part, les nanos posent à nouveau frais la question des usages : en effet, le nanomonde ne s’appréhende que par des outils de médiation du réel (instrumentation, discrétisation, représentation de données, simulation, transmodalité). Or, s’il ne peut pas y avoir, à proprement parler, de design d’objets nanométriques, mais de design d’objets intégrant des nanos, comment les designers donnent-ils sens à l’intégration de cette nouvelle dimension ? <br><br><b>9h30-10h45</b><br><br>Introduction de Alain Cadix (ENSCI)<br>Intervenants : Patrick Pajon (Centre de Recherche sur l’Imaginaire), Sylvie Tissot (Quantum design)<br><b>11h00-12h00</b><br><br>Projection du film Puissances de dix (1977) de Charles et Ray Eames <br>Modération par Jean-Louis Fréchin (ENSCI)<br>Intervenants : Gilles Belley et Jean-François Dingjian, Designers<br><b>12h00-12h30</b><br>Modération par Marie-Virginie Berbet, designer<br>Présentation du travail des élèves designers sur design/nano et <br>biotechnologies dans le cadre d’un studio expérimental à l’ENSCILes Ateliers");
				
			});

			$("#tf6").click(function() {
				$(".videoLiveProgramTitle").html("<b>19h00- 14h00 :</b> Repas");
				$(".videoLiveProgramDescription").html("");
				
			});

			$("#tf7").click(function() {
				$(".videoLiveProgramTitle").html("<b>14h00- 19h00 :</b> Imaginaire politique et ingénierie du débat public");
				$(".videoLiveProgramDescription").html("On analysera ici la façon dont les recherches en nanotechnologies sont devenues un « terrain d’expérimentation » pour construire de nouveaux rapports entre science et société et faire émerger une « société de la connaissance ».  Or, Cap Digital a mis en place un groupe de travail sur l’innovation sociale et se mobilise sur le développement d’outils de gestion et d’échange de connaissances et de débat. Au-delà de la manière dont le débat sur les nanotechnologies a été géré (sur laquelle on pourra revenir), cette session vise à interroger en quoi le débat sur les nanos, mais, plus largement, la question du principe de précaution, nous obligent à repenser les outils de gestion de crise et de débat public ainsi qu’à poser à nouveaux frais la question fondamentale de la confiance (trust). <br><br><b>14h00-16h00 </b><br>Introduction de Bernard Stiegler<br>Intervenants : Brice Laurent (Commission Européenne), <br>Ermelinde Malcotte (Paris X), Philippe Aigrain (Sopinspace)<br><br><b>16h30-18h30</b><br>Intervenants : Dominique Boullier (Sciences-Po), Jean Sallantin <br>(LIRM), Dorothée Benoit (VivAgora)<br><b>18h30-19h00</b><br>Débat animé par Jean Sallantin");
				
			});
		
			$("#tf8").click(function() {
				$(".videoLiveProgramTitle").html("<b>19h00- 22h00 :</b> Soirée");
				$(".videoLiveProgramDescription").html("<b>19h00</b>Présentation d’initiatives relatives au débat sur les nanotechnologies et de projets et outils innovants pour le débat public en ligne. Une collaboration IRI, VivAgora, Carrefours des possibles de la FING<br><b>20h30 Forum –1</b><br>Rencontres avec les porteurs de projets innovants.");
				
			});
		
		
		});
		
		
		<!-- LIMIT TEXTAREA:
		function imposemax(Object)
		{
		  return (Object.value.length <= 140);
		}
		// End -->
		
		<!-- TIMER 
		var c=0;
		var t;
		var timer_is_on=0;

		function timedCount()
		{
			document.getElementById('txt').value=c;
			c = c+1;
			t = window.setTimeout("timedCount()",1000);
			$(".twtr-ft").hide();
			$(".twtr-hd").hide();
			
			//twtr-tweet
			$(".twtr-tweet").each(colorTweetings);
		
		}

		function colorTweetings (){
			/*
			efc1f0 > violet
			c5e7cd > vert
			f6ced0 > rouge
			bfdbec > blue 
			ecedc1 > yellow
			*/
				var tweettemp = $(this).html();
				//alert(tweettemp);
				//$(".videoLiveProgramDescription").text(tweettemp);
				//$(".videoLiveProgramTitle").text(tweettemp.search(/\x2D\x2D/));
				
				/*
				<a target="_blank" class="twtr-reply" href="http://twitter.com/?status=@LaurentChic%20&amp;in_reply_to_status_id=12411225795198976&amp;in_reply_to=LaurentChic">reply</a>
				*/	//alert("tweettemp");
				
				if (tweettemp.search(/\x3F\x3F/)!=-1){
				
					 $(this).css({'background-color': '#ecedc1','color':"#000"});
				}
				
				if (tweettemp.search(/\x2B\x2B/)!=-1){
					 $(this).css({'background-color': '#c5e7cd','color':"#fff"});
				}
				
				if (tweettemp.search(/\x2D\x2D/)!=-1){
					 $(this).css({'background-color': '#f6ced0','color':"#fff"});
				}
				
				if (tweettemp.search(/\x3D\x3D/)!=-1){
					 $(this).css({'background-color': '#bfdbec','color':"#000"});
				}
		};
			

		
		function doTimer()
		{
		if (!timer_is_on)
		  {
		  timer_is_on=1;
		  timedCount();
		  }
		}

		function stopCount()
		{
			clearTimeout(t);
			timer_is_on=0;
		}
		//
		
		//-->
		
		
	</script>

	
  </head>
  <body>
    <div class="container">
      <img src="images/ENMI_2010_logo.gif" class="logo">
	  <ul class="menu"> 
	  <li class="menuUnderline"><a href="#Aboutbox" class="menuLink" id="About"> À propos</a></li>
	  <li class="menuUnderline" ><a href="http://www.rslnmag.fr/blog/2011/1/17/clay-shirky_-personne-n-est-titulaire-du-code-source-de-la-democratie_/" class="menuLink" target="_blank"> Programme</a></li>

	  </ul>

	  
	  <div class="videoLive">
		<div class="videoLivePlayer">
		
			<!--
			<object id="player" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" name="player" width="500" height="375"> 
				<param name="movie" value="res/mediaplayer/player.swf" /> 
				<param name="allowfullscreen" value="true" /> 
				<param name="allowscriptaccess" value="always" /> 
				<param name="wmode" value="transparent" />
				<param name="flashvars" value="autostart=true&live=true&image=images/bgd_player.jpg&provider=rtmp&streamer=rtmp://media.iri.centrepompidou.fr/ddc_player/&file=livestream&controlbar=none&autostart=true" /> 
				<embed 
					type="application/x-shockwave-flash"
					id="player2"
					name="player2"
					src="res/mediaplayer/player.swf" 
					width="500" 
					height="375"
					allowscriptaccess="always" 
					allowfullscreen="true"
					wmode="transparent"
					flashvars="autostart=true&live=true&provider=rtmp&streamer=rtmp://media.iri.centrepompidou.fr/ddc_player/&file=livestream&image=images/bgd_player.jpg&controlbar=none&autostart=true" 
					
				/> 
			</object> 
			-->
			<img src="images/bgd_player.jpg" width="500"  height="375" />
		</div>	
		
	  </div>

	  <div class="videoLiveProgram">	

		<!--<div class="timeline" style="width:499px;">
				
				<div class="bigTimeFrame" 
					 
					 style="width:253px;">
					 <div style="padding-left:5px;">14 dec 2010</div>
				</div>
					 
				<div class="bigTimeFrame"
					 title="The tooltip text #1"
					 style="border-right:none;">
					 <div style="padding-left:5px;">15 dec 2010</div>
				</div>
				
				<div class="timeFragment" style="width:253px;">
				
					<div id="tf0" 
						 class="timeFrame" 
						 title="<b>9h30- 13h00 :</b><br> Imaginaires Industriels et hyperminiaturisation"
						 style="width:27%;background-color:#29b8ed;"></div> 
						 
					<div id="tf1"
						 class="timeFrame"
						 title="<b>13h00- 14h30 :</b><br> Repas"
						 style="width:13%;background-color:#959595;"></div> 
						 
					<div id="tf2"
						 class="timeFrame" 
						 title="<b>14h30- 16h50 :</b><br> Imaginaires Scientifiques"
						 style="width:14%;background-color:#29b8ed;"></div> 
						 
					<div id="tf3"
						 class="timeFrame"
						 title="<b>17h00- 19h00 :</b><br>Imaginaires Anthropologique"
						 style="width:17%;background-color:#959595;"></div> 
						 
					<div id="tf4"
						 class="timeFrame" 
						 title="<b>19h00- 22h00 :</b><br> Soirée"
						 style="width:25%;background-color:#29b8ed;"></div> 
						 
				</div>
				<div class="timeFragment" style="width:245px;">
				
					<div id="tf5"
						 class="timeFrame" 
						 title="<b>9h30-12h30</b> <br>Design et outils de représentation"
						 style="width:35%;background-color:#29b8ed;"></div> 
						 
					<div id="tf6"
						 class="timeFrame"
						 title="<b>12h30-14h00</b> <br>Repas"
						 style="width:10%;background-color:#959595;"></div> 
						 
					<div id="tf7"
						 class="timeFrame" 
						 title="<b>14h00-19h00</b> <br>Imaginaire politique et ingénierie du débat public"
						 style="width:50%;background-color:#29b8ed;"></div> 
						 
					
				</div>
				
		</div>-->
		
		<div class="arrowContainer">
			<div class="arrow"> </div>
		</div>
		
		
		<!-- -->

		<!-- -->
		<div class="videoLiveProgramTitle"><b>Clay Shirky : « Personne n'est titulaire du code source de la démocratie »</b>&nbsp;<a id="Video_ldt" href="http://www.iri.centrepompidou.fr/dev/ldt/ldtplatform/ldt/space/ldt/indexproject/607807e6-3054-11e0-b2c7-00145ea49a02">La vidéo sous Ligne de Temps</a></div>
		<div class="videoLiveProgramDescription">
		<br>
		Journaliste américain spécialiste des nouvelles technologies de l'information et de la communication - NTIC, Clay Shirky est aussi consultant, écrivain, professeur.<br/><br/>

Diplômé de l'Université de New York il écrit et enseigne, entre autres, sur les effets de corrélation de la topologie sociale et technologique de réseau, où comment nos réseaux forment la culture et inversement.<br/><br/>
<br/><b> Dernier ouvrages :</b> <ul>
<li> <a href="http://isbn.nu/9781594202537?asim" target="_blank">2010 : Cognitive Surplus: Creativity and Generosity in a Connected Age  </a></li>
<li> <a href="http://isbn.nu/9781594201530" target="_blank">2008 : Here Comes Everybody: The Power of Organizing Without Organizations</a></li>
</ul>
<b>Source :</b> <a href="http://fr.wikipedia.org/wiki/Clay_Shirky" target="_blank"> Wikipedia.fr</a>
<br/> <b>Plus d'information : </b> <a href="http://www.shirky.com/" target="_blank">www.shirky.com</a>
<br/> <b>Crédit photo : </b> <a href="http://www.flickr.com/photos/poptech2006/2969510044/" target="_blank"> CC BY NA - Pop!Tech 2008</a>

		</div>
		
		
	</div>
	  
	  <div class="tweetWriter">
		<h3 class="tweetWriterTitle">Annotations pol&eacute;mique : </h3>
		<form  action="tweet.php" method="post" id="statusform" >
		<?php if (!isset($_SESSION['TWITTER_ACCESS_TOKEN'])){
				echo("<div class='loginbutton' ><a href='".URL_ROOT."?CONNECT=true' class='loginlink'>
				Vous n'êtes pas connecté.<br>
				Pour participer, veuillez vous identifier en cliquant ici. </a></div>");
			  }else{
				echo("<textarea name='status' id='status' rows='3' cols='50' onkeypress='return imposemax(this);'>#rsln</textarea>");
			  }
		?>


				<div id="messageSuccess" style="background-color:lightgreen;">
					Votre tweet a bien été envoyé !<br><br>
				</div>
				
				<div id="messageFailed" style="background-color:red;">
					Ooups! il y a une erreur vous avez le droit de frapper le developpeur :<div id="error">&nbsp;</div><br/><br>
				</div>

			  
			
			<a class="button_w" href="#"  id="sendTweet" style="float:right;margin-right:15px;margin-left:35px;width:70px;" ><span>Envoyer</span></a> 
			<!--<button name="s" type="button" id="sendTweet"
					style="float:right;margin-right:15px;margin-left:35px;width:70px;"  >Envoyer</button>-->
			<a 
					
					id="positive"
					title="accord"
					class="tweetButton">++</a>
			<a 
					
					id="negative"
					title="désaccord"
					class="tweetButton">--</a>
			<a
					
					id="reference"
					title="reference"
					class="tweetButton">==</a>
			<a 
					
					id="question"  
					title="question"
					class="tweetButton"> ??</a>
		</form>
	  </div>
	  
	  <div class="tweetReader">
			<script>
				new TWTR.Widget({
				  version: 2,
				  type: 'search',
				  search: '#rsln',
				  interval: 1000,
				  title: '',
				  subject: '',
				  width: 377,
				  height: 450,
				  theme: {
					shell: {
					  background: '#ffffff',
					  color: '#ffffff'
					},
					tweets: {
					  background: '#ffffff',
					  color: '#444444',
					  links: '#1985b5'
					}
				  },
				  features: {
					scrollbar: false,
					loop: true,
					live: true,
					hashtags: true,
					timestamp: true,
					avatars: true,
					toptweets: true,
					behavior: 'default'
				  }
				}).render().start();
			</script>
	  </div>

      <div class="footer">
		<hr>
		 <a href="http://www.iri.centrepompidou.fr/" class="footerLink" target="_blank">
 IRI </a>
		 |  <a href="http://www.rslnmag.fr/" class="footerLink" target="_blank" > RSLN  </a>
		 |  <a href="http://www.slate.fr/" class="footerLink"  target="_blank"> SLATE.fr  </a>
		 |  <a href="http://www.microsoft.fr/" class="footerLink" target="_blank"> MICROSOFT.fr  </a>
		 <?php 
				if (isset($_SESSION['TWITTER_ACCESS_TOKEN'])){
					echo("| 	<a href='clear.php'  class='footerLink'>D&eacute;connexion</a>");
				}
		 ?>
		  <input type="text" id="txt" size="3"/>
	  </div>   
	

    </div>
	
	<!-- LIGHTBOX --> 
	<div style="display:none;">
		<div id="Aboutbox" >
		<div class="lightBorder">
			<div class="lightTitle" style="height:45px;">&nbsp;  </div>
			<div class="lightSubTitle">Annotation polémique par tweet </div>
			<div class="lightDescription">À partir de cette interface ou de votre client twitter habituel, vous pouvez réagir en direct aux conférences en twittant. Vos tweets seront synchronisés avec l'enregistrement des conférences. Vous pourrez qualifier vos tweets en y intégrant la syntaxe ci-contre.
			</div>
			<div>
				<br/>
				<a class="button_b" href="#"  id="IDENTIFIER"><span>S'identifier</span></a> <br/><br/>
				<a class="button_w" href="#"  id="ACCES"><span>Libre accès</span></a> 
			</div>
		</div>
		</div>
	</div>

	
  </body>
</html>