30 var begin = (+ currentAnnotation.begin) / 1000; |
30 var begin = (+ currentAnnotation.begin) / 1000; |
31 var end = (+ currentAnnotation.end) / 1000; |
31 var end = (+ currentAnnotation.end) / 1000; |
32 |
32 |
33 var duration = +this._serializer.currentMedia().meta["dc:duration"] / 1000; |
33 var duration = +this._serializer.currentMedia().meta["dc:duration"] / 1000; |
34 var middle_time = (begin + end) / 2; |
34 var middle_time = (begin + end) / 2; |
35 var percents = Math.floor((middle_time / duration) * 100); |
35 var percents = middle_time / duration; |
36 |
36 |
37 // we need to apply a fix because the arrow has a certain length |
37 // we need to apply a fix because the arrow has a certain length |
38 // it's half the length of the arrow (27 / 2). We need to convert |
38 // it's half the length of the arrow (27 / 2). We need to convert |
39 // it in percents though. |
39 // it in percents though. |
40 var totalWidth = this.selector.width(); |
40 var totalWidth = this.selector.width(); |
41 var correction = ((27 / 2) / totalWidth) * 100; |
41 var pixels = percents * totalWidth; |
42 var corrected_percents = percents - correction; |
42 var correction = (27 / 2); |
43 |
43 var corrected_pixels = pixels - correction; |
|
44 |
|
45 /* make sure that the arrow is aligned with the pattern |
|
46 of the widget under it */ |
|
47 if (corrected_pixels % 3 != 0) |
|
48 corrected_pixels -= (corrected_pixels % 3 - 1); |
|
49 |
44 /* don't move out of the screen */ |
50 /* don't move out of the screen */ |
45 if (corrected_percents <= 0) |
51 if (corrected_pixels <= 0) |
46 corrected_percents = 0; |
52 corrected_pixels = 0; |
47 |
53 |
48 if (corrected_percents <= 5) { |
54 if (corrected_pixels <= 15) { |
49 var left_edge_img_templ = IriSP.templToHTML("url('{{img_dir}}/left_edge_arrow.png')"); |
55 var left_edge_img_templ = IriSP.templToHTML("url('{{img_dir}}/left_edge_arrow.png')"); |
50 this.selector.children(".Ldt-arrowWidget").css("background-image", left_edge_img_templ); |
56 this.selector.children(".Ldt-arrowWidget").css("background-image", left_edge_img_templ); |
51 } else if (corrected_percents >= 95) { |
57 } else if (corrected_pixels >= totalWidth - 25) { |
52 var right_edge_img_templ = IriSP.templToHTML("url('{{img_dir}}/right_edge_arrow.png')"); |
58 var right_edge_img_templ = IriSP.templToHTML("url('{{img_dir}}/right_edge_arrow.png')"); |
53 this.selector.children(".Ldt-arrowWidget").css("background-image", right_edge_img_templ); |
59 this.selector.children(".Ldt-arrowWidget").css("background-image", right_edge_img_templ); |
54 } else { |
60 } else { |
55 var img_templ = IriSP.templToHTML("url('{{img_dir}}/arrow.png')"); |
61 var img_templ = IriSP.templToHTML("url('{{img_dir}}/arrow.png')"); |
56 this.selector.children(".Ldt-arrowWidget").css("background-image", img_templ); |
62 this.selector.children(".Ldt-arrowWidget").css("background-image", img_templ); |
57 } |
63 } |
58 |
64 |
59 this.selector.children(".Ldt-arrowWidget").animate({"left" : corrected_percents + "%"}); |
65 this.selector.children(".Ldt-arrowWidget").animate({"left" : corrected_pixels + "px"}); |
60 |
66 |
61 this._oldAnnotation = currentAnnotation; |
67 this._oldAnnotation = currentAnnotation; |
62 } |
68 } |
63 } |
69 } |