|
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 /* CLIENT VAR LIVE */ |
|
27 |
|
28 $C_hashtag= "#rsln"; |
|
29 $C_link = "http://www.rslnmag.fr/blog/2011/3/24/la-journaliste-mercedes-bunz-prochaine-invitee-des-rencontres-rsln/"; |
|
30 $C_title = "Mercedes Bunz et le journaliste"; |
|
31 $C_REP = "rsln-mercedes-bunz/"; |
|
32 $C_description = "Elle nous racontera comment les algorithmes ont fini par devenir des producteurs d'infos et pourquoi ils ne remplaceront pour autant jamais les journalistes. |
|
33 <br/><br/> |
|
34 (titre de sa conférence, en VO : When robots learned to write, How the rise of the algorithms will change journalism and revolutionize our concept of knowledge.) |
|
35 <br/><br/> |
|
36 C'est un thème sur lequel elle avait été très remarquée, lors d'une intervention à la conférence Lift, à Genève, en mai 2010."; |
|
37 |
|
38 $C_partenaires = " |
|
39 <a href='http://www.iri.centrepompidou.fr/' class='footerLink' target='_blank'> |
|
40 IRI </a> |
|
41 | <a href='http://www.rslnmag.fr/' class='footerLink' target='_blank' > RSLN </a> |
|
42 | <a href='http://www.microsoft.fr/' class='footerLink' target='_blank'> MICROSOFT.fr </a>"; |
|
43 |
|
44 ?> |
|
45 |
|
46 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" |
|
47 "http://www.w3.org/TR/html4/strict.dtd"> |
|
48 |
|
49 <html lang="en"> |
|
50 <head> |
|
51 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> |
|
52 <title>RSLN - Live Video and Annotation</title> |
|
53 <meta http-equiv="X-UA-Compatible" content="IE=8" /> |
|
54 |
|
55 <!-- Framework CSS --> |
|
56 <link rel="stylesheet" href="res/blueprint/screen.css" type="text/css" media="screen, projection"> |
|
57 <link rel="stylesheet" href="res/blueprint/print.css" type="text/css" media="print"> |
|
58 <!--[if lt IE 8]><link rel="stylesheet" href="blueprint/ie.css" type="text/css" media="screen, projection"><![endif]--> |
|
59 |
|
60 <!-- Import fancy-type plugin for the sample page. --> |
|
61 |
|
62 <link rel="stylesheet" href="res/blueprint/plugins/fancy-type/screen.css" type="text/css" media="screen, projection"> |
|
63 <link rel="stylesheet" href="custom.css" type="text/css" media="screen, projection"> |
|
64 <link rel="stylesheet" type="text/css" href="res/jquery.fancybox/fancybox/jquery.fancybox-1.3.4.css" media="screen"> |
|
65 <link rel="stylesheet" type="text/css" href="res/niceforms/niceforms-custom.css" media="screen" > |
|
66 |
|
67 <!-- JAVASCRIPT --> |
|
68 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> |
|
69 <script type="text/javascript" src="res/jquery.fancybox/fancybox/jquery.fancybox-1.3.4.pack.js"></script> |
|
70 <script type="text/javascript" src="res/metadataplayer/res/js/jquery.tools.min.js"></script> |
|
71 <script type="text/javascript" src="res/niceforms/niceforms.js"></script> |
|
72 <script src="http://widgets.twimg.com/j/2/widget.js"></script> |
|
73 |
|
74 <!-- FONT --> |
|
75 <link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow&subset=latin' rel='stylesheet' type='text/css'> |
|
76 <link href='http://fonts.googleapis.com/css?family=PT+Sans&subset=latin' rel='stylesheet' type='text/css'> |
|
77 <link href='http://fonts.googleapis.com/css?family=Geo&subset=latin' rel='stylesheet' type='text/css'> |
|
78 |
|
79 <script type="text/javascript"> |
|
80 $(document).ready(function() { |
|
81 |
|
82 doTimer(); |
|
83 //$("txt").hide(); |
|
84 $(".loginbutton").click(function() { |
|
85 document.location.href="<?php URL_ROOT ?>?CONNECT=true"; |
|
86 }); |
|
87 $("#IDENTIFIER").click(function() { |
|
88 document.location.href="<?php URL_ROOT ?>?CONNECT=true"; |
|
89 }); |
|
90 |
|
91 $("#messageSuccess").hide(); |
|
92 $("#messageFailed").hide(); |
|
93 $("#txt").hide(); |
|
94 |
|
95 // BUTTONS |
|
96 $("#positive").click(function(){ |
|
97 var MyValue = $('#status').attr("value"); |
|
98 $('#status').attr("value",MyValue+"++ "); |
|
99 }); |
|
100 $("#negative").click(function(){ |
|
101 var MyValue = $('#status').attr("value"); |
|
102 $('#status').attr("value",MyValue+"-- "); |
|
103 }); |
|
104 $("#reference").click(function(){ |
|
105 var MyValue = $('#status').attr("value"); |
|
106 $('#status').attr("value",MyValue+"== "); |
|
107 }); |
|
108 $("#question").click(function(){ |
|
109 var MyValue = $('#status').attr("value"); |
|
110 $('#status').attr("value",MyValue+"?? "); |
|
111 }); |
|
112 |
|
113 // SEND TWEETS |
|
114 $("#sendTweet").click(function(){ |
|
115 var MyStatus = $('#status').attr("value"); |
|
116 $.post('tweet_ajax.php', {status:MyStatus} |
|
117 ,function(data) { |
|
118 |
|
119 if(data=="true"){ |
|
120 $("#messageSuccess").show('fast'); |
|
121 $("#messageSuccess").delay(800).hide('slow'); |
|
122 $('#status').attr("value","#rsln"); |
|
123 }else{ |
|
124 $("#error").text(data); |
|
125 $("#messageFailed").show('fast'); |
|
126 $("#messageFailed").delay(800).hide('slow'); |
|
127 } |
|
128 |
|
129 }); |
|
130 |
|
131 }); |
|
132 |
|
133 $(".timeFrame").tooltip(); |
|
134 /* |
|
135 * Lightbox button |
|
136 */ |
|
137 $("#About").fancybox({ |
|
138 'titlePosition' : 'inside', |
|
139 'transitionIn' : 'none', |
|
140 'transitionOut' : 'none', |
|
141 'enableEscapeButton': 'none', |
|
142 'margin' : 1, |
|
143 'padding' : 0 |
|
144 }<?php if (!isset($_SESSION['TWITTER_ACCESS_TOKEN'])){echo(").trigger('click');");}else{echo(");");} ?> |
|
145 |
|
146 |
|
147 $("#Program").fancybox({ |
|
148 'width' : '75%', |
|
149 'height' : '75%', |
|
150 'autoScale' : false, |
|
151 'transitionIn' : 'none', |
|
152 'transitionOut' : 'none', |
|
153 'type' : 'iframe' |
|
154 }); |
|
155 |
|
156 $("#Video_ldt").fancybox({ |
|
157 'width' : 1021, |
|
158 'height' : 661, |
|
159 'autoScale' : false, |
|
160 'transitionIn' : 'none', |
|
161 'transitionOut' : 'none', |
|
162 'type' : 'iframe' |
|
163 }); |
|
164 |
|
165 $("#ACCES").click(function() { |
|
166 $.fancybox.close(); |
|
167 }); |
|
168 |
|
169 // Buttons |
|
170 |
|
171 |
|
172 }); |
|
173 |
|
174 |
|
175 <!-- LIMIT TEXTAREA: |
|
176 function imposemax(Object) |
|
177 { |
|
178 return (Object.value.length <= 140); |
|
179 } |
|
180 // End --> |
|
181 |
|
182 <!-- TIMER |
|
183 var c=0; |
|
184 var t; |
|
185 var timer_is_on=0; |
|
186 |
|
187 function timedCount() |
|
188 { |
|
189 document.getElementById('txt').value=c; |
|
190 c = c+1; |
|
191 t = window.setTimeout("timedCount()",1000); |
|
192 $(".twtr-ft").hide(); |
|
193 $(".twtr-hd").hide(); |
|
194 //twtr-tweet |
|
195 $(".twtr-tweet").each(colorTweetings); |
|
196 |
|
197 } |
|
198 |
|
199 function colorTweetings (){ |
|
200 var tweettemp = $(this).html(); |
|
201 if (tweettemp.search(/\x3F\x3F/)!=-1){ |
|
202 $(this).css({'background-color': '#bfdbec','color':"#000"}); |
|
203 } |
|
204 if (tweettemp.search(/\x2B\x2B/)!=-1){ |
|
205 $(this).css({'background-color': '#c5e7cd','color':"#fff"}); |
|
206 } |
|
207 if (tweettemp.search(/\x2D\x2D/)!=-1){ |
|
208 $(this).css({'background-color': '#f6ced0','color':"#fff"}); |
|
209 } |
|
210 if (tweettemp.search(/\x3D\x3D/)!=-1){ |
|
211 $(this).css({'background-color': '#ecedc1','color':"#000"}); |
|
212 } |
|
213 }; |
|
214 |
|
215 |
|
216 |
|
217 function doTimer() |
|
218 { |
|
219 if (!timer_is_on) |
|
220 { |
|
221 timer_is_on=1; |
|
222 timedCount(); |
|
223 } |
|
224 } |
|
225 |
|
226 function stopCount() |
|
227 { |
|
228 clearTimeout(t); |
|
229 timer_is_on=0; |
|
230 } |
|
231 // |
|
232 //--> |
|
233 </script> |
|
234 |
|
235 <script type="text/javascript"> |
|
236 |
|
237 var _gaq = _gaq || []; |
|
238 _gaq.push(['_setAccount', 'UA-9955524-3']); |
|
239 _gaq.push(['_setDomainName', '.iri.centrepompidou.fr']); |
|
240 _gaq.push(['_trackPageview']); |
|
241 |
|
242 (function() { |
|
243 var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; |
|
244 ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; |
|
245 var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); |
|
246 })(); |
|
247 |
|
248 </script> |
|
249 |
|
250 </head> |
|
251 <body> |
|
252 <div class="container"> |
|
253 <img src="<?php echo($C_REP); ?>/images/head_logo.gif" class="Producteur logo"> |
|
254 <div id="minilogo" style="margin-left:85px;height:5px;top:5px;"></div> |
|
255 <ul class="menu"> |
|
256 <li class="menuUnderline"><a href="index.php" class="menuLink">Archives </a></li> |
|
257 <li class="menuUnderline" ><a href="http://www.rslnmag.fr/blog/2011/3/13/_nous-en-sommes-2020_toutes-les-donnees-sont-liberees_/" class="menuLink" target="_blank"> Programme</a> |
|
258 <li ><a href="about.php" class="menuLink" >A propos</a></li> |
|
259 |
|
260 </ul> |
|
261 |
|
262 |
|
263 <div class="videoLive"> |
|
264 <div class="videoLivePlayer"> |
|
265 <img src="<?php echo($C_REP); ?>/images/big_visuel_rsln_mb.jpg" width="500" height="375" /> |
|
266 </div> |
|
267 |
|
268 </div> |
|
269 |
|
270 <div class="videoLiveProgram"> |
|
271 |
|
272 <div class="arrowContainer"> |
|
273 <div class="arrow"> </div> |
|
274 </div> |
|
275 <div class="videoLiveProgramTitle"> |
|
276 <b><?php echo($C_title); ?></b></div> |
|
277 <div class="videoLiveProgramDescription"> |
|
278 <br><?php echo($C_description); ?></div> |
|
279 |
|
280 |
|
281 </div> |
|
282 |
|
283 <div class="tweetWriter"> |
|
284 <h3 class="tweetWriterTitle">Annotations polémique : </h3> |
|
285 <form action="tweet.php" method="post" id="statusform" > |
|
286 <?php if (!isset($_SESSION['TWITTER_ACCESS_TOKEN'])){ |
|
287 echo("<div class='loginbutton' ><a href='".URL_ROOT."?CONNECT=true' class='loginlink'> |
|
288 Vous n'êtes pas connecté.<br> |
|
289 Pour participer, veuillez vous identifier en cliquant ici. </a></div>"); |
|
290 }else{ |
|
291 echo("<textarea name='status' id='status' rows='3' cols='50' onkeypress='return imposemax(this);'>".$C_hashtag."</textarea>"); |
|
292 } |
|
293 ?> |
|
294 |
|
295 |
|
296 <div id="messageSuccess" style="background-color:lightgreen;"> |
|
297 Votre tweet a bien été envoyé !<br><br> |
|
298 </div> |
|
299 |
|
300 <div id="messageFailed" style="background-color:red;"> |
|
301 Ooups! il y a une erreur vous avez le droit de frapper le developpeur :<div id="error"> </div><br/><br> |
|
302 </div> |
|
303 |
|
304 |
|
305 |
|
306 <a class="button_w" href="#" id="sendTweet" style="float:right;margin-right:15px;margin-left:35px;width:70px;" ><span>Envoyer</span></a> |
|
307 <!--<button name="s" type="button" id="sendTweet" |
|
308 style="float:right;margin-right:15px;margin-left:35px;width:70px;" >Envoyer</button>--> |
|
309 <a |
|
310 |
|
311 id="positive" |
|
312 title="accord" |
|
313 class="tweetButton">++</a> |
|
314 <a |
|
315 |
|
316 id="negative" |
|
317 title="désaccord" |
|
318 class="tweetButton">--</a> |
|
319 <a |
|
320 |
|
321 id="reference" |
|
322 title="reference" |
|
323 class="tweetButton">==</a> |
|
324 <a |
|
325 |
|
326 id="question" |
|
327 title="question" |
|
328 class="tweetButton"> ??</a> |
|
329 </form> |
|
330 </div> |
|
331 |
|
332 <div class="tweetReader"> |
|
333 <script> |
|
334 new TWTR.Widget({ |
|
335 version: 2, |
|
336 type: 'search', |
|
337 search: '<?php echo($C_hashtag); ?>', |
|
338 interval: 1000, |
|
339 title: '', |
|
340 subject: '', |
|
341 width: 377, |
|
342 height: 450, |
|
343 theme: { |
|
344 shell: { |
|
345 background: '#ffffff', |
|
346 color: '#ffffff' |
|
347 }, |
|
348 tweets: { |
|
349 background: '#ffffff', |
|
350 color: '#444444', |
|
351 links: '#1985b5' |
|
352 } |
|
353 }, |
|
354 features: { |
|
355 scrollbar: false, |
|
356 loop: true, |
|
357 live: true, |
|
358 hashtags: true, |
|
359 timestamp: true, |
|
360 avatars: true, |
|
361 toptweets: true, |
|
362 behavior: 'default' |
|
363 } |
|
364 }).render().start(); |
|
365 </script> |
|
366 </div> |
|
367 |
|
368 <div class="footer"> |
|
369 <hr> |
|
370 <?php |
|
371 echo($C_partenaires); |
|
372 |
|
373 if (isset($_SESSION['TWITTER_ACCESS_TOKEN'])){ |
|
374 echo("| <a href='clear.php' class='footerLink'>Déconnexion</a>"); |
|
375 } |
|
376 ?> |
|
377 <div href="#Aboutbox" id="About">about</div> |
|
378 <input type="text" id="txt" size="3"/> |
|
379 |
|
380 </div> |
|
381 |
|
382 |
|
383 </div> |
|
384 |
|
385 <!-- LIGHTBOX --> |
|
386 <div style="display:none;"> |
|
387 <div id="Aboutbox" > |
|
388 <div class="lightBorder"> |
|
389 <div class="lightTitle" style="height:45px;"> </div> |
|
390 <div class="lightSubTitle">Annotation polémique par tweet </div> |
|
391 <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. |
|
392 </div> |
|
393 <div> |
|
394 <br/> |
|
395 <a class="button_b" href="#" id="IDENTIFIER"><span>S'identifier</span></a> <br/><br/> |
|
396 <a class="button_w" href="#" id="ACCES"><span>Libre accès</span></a> |
|
397 </div> |
|
398 </div> |
|
399 </div> |
|
400 </div> |
|
401 <!-- END LIGHTBOX --> |
|
402 |
|
403 |
|
404 </body> |
|
405 </html> |