web/rsln/index.php
changeset 109 948129d1817e
parent 108 7f43d14b32cd
child 110 74ace8f6e768
equal deleted inserted replaced
108:7f43d14b32cd 109:948129d1817e
     1 <?php
       
     2 
       
     3 /**
       
     4  * include some common code (like we did in the 90s)
       
     5  * People still do this? ;)
       
     6  */
       
     7 include_once './common.php';
       
     8 
       
     9 /**
       
    10  * Do we already have a valid Access Token or need to go get one?
       
    11  */
       
    12 if (!isset($_SESSION['TWITTER_ACCESS_TOKEN']) && isset($_GET['CONNECT']) ) {
       
    13     /**
       
    14      * Guess we need to go get one!
       
    15      */
       
    16     $token = $consumer->getRequestToken();
       
    17     $_SESSION['TWITTER_REQUEST_TOKEN'] = serialize($token);
       
    18 
       
    19     /**
       
    20      * Now redirect user to Twitter site so they can log in and
       
    21      * approve our access
       
    22      */
       
    23     $consumer->redirect();
       
    24 }
       
    25 
       
    26 ?>
       
    27 
       
    28 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
       
    29    "http://www.w3.org/TR/html4/strict.dtd">
       
    30 
       
    31 <html lang="en">
       
    32   <head>
       
    33     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
       
    34     <title>RSLN  - Live Video and Annotation</title>
       
    35 	<meta http-equiv="X-UA-Compatible" content="IE=8" /> 
       
    36 
       
    37     <!-- Framework CSS -->
       
    38     <link rel="stylesheet" href="res/blueprint/screen.css" type="text/css" media="screen, projection">
       
    39     <link rel="stylesheet" href="res/blueprint/print.css" type="text/css" media="print">
       
    40     <!--[if lt IE 8]><link rel="stylesheet" href="blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->
       
    41 
       
    42     <!-- Import fancy-type plugin for the sample page. -->
       
    43     
       
    44 	<link rel="stylesheet" href="res/blueprint/plugins/fancy-type/screen.css" type="text/css" media="screen, projection">
       
    45 	<link rel="stylesheet" href="custom.css" type="text/css" media="screen, projection">
       
    46 	<link rel="stylesheet" type="text/css" href="res/jquery.fancybox/fancybox/jquery.fancybox-1.3.4.css" media="screen">
       
    47 	<link rel="stylesheet" type="text/css" href="res/niceforms/niceforms-custom.css" media="screen" >
       
    48 
       
    49 	<!-- JAVASCRIPT --> 
       
    50 	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
       
    51 	<script type="text/javascript" src="res/metadataplayer/res/js/jquery.tools.min.js"></script>
       
    52 	<script type="text/javascript" src="res/jquery.fancybox/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
       
    53 	<script type="text/javascript" src="res/jquery.fancybox/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
       
    54 	<script type="text/javascript" src="res/niceforms/niceforms.js"></script>
       
    55 	<script src="http://widgets.twimg.com/j/2/widget.js"></script>
       
    56 	
       
    57 	<!-- FONT -->
       
    58 	<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow&subset=latin' rel='stylesheet' type='text/css'>
       
    59 	<link href='http://fonts.googleapis.com/css?family=PT+Sans&subset=latin' rel='stylesheet' type='text/css'>
       
    60 	<link href='http://fonts.googleapis.com/css?family=Geo&subset=latin' rel='stylesheet' type='text/css'>
       
    61 
       
    62 	<script type="text/javascript">	
       
    63 	$(document).ready(function() {
       
    64 
       
    65 			doTimer();
       
    66 			//$("txt").hide();
       
    67 			$(".loginbutton").click(function() {
       
    68 				document.location.href="<?php URL_ROOT ?>?CONNECT=true";
       
    69 			});
       
    70 			$("#IDENTIFIER").click(function() {
       
    71 				document.location.href="<?php URL_ROOT ?>?CONNECT=true";
       
    72 			});
       
    73 			
       
    74 			$("#messageSuccess").hide();
       
    75 			$("#messageFailed").hide();
       
    76 			$("#txt").hide();
       
    77 			
       
    78 			// BUTTONS
       
    79 			$("#positive").click(function(){
       
    80 				var MyValue = $('#status').attr("value");
       
    81 				 $('#status').attr("value",MyValue+"++ ");
       
    82 			});
       
    83 			$("#negative").click(function(){
       
    84 				var MyValue = $('#status').attr("value");
       
    85 				$('#status').attr("value",MyValue+"-- ");
       
    86 			});
       
    87 			$("#reference").click(function(){
       
    88 				var MyValue = $('#status').attr("value");
       
    89 				$('#status').attr("value",MyValue+"== ");
       
    90 			});
       
    91 			$("#question").click(function(){
       
    92 				var MyValue = $('#status').attr("value");
       
    93 				$('#status').attr("value",MyValue+"?? ");
       
    94 			});
       
    95 			
       
    96 			// SEND TWEETS 
       
    97 			$("#sendTweet").click(function(){
       
    98 				var MyStatus = $('#status').attr("value");
       
    99 				$.post('tweet_ajax.php', {status:MyStatus}
       
   100 				,function(data) {
       
   101 				
       
   102 					if(data=="true"){
       
   103 						$("#messageSuccess").show('fast');
       
   104 						$("#messageSuccess").delay(800).hide('slow');
       
   105 						$('#status').attr("value","#rsln");
       
   106 						//$('#status').css("background-image","images/greenTweet.png");
       
   107 						//$('#status').delay(800).css("background-image","images/tweetWriterBgdTxtArea.gif");
       
   108 					}else{
       
   109 						$("#error").text(data);
       
   110 						$("#messageFailed").show('fast');
       
   111 						$("#messageFailed").delay(800).hide('slow');
       
   112 						//$('#status').css("background-image","images/redTweet.png");
       
   113 						//$('#status').delay(800).css("background-image","images/tweetWriterBgdTxtArea.gif");
       
   114 					}
       
   115 					
       
   116 				});
       
   117 				
       
   118 			});			
       
   119 			
       
   120 			$(".timeFrame").tooltip();
       
   121 			/*
       
   122 			*   Lightbox button 
       
   123 			*/
       
   124 			$("#About").fancybox({
       
   125 				'titlePosition'		: 'inside',
       
   126 				'transitionIn'		: 'none',
       
   127 				'transitionOut'		: 'none',
       
   128 				'enableEscapeButton': 'none',
       
   129 				'margin' 			: 1,
       
   130 				'padding' 			: 0
       
   131 			}<?php if (!isset($_SESSION['TWITTER_ACCESS_TOKEN'])){echo(").trigger('click');");}else{echo(");");} ?>
       
   132 			
       
   133 			
       
   134 			$("#Program").fancybox({
       
   135 				'width'				: '75%',
       
   136 				'height'			: '75%',
       
   137 				'autoScale'			: false,
       
   138 				'transitionIn'		: 'none',
       
   139 				'transitionOut'		: 'none',
       
   140 				'type'				: 'iframe'
       
   141 			});
       
   142 
       
   143 			$("#Video_ldt").fancybox({
       
   144 				'width'				: 1021,
       
   145 				'height'			: 661,
       
   146 				'autoScale'			: false,
       
   147 				'transitionIn'		: 'none',
       
   148 				'transitionOut'		: 'none',
       
   149 				'type'				: 'iframe'
       
   150 			});
       
   151 			
       
   152 			$("#ACCES").click(function() {
       
   153 				$.fancybox.close();
       
   154 			});
       
   155 			
       
   156 			// Buttons 
       
   157 			$("#tf0").click(function() {
       
   158 				
       
   159 				$(".videoLiveProgramTitle").html("<b>9h30- 13h00 :</b> Imaginaires Industriels et hyperminiaturisation");
       
   160 				$(".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)");
       
   161 			});
       
   162 			
       
   163 			$("#tf1").click(function() {
       
   164 				$(".videoLiveProgramTitle").html("<b>13h00- 14h30 :</b> Pause déjeuner");
       
   165 				$(".videoLiveProgramDescription").html("");
       
   166 			});
       
   167 			
       
   168 			$("#tf2").click(function() {
       
   169 				$(".videoLiveProgramTitle").html("<b>14h30- 16h50 :</b> Imaginaires Scientifiques");
       
   170 				$(".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)");
       
   171 			});
       
   172 				
       
   173 			$("#tf3").click(function() {
       
   174 				$(".videoLiveProgramTitle").html("<b>17h00- 19h00 :</b> Imaginaires Anthropologiques");
       
   175 				$(".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");
       
   176 				
       
   177 			});
       
   178 			
       
   179 			$("#tf4").click(function() {
       
   180 				$(".videoLiveProgramTitle").html("<b>19h00- 22h00 :</b> Soirée");
       
   181 				$(".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.");
       
   182 				
       
   183 			});
       
   184 			
       
   185 			// ----
       
   186 			// day 2
       
   187 			
       
   188 			$("#tf5").click(function() {
       
   189 				$(".videoLiveProgramTitle").html("<b>9h30- 12h30 :</b> Design et outils de représentation");
       
   190 				$(".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");
       
   191 				
       
   192 			});
       
   193 
       
   194 			$("#tf6").click(function() {
       
   195 				$(".videoLiveProgramTitle").html("<b>19h00- 14h00 :</b> Repas");
       
   196 				$(".videoLiveProgramDescription").html("");
       
   197 				
       
   198 			});
       
   199 
       
   200 			$("#tf7").click(function() {
       
   201 				$(".videoLiveProgramTitle").html("<b>14h00- 19h00 :</b> Imaginaire politique et ingénierie du débat public");
       
   202 				$(".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");
       
   203 				
       
   204 			});
       
   205 		
       
   206 			$("#tf8").click(function() {
       
   207 				$(".videoLiveProgramTitle").html("<b>19h00- 22h00 :</b> Soirée");
       
   208 				$(".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.");
       
   209 				
       
   210 			});
       
   211 		
       
   212 		
       
   213 		});
       
   214 		
       
   215 		
       
   216 		<!-- LIMIT TEXTAREA:
       
   217 		function imposemax(Object)
       
   218 		{
       
   219 		  return (Object.value.length <= 140);
       
   220 		}
       
   221 		// End -->
       
   222 		
       
   223 		<!-- TIMER 
       
   224 		var c=0;
       
   225 		var t;
       
   226 		var timer_is_on=0;
       
   227 
       
   228 		function timedCount()
       
   229 		{
       
   230 			document.getElementById('txt').value=c;
       
   231 			c = c+1;
       
   232 			t = window.setTimeout("timedCount()",1000);
       
   233 			$(".twtr-ft").hide();
       
   234 			$(".twtr-hd").hide();
       
   235 			
       
   236 			//twtr-tweet
       
   237 			$(".twtr-tweet").each(colorTweetings);
       
   238 		
       
   239 		}
       
   240 
       
   241 		function colorTweetings (){
       
   242 			/*
       
   243 			efc1f0 > violet
       
   244 			c5e7cd > vert
       
   245 			f6ced0 > rouge
       
   246 			bfdbec > blue 
       
   247 			ecedc1 > yellow
       
   248 			*/
       
   249 				var tweettemp = $(this).html();
       
   250 				//alert(tweettemp);
       
   251 				//$(".videoLiveProgramDescription").text(tweettemp);
       
   252 				//$(".videoLiveProgramTitle").text(tweettemp.search(/\x2D\x2D/));
       
   253 				
       
   254 				/*
       
   255 				<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>
       
   256 				*/	//alert("tweettemp");
       
   257 				
       
   258 				if (tweettemp.search(/\x3F\x3F/)!=-1){
       
   259 				
       
   260 					 $(this).css({'background-color': '#ecedc1','color':"#000"});
       
   261 				}
       
   262 				
       
   263 				if (tweettemp.search(/\x2B\x2B/)!=-1){
       
   264 					 $(this).css({'background-color': '#c5e7cd','color':"#fff"});
       
   265 				}
       
   266 				
       
   267 				if (tweettemp.search(/\x2D\x2D/)!=-1){
       
   268 					 $(this).css({'background-color': '#f6ced0','color':"#fff"});
       
   269 				}
       
   270 				
       
   271 				if (tweettemp.search(/\x3D\x3D/)!=-1){
       
   272 					 $(this).css({'background-color': '#bfdbec','color':"#000"});
       
   273 				}
       
   274 		};
       
   275 			
       
   276 
       
   277 		
       
   278 		function doTimer()
       
   279 		{
       
   280 		if (!timer_is_on)
       
   281 		  {
       
   282 		  timer_is_on=1;
       
   283 		  timedCount();
       
   284 		  }
       
   285 		}
       
   286 
       
   287 		function stopCount()
       
   288 		{
       
   289 			clearTimeout(t);
       
   290 			timer_is_on=0;
       
   291 		}
       
   292 		//
       
   293 		
       
   294 		//-->
       
   295 		
       
   296 		
       
   297 	</script>
       
   298 	<script type="text/javascript">
       
   299 	
       
   300 	  var _gaq = _gaq || [];
       
   301 	  _gaq.push(['_setAccount', 'UA-9955524-3']);
       
   302 	  _gaq.push(['_setDomainName', '.iri.centrepompidou.fr']);
       
   303 	  _gaq.push(['_trackPageview']);
       
   304 	
       
   305 	  (function() {
       
   306 	    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
       
   307 	    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
       
   308 	    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
       
   309 	  })();
       
   310 	
       
   311 	</script>
       
   312 	
       
   313   </head>
       
   314   <body>
       
   315     <div class="container">
       
   316       <img src="images/ENMI_2010_logo.gif" class="logo">
       
   317 	  <ul class="menu"> 
       
   318 	  <li class="menuUnderline"><a href="../" class="menuLink" id="About"> Accueil</a></li>
       
   319 	  <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>
       
   320 	  <li ><a href="polemicaltimeline.php" class="menuLink" >Lecteur polémique</a></li>
       
   321 
       
   322 	  </ul>
       
   323 
       
   324 	  
       
   325 	  <div class="videoLive">
       
   326 		<div class="videoLivePlayer">
       
   327 		
       
   328 			<!--
       
   329 			<object id="player" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" name="player" width="500" height="375"> 
       
   330 				<param name="movie" value="res/mediaplayer/player.swf" /> 
       
   331 				<param name="allowfullscreen" value="true" /> 
       
   332 				<param name="allowscriptaccess" value="always" /> 
       
   333 				<param name="wmode" value="transparent" />
       
   334 				<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" /> 
       
   335 				<embed 
       
   336 					type="application/x-shockwave-flash"
       
   337 					id="player2"
       
   338 					name="player2"
       
   339 					src="res/mediaplayer/player.swf" 
       
   340 					width="500" 
       
   341 					height="375"
       
   342 					allowscriptaccess="always" 
       
   343 					allowfullscreen="true"
       
   344 					wmode="transparent"
       
   345 					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" 
       
   346 					
       
   347 				/> 
       
   348 			</object> 
       
   349 			-->
       
   350 			<img src="images/bgd_player.jpg" width="500"  height="375" />
       
   351 		</div>	
       
   352 		
       
   353 	  </div>
       
   354 
       
   355 	  <div class="videoLiveProgram">	
       
   356 
       
   357 		<!--<div class="timeline" style="width:499px;">
       
   358 				
       
   359 				<div class="bigTimeFrame" 
       
   360 					 
       
   361 					 style="width:253px;">
       
   362 					 <div style="padding-left:5px;">14 dec 2010</div>
       
   363 				</div>
       
   364 					 
       
   365 				<div class="bigTimeFrame"
       
   366 					 title="The tooltip text #1"
       
   367 					 style="border-right:none;">
       
   368 					 <div style="padding-left:5px;">15 dec 2010</div>
       
   369 				</div>
       
   370 				
       
   371 				<div class="timeFragment" style="width:253px;">
       
   372 				
       
   373 					<div id="tf0" 
       
   374 						 class="timeFrame" 
       
   375 						 title="<b>9h30- 13h00 :</b><br> Imaginaires Industriels et hyperminiaturisation"
       
   376 						 style="width:27%;background-color:#29b8ed;"></div> 
       
   377 						 
       
   378 					<div id="tf1"
       
   379 						 class="timeFrame"
       
   380 						 title="<b>13h00- 14h30 :</b><br> Repas"
       
   381 						 style="width:13%;background-color:#959595;"></div> 
       
   382 						 
       
   383 					<div id="tf2"
       
   384 						 class="timeFrame" 
       
   385 						 title="<b>14h30- 16h50 :</b><br> Imaginaires Scientifiques"
       
   386 						 style="width:14%;background-color:#29b8ed;"></div> 
       
   387 						 
       
   388 					<div id="tf3"
       
   389 						 class="timeFrame"
       
   390 						 title="<b>17h00- 19h00 :</b><br>Imaginaires Anthropologique"
       
   391 						 style="width:17%;background-color:#959595;"></div> 
       
   392 						 
       
   393 					<div id="tf4"
       
   394 						 class="timeFrame" 
       
   395 						 title="<b>19h00- 22h00 :</b><br> Soirée"
       
   396 						 style="width:25%;background-color:#29b8ed;"></div> 
       
   397 						 
       
   398 				</div>
       
   399 				<div class="timeFragment" style="width:245px;">
       
   400 				
       
   401 					<div id="tf5"
       
   402 						 class="timeFrame" 
       
   403 						 title="<b>9h30-12h30</b> <br>Design et outils de représentation"
       
   404 						 style="width:35%;background-color:#29b8ed;"></div> 
       
   405 						 
       
   406 					<div id="tf6"
       
   407 						 class="timeFrame"
       
   408 						 title="<b>12h30-14h00</b> <br>Repas"
       
   409 						 style="width:10%;background-color:#959595;"></div> 
       
   410 						 
       
   411 					<div id="tf7"
       
   412 						 class="timeFrame" 
       
   413 						 title="<b>14h00-19h00</b> <br>Imaginaire politique et ingénierie du débat public"
       
   414 						 style="width:50%;background-color:#29b8ed;"></div> 
       
   415 						 
       
   416 					
       
   417 				</div>
       
   418 				
       
   419 		</div>-->
       
   420 		
       
   421 		<div class="arrowContainer">
       
   422 			<div class="arrow"> </div>
       
   423 		</div>
       
   424 		
       
   425 		
       
   426 		<!-- -->
       
   427 
       
   428 		<!-- -->
       
   429 		<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/13b0aa52-336b-11e0-b233-00145ea49a02">La vidéo sous Lignes de Temps</a></div>
       
   430 		<div class="videoLiveProgramDescription">
       
   431 		<br>
       
   432 		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/>
       
   433 
       
   434 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/>
       
   435 <br/><b> Dernier ouvrages :</b> <ul>
       
   436 <li> <a href="http://isbn.nu/9781594202537?asim" target="_blank">2010 : Cognitive Surplus: Creativity and Generosity in a Connected Age  </a></li>
       
   437 <li> <a href="http://isbn.nu/9781594201530" target="_blank">2008 : Here Comes Everybody: The Power of Organizing Without Organizations</a></li>
       
   438 </ul>
       
   439 <b>Source :</b> <a href="http://fr.wikipedia.org/wiki/Clay_Shirky" target="_blank"> Wikipedia.fr</a>
       
   440 <br/> <b>Plus d'information : </b> <a href="http://www.shirky.com/" target="_blank">www.shirky.com</a>
       
   441 <br/> <b>Crédit photo : </b> <a href="http://www.flickr.com/photos/poptech2006/2969510044/" target="_blank"> CC BY NA - Pop!Tech 2008</a>
       
   442 
       
   443 		</div>
       
   444 		
       
   445 		
       
   446 	</div>
       
   447 	  
       
   448 	  <div class="tweetWriter">
       
   449 		<h3 class="tweetWriterTitle">Annotations pol&eacute;mique : </h3>
       
   450 		<form  action="tweet.php" method="post" id="statusform" >
       
   451 		<?php if (!isset($_SESSION['TWITTER_ACCESS_TOKEN'])){
       
   452 				echo("<div class='loginbutton' ><a href='".URL_ROOT."?CONNECT=true' class='loginlink'>
       
   453 				Vous n'êtes pas connecté.<br>
       
   454 				Pour participer, veuillez vous identifier en cliquant ici. </a></div>");
       
   455 			  }else{
       
   456 				echo("<textarea name='status' id='status' rows='3' cols='50' onkeypress='return imposemax(this);'>#rsln</textarea>");
       
   457 			  }
       
   458 		?>
       
   459 
       
   460 
       
   461 				<div id="messageSuccess" style="background-color:lightgreen;">
       
   462 					Votre tweet a bien été envoyé !<br><br>
       
   463 				</div>
       
   464 				
       
   465 				<div id="messageFailed" style="background-color:red;">
       
   466 					Ooups! il y a une erreur vous avez le droit de frapper le developpeur :<div id="error">&nbsp;</div><br/><br>
       
   467 				</div>
       
   468 
       
   469 			  
       
   470 			
       
   471 			<a class="button_w" href="#"  id="sendTweet" style="float:right;margin-right:15px;margin-left:35px;width:70px;" ><span>Envoyer</span></a> 
       
   472 			<!--<button name="s" type="button" id="sendTweet"
       
   473 					style="float:right;margin-right:15px;margin-left:35px;width:70px;"  >Envoyer</button>-->
       
   474 			<a 
       
   475 					
       
   476 					id="positive"
       
   477 					title="accord"
       
   478 					class="tweetButton">++</a>
       
   479 			<a 
       
   480 					
       
   481 					id="negative"
       
   482 					title="désaccord"
       
   483 					class="tweetButton">--</a>
       
   484 			<a
       
   485 					
       
   486 					id="reference"
       
   487 					title="reference"
       
   488 					class="tweetButton">==</a>
       
   489 			<a 
       
   490 					
       
   491 					id="question"  
       
   492 					title="question"
       
   493 					class="tweetButton"> ??</a>
       
   494 		</form>
       
   495 	  </div>
       
   496 	  
       
   497 	  <div class="tweetReader">
       
   498 			<script>
       
   499 				new TWTR.Widget({
       
   500 				  version: 2,
       
   501 				  type: 'search',
       
   502 				  search: '#rsln',
       
   503 				  interval: 1000,
       
   504 				  title: '',
       
   505 				  subject: '',
       
   506 				  width: 377,
       
   507 				  height: 450,
       
   508 				  theme: {
       
   509 					shell: {
       
   510 					  background: '#ffffff',
       
   511 					  color: '#ffffff'
       
   512 					},
       
   513 					tweets: {
       
   514 					  background: '#ffffff',
       
   515 					  color: '#444444',
       
   516 					  links: '#1985b5'
       
   517 					}
       
   518 				  },
       
   519 				  features: {
       
   520 					scrollbar: false,
       
   521 					loop: true,
       
   522 					live: true,
       
   523 					hashtags: true,
       
   524 					timestamp: true,
       
   525 					avatars: true,
       
   526 					toptweets: true,
       
   527 					behavior: 'default'
       
   528 				  }
       
   529 				}).render().start();
       
   530 			</script>
       
   531 	  </div>
       
   532 
       
   533       <div class="footer">
       
   534 		<hr>
       
   535 		 <a href="http://www.iri.centrepompidou.fr/" class="footerLink" target="_blank">
       
   536  IRI </a>
       
   537 		 |  <a href="http://www.rslnmag.fr/" class="footerLink" target="_blank" > RSLN  </a>
       
   538 		 |  <a href="http://www.slate.fr/" class="footerLink"  target="_blank"> SLATE.fr  </a>
       
   539 		 |  <a href="http://www.microsoft.fr/" class="footerLink" target="_blank"> MICROSOFT.fr  </a>
       
   540 		 <?php 
       
   541 				if (isset($_SESSION['TWITTER_ACCESS_TOKEN'])){
       
   542 					echo("| 	<a href='clear.php'  class='footerLink'>D&eacute;connexion</a>");
       
   543 				}
       
   544 		 ?>
       
   545 		  <input type="text" id="txt" size="3"/>
       
   546 	  </div>   
       
   547 	
       
   548 
       
   549     </div>
       
   550 	
       
   551 	<!-- LIGHTBOX --> 
       
   552 	<div style="display:none;">
       
   553 		<div id="Aboutbox" >
       
   554 		<div class="lightBorder">
       
   555 			<div class="lightTitle" style="height:45px;">&nbsp;  </div>
       
   556 			<div class="lightSubTitle">Annotation polémique par tweet </div>
       
   557 			<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.
       
   558 			</div>
       
   559 			<div>
       
   560 				<br/>
       
   561 				<a class="button_b" href="#"  id="IDENTIFIER"><span>S'identifier</span></a> <br/><br/>
       
   562 				<a class="button_w" href="#"  id="ACCES"><span>Libre accès</span></a> 
       
   563 			</div>
       
   564 		</div>
       
   565 		</div>
       
   566 	</div>
       
   567 
       
   568 	
       
   569   </body>
       
   570 </html>