12 mashup = new IriSP.Model.Mashup(false, project), |
12 mashup = new IriSP.Model.Mashup(false, project), |
13 mediatemplate = _.template( |
13 mediatemplate = _.template( |
14 '<li class="item-video media" data-media-id="<%= id %>"><div class="media-count-wrap"><span class="media-count"></span></div>' |
14 '<li class="item-video media" data-media-id="<%= id %>"><div class="media-count-wrap"><span class="media-count"></span></div>' |
15 + '<img class="thumbnail" src="<%= thumbnail %>" alt="<%= title %>" />' |
15 + '<img class="thumbnail" src="<%= thumbnail %>" alt="<%= title %>" />' |
16 + '<div class="video-info"><h3 class="title-video"><%= title %></h3><p class="description"><%= description %></p>' |
16 + '<div class="video-info"><h3 class="title-video"><%= title %></h3><p class="description"><%= description %></p>' |
17 + '<p class="time-length"><%= IriSP.translate("Duration:") %> <span><%= duration.toString() %></span></p></div><div class="media-found-segments"></div></li>' |
17 + '<p class="time-length"><%= gettext("Duration:") %> <span><%= duration.toString() %></span></p></div><div class="media-found-segments"></div></li>' |
18 ), |
18 ), |
19 segmenttemplate = _.template( |
19 segmenttemplate = _.template( |
20 '<li class="item-video annotation" data-segment-id="<%= annotation.id %>" data-media-id="<%= annotation.getMedia().id %>">' |
20 '<li class="item-video annotation" data-segment-id="<%= annotation.id %>" data-media-id="<%= annotation.getMedia().id %>">' |
21 + '<img class="thumbnail" src="<%= annotation.thumbnail %>" alt="<%= annotation.getMedia().title %>" />' |
21 + '<img class="thumbnail" src="<%= annotation.thumbnail %>" alt="<%= annotation.getMedia().title %>" />' |
22 + '<div class="validate <%= annotation.status %>"><div class="validate-tooltip"><ul><li><%= annotation.status_messages.join("</li><li>") %></li></ul></div></div><div class="video-info"><h3 class="title-video"><%= annotation.getMedia().title %></h3>' |
22 + '<div class="validate <%= annotation.status %>"><div class="validate-tooltip"><ul><li><%= annotation.status_messages.join("</li><li>") %></li></ul></div></div><div class="video-info"><h3 class="title-video"><%= annotation.getMedia().title %></h3>' |
23 + '<p class="subtitle"><%= annotation.title %></p><p class="duration"><%= annotation.begin.toString() %> - <%= annotation.end.toString() %> (<%= annotation.getDuration().toString() %>)</p>' |
23 + '<p class="subtitle"><%= annotation.title %></p><p class="duration"><%= annotation.begin.toString() %> - <%= annotation.end.toString() %> (<%= annotation.getDuration().toString() %>)</p>' |
24 + '<ul class="tools"><li><a class="edit" href="#" title="<%= IriSP.translate("Edit segment") %>"></a></li><li><a class="bottom" href="#" title="<%= IriSP.translate("Move segment down") %>"></a></li>' |
24 + '<ul class="tools"><li><a class="edit" href="#" title="<%= gettext("Edit segment") %>"></a></li><li><a class="bottom" href="#" title="<%= gettext("Move segment down") %>"></a></li>' |
25 + '<li><a class="top" href="#" title="<%= IriSP.translate("Move segment up") %>"></a></li><li><a class="delete" href="#" title="<%= IriSP.translate("Delete segment") %>"></a></li></ul></div></li>' |
25 + '<li><a class="top" href="#" title="<%= gettext("Move segment up") %>"></a></li><li><a class="delete" href="#" title="<%= gettext("Delete segment") %>"></a></li></ul></div></li>' |
26 ), |
26 ), |
27 mediasegmenttemplate = _.template( |
27 mediasegmenttemplate = _.template( |
28 '<div class="media-segment">' |
28 '<div class="media-segment">' |
29 + '<div class="media-segment-section" style="left:<%= left %>px; width:<%= width %>px; background:<%= color %>; top: <%= top %>px;" data-segment-id="<%= annotation.id %>"></div>' |
29 + '<div class="media-segment-section" style="left:<%= left %>px; width:<%= width %>px; background:<%= color %>; top: <%= top %>px;" data-segment-id="<%= annotation.id %>"></div>' |
30 + '<div class="popin media-segment-popin" style="left:<%= popleft %>px; top: <%= 5+top %>px;"><div style="left:<%= pointerpos %>px;" class="pointer"></div><div class="popin-content">' |
30 + '<div class="popin media-segment-popin" style="left:<%= popleft %>px; top: <%= 5+top %>px;"><div style="left:<%= pointerpos %>px;" class="pointer"></div><div class="popin-content">' |
31 + '<h3><%= annotation.title %></h3><a href="#" class="button reprendre-segment" data-segment-id="<%= annotation.id %>"><%= IriSP.translate("Clone segment") %></a>' |
31 + '<h3><%= annotation.title %></h3><a href="#" class="button reprendre-segment" data-segment-id="<%= annotation.id %>"><%= gettext("Clone segment") %></a>' |
32 + '<p><%= IriSP.translate("From:") %> <span><%= annotation.begin.toString() %></span> <%= IriSP.translate("to:") %> <span><%= annotation.end.toString() %></span> (<%= IriSP.translate("duration:") %> <span><%= annotation.getDuration().toString() %></span>)</p>' |
32 + '<p><%= gettext("From:") %> <span><%= annotation.begin.toString() %></span> <%= gettext("to:") %> <span><%= annotation.end.toString() %></span> (<%= gettext("duration:") %> <span><%= annotation.getDuration().toString() %></span>)</p>' |
33 + '</div></div></div>' |
33 + '</div></div></div>' |
34 ), |
34 ), |
35 mediasegmentlisttemplate = _.template( |
35 mediasegmentlisttemplate = _.template( |
36 '<div class="media-segment-list" style="height: <%= height %>px"><div class="media-current-section" style="left: <%= left %>px; width: <%= width %>px;"></div><div class="media-segment-list-inner"></div><%= segments %></div>' |
36 '<div class="media-segment-list" style="height: <%= height %>px"><div class="media-current-section" style="left: <%= left %>px; width: <%= width %>px;"></div><div class="media-segment-list-inner"></div><%= segments %></div>' |
37 ), |
37 ), |
38 mediafoundtemplate = _.template( |
38 mediafoundtemplate = _.template( |
39 '<div class="media-segment"><div class="media-segment-section" style="left:<%= left %>px; width:<%= width %>px; background:<%= color %>; top: <%= top %>px;"></div>' |
39 '<div class="media-segment"><div class="media-segment-section" style="left:<%= left %>px; width:<%= width %>px; background:<%= color %>; top: <%= top %>px;"></div>' |
40 + '<div class="popin media-found-popin" style="left:<%= popleft %>px; top: <%= 5+top %>px;"><div style="left:<%= pointerpos %>px;" class="pointer"></div><div class="popin-content">' |
40 + '<div class="popin media-found-popin" style="left:<%= popleft %>px; top: <%= 5+top %>px;"><div style="left:<%= pointerpos %>px;" class="pointer"></div><div class="popin-content">' |
41 + '<h3><%= title %></h3><a href="#" class="button clone-segment" data-segment-id="<%= annotation.id %>"><%= IriSP.translate("Clone segment") %></a>' |
41 + '<h3><%= title %></h3><a href="#" class="button clone-segment" data-segment-id="<%= annotation.id %>"><%= gettext("Clone segment") %></a>' |
42 + '</div></div></div>' |
42 + '</div></div></div>' |
43 ), |
43 ), |
44 mediafoundlisttemplate = _.template( |
44 mediafoundlisttemplate = _.template( |
45 '<div class="media-found-list" style="height: <%= height %>px"><div class="media-segment-list-inner"></div><%= segments %></div>' |
45 '<div class="media-found-list" style="height: <%= height %>px"><div class="media-segment-list-inner"></div><%= segments %></div>' |
46 ), |
46 ), |
57 var segmentcritical = [ |
57 var segmentcritical = [ |
58 { |
58 { |
59 validate: function(_s) { |
59 validate: function(_s) { |
60 return (_s.getDuration() >= 1000); |
60 return (_s.getDuration() >= 1000); |
61 }, |
61 }, |
62 message: "A segment must be at least one second long" |
62 message: gettext("A segment must be at least one second long") |
63 }, |
63 }, |
64 { |
64 { |
65 validate: function(_s) { |
65 validate: function(_s) { |
66 return (_s.getDuration() < 180000); |
66 return (_s.getDuration() < 180000); |
67 }, |
67 }, |
68 message: "A segment must be at most three minutes long" |
68 message: gettext("A segment must be at most three minutes long") |
69 }, |
69 }, |
70 { |
70 { |
71 validate: function(_s) { |
71 validate: function(_s) { |
72 return (!!_s.title && _s.title !== IriSP.translate("Untitled segment")); |
72 return (!!_s.title && _s.title !== gettext("Untitled segment")); |
73 }, |
73 }, |
74 message: "A segment must have a title" |
74 message: gettext("A segment must have a title") |
75 } |
75 } |
76 ]; |
76 ]; |
77 var segmentwarning = [ |
77 var segmentwarning = [ |
78 { |
78 { |
79 validate: function(_s) { |
79 validate: function(_s) { |
80 return (!!_s.description); |
80 return (!!_s.description); |
81 }, |
81 }, |
82 message: "A segment should have a description" |
82 message: gettext("A segment should have a description") |
83 }, |
83 }, |
84 { |
84 { |
85 validate: function(_s) { |
85 validate: function(_s) { |
86 return (!!_s.keywords.length); |
86 return (!!_s.keywords.length); |
87 }, |
87 }, |
88 message: "A segment should have tags" |
88 message: gettext("A segment should have tags") |
89 } |
89 } |
90 ]; |
90 ]; |
91 |
91 |
92 var mashupcritical = [ |
92 var mashupcritical = [ |
93 { |
93 { |
94 validate: function(_m) { |
94 validate: function(_m) { |
95 return _m.segments.length > 2; |
95 return _m.segments.length > 2; |
96 }, |
96 }, |
97 message: "A hashcut must be made from at least three segments" |
97 message: gettext("A hashcut must be made from at least three segments") |
98 }, |
98 }, |
99 { |
99 { |
100 validate: function(_m) { |
100 validate: function(_m) { |
101 return (!!_m.title && _m.title !== IriSP.translate("Untitled Hashcut")); |
101 return (!!_m.title && _m.title !== gettext("Untitled Hashcut")); |
102 }, |
102 }, |
103 message: "A hashcut must have a title" |
103 message: gettext("A hashcut must have a title") |
104 } |
104 } |
105 ]; |
105 ]; |
106 var mashupwarning = [ |
106 var mashupwarning = [ |
107 { |
107 { |
108 validate: function(_m) { |
108 validate: function(_m) { |
109 return !!_m.description |
109 return !!_m.description |
110 }, |
110 }, |
111 message: "A hashcut should have a description" |
111 message: gettext("A hashcut should have a description") |
112 } |
112 } |
113 ]; |
113 ]; |
114 |
114 |
115 /* Fill left column with Media List */ |
115 /* Fill left column with Media List */ |
116 |
116 |
372 if (!currentSegment) { |
372 if (!currentSegment) { |
373 currentSegment = new IriSP.Model.Annotation(false, project); |
373 currentSegment = new IriSP.Model.Annotation(false, project); |
374 currentSegment.setMedia(currentMedia.id); |
374 currentSegment.setMedia(currentMedia.id); |
375 currentSegment.setBegin(currentMedia.getCurrentTime()); |
375 currentSegment.setBegin(currentMedia.getCurrentTime()); |
376 currentSegment.setEnd(Math.min(currentMedia.getCurrentTime() + 180000, currentMedia.duration)); |
376 currentSegment.setEnd(Math.min(currentMedia.getCurrentTime() + 180000, currentMedia.duration)); |
377 currentSegment.title = IriSP.translate("Untitled segment"); |
377 currentSegment.title = gettext("Untitled segment"); |
378 currentSegment.color = currentMedia.color; |
378 currentSegment.color = currentMedia.color; |
379 currentSegment.thumbnail = currentMedia.thumbnail; |
379 currentSegment.thumbnail = currentMedia.thumbnail; |
380 currentSegment.created = new Date(); |
380 currentSegment.created = new Date(); |
381 currentSegment.keywords = []; |
381 currentSegment.keywords = []; |
382 currentSegment.description = ""; |
382 currentSegment.description = ""; |
394 }); |
394 }); |
395 } |
395 } |
396 if (currentMedia.loaded) { |
396 if (currentMedia.loaded) { |
397 currentMedia.setCurrentTime(currentSegment.begin); |
397 currentMedia.setCurrentTime(currentSegment.begin); |
398 } |
398 } |
399 $(".add-segment").val(IriSP.translate(addMode ? "Add segment to hashcut" : "Save segment")); |
399 $(".add-segment").val(addMode ? gettext("Add segment to hashcut") : gettext("Save segment")); |
400 $(".create-or-edit").text(IriSP.translate(addMode ? "Create new segment" : "Edit existing segment")); |
400 $(".create-or-edit").text(addMode ? gettext("Create new segment") : gettext("Edit existing segment")); |
401 $("#segment-title").val(currentSegment.title); |
401 $("#segment-title").val(currentSegment.title); |
402 $("#segment-description").val(currentSegment.description); |
402 $("#segment-description").val(currentSegment.description); |
403 var segment_tags = $("#segment-tags"); |
403 var segment_tags = $("#segment-tags"); |
404 segment_tags.tagit("option","onTagRemoved",function(){}); |
404 segment_tags.tagit("option","onTagRemoved",function(){}); |
405 segment_tags.tagit("option","onTagAdded",function(){}); |
405 segment_tags.tagit("option","onTagAdded",function(){}); |
753 |
753 |
754 currentSegment = new IriSP.Model.Annotation(false, project); |
754 currentSegment = new IriSP.Model.Annotation(false, project); |
755 currentSegment.setMedia(media.id); |
755 currentSegment.setMedia(media.id); |
756 currentSegment.setBegin(s.begin); |
756 currentSegment.setBegin(s.begin); |
757 currentSegment.setEnd(s.end); |
757 currentSegment.setEnd(s.end); |
758 currentSegment.title = IriSP.translate("Copy of ") + s.title; |
758 currentSegment.title = gettext("Copy of ") + s.title; |
759 currentSegment.description = s.description; |
759 currentSegment.description = s.description; |
760 currentSegment.keywords = s.keywords; |
760 currentSegment.keywords = s.keywords; |
761 currentSegment.color = media.color; |
761 currentSegment.color = media.color; |
762 currentSegment.thumbnail = media.thumbnail; |
762 currentSegment.thumbnail = media.thumbnail; |
763 currentSegment.created = new Date(); |
763 currentSegment.created = new Date(); |
799 cloneSegment($(this).attr("data-segment-id")); |
799 cloneSegment($(this).attr("data-segment-id")); |
800 return false; |
800 return false; |
801 }); |
801 }); |
802 /* Changing Hashcut Title and description */ |
802 /* Changing Hashcut Title and description */ |
803 |
803 |
804 mashup.title = IriSP.translate("Untitled Hashcut"); |
804 mashup.title = gettext("Untitled Hashcut"); |
805 $(".title-video-wrap a").text(mashup.title); |
805 $(".title-video-wrap a").text(mashup.title); |
806 $("#hashcut-title").val(mashup.title); |
806 $("#hashcut-title").val(mashup.title); |
807 |
807 |
808 $("#hashcut-title").on("keyup change input paste", function() { |
808 $("#hashcut-title").on("keyup change input paste", function() { |
809 mashup.title = $(this).val(); |
809 mashup.title = $(this).val(); |
810 $(".title-video-wrap a").text(mashup.title); |
810 $(".title-video-wrap a").text(mashup.title); |
811 mashup.trigger("change"); |
811 mashup.trigger("change"); |
812 }); |
812 }); |
813 $("#hashcut-title").on("focus click", function() { |
813 $("#hashcut-title").on("focus click", function() { |
814 if ($(this).val() === IriSP.translate("Untitled Hashcut")) { |
814 if ($(this).val() === gettext("Untitled Hashcut")) { |
815 $(this).val(""); |
815 $(this).val(""); |
816 } |
816 } |
817 }); |
817 }); |
818 |
818 |
819 $("#hashcut-description").on("keyup change input paste", function() { |
819 $("#hashcut-description").on("keyup change input paste", function() { |
827 }) |
827 }) |
828 |
828 |
829 /* Publication */ |
829 /* Publication */ |
830 |
830 |
831 function onLeave() { |
831 function onLeave() { |
832 return IriSP.translate("You haven't published your hashcut yet.\nIf you leave this page, it will be lost"); |
832 return gettext("You haven't published your hashcut yet.\nIf you leave this page, it will be lost."); |
833 } |
833 } |
834 |
834 |
835 $(window).on("beforeunload", onLeave); |
835 $(window).on("beforeunload", onLeave); |
836 |
836 |
837 $(".publier-button").click(function() { |
837 $(".publier-button").click(function() { |
838 if ($(this).hasClass("disable")) { |
838 if ($(this).hasClass("disable")) { |
839 alert(IriSP.translate("The mashup can't be published because:")+"\n\n"+mashupstatus); |
839 alert(gettext("The hashcut can't be published because:")+"\n\n"+mashupstatus); |
840 return false; |
840 return false; |
841 } |
841 } |
842 var postproject = directory.newLocalSource(), |
842 var postproject = directory.newLocalSource(), |
843 medias = mashup.getMedias() |
843 medias = mashup.getMedias() |
844 annotations = mashup.getOriginalAnnotations(); |
844 annotations = mashup.getOriginalAnnotations(); |