24 } |
29 } |
25 ); |
30 ); |
26 |
31 |
27 myMedia.on("timeupdate", function(t) { |
32 myMedia.on("timeupdate", function(t) { |
28 |
33 |
|
34 //init |
|
35 global.mediaDuration = myMedia.duration.milliseconds; |
|
36 |
29 //curseur chapitre |
37 //curseur chapitre |
30 var pos = $(".chapitre-cut-wrap").width() * t / myMedia.duration, |
38 var wContainer = $('.chapitre-cut-wrap').width() - 1, |
31 wContainer = $('.chapitre-cut-wrap').width(), |
39 pos = wContainer * t / myMedia.duration, |
32 btnCutChapter = $('.btn-cut-chapter'), |
40 btnCutChapter = $('.btn-cut-chapter'), |
33 wBtnCutChapter = btnCutChapter.outerWidth(); |
41 wBtnCutChapter = btnCutChapter.outerWidth(); |
34 |
42 |
35 $(".indicateur-chapter").css("left",pos); |
43 $(".indicateur-chapter").css("left",pos); |
36 if(pos+wBtnCutChapter>wContainer){ |
44 if(pos+wBtnCutChapter>wContainer){ |
37 btnCutChapter.css("left",(pos - wBtnCutChapter)); |
45 btnCutChapter.css("left",(pos - wBtnCutChapter)); |
38 }else{ |
46 }else{ |
39 btnCutChapter.css("left",pos); |
47 btnCutChapter.css("left",pos); |
40 } |
48 } |
41 |
49 |
|
50 //chapitre edit |
|
51 var formChapter = $('.form-chapter-edit'), |
|
52 inputBeginChapter = formChapter.find('input[name=begin]'), |
|
53 inputDurationChapter = formChapter.find('input[name=duration]'), |
|
54 inputEndChapter = formChapter.find('input[name=end]'), |
|
55 viewBeginChapter = formChapter.find('.begin'), |
|
56 viewDurationChapter = formChapter.find('.duration'), |
|
57 viewEndChapter = formChapter.find('.end'), |
|
58 timeBegin = global.beginCurrentChapter, |
|
59 timeEnd = t.milliseconds, |
|
60 timeDuration = timeEnd - timeBegin; |
|
61 |
|
62 inputBeginChapter.val(timeBegin); |
|
63 inputEndChapter.val(timeEnd); |
|
64 inputDurationChapter.val(timeDuration); |
|
65 viewBeginChapter.html(millisecondsToString(timeBegin)); |
|
66 viewDurationChapter.html(millisecondsToString(timeDuration)); |
|
67 viewEndChapter.html(millisecondsToString(timeEnd)); |
42 });//timeupdate |
68 });//timeupdate |
43 |
69 |
44 });//myProject.onLoad |
70 });//myProject.onLoad |
45 |
71 |
46 |
72 |
141 |
167 |
142 $.get('template.html', function(templates){ |
168 $.get('template.html', function(templates){ |
143 var tpl = $(templates).filter('#tpl-chapter-edit').html(); |
169 var tpl = $(templates).filter('#tpl-chapter-edit').html(); |
144 var tpl = Mustache.render(tpl, viewChapter); |
170 var tpl = Mustache.render(tpl, viewChapter); |
145 $('.form-chapter-edit').empty().append(tpl); |
171 $('.form-chapter-edit').empty().append(tpl); |
|
172 $('.form-chapter-edit').find('.tag-it').tagit(); |
146 }); |
173 }); |
147 }); |
174 }); |
148 //nouveau chapitre |
175 //nouveau chapitre |
149 $('.chapter-widget').on('click', '.btn-cut-chapter', function(e){ |
176 $('.chapter-widget').on('click', '.btn-cut-chapter', function(e){ |
150 e.preventDefault(); |
177 e.preventDefault(); |
151 |
178 |
152 var uniqId = 'id' + (new Date()).getTime(); |
179 var uniqId = 'id' + (new Date()).getTime(); |
|
180 |
|
181 var formChapter = $('.form-chapter-edit'), |
|
182 title = formChapter.find('input[name=title]').val(), |
|
183 tags = formChapter.find('input[name=tags]').val(), |
|
184 begin = formChapter.find('input[name=begin]').val(), |
|
185 duration = formChapter.find('input[name=duration]').val(), |
|
186 end = formChapter.find('input[name=end]').val(), |
|
187 beginString = millisecondsToString(begin), |
|
188 durationString = millisecondsToString(duration), |
|
189 endString = millisecondsToString(end), |
|
190 description = formChapter.find('textarea[name=description]').val(), |
|
191 id = uniqId; |
|
192 |
|
193 var dataChapter = { |
|
194 title : title, |
|
195 tags : tags, |
|
196 begin : begin, |
|
197 duration : duration, |
|
198 end : end, |
|
199 description : description, |
|
200 beginString : beginString, |
|
201 durationString : durationString, |
|
202 endString : endString, |
|
203 id : id |
|
204 }; |
|
205 |
|
206 addChapter(dataChapter); |
|
207 }); |
|
208 |
|
209 function addChapter(dataChapter){ |
|
210 chapters.push(dataChapter); |
|
211 |
|
212 //vue liste chapitre |
153 $.get('template.html', function(templates){ |
213 $.get('template.html', function(templates){ |
154 var viewChapterRow = { |
214 var tplChapterRow = $(templates).filter('#tpl-chapter-row').html(); |
155 id : uniqId |
215 tplChapterRow = Mustache.render(tplChapterRow, dataChapter); |
156 }; |
216 $('.list-chapter-rows-wrap').append(tplChapterRow); |
157 var tpl = $(templates).filter('#tpl-chapter-row').html(); |
217 |
158 var tpl = Mustache.render(tpl, viewChapterRow); |
218 updateChapterSegments(); |
159 $('.list-chapter-rows-wrap').append(tpl); |
219 }); |
160 }); |
|
161 }); |
|
162 |
|
163 function addChapter(data){ |
|
164 |
220 |
165 } |
221 } |
166 |
222 |
|
223 function updateChapterSegments(){ |
|
224 var chapterSegmentWrap = $('.chapter-segments'), |
|
225 wChapterSegmentWrap = chapterSegmentWrap.width(); |
|
226 chapterSegmentWrap.empty(); |
|
227 |
|
228 $.each(chapters, function(k, v){ |
|
229 var chapter = v, |
|
230 color = global.colors[k], |
|
231 width = chapter.duration * wChapterSegmentWrap / global.mediaDuration, |
|
232 segment = $('<li>'+chapter.title+'</li>').css({ |
|
233 width : width, |
|
234 backgroundColor : color |
|
235 }).attr('id', chapter.id); |
|
236 chapterSegmentWrap.append(segment) |
|
237 }); |
|
238 } |
|
239 |
|
240 function loadChapters(){ |
|
241 //nouveau projet, 1 chapitre |
|
242 var uniqId = 'id' + (new Date()).getTime(); |
|
243 |
|
244 var title = 'chapitre 1', |
|
245 tags = 'tag1,tag2', |
|
246 begin = 0, |
|
247 duration = myMedia.duration.milliseconds, |
|
248 end = myMedia.duration.milliseconds, |
|
249 beginString = millisecondsToString(begin), |
|
250 durationString = millisecondsToString(duration), |
|
251 endString = millisecondsToString(end), |
|
252 description = 'description du chapitre 1', |
|
253 id = uniqId; |
|
254 |
|
255 var dataChapter = { |
|
256 title : title, |
|
257 tags : tags, |
|
258 begin : begin, |
|
259 duration : duration, |
|
260 end : end, |
|
261 description : description, |
|
262 beginString : beginString, |
|
263 durationString : durationString, |
|
264 endString : endString, |
|
265 id : id |
|
266 }; |
|
267 |
|
268 addChapter(dataChapter); |
|
269 } |
|
270 |
167 //edit annotation |
271 //edit annotation |
168 $('#list-annotations').on('click', 'a.btn-edit-annotation', function(e){ |
272 $('#list-annotations').on('click', 'a.btn-edit-annotation', function(e){ |
169 e.preventDefault(); |
273 e.preventDefault(); |
170 |
274 |
171 var idAnnotation = $(this).attr('data-id'); |
275 var idAnnotation = $(this).attr('data-id'); |