| author | Anthony Ly <anthonyly.com@gmail.com> |
| Fri, 17 May 2013 12:41:30 +0200 | |
| changeset 21 | abd04f346dbe |
| parent 18 | 16b482c153fd |
| child 22 | 0e02c3a28491 |
| permissions | -rw-r--r-- |
| 9 | 1 |
$(function(){ |
| 6 | 2 |
|
3 |
var global = { |
|
4 |
diaporama : null, |
|
|
21
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
5 |
idAnnotation : null, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
6 |
beginCurrentChapter : 0, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
7 |
mediaDuration : 0, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
8 |
colors : ['#1abc9c', '#3498db', '#9b59b6', '#f1c40f', '#e67e22', '#e74c3c'] |
| 16 | 9 |
}, |
|
21
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
10 |
chapters = [], |
| 18 | 11 |
annotations = []; |
| 16 | 12 |
|
13 |
myProject.onLoad(function() { |
|
14 |
||
15 |
$(".project-title").text(myProject.title); |
|
16 |
|
|
17 |
myMedia = myProject.getCurrentMedia(); |
|
18 |
|
|
|
21
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
19 |
loadChapters(); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
20 |
|
| 16 | 21 |
IriSP.htmlPlayer( |
22 |
myMedia, |
|
23 |
$(".main-video"), |
|
24 |
{ |
|
25 |
width: 460, |
|
26 |
height: 345, |
|
27 |
controls: true, |
|
28 |
autostart: true |
|
29 |
} |
|
30 |
); |
|
31 |
||
32 |
myMedia.on("timeupdate", function(t) { |
|
33 |
||
|
21
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
34 |
//init |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
35 |
global.mediaDuration = myMedia.duration.milliseconds; |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
36 |
|
| 16 | 37 |
//curseur chapitre |
|
21
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
38 |
var wContainer = $('.chapitre-cut-wrap').width() - 1, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
39 |
pos = wContainer * t / myMedia.duration, |
| 16 | 40 |
btnCutChapter = $('.btn-cut-chapter'), |
41 |
wBtnCutChapter = btnCutChapter.outerWidth(); |
|
42 |
|
|
43 |
$(".indicateur-chapter").css("left",pos); |
|
44 |
if(pos+wBtnCutChapter>wContainer){ |
|
45 |
btnCutChapter.css("left",(pos - wBtnCutChapter)); |
|
46 |
}else{ |
|
47 |
btnCutChapter.css("left",pos); |
|
48 |
} |
|
|
21
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
49 |
|
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
50 |
//chapitre edit |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
51 |
var formChapter = $('.form-chapter-edit'), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
52 |
inputBeginChapter = formChapter.find('input[name=begin]'), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
53 |
inputDurationChapter = formChapter.find('input[name=duration]'), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
54 |
inputEndChapter = formChapter.find('input[name=end]'), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
55 |
viewBeginChapter = formChapter.find('.begin'), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
56 |
viewDurationChapter = formChapter.find('.duration'), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
57 |
viewEndChapter = formChapter.find('.end'), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
58 |
timeBegin = global.beginCurrentChapter, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
59 |
timeEnd = t.milliseconds, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
60 |
timeDuration = timeEnd - timeBegin; |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
61 |
|
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
62 |
inputBeginChapter.val(timeBegin); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
63 |
inputEndChapter.val(timeEnd); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
64 |
inputDurationChapter.val(timeDuration); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
65 |
viewBeginChapter.html(millisecondsToString(timeBegin)); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
66 |
viewDurationChapter.html(millisecondsToString(timeDuration)); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
67 |
viewEndChapter.html(millisecondsToString(timeEnd)); |
| 18 | 68 |
});//timeupdate |
| 16 | 69 |
|
70 |
});//myProject.onLoad |
|
71 |
||
| 6 | 72 |
|
73 |
//modal |
|
| 9 | 74 |
$(document).on('click', 'a.open-modal', function(e){ |
75 |
var diaporama = $(this).attr('data-diaporama'), |
|
76 |
idAnnotation = $(this).attr('data-id'); |
|
77 |
||
78 |
if(diaporama !== undefined){ |
|
79 |
global.diaporama = diaporama; |
|
80 |
} |
|
81 |
if(idAnnotation !== undefined){ |
|
82 |
global.idAnnotation = idAnnotation; |
|
83 |
} |
|
84 |
}) |
|
| 6 | 85 |
//edition image |
86 |
$('.popup').on('change', '#media-type-select', function(e){ |
|
87 |
var typeImage = $(this).val(); |
|
88 |
$('.input-image-url, .input-image-upload').hide(); |
|
89 |
$('.input-image-'+typeImage).show(); |
|
90 |
}); |
|
91 |
//bibliotheque |
|
92 |
//video |
|
93 |
$('.popup').on('click', '.bibliotheque-video a', function(e){ |
|
94 |
e.preventDefault(); |
|
95 |
$('.popup').modal('hide'); |
|
96 |
$.get('template.html', function(templates){ |
|
97 |
var videoWrap = $('#'+global.idAnnotation).find('.annotation-video-content'), |
|
98 |
tplVideo = $(templates).filter('#tpl-video-row').html(); |
|
99 |
videoWrap.empty().append(tplVideo); |
|
100 |
}); |
|
101 |
|
|
102 |
}); |
|
103 |
//image |
|
104 |
$('.popup').on('click', '.bibliotheque-image a', function(e){ |
|
105 |
e.preventDefault(); |
|
106 |
var listDiaporama = $('#'+global.diaporama); |
|
107 |
addImageToDiaporama(listDiaporama); |
|
108 |
$('.popup').modal('hide'); |
|
109 |
}); |
|
110 |
||
111 |
$(document).on('click','.btn-delete', function(e){ |
|
112 |
e.preventDefault(); |
|
113 |
//si c'est une annotation et que la tab est ouverte, on la ferme |
|
114 |
var type = $(this).attr('data-type'); |
|
115 |
if(type == 'annotation'){ |
|
116 |
var idAnnotation = $(this).attr('data-id'); |
|
117 |
$('a[href=#annotation-'+idAnnotation+']').closest('li').remove(); |
|
118 |
$('.tab-content #annotation'+idAnnotation).remove(); |
|
119 |
$('#tab-list-annotation').tab('show'); |
|
120 |
} |
|
121 |
}); |
|
122 |
||
123 |
//confirmation suppression |
|
124 |
$("#modal-confirm").on('click', '#btn-delete-modal', function(e){ |
|
| 9 | 125 |
|
| 6 | 126 |
}); |
127 |
||
128 |
//title-editor |
|
129 |
$('.project-title-editor ._popover').bind('click',function(e){e.preventDefault()}); |
|
130 |
$('.project-title-editor ._popover').popover({ |
|
131 |
html : true, |
|
132 |
content : function(){ |
|
133 |
var previousValue = $('.project-title').text(), |
|
134 |
formInput = |
|
135 |
'<form action="#" class="project-title-editor-form">'+ |
|
136 |
'<input type="text" class="project-title-editor-input" value="'+previousValue+'">'+ |
|
137 |
'</form>'; |
|
138 |
return formInput; |
|
139 |
} |
|
140 |
}); |
|
141 |
||
142 |
$('body').on('click', function (e) { |
|
143 |
$('._popover').each(function () { |
|
144 |
if (!$(this).is(e.target) && $(this).has(e.target).length === 0 && $('.popover').has(e.target).length === 0) { |
|
145 |
$(this).popover('hide'); |
|
146 |
} |
|
147 |
}); |
|
148 |
}); |
|
149 |
||
150 |
$('body').on('submit', '.project-title-editor-form', function(e){ |
|
151 |
e.preventDefault(); |
|
152 |
$('._popover').popover('hide'); |
|
153 |
}); |
|
154 |
||
155 |
$(document).on('keyup', '.project-title-editor-input', function() { |
|
156 |
$('.project-title').html($(this).val()); |
|
157 |
}); |
|
| 9 | 158 |
|
| 18 | 159 |
//--chapter |
| 6 | 160 |
$('.list-chapter-wrap').on('click', '.edit-chapter', function(e){ |
161 |
e.preventDefault(); |
|
162 |
var viewChapter = { |
|
163 |
titre : 'titre du chapitre', |
|
164 |
tags : 'tag 1, tag 2, tag 3', |
|
165 |
description : 'lorem ipsum' |
|
166 |
} |
|
167 |
|
|
168 |
$.get('template.html', function(templates){ |
|
169 |
var tpl = $(templates).filter('#tpl-chapter-edit').html(); |
|
170 |
var tpl = Mustache.render(tpl, viewChapter); |
|
171 |
$('.form-chapter-edit').empty().append(tpl); |
|
|
21
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
172 |
$('.form-chapter-edit').find('.tag-it').tagit(); |
| 6 | 173 |
}); |
174 |
}); |
|
175 |
//nouveau chapitre |
|
176 |
$('.chapter-widget').on('click', '.btn-cut-chapter', function(e){ |
|
177 |
e.preventDefault(); |
|
| 16 | 178 |
|
| 6 | 179 |
var uniqId = 'id' + (new Date()).getTime(); |
|
21
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
180 |
|
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
181 |
var formChapter = $('.form-chapter-edit'), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
182 |
title = formChapter.find('input[name=title]').val(), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
183 |
tags = formChapter.find('input[name=tags]').val(), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
184 |
begin = formChapter.find('input[name=begin]').val(), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
185 |
duration = formChapter.find('input[name=duration]').val(), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
186 |
end = formChapter.find('input[name=end]').val(), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
187 |
beginString = millisecondsToString(begin), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
188 |
durationString = millisecondsToString(duration), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
189 |
endString = millisecondsToString(end), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
190 |
description = formChapter.find('textarea[name=description]').val(), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
191 |
id = uniqId; |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
192 |
|
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
193 |
var dataChapter = { |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
194 |
title : title, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
195 |
tags : tags, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
196 |
begin : begin, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
197 |
duration : duration, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
198 |
end : end, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
199 |
description : description, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
200 |
beginString : beginString, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
201 |
durationString : durationString, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
202 |
endString : endString, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
203 |
id : id |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
204 |
}; |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
205 |
|
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
206 |
addChapter(dataChapter); |
| 6 | 207 |
}); |
208 |
||
|
21
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
209 |
function addChapter(dataChapter){ |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
210 |
chapters.push(dataChapter); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
211 |
|
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
212 |
//vue liste chapitre |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
213 |
$.get('template.html', function(templates){ |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
214 |
var tplChapterRow = $(templates).filter('#tpl-chapter-row').html(); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
215 |
tplChapterRow = Mustache.render(tplChapterRow, dataChapter); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
216 |
$('.list-chapter-rows-wrap').append(tplChapterRow); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
217 |
|
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
218 |
updateChapterSegments(); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
219 |
}); |
| 18 | 220 |
|
221 |
} |
|
| 6 | 222 |
|
|
21
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
223 |
function updateChapterSegments(){ |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
224 |
var chapterSegmentWrap = $('.chapter-segments'), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
225 |
wChapterSegmentWrap = chapterSegmentWrap.width(); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
226 |
chapterSegmentWrap.empty(); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
227 |
|
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
228 |
$.each(chapters, function(k, v){ |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
229 |
var chapter = v, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
230 |
color = global.colors[k], |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
231 |
width = chapter.duration * wChapterSegmentWrap / global.mediaDuration, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
232 |
segment = $('<li>'+chapter.title+'</li>').css({ |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
233 |
width : width, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
234 |
backgroundColor : color |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
235 |
}).attr('id', chapter.id); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
236 |
chapterSegmentWrap.append(segment) |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
237 |
}); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
238 |
} |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
239 |
|
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
240 |
function loadChapters(){ |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
241 |
//nouveau projet, 1 chapitre |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
242 |
var uniqId = 'id' + (new Date()).getTime(); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
243 |
|
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
244 |
var title = 'chapitre 1', |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
245 |
tags = 'tag1,tag2', |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
246 |
begin = 0, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
247 |
duration = myMedia.duration.milliseconds, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
248 |
end = myMedia.duration.milliseconds, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
249 |
beginString = millisecondsToString(begin), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
250 |
durationString = millisecondsToString(duration), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
251 |
endString = millisecondsToString(end), |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
252 |
description = 'description du chapitre 1', |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
253 |
id = uniqId; |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
254 |
|
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
255 |
var dataChapter = { |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
256 |
title : title, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
257 |
tags : tags, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
258 |
begin : begin, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
259 |
duration : duration, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
260 |
end : end, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
261 |
description : description, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
262 |
beginString : beginString, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
263 |
durationString : durationString, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
264 |
endString : endString, |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
265 |
id : id |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
266 |
}; |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
267 |
|
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
268 |
addChapter(dataChapter); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
269 |
} |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
270 |
|
| 6 | 271 |
//edit annotation |
272 |
$('#list-annotations').on('click', 'a.btn-edit-annotation', function(e){ |
|
273 |
e.preventDefault(); |
|
274 |
||
275 |
var idAnnotation = $(this).attr('data-id'); |
|
276 |
//si il est déjà ouvert |
|
277 |
if($('#annotation-'+idAnnotation).length){ |
|
278 |
$('a[href=#annotation-'+idAnnotation+']').tab('show'); |
|
279 |
}else{ |
|
280 |
var typeAnnotation = $(this).attr('data-type'), |
|
281 |
data = {id:idAnnotation}; |
|
282 |
openNewTab(typeAnnotation, data); |
|
283 |
} |
|
284 |
}); |
|
285 |
||
| 9 | 286 |
//tab |
287 |
$('#annotation-tab').on('click', 'a', function(e){ |
|
288 |
e.preventDefault(); |
|
289 |
$(this).tab('show'); |
|
290 |
}); |
|
291 |
||
292 |
//ouvrir tab |
|
293 |
$(document).on('click', '.open-tab', function(e){ |
|
294 |
e.preventDefault(); |
|
295 |
var type = $(this).attr('data-type'); |
|
296 |
var data = $(this).attr('data-data'); // à définir |
|
297 |
openNewTab(type); |
|
298 |
}); |
|
299 |
||
| 6 | 300 |
function openNewTab(type, data){ |
301 |
||
302 |
var uniqId = 'id' + (new Date()).getTime(), |
|
303 |
idAnnotation = (data !== undefined) ? data.id : uniqId, |
|
304 |
tabContent = $('<div class="tab-pane" id="annotation-'+idAnnotation+'"></div>'), |
|
305 |
iconTab; |
|
306 |
||
307 |
||
308 |
$.get('template.html', function(templates){ |
|
309 |
//head commun à tous |
|
310 |
var view = { |
|
311 |
titre : "un titre mustache", |
|
312 |
id : uniqId |
|
313 |
}; |
|
314 |
var tplHead = $(templates).filter('#tpl-head').html(); |
|
315 |
var output = Mustache.render(tplHead, view); |
|
316 |
$(tabContent).append(output); |
|
317 |
$(tabContent).find(".slider-duration").slider(configSlider); |
|
318 |
||
319 |
//type |
|
320 |
var viewType = {id : uniqId}; |
|
321 |
var tpl = $(templates).filter('#tpl-'+type).html(); |
|
322 |
tpl = Mustache.render(tpl, viewType); |
|
323 |
$(tabContent).append(tpl); |
|
324 |
$('.tab-content').append(tabContent); |
|
325 |
||
326 |
//particularité selon type |
|
327 |
switch(type){ |
|
328 |
case 'video': iconTab = 'film'; |
|
329 |
break; |
|
330 |
case 'text': |
|
331 |
iconTab = 'align-left'; |
|
332 |
$(tabContent).find('.wysiwyg').cleditor(wysiwygConfig); |
|
333 |
break; |
|
334 |
case 'html': iconTab = 'link'; |
|
335 |
break; |
|
336 |
case 'diaporama': iconTab = 'picture'; |
|
337 |
$(tabContent).find('.number-spin').spin(spinParam); |
|
338 |
$(tabContent).find('.ui-sortable').sortable({ |
|
339 |
stop : function(event, ui){ |
|
340 |
disabledBtnSortable($(this)); |
|
341 |
} |
|
342 |
}); |
|
343 |
break; |
|
344 |
} |
|
345 |
$(".nav-tabs li:last-child").after('<li><a href="#annotation-'+idAnnotation+'"><i class="icon-'+iconTab+'"></i> New <span class="close-tab">×</span></a></li>'); |
|
346 |
$('a[href=#annotation-'+idAnnotation+']').tab('show'); |
|
347 |
}); |
|
348 |
}//openNewTab() |
|
349 |
||
| 9 | 350 |
//fermer tab |
351 |
$('#annotation-tab').on('click', 'span.close-tab', function(e){ |
|
352 |
e.preventDefault();e.stopPropagation(); |
|
353 |
var idTab = $(this).parents('a').attr('href'); |
|
354 |
$(this).closest('li').remove(); |
|
355 |
$('.tab-content '+idTab).remove(); |
|
356 |
$('#tab-list-annotation').tab('show'); |
|
357 |
}); |
|
358 |
||
359 |
||
| 6 | 360 |
//diaporama |
| 9 | 361 |
function addImageToDiaporama(diaporama){ |
| 6 | 362 |
$.get('template.html', function(templates){ |
363 |
var tplDiapo = $(templates).filter('#tpl-diaporama-row').html(), |
|
364 |
uniqId = 'id' + (new Date()).getTime(), |
|
365 |
viewDiapo = { ridid : uniqId}; |
|
366 |
tplDiapo = Mustache.render(tplDiapo, viewDiapo); |
|
367 |
diaporama.append(tplDiapo); |
|
368 |
disabledBtnSortable(diaporama); |
|
369 |
}); |
|
370 |
}; |
|
371 |
||
| 9 | 372 |
//bouton up / down |
| 6 | 373 |
$(document).on('click', '.ui-sortable .btn-sort', function(e){ |
374 |
e.preventDefault(); |
|
375 |
var row = $(this).parents('tr.row-image-diaporama'), |
|
376 |
listDiaporama = $(this).parents('.list-image-diaporama'); |
|
377 |
||
378 |
if($(this).hasClass('down')) |
|
379 |
row.insertAfter(row.next()); |
|
380 |
else if($(this).hasClass('up')) |
|
381 |
row.insertBefore(row.prev()); |
|
382 |
||
383 |
disabledBtnSortable(listDiaporama); |
|
384 |
}); |
|
385 |
||
386 |
function disabledBtnSortable(listDiaporama){ |
|
387 |
listDiaporama.find('.btn-sort.disabled').removeClass('disabled'); |
|
388 |
listDiaporama.find('tr.row-image-diaporama:first-child').find('.btn-sort.up').addClass('disabled'); |
|
389 |
listDiaporama.find('tr.row-image-diaporama:last-child').find('.btn-sort.down').addClass('disabled'); |
|
390 |
} |
|
391 |
||
| 9 | 392 |
|
| 6 | 393 |
|
394 |
//sauvegarder annotation |
|
395 |
$('.tab-content').on('click', '.btn-save-annotation', function(e){ |
|
396 |
e.preventDefault(); |
|
397 |
var idAnnotation = $(this).attr('data-id'); |
|
398 |
}); |
|
399 |
||
400 |
//annotation html |
|
401 |
$('.tab-content').on('click', '.btn-html-apercu', function(e){ |
|
402 |
e.preventDefault(); |
|
403 |
||
404 |
var apercuWrap = $(this).parents('.edit-annotation-html').find('.html-apercu'), |
|
405 |
htmlTextarea = $(this).parents('.edit-annotation-html').find('textarea'); |
|
406 |
||
407 |
apercuWrap.empty().html(htmlTextarea.val()); |
|
408 |
}); |
|
409 |
||
410 |
//annotation > diaporama (spin) |
|
| 16 | 411 |
|
| 6 | 412 |
|
413 |
//config |
|
414 |
//CLEditor annotation > text (wysiwyg) |
|
415 |
//http://premiumsoftware.net/cleditor/docs/GettingStarted.html#optionalParameters |
|
416 |
var wysiwygConfig = { |
|
417 |
width: 456, |
|
418 |
height: 250, |
|
419 |
controls: "bold italic underline strikethrough | font size " + |
|
420 |
"style | color highlight removeformat | bullets numbering | outdent ", |
|
421 |
fonts: "Arial,Arial Black,Comic Sans MS,Courier New,Narrow,Garamond," + |
|
422 |
"Georgia,Impact,Sans Serif,Serif,Tahoma,Trebuchet MS,Verdana", |
|
423 |
sizes: "1,2,3,4,5,6,7", |
|
424 |
styles: [["Paragraph", "<p>"], ["Header 1", "<h1>"], ["Header 2", "<h2>"], |
|
425 |
["Header 3", "<h3>"], ["Header 4","<h4>"], ["Header 5","<h5>"], |
|
426 |
["Header 6","<h6>"]], |
|
427 |
docType: '<!DOCTYPE HTML>', |
|
428 |
bodyStyle: "margin:0; font-family: 'Helvetica Neue',​Helvetica,​Arial,​sans-serif;" |
|
429 |
}; |
|
430 |
||
431 |
//slider |
|
432 |
var configSlider = { |
|
433 |
range: true, |
|
434 |
values: [ 0, 1*60*1000 ], |
|
435 |
min: 0, |
|
436 |
max: 10*60*1000, |
|
437 |
slide: function( event, ui ) { |
|
438 |
|
|
439 |
var debutString = millisecondsToString(ui.values[0]); |
|
440 |
var endString = millisecondsToString(ui.values[1]); |
|
441 |
var durationString = millisecondsToString(ui.values[1] - ui.values[0]); |
|
442 |
||
443 |
var idSlider = $(this).attr('data-id'); |
|
444 |
|
|
445 |
$( '#'+ idSlider +'-begin' ).html(debutString); |
|
446 |
$( '#'+ idSlider +'-duration' ).html(durationString); |
|
447 |
$( '#'+ idSlider +'-end' ).html(endString); |
|
448 |
|
|
449 |
} |
|
450 |
}; |
|
451 |
||
| 9 | 452 |
//milliseconds To 12h12m12s |
| 6 | 453 |
function millisecondsToString(milliseconds) { |
454 |
var oneHour = 3600000; |
|
455 |
var oneMinute = 60000; |
|
456 |
var oneSecond = 1000; |
|
457 |
var seconds = 0; |
|
458 |
var minutes = 0; |
|
459 |
var hours = 0; |
|
460 |
var result; |
|
461 |
||
462 |
if (milliseconds >= oneHour) { |
|
463 |
hours = Math.floor(milliseconds / oneHour); |
|
464 |
} |
|
465 |
||
466 |
milliseconds = hours > 0 ? (milliseconds - hours * oneHour) : milliseconds; |
|
467 |
||
468 |
if (milliseconds >= oneMinute) { |
|
469 |
minutes = Math.floor(milliseconds / oneMinute); |
|
470 |
} |
|
471 |
||
472 |
milliseconds = minutes > 0 ? (milliseconds - minutes * oneMinute) : milliseconds; |
|
473 |
||
474 |
if (milliseconds >= oneSecond) { |
|
475 |
seconds = Math.floor(milliseconds / oneSecond); |
|
476 |
} |
|
477 |
||
478 |
milliseconds = seconds > 0 ? (milliseconds - seconds * oneSecond) : milliseconds; |
|
479 |
||
480 |
if (hours > 0) { |
|
481 |
result = (hours > 9 ? hours : "0" + hours) + "h"; |
|
482 |
} else { |
|
483 |
result = ""; |
|
484 |
} |
|
485 |
||
486 |
if (minutes > 0) { |
|
487 |
result += (minutes > 9 ? minutes : "0" + minutes) + "m"; |
|
488 |
} else { |
|
489 |
result += "00m"; |
|
490 |
} |
|
491 |
||
492 |
if (seconds > 0) { |
|
493 |
result += (seconds > 9 ? seconds : "0" + seconds) + "s"; |
|
494 |
} else { |
|
495 |
result += "00s"; |
|
496 |
} |
|
497 |
||
498 |
return result; |
|
499 |
} |
|
| 9 | 500 |
|
501 |
//test |
|
502 |
$(".wysiwyg").cleditor(wysiwygConfig); |
|
503 |
||
504 |
$('.number-spin').spin(spinParam); |
|
505 |
||
506 |
disabledBtnSortable($('.ui-sortable')) |
|
507 |
$('.ui-sortable').sortable({ |
|
508 |
stop : function(event, ui){ |
|
509 |
disabledBtnSortable($(this)); |
|
510 |
} |
|
511 |
}); |
|
512 |
||
513 |
$('.slider-duration').slider(configSlider); |
|
514 |
||
515 |
$('#annotation-tab a:last-child').tab('show'); |
|
516 |
||
|
21
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
517 |
$(".tag-it").tagit(); |
|
abd04f346dbe
delete row on enter key press in modal
Anthony Ly <anthonyly.com@gmail.com>
parents:
18
diff
changeset
|
518 |
|
| 16 | 519 |
});//ready |