|
0
|
1 |
<!doctype html> |
|
|
2 |
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="fr"> <![endif]--> |
|
|
3 |
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="fr"> <![endif]--> |
|
|
4 |
<!--[if IE 8]> <html class="no-js lt-ie9" lang="fr"> <![endif]--> |
|
|
5 |
<!--[if gt IE 8]><!--> <html class="no-js" lang="fr"> <!--<![endif]--> |
|
|
6 |
<head> |
|
|
7 |
<meta charset="utf-8"> |
|
|
8 |
<title>Digital Studies - Home</title> |
|
|
9 |
<link rel="stylesheet" href="./lib/bootstrap/css/bootstrap.min.css"> |
|
|
10 |
<link rel="stylesheet" href="./css/ds.css"> |
|
|
11 |
</head> |
|
|
12 |
<body> |
|
|
13 |
<div id="wrapper"> |
|
|
14 |
<header class="navbar navbar-inverse" role="banner"> |
|
|
15 |
<div class="container"> |
|
|
16 |
<nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation"> |
|
|
17 |
<ul class="nav navbar-nav"> |
|
|
18 |
<li> |
|
|
19 |
<a href="#"><img src="./img/logodsrose2" alt="Logo Digital Studies" /></a> |
|
|
20 |
</li> |
|
|
21 |
</ul> |
|
|
22 |
<ul class="nav navbar-nav" style="float:right;"> |
|
|
23 |
<li><a href="#">Lien 1</a></li> |
|
|
24 |
<li><a href="#">Lien 2</a></li> |
|
|
25 |
<li><a href="#">Lien 3</a></li> |
|
|
26 |
<li><a href="#">Lien 4</a></li> |
|
|
27 |
</ul> |
|
|
28 |
</nav> |
|
|
29 |
</div> |
|
|
30 |
</header> |
|
|
31 |
<div class="container"> |
|
|
32 |
<div class="row divctn"> |
|
|
33 |
<div class="col-md-4"> |
|
6
|
34 |
<div class="videotitle" id="videotitle0"> |
|
0
|
35 |
<p><a class="videolink" data-videoid="0">Vidéo chapitrée du résumé</a> <button type="button" class="btn btn-info btn-xs" data-toggle="collapse" data-target="#abstract">Voir plus</button></p> |
|
3
|
36 |
<div id="abstract" class="collapse"> |
|
|
37 |
<p>Avec l’apparition du web, c’est la nature même des savoirs sous toutes leurs formes qui a changé tandis que l’écriture réticulaire devenait accessible aux publics les plus divers. Ceux-ci ont redéfini les conditions de la parité et de ce fait l’université est entrée dans un nouvel âge. C’est ce fait majeur, massif et à bien des égards stupéfiant qui requiert le développement des digital studies prôné par la ministre de l’enseignement supérieur et de la recherche.</p> |
|
|
38 |
<p>L’enjeu majeur représenté par les enseignements numériques vient rationnellement après celui de la recherche et des études numériques. Il s’agit d’impulser une dynamique qui repense les rapports des savoirs à leurs supports (dont les MOOCs) avec les universités et les institutions académiques, et qui, par la recherche, redéfinisse leur rôle dans ce nouveau contexte.</p> |
|
|
39 |
<p>La technologie du vidéolivre est un support nouveau pour un réseau de lecteurs constituant une communauté plurielle d’interprétations. Ce n’est là qu’un exemple de ces nouveaux dispositifs du débat public auxquels il est fondamental d’initier et d’associer le plus tôt possible les étudiants.</p> |
|
|
40 |
</div> |
|
0
|
41 |
</div> |
|
6
|
42 |
<div class="videotitle" id="videotitle1"> |
|
3
|
43 |
<p>Chapitre 1 : L'état et le numérique<br/><a class="videolink" data-videoid="1r">résumé</a> ou <a class="videolink" data-videoid="1">vidéo complète</a></p> |
|
0
|
44 |
</div> |
|
6
|
45 |
<div class="videotitle" id="videotitle2"> |
|
3
|
46 |
<p>Chapitre 2 : Technologies, savoirs et sociétés<br/><a class="videolink" data-videoid="2r">résumé</a> ou <a class="videolink" data-videoid="2">vidéo complète</a></p> |
|
0
|
47 |
</div> |
|
6
|
48 |
<div class="videotitle" id="videotitle3"> |
|
3
|
49 |
<p>Chapitre 3 : Qui pour guider une politique du numérique : le marché ? ou la recherche académique ?<br/><a class="videolink" data-videoid="3r">résumé</a> ou <a class="videolink" data-videoid="3">vidéo complète</a></p> |
|
0
|
50 |
</div> |
|
6
|
51 |
<div class="videotitle" id="videotitle4"> |
|
3
|
52 |
<p>Chapitre 4 : La polémique, mère de tous savoirs<br/><a class="videolink" data-videoid="4r">résumé</a> ou <a class="videolink" data-videoid="4">vidéo complète</a></p> |
|
|
53 |
</div> |
|
6
|
54 |
<div class="videotitle" id="videotitle5"> |
|
3
|
55 |
<p>Chapitre 5 : La catégorisation contributive<br/><a class="videolink" data-videoid="5r">résumé</a> ou <a class="videolink" data-videoid="5">vidéo complète</a></p> |
|
0
|
56 |
</div> |
|
6
|
57 |
<div class="videotitle" id="videotitle6"> |
|
3
|
58 |
<p>Chapitre 6 : Sur l'industrie éditoriale numérisée<br/><a class="videolink" data-videoid="6r">résumé</a> ou <a class="videolink" data-videoid="6">vidéo complète</a></p> |
|
0
|
59 |
</div> |
|
6
|
60 |
<div class="videotitle" id="videotitle6"> |
|
3
|
61 |
<p>Chapitre 7 : Propositions pour France Université Numérique<br/><a class="videolink" data-videoid="7r">résumé</a> ou <a class="videolink" data-videoid="7">vidéo complète</a></p> |
|
0
|
62 |
</div> |
|
6
|
63 |
<div class="videotitle" id="videotitlef"> |
|
0
|
64 |
<p><a class="videolink" data-videoid="full">Vidéo complète chapitrée</a></p> |
|
|
65 |
</div> |
|
|
66 |
</div> |
|
|
67 |
<div class="col-md-8" id="videocontainer">Pour commencer, cliquez sur "Vidéo chapitrée du résumé" ou "Vidéo complète chapitrée"</div> |
|
|
68 |
</div> |
|
|
69 |
</div> |
|
|
70 |
<footer> |
|
|
71 |
<div class="container row"> |
|
|
72 |
<div class="footer-img col-md-6"> |
|
|
73 |
<a href="http://www.iri.centrepompidou.fr" target="_blank"><img src="./img/logo_IRI_footer.png" alt="Logo IRI" /></a> |
|
|
74 |
<a href="http://arsindustrialis.org/" target="_blank"><img src="./img/logoarsindustrialis.jpg" alt="Logo ars" /></a> |
|
|
75 |
<a href="http://pharmakon.fr/" target="_blank"><img src="./img/logo_pharmakon.png" alt="Logo Pharmakon" /></a> |
|
|
76 |
</div> |
|
|
77 |
<div class="col-md-6"> |
|
|
78 |
<div class="text-right" id="copyright-version">©2013 <a href="http://www.iri.centrepompidou.fr" target="_blank">IRI</a></div> |
|
|
79 |
</div> |
|
|
80 |
</div> |
|
|
81 |
</footer> |
|
|
82 |
</div> |
|
|
83 |
<script type="text/javascript" src="./lib/jquery-1.9.1.js"></script> |
|
5
|
84 |
<script type="text/javascript" src="./lib/jquery.history.js"></script> |
|
0
|
85 |
<script type="text/javascript" src="./lib/bootstrap/js/bootstrap.min.js"></script> |
|
|
86 |
<script type="text/javascript"> |
|
5
|
87 |
|
|
0
|
88 |
var iframes = { |
|
|
89 |
"0" : "<iframe src='http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/embediframe/?content_id=53574ae4-49e9-11e2-b4ad-00145ea4a2be&project_id=a94ee060-49e9-11e2-b4ad-00145ea4a2be&createannotation=True&tag_titles=&polemic=all&annotations_list=True&autostart=True&annotation=True' width='570' height='1300' seamless='seamless'></iframe>", |
|
|
90 |
"1" : "<p>iframe à venir, vidéo n°1</p>", |
|
6
|
91 |
"1r" : "<iframe src='http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/embediframe/?content_id=0718fd52-3af8-11e3-8796-00145ea4a2be&project_id=2a7b8bde-3af8-11e3-a863-00145ea4a2be&createannotation=True&tag_titles=&polemic=all&annotations_list=True&autostart=True&annotation=True' width='570' height='1300' seamless='seamless'></iframe>", |
|
0
|
92 |
"2" : "<p>iframe à venir, vidéo n°2</p>", |
|
6
|
93 |
"2r" : "<iframe src='http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/embediframe/?content_id=fc7a32a2-3af8-11e3-a863-00145ea4a2be&project_id=0f2c892c-3af9-11e3-a863-00145ea4a2be&createannotation=True&tag_titles=&polemic=all&annotations_list=True&autostart=True&annotation=True' width='570' height='1300' seamless='seamless'></iframe>", |
|
0
|
94 |
"3" : "<p>iframe à venir, vidéo n°3</p>", |
|
|
95 |
"4" : "<p>iframe à venir, vidéo n°4</p>", |
|
|
96 |
"5" : "<p>iframe à venir, vidéo n°5</p>", |
|
|
97 |
"6" : "<p>iframe à venir, vidéo n°6</p>", |
|
|
98 |
"7" : "<p>iframe à venir, vidéo n°7</p>", |
|
|
99 |
"full" : "<iframe src='http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/embediframe/?content_id=62083f72-363c-11e3-8068-00145ea4a2be&project_id=032aebaa-37de-11e3-a863-00145ea4a2be&createannotation=True&tag_titles=&polemic=all&annotations_list=True&autostart=True&annotation=True' width='570' height='1300' seamless='seamless'></iframe>", |
|
|
100 |
}; |
|
|
101 |
|
|
5
|
102 |
function displayIframe(n, update_h){ |
|
0
|
103 |
$("#videocontainer").html(iframes[n]); |
|
5
|
104 |
|
|
|
105 |
// update history |
|
|
106 |
update_h = typeof update_h !== 'undefined' ? update_h : true; |
|
|
107 |
if(update_h){ |
|
|
108 |
update_history("iframe=" + n); |
|
|
109 |
} |
|
6
|
110 |
|
|
|
111 |
active_css(n); |
|
0
|
112 |
} |
|
|
113 |
|
|
5
|
114 |
function playVideo(n, update_h){ |
|
6
|
115 |
if (n=="1" || n=="2" || n=="3" || n=="4" || n=="5" || n=="6" || n=="7" || n=="3r" || n=="4r" || n=="5r" || n=="6r" || n=="7r"){ |
|
0
|
116 |
$("#videocontainer").html("<p>à venir, vidéo n°" + n + "</p>"); |
|
|
117 |
} |
|
|
118 |
else{ |
|
|
119 |
var s = '' |
|
|
120 |
+ '<div>' |
|
3
|
121 |
+ ' <div style="float:left; width:550px;" id="wrapper_player_project_a94ee060-49e9-11e2-b4ad-00145ea4a2be">' |
|
|
122 |
+ ' <div>' |
|
|
123 |
+ ' <div id="player_project_a94ee060-49e9-11e2-b4ad-00145ea4a2be_embed" class="iri_player_embed"></div>' |
|
|
124 |
+ ' <script type="text/javascript" src="./lib/metadataplayer/LdtPlayer-core.js"><\/script>' |
|
|
125 |
+ ' <script type="text/javascript">' |
|
0
|
126 |
+ 'if (typeof jQuery == "undefined") {' |
|
|
127 |
+ ' jQuery = IriSP.jQuery;' |
|
|
128 |
+ ' }' |
|
|
129 |
+ ' var metadatas = {metadata: {url: "./json/data__NUM_JSON__.json"}};' |
|
|
130 |
+ ' var metadata_key = "metadata";' |
|
|
131 |
+ ' IriSP.libFiles.defaultDir = "./js";' |
|
|
132 |
+ ' IriSP.libFiles.locations.jwPlayerSWF = "./player.swf";' |
|
|
133 |
+ ' IriSP.libFiles.locations.cssjQueryUI = "./css/jquery-ui.css";' |
|
|
134 |
+ ' IriSP.language = "fr-fr";' |
|
|
135 |
+ ' IriSP.widgetsDir = "./lib/metadataplayer";' |
|
|
136 |
+ ' var _metadata = {' |
|
|
137 |
+ ' url: metadatas[metadata_key].url,' |
|
|
138 |
+ ' format: "ldt"' |
|
|
139 |
+ ' };' |
|
|
140 |
+ ' var _config = {' |
|
|
141 |
+ ' width: "550",' |
|
|
142 |
+ ' container: "player_project_a94ee060-49e9-11e2-b4ad-00145ea4a2be_embed",' |
|
|
143 |
+ ' css: "./lib/metadataplayer/LdtPlayer-core.css",' |
|
|
144 |
+ ' default_options: {' |
|
|
145 |
+ ' metadata: _metadata' |
|
|
146 |
+ ' },' |
|
|
147 |
+ ' widgets: [' |
|
|
148 |
+ ' {' |
|
|
149 |
+ ' type: "AutoPlayer",' |
|
|
150 |
+ ' height: "300",' |
|
|
151 |
+ ' autostart: true,' |
|
|
152 |
+ ' url_transform: function(url) { if(url.substr(url.length - 4).toLowerCase()==".flv"){ return url.replace("/ddc_player/video/","/ddc_player/flv:video/"); } return url.replace("/ddc_player/video/","/ddc_player/mp4:video/"); }' |
|
|
153 |
+ ' },' |
|
|
154 |
+ ' {' |
|
|
155 |
+ ' type: "Polemic",' |
|
|
156 |
+ ' annotation_type: false,' |
|
|
157 |
+ ' defaultcolor: "#585858",' |
|
|
158 |
+ ' foundcolor: "#fc00ff",' |
|
|
159 |
+ ' polemics : [' |
|
|
160 |
+ ' {' |
|
|
161 |
+ ' "name" : "OK",' |
|
|
162 |
+ ' "keywords" : [ "++" ],' |
|
|
163 |
+ ' "color" : "#1d973d"' |
|
|
164 |
+ ' },' |
|
|
165 |
+ ' {' |
|
|
166 |
+ ' "name" : "KO",' |
|
|
167 |
+ ' "keywords" : [ "--" ],' |
|
|
168 |
+ ' "color" : "#ce0a15"' |
|
|
169 |
+ ' },' |
|
|
170 |
+ ' {' |
|
|
171 |
+ ' "name" : "REF",' |
|
|
172 |
+ ' "keywords" : [ "==", "http://" ],' |
|
|
173 |
+ ' "color" : "#c5a62d" ' |
|
|
174 |
+ ' },' |
|
|
175 |
+ ' {' |
|
|
176 |
+ ' "name" : "Q",' |
|
|
177 |
+ ' "keywords" : [ "?" ],' |
|
|
178 |
+ ' "color" : "#036aae"' |
|
|
179 |
+ ' }' |
|
|
180 |
+ ' ]' |
|
|
181 |
+ ' }' |
|
|
182 |
+ ' ,{' |
|
|
183 |
+ ' type: "Slider"' |
|
|
184 |
+ ' }' |
|
|
185 |
/*+ ' ,{' |
|
|
186 |
+ ' type: "AnnotationsList",' |
|
|
187 |
+ ' container: "AnnotationsList_ext",' |
|
|
188 |
+ ' ajax_url: "http://ldt.iri.centrepompidou.fr/ldtplatform/api/ldt/1.0/segments/bytimecode/{{media}}/{{begin}}/{{end}}",' |
|
|
189 |
+ ' ajax_granularity : 300000,' |
|
|
190 |
+ ' default_thumbnail : "./css/imgs/video_sequence.png",' |
|
|
191 |
+ ' show_audio: true,' |
|
|
192 |
+ ' rtmp_streamer: "rtmp://media.iri.centrepompidou.fr/ddc_micro_record/"' |
|
|
193 |
+ ' }'*/ |
|
|
194 |
+ ' ,{' |
|
|
195 |
+ ' type: "Controller"' |
|
|
196 |
+ ' }' |
|
|
197 |
+ ' ,{' |
|
|
198 |
+ ' type: "Segments",' |
|
|
199 |
+ ' annotation_type: ["chap","découpage"]' |
|
|
200 |
+ ' }' |
|
|
201 |
+ ' ,{' |
|
|
202 |
+ ' type: "Annotation"' |
|
|
203 |
+ ' }' |
|
|
204 |
+ ' ,{' |
|
|
205 |
+ ' type: "Mediafragment"' |
|
|
206 |
+ ' }' |
|
|
207 |
+ ' ]' |
|
|
208 |
+ ' };' |
|
|
209 |
+ ' _myPlayer = new IriSP.Metadataplayer(_config);' |
|
3
|
210 |
+ ' <\/script>' |
|
|
211 |
+ ' </div>' |
|
0
|
212 |
+ ' </div>' |
|
3
|
213 |
+ ' <div style="float:left; width:400px;" id="AnnotationsList_ext"></div>' |
|
0
|
214 |
+ '</div>' |
|
3
|
215 |
+ '<div><p class="text-right"><a style="margin-top: 10px;" class="btn btn-info" href="#" onclick="displayIframe(\'__NUM_JSON__\');return false;"><i class="glyphicon glyphicon-comment"></i> Ajouter votre commentaire sur cette vidéo</a></p></div>'; |
|
0
|
216 |
|
|
|
217 |
$("#videocontainer").html(s.replace(/__NUM_JSON__/g, n)); |
|
|
218 |
} |
|
5
|
219 |
|
|
|
220 |
// update history |
|
|
221 |
update_h = typeof update_h !== 'undefined' ? update_h : true; |
|
|
222 |
if(update_h){ |
|
|
223 |
update_history("v=" + n); |
|
|
224 |
} |
|
6
|
225 |
|
|
|
226 |
active_css(n); |
|
0
|
227 |
} |
|
5
|
228 |
|
|
|
229 |
//Functions to manage history with parameters |
|
|
230 |
function getURLParameter(name) { |
|
|
231 |
return decodeURI( |
|
|
232 |
(RegExp(name + '=' + '(.+?)(&|$)').exec(location.hash)||[,null])[1] |
|
|
233 |
); |
|
|
234 |
} |
|
|
235 |
function update_history(s){ |
|
|
236 |
History.replaceState(null, null, "#" + s); |
|
|
237 |
} |
|
|
238 |
|
|
6
|
239 |
// active css |
|
|
240 |
function active_css(n){ |
|
|
241 |
$(".videotitle").removeClass("active"); |
|
|
242 |
$("#videotitle" + n.substr(0,1)).addClass("active"); |
|
|
243 |
} |
|
|
244 |
|
|
5
|
245 |
// on load |
|
|
246 |
$(function() { |
|
|
247 |
$(".videolink").click(function(e){ |
|
|
248 |
playVideo($(this).attr("data-videoid")); |
|
|
249 |
}); |
|
|
250 |
// load first video with get parameter |
|
|
251 |
var first = "full"; |
|
|
252 |
var iframe = getURLParameter("iframe"); |
|
|
253 |
if(iframe=="null"){ |
|
|
254 |
var v = getURLParameter("v"); |
|
|
255 |
if(v=="null"){ |
|
|
256 |
playVideo(first, false); |
|
|
257 |
} |
|
|
258 |
else{ |
|
|
259 |
playVideo(v, false); |
|
|
260 |
} |
|
|
261 |
} |
|
|
262 |
else{ |
|
|
263 |
displayIframe(iframe, false) |
|
|
264 |
} |
|
|
265 |
}); |
|
|
266 |
|
|
0
|
267 |
</script> |
|
|
268 |
</body> |
|
|
269 |
</html> |