web/LdtPlayer-release.js
changeset 24 36df3a25d7bd
parent 23 44945db9746a
child 25 4f082f63e295
equal deleted inserted replaced
23:44945db9746a 24:36df3a25d7bd
  8668       });
  8668       });
  8669     }
  8669     }
  8670 };
  8670 };
  8671 
  8671 
  8672 
  8672 
  8673 IriSP.annotation_template = "{{! template for an annotation displayed in a segmentWidget }}<div title='{{divTitle}}' id='{{id}}'	class='Ldt-iri-chapter' 	style='left: {{startPourcent}}%;          width: {{endPourcent}}%;          background:#{{hexa_color}};' 	></div>";
  8673 IriSP.annotation_template = "{{! template for an annotation displayed in a segmentWidget }}<div title='{{divTitle}}' id='{{id}}'	class='Ldt-iri-chapter' 	style='left: {{startPourcent}}%;          width: {{endPourcent}}%;          background-color:#{{hexa_color}};' 	></div>";
  8674 IriSP.annotationWidget_template = "{{! template for the annotation widget }}<div class='Ldt-AnnotationsWidget'>  <!-- ugly div because we want to have a double border -->  <div class='Ldt-Annotation-DoubleBorder'>      <div class='Ldt-AnnotationContent'>        <div class='Ldt-AnnotationShareIcons'>         <a class='Ldt-fbShare' href=''><img src='{{img_dir}}/facebook.png' alt='share on facebook'></img></a>         <a class='Ldt-TwShare' href=''><img src='{{img_dir}}/twitter.png' alt='share on twitter'></img></a>         <a class='Ldt-GplusShare' href=''><img src='{{img_dir}}/google.png' alt='share on google+'></img></a>      </div>		  <div class='Ldt-SaTitle'></div>	  	<div class='Ldt-SaDescription'></div>    </div>  </div></div>";
  8674 IriSP.annotationWidget_template = "{{! template for the annotation widget }}<div class='Ldt-AnnotationsWidget'>  <!-- ugly div because we want to have a double border -->  <div class='Ldt-Annotation-DoubleBorder'>      <div class='Ldt-AnnotationContent'>        <div class='Ldt-AnnotationShareIcons'>         <a class='Ldt-fbShare' href=''><img src='{{img_dir}}/facebook.png' alt='share on facebook'></img></a>         <a class='Ldt-TwShare' href=''><img src='{{img_dir}}/twitter.png' alt='share on twitter'></img></a>         <a class='Ldt-GplusShare' href=''><img src='{{img_dir}}/google.png' alt='share on google+'></img></a>      </div>		  <div class='Ldt-SaTitle'></div>	  	<div class='Ldt-SaDescription'></div>    </div>  </div></div>";
  8675 IriSP.annotation_loading_template = "{{! template shown while the annotation widget is loading }}<div id='Ldt-load-container'><div id='Ldt-loader'>&nbsp;</div> Chargement... </div>";
  8675 IriSP.annotation_loading_template = "{{! template shown while the annotation widget is loading }}<div id='Ldt-load-container'><div id='Ldt-loader'>&nbsp;</div> Chargement... </div>";
  8676 IriSP.arrowWidget_template = "<div class='Ldt-arrowWidget'></div>";
  8676 IriSP.arrowWidget_template = "<div class='Ldt-arrowWidget'></div>";
  8677 IriSP.overlay_marker_template = "{{! the template for the small white bars which is z-indexed over our segment widget }}<div class='positionMarker' style='background-color: #F7268E;'></div>";
  8677 IriSP.overlay_marker_template = "{{! the template for the small white bars which is z-indexed over our segment widget }}<div class='positionMarker' style='background-color: #F7268E;'></div>";
  8678 IriSP.player_template = "{{! template for the radio player }}<div class='Ldt-controler demo'>	<div class='Ldt-LeftPlayerControls'>    <div class='Ldt-button Ldt-CtrlPlay'></div>		<div class='Ldt-button Ldt-CtrlAnnotate'></div>    <div class='Ldt-button Ldt-CtrlSearch'></div>	</div>		<div class='Ldt-RightPlayerControls'>    <div class='Ldt-Time'>      <div class='Ldt-ElapsedTime'></div>      <div class='Ldt-TimeSeparator'>/</div>      <div class='Ldt-TotalTime'></div>    </div>		<div class='Ldt-button Ldt-CtrlSound'></div>	</div></div>";
  8678 IriSP.player_template = "{{! template for the radio player }}<div class='Ldt-controler demo'>	<div class='Ldt-LeftPlayerControls'>    <div class='Ldt-button Ldt-CtrlPlay'></div>		<div class='Ldt-button Ldt-CtrlAnnotate'></div>    <div class='Ldt-button Ldt-CtrlSearch'></div>	</div>		<div class='Ldt-RightPlayerControls'>    <div class='Ldt-Time'>      <div class='Ldt-ElapsedTime'></div>      <div class='Ldt-TimeSeparator'>/</div>      <div class='Ldt-TotalTime'></div>    </div>		<div class='Ldt-button Ldt-CtrlSound'></div>	</div></div>";
  8979     return count;
  8979     return count;
  8980 };
  8980 };
  8981 
  8981 
  8982 // conversion de couleur Decimal vers HexaDecimal || 000 si fff
  8982 // conversion de couleur Decimal vers HexaDecimal || 000 si fff
  8983 IriSP.DEC_HEXA_COLOR = function (dec) {
  8983 IriSP.DEC_HEXA_COLOR = function (dec) {
  8984 	 var hexa='0123456789ABCDEF',hex='';
  8984 	 var hexa='0123456789ABCDEF';
       
  8985    var hex='';
  8985 	 var tmp;
  8986 	 var tmp;
  8986 	 while (dec>15){
  8987 	 while (dec>15){
  8987 		  tmp = dec-(Math.floor(dec/16))*16;
  8988 		  tmp = dec-(Math.floor(dec/16))*16;
  8988 		  hex = hexa.charAt(tmp)+hex;
  8989 		  hex = hexa.charAt(tmp)+hex;
  8989 		  dec = Math.floor(dec/16);
  8990 		  dec = Math.floor(dec/16);
 10494 
 10495 
 10495     var begin = Math.round((+ annotation.begin) / 1000);
 10496     var begin = Math.round((+ annotation.begin) / 1000);
 10496     var end = Math.round((+ annotation.end) / 1000);
 10497     var end = Math.round((+ annotation.end) / 1000);
 10497     var duration = this._serializer.currentMedia().meta["dc:duration"] / 1000;
 10498     var duration = this._serializer.currentMedia().meta["dc:duration"] / 1000;
 10498     var id = annotation.id;
 10499     var id = annotation.id;
 10499     var startPourcent 	= IriSP.timeToPourcent(begin, duration) + onePxPercent;
 10500     var startPourcent 	= IriSP.timeToPourcent(begin, duration);
 10500     
 10501     
 10501     /* some sort of collapsing occurs, so we only have to substract one pixel to each box instead of
 10502     /* surprisingly, the following code doesn't work on webkit - for some reason, most of the 
 10502        two
 10503        boxes are 3 pixels wider.
 10503     */
 10504     */
 10504     var endPourcent 	= IriSP.timeToPourcent(end, duration) - startPourcent - onePxPercent * 1.5;
 10505     if (IriSP.jQuery.browser.webkit) { console.log("webkit");
 10505     
 10506       var endPourcent 	= (IriSP.timeToPourcent(end, duration) - startPourcent - onePxPercent * 4.5).toFixed(1);
 10506     /* on the other hand, we have to substract one pixel from the first box because it's the only
 10507     }
 10507        one to have to effective 1px margins */
 10508     else
       
 10509       var endPourcent 	= (IriSP.timeToPourcent(end, duration) - startPourcent - onePxPercent * 1.5).toFixed(1);
       
 10510     
 10508     if (i == 0) {
 10511     if (i == 0) {
 10509 
 10512 
 10510       endPourcent -= onePxPercent;
 10513       endPourcent -= onePxPercent;
 10511     }
 10514     }
 10512     
 10515     
 10516       var color = annotation.content.color;
 10519       var color = annotation.content.color;
 10517     else
 10520     else
 10518       var color = annotation.color;
 10521       var color = annotation.color;
 10519     
 10522     
 10520     var hexa_color = IriSP.DEC_HEXA_COLOR(color);
 10523     var hexa_color = IriSP.DEC_HEXA_COLOR(color);
 10521     
 10524 
 10522     if (hexa_color === "FFCC00")
 10525     if (hexa_color === "FFCC00")
 10523       hexa_color = "333";
 10526       hexa_color = "333";
       
 10527     if (hexa_color.length == 4)
       
 10528       hexa_color = hexa_color + '00';
 10524     
 10529     
 10525     var annotationTemplate = Mustache.to_html(IriSP.annotation_template,
 10530     var annotationTemplate = Mustache.to_html(IriSP.annotation_template,
 10526         {"divTitle" : divTitle, "id" : id, "startPourcent" : startPourcent,
 10531         {"divTitle" : divTitle, "id" : id, "startPourcent" : startPourcent,
 10527         "endPourcent" : endPourcent, "hexa_color" : hexa_color,
 10532         "endPourcent" : endPourcent, "hexa_color" : hexa_color,
 10528         "seekPlace" : Math.round(begin/1000)});
 10533         "seekPlace" : Math.round(begin/1000)});
 10810   this.selector.find(".tip").show();
 10815   this.selector.find(".tip").show();
 10811   this._shown = true;
 10816   this._shown = true;
 10812 };
 10817 };
 10813 
 10818 
 10814 IriSP.TooltipWidget.prototype.hide = function() {                                                   
 10819 IriSP.TooltipWidget.prototype.hide = function() {                                                   
 10815   console.log("hide");  
       
 10816   this.selector.find(".tip").hide();
 10820   this.selector.find(".tip").hide();
 10817   this._shown = false;  
 10821   this._shown = false;  
 10818 };
 10822 };
 10819 /* a widget that displays tweet - used in conjunction with the polemicWidget */
 10823 /* a widget that displays tweet - used in conjunction with the polemicWidget */
 10820 
 10824