src/js/widgets/segmentsWidget.js
branchcalage-segmentsWidget
changeset 516 fe8c9f4791cb
parent 515 54324c5d82ab
child 550 ae0f2ec05ed7
equal deleted inserted replaced
515:54324c5d82ab 516:fe8c9f4791cb
    81     var id = annotation.id;
    81     var id = annotation.id;
    82         
    82         
    83     var startPixel = Math.floor(this.selector.parent().width() * (begin / duration));
    83     var startPixel = Math.floor(this.selector.parent().width() * (begin / duration));
    84 
    84 
    85     var endPixel = Math.floor(this.selector.parent().width() * (end / duration));
    85     var endPixel = Math.floor(this.selector.parent().width() * (end / duration));
    86     var pxWidth = endPixel - startPixel -1;
    86     
       
    87     if (annotation.id !== lastSegment.id) 
       
    88       var pxWidth = endPixel - startPixel -1;
       
    89     else
       
    90       /* the last segment has no segment following it */
       
    91       var pxWidth = endPixel - startPixel;
    87  
    92  
    88     var divTitle = (annotation.content.title + " - " + annotation.content.description).substr(0,55);
    93     var divTitle = (annotation.content.title + " - " + annotation.content.description).substr(0,55);
    89 
    94 
    90     if (typeof(annotation.content.color) !== "undefined")
    95     if (typeof(annotation.content.color) !== "undefined")
    91       var color = annotation.content.color;
    96       var color = annotation.content.color;
   105         "seekPlace" : Math.round(begin/1000)});
   110         "seekPlace" : Math.round(begin/1000)});
   106 
   111 
   107         
   112         
   108     this.selector.append(annotationTemplate);
   113     this.selector.append(annotationTemplate);
   109     
   114     
   110     /* add a special class to the last segment */
   115     /* add a special class to the last segment and change its border */
   111     if (annotation.id === lastSegment.id) {
   116     if (annotation.id === lastSegment.id) {
   112         this.selector.find("#" + id).addClass("Ldt-lastSegment");        
   117         this.selector.find("#" + id).addClass("Ldt-lastSegment");        
   113         this.selector.find(".Ldt-lastSegment").css("border-color", hexa_color);
   118         this.selector.find(".Ldt-lastSegment").css("border-color", "#" + hexa_color);        
   114     }
   119     }
   115 
   120 
   116     IriSP.jQuery("#" + id).fadeTo(0, 0.3);
   121     IriSP.jQuery("#" + id).fadeTo(0, 0.3);
   117 
   122 
   118     IriSP.jQuery("#" + id).mouseover(
   123     IriSP.jQuery("#" + id).mouseover(
   143   }
   148   }
   144 };
   149 };
   145 
   150 
   146 /* restores the view after a search */
   151 /* restores the view after a search */
   147 IriSP.SegmentsWidget.prototype.clear = function() {
   152 IriSP.SegmentsWidget.prototype.clear = function() {
   148   this.selector.children(".Ldt-iri-chapter").css('border','none').animate({opacity:0.3}, 100);
   153   this.selector.children(".Ldt-iri-chapter").animate({opacity:0.3}, 100);
   149 };
   154 };
   150 
   155 
   151 IriSP.SegmentsWidget.prototype.clickHandler = function(annotation) {
   156 IriSP.SegmentsWidget.prototype.clickHandler = function(annotation) {
   152   this._Popcorn.trigger("IriSP.SegmentsWidget.click", annotation.id);
   157   this._Popcorn.trigger("IriSP.SegmentsWidget.click", annotation.id);
   153   var begin = (+ annotation.begin) / 1000;
   158   var begin = (+ annotation.begin) / 1000;
   172  
   177  
   173   // then highlight the ones with matches.
   178   // then highlight the ones with matches.
   174   for (var id in matches) {
   179   for (var id in matches) {
   175     var factor = 0.5 + matches[id] * 0.2;
   180     var factor = 0.5 + matches[id] * 0.2;
   176     this.selector.find("#"+id).dequeue();
   181     this.selector.find("#"+id).dequeue();
   177     this.selector.find("#"+id).css('border','1px red');
       
   178     this.selector.find("#"+id).animate({opacity:factor}, 200);
   182     this.selector.find("#"+id).animate({opacity:factor}, 200);
   179   }
   183   }
   180 
   184 
   181  
   185  
   182   this.oldSearchMatches = matches;
   186   this.oldSearchMatches = matches;