web/index.html
changeset 10 4501548c3e5a
parent 9 d22885042ac0
child 11 75419dc974b1
equal deleted inserted replaced
9:d22885042ac0 10:4501548c3e5a
    83   <script type="text/javascript" src="./lib/jquery-1.9.1.js"></script>
    83   <script type="text/javascript" src="./lib/jquery-1.9.1.js"></script>
    84   <script type="text/javascript" src="./lib/jquery.history.js"></script>
    84   <script type="text/javascript" src="./lib/jquery.history.js"></script>
    85   <script type="text/javascript" src="./lib/bootstrap/js/bootstrap.min.js"></script>
    85   <script type="text/javascript" src="./lib/bootstrap/js/bootstrap.min.js"></script>
    86   <script type="text/javascript">
    86   <script type="text/javascript">
    87     
    87     
       
    88     var cur_vid = "";
       
    89   
    88     var iframes = {
    90     var iframes = {
    89       "0" : "<iframe src='http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/embediframe/?content_id=37903d3c-3b21-11e3-9592-00145ea4a2be&project_id=49bd6124-3b21-11e3-a863-00145ea4a2be&createannotation=True&tag_titles=&polemic=all&annotations_list=True&autostart=True&annotation=True' width='570' height='1300' seamless='seamless'></iframe>",
    91       "0" : "<iframe src='http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/embediframe/?content_id=37903d3c-3b21-11e3-9592-00145ea4a2be&project_id=49bd6124-3b21-11e3-a863-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>",
    92       "1" : "<p>iframe à venir, vidéo n°1</p>",
    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>",
    93       "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>",
    92       "2" : "<p>iframe à venir, vidéo n°2</p>",
    94       "2" : "<p>iframe à venir, vidéo n°2</p>",
   119     function playVideo(n, segid, update_h){
   121     function playVideo(n, segid, update_h){
   120       // test segid
   122       // test segid
   121       if(!(typeof segid !== 'undefined' && segid !== false)){
   123       if(!(typeof segid !== 'undefined' && segid !== false)){
   122     	  segid = "";
   124     	  segid = "";
   123       }
   125       }
   124 
   126       
   125       if (n=="1" || n=="2" || n=="3" || n=="4" || n=="5" || n=="6" || n=="7"){
   127       var fire_hash_changed = false;
   126         $("#videocontainer").html("<p>à venir, vidéo n°" + n + "</p>");
   128       
       
   129       if(cur_vid!=n){
       
   130 	      if (n=="1" || n=="2" || n=="3" || n=="4" || n=="5" || n=="6" || n=="7"){
       
   131 	        $("#videocontainer").html("<p>à venir, vidéo n°" + n + "</p>");
       
   132 	      }
       
   133 	      else{
       
   134 	        var s = ''
       
   135 	 + '<div>'
       
   136 	 + '  <div style="float:left; width:550px;" id="wrapper_player_project_a94ee060-49e9-11e2-b4ad-00145ea4a2be">'
       
   137 	 + '    <div>'
       
   138 	 + '      <div id="player_project_a94ee060-49e9-11e2-b4ad-00145ea4a2be_embed" class="iri_player_embed"></div>'
       
   139 	 + '      <script type="text/javascript" src="./lib/metadataplayer/LdtPlayer-core.js"><\/script>'
       
   140 	 + '      <script type="text/javascript">'
       
   141 	 + 'if (typeof jQuery == "undefined") {'
       
   142 	 + '    jQuery = IriSP.jQuery;'
       
   143 	 + '   }'
       
   144 	 + '    var metadatas = {metadata: {url: "./json/data__NUM_JSON__.json"}};'
       
   145 	 + '    var metadata_key = "metadata";'
       
   146 	 + '  IriSP.libFiles.defaultDir = "./js";'
       
   147 	 + '  IriSP.libFiles.locations.jwPlayerSWF = "./player.swf";'
       
   148 	 + '  IriSP.libFiles.locations.cssjQueryUI = "./css/jquery-ui.css";'
       
   149 	 + '  IriSP.language = "fr-fr";'
       
   150 	 + '  IriSP.widgetsDir = "./lib/metadataplayer";'
       
   151 	 + '  var _metadata = {'
       
   152 	 + '      url: metadatas[metadata_key].url,'
       
   153 	 + '      format: "ldt"'
       
   154 	 + '  };'
       
   155 	 + '  var _config = {'
       
   156 	 + '      width: "550",'
       
   157 	 + '      container: "player_project_a94ee060-49e9-11e2-b4ad-00145ea4a2be_embed",'
       
   158 	 + '      css: "./lib/metadataplayer/LdtPlayer-core.css",'
       
   159 	 + '      default_options: {'
       
   160 	 + '          metadata: _metadata'
       
   161 	 + '      },'
       
   162 	 + '      widgets: ['
       
   163 	 + '          {'
       
   164 	 + '              type: "AutoPlayer",'
       
   165 	 + '              height: "300",'
       
   166 	 + '              autostart:  true,'
       
   167 	 + '              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/"); }'
       
   168 	 + '          }'
       
   169 	 + '          ,{'
       
   170 	 + '              type: "Polemic",'
       
   171 	 + '              annotation_type: false,'
       
   172 	 + '              defaultcolor: "#585858",'
       
   173 	 + '              foundcolor: "#fc00ff",'
       
   174 	 + '              polemics : ['
       
   175 	 + '                      {'
       
   176 	 + '                          "name" : "OK",'
       
   177 	 + '                          "keywords" : [ "++" ],'
       
   178 	 + '                          "color" : "#1d973d"'
       
   179 	 + '                      },'
       
   180 	 + '                      {'
       
   181 	 + '                          "name" : "KO",'
       
   182 	 + '                          "keywords" : [ "--" ],'
       
   183 	 + '                          "color" : "#ce0a15"'
       
   184 	 + '                      },'
       
   185 	 + '                      {'
       
   186 	 + '                          "name" : "REF",'
       
   187 	 + '                          "keywords" : [ "==", "http://" ],'
       
   188 	 + '                          "color" : "#c5a62d"  '
       
   189 	 + '                      },'
       
   190 	 + '                      {'
       
   191 	 + '                          "name" : "Q",'
       
   192 	 + '                          "keywords" : [ "?" ],'
       
   193 	 + '                          "color" : "#036aae"'
       
   194 	 + '                      }'
       
   195 	 + '                  ]'
       
   196 	 + '          }'
       
   197 	 + '          ,{'
       
   198 	 + '              type: "Slider"'
       
   199 	 + '          }'
       
   200 	 /*+ '          ,{'
       
   201 	 + '              type: "AnnotationsList",'
       
   202 	 + '              container: "AnnotationsList_ext",'
       
   203 	 + '              ajax_url: "http://ldt.iri.centrepompidou.fr/ldtplatform/api/ldt/1.0/segments/bytimecode/{{media}}/{{begin}}/{{end}}",'
       
   204 	 + '              ajax_granularity : 300000,'
       
   205 	 + '              default_thumbnail : "./css/imgs/video_sequence.png",'
       
   206 	 + '              show_audio: true,'
       
   207 	 + '              rtmp_streamer: "rtmp://media.iri.centrepompidou.fr/ddc_micro_record/"'
       
   208 	 + '          }'*/
       
   209 	 + '          ,{'
       
   210 	 + '              type: "Controller"'
       
   211 	 + '          }'
       
   212 	 + '          ,{'
       
   213 	// + '              type: "Segments",'
       
   214 	// + '              annotation_type: ["chap","découpage"]'
       
   215 	 + '              type: "MultiSegments"'
       
   216 	 + '          }'
       
   217 	// + '          ,{'
       
   218 	// + '              type: "Annotation"'
       
   219 	// + '          }'
       
   220 	 + '          ,{'
       
   221 	 + '              type: "Mediafragment"'
       
   222 	 + '          }'
       
   223 	 + '      ]'
       
   224 	 + '  };'
       
   225 	 + '  _myPlayer = new IriSP.Metadataplayer(_config);'
       
   226 	 + '      <\/script>'
       
   227 	 + '    </div>'
       
   228 	 + '  </div>'
       
   229 	 + '  <div style="float:left; width:400px;" id="AnnotationsList_ext"></div>'
       
   230 	 + '</div>'
       
   231 	 + '<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>';
       
   232 	      
       
   233 	        $("#videocontainer").html(s.replace(/__NUM_JSON__/g, n));
       
   234 	      }
       
   235 	      cur_vid = n;
   127       }
   236       }
   128       else{
   237       else{
   129         var s = ''
   238     	  fire_hash_changed = true;
   130  + '<div>'
       
   131  + '  <div style="float:left; width:550px;" id="wrapper_player_project_a94ee060-49e9-11e2-b4ad-00145ea4a2be">'
       
   132  + '    <div>'
       
   133  + '      <div id="player_project_a94ee060-49e9-11e2-b4ad-00145ea4a2be_embed" class="iri_player_embed"></div>'
       
   134  + '      <script type="text/javascript" src="./lib/metadataplayer/LdtPlayer-core.js"><\/script>'
       
   135  + '      <script type="text/javascript">'
       
   136  + 'if (typeof jQuery == "undefined") {'
       
   137  + '    jQuery = IriSP.jQuery;'
       
   138  + '   }'
       
   139  + '    var metadatas = {metadata: {url: "./json/data__NUM_JSON__.json"}};'
       
   140  + '    var metadata_key = "metadata";'
       
   141  + '  IriSP.libFiles.defaultDir = "./js";'
       
   142  + '  IriSP.libFiles.locations.jwPlayerSWF = "./player.swf";'
       
   143  + '  IriSP.libFiles.locations.cssjQueryUI = "./css/jquery-ui.css";'
       
   144  + '  IriSP.language = "fr-fr";'
       
   145  + '  IriSP.widgetsDir = "./lib/metadataplayer";'
       
   146  + '  var _metadata = {'
       
   147  + '      url: metadatas[metadata_key].url,'
       
   148  + '      format: "ldt"'
       
   149  + '  };'
       
   150  + '  var _config = {'
       
   151  + '      width: "550",'
       
   152  + '      container: "player_project_a94ee060-49e9-11e2-b4ad-00145ea4a2be_embed",'
       
   153  + '      css: "./lib/metadataplayer/LdtPlayer-core.css",'
       
   154  + '      default_options: {'
       
   155  + '          metadata: _metadata'
       
   156  + '      },'
       
   157  + '      widgets: ['
       
   158  + '          {'
       
   159  + '              type: "AutoPlayer",'
       
   160  + '              height: "300",'
       
   161  + '              autostart:  true,'
       
   162  + '              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/"); }'
       
   163  + '          }'
       
   164  + '          ,{'
       
   165  + '              type: "Polemic",'
       
   166  + '              annotation_type: false,'
       
   167  + '              defaultcolor: "#585858",'
       
   168  + '              foundcolor: "#fc00ff",'
       
   169  + '              polemics : ['
       
   170  + '                      {'
       
   171  + '                          "name" : "OK",'
       
   172  + '                          "keywords" : [ "++" ],'
       
   173  + '                          "color" : "#1d973d"'
       
   174  + '                      },'
       
   175  + '                      {'
       
   176  + '                          "name" : "KO",'
       
   177  + '                          "keywords" : [ "--" ],'
       
   178  + '                          "color" : "#ce0a15"'
       
   179  + '                      },'
       
   180  + '                      {'
       
   181  + '                          "name" : "REF",'
       
   182  + '                          "keywords" : [ "==", "http://" ],'
       
   183  + '                          "color" : "#c5a62d"  '
       
   184  + '                      },'
       
   185  + '                      {'
       
   186  + '                          "name" : "Q",'
       
   187  + '                          "keywords" : [ "?" ],'
       
   188  + '                          "color" : "#036aae"'
       
   189  + '                      }'
       
   190  + '                  ]'
       
   191  + '          }'
       
   192  + '          ,{'
       
   193  + '              type: "Slider"'
       
   194  + '          }'
       
   195  /*+ '          ,{'
       
   196  + '              type: "AnnotationsList",'
       
   197  + '              container: "AnnotationsList_ext",'
       
   198  + '              ajax_url: "http://ldt.iri.centrepompidou.fr/ldtplatform/api/ldt/1.0/segments/bytimecode/{{media}}/{{begin}}/{{end}}",'
       
   199  + '              ajax_granularity : 300000,'
       
   200  + '              default_thumbnail : "./css/imgs/video_sequence.png",'
       
   201  + '              show_audio: true,'
       
   202  + '              rtmp_streamer: "rtmp://media.iri.centrepompidou.fr/ddc_micro_record/"'
       
   203  + '          }'*/
       
   204  + '          ,{'
       
   205  + '              type: "Controller"'
       
   206  + '          }'
       
   207  + '          ,{'
       
   208 // + '              type: "Segments",'
       
   209 // + '              annotation_type: ["chap","découpage"]'
       
   210  + '              type: "MultiSegments"'
       
   211  + '          }'
       
   212 // + '          ,{'
       
   213 // + '              type: "Annotation"'
       
   214 // + '          }'
       
   215  + '          ,{'
       
   216  + '              type: "Mediafragment"'
       
   217  + '          }'
       
   218  + '      ]'
       
   219  + '  };'
       
   220  + '  _myPlayer = new IriSP.Metadataplayer(_config);'
       
   221  + '      <\/script>'
       
   222  + '    </div>'
       
   223  + '  </div>'
       
   224  + '  <div style="float:left; width:400px;" id="AnnotationsList_ext"></div>'
       
   225  + '</div>'
       
   226  + '<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>';
       
   227       
       
   228         $("#videocontainer").html(s.replace(/__NUM_JSON__/g, n));
       
   229       }
   239       }
   230       
   240       
   231       // update history
   241       // update history
   232       update_h = typeof update_h !== 'undefined' ? update_h : true;
   242       update_h = typeof update_h !== 'undefined' ? update_h : true;
   233       if(update_h){
   243       if(update_h){
   234     	if(segid!=""){
   244     	if(segid!=""){
   235     		update_history("v=" + n + "&id=" + segid);
   245     		update_history("v=" + n + "&id=" + segid);
       
   246     		if(fire_hash_changed){
       
   247     			$(window).trigger('hashchange');
       
   248     		}
   236     	}
   249     	}
   237     	else{
   250     	else{
   238           update_history("v=" + n);
   251           update_history("v=" + n);
   239     	}
   252     	}
   240       }
   253       }
   259     }
   272     }
   260     
   273     
   261     // on load
   274     // on load
   262     $(function() {
   275     $(function() {
   263       $(".videolink").click(function(e){
   276       $(".videolink").click(function(e){
   264     	console.log('$(this).attr("data-segid")');
       
   265     	console.log($(this).attr("data-segid"));
       
   266         playVideo($(this).attr("data-videoid"), $(this).attr('data-segid'));
   277         playVideo($(this).attr("data-videoid"), $(this).attr('data-segid'));
   267       });
   278       });
   268       // load first video with get parameter
   279       // load first video with get parameter
   269       var first = "0";
   280       var first = "0";
   270       var iframe = getURLParameter("iframe");
   281       var iframe = getURLParameter("iframe");