6bbbdd5404
Fixed. 1. It only clears the left window form if 'delete' action is clickced on the opened playlist. 2. similar functionality was implemented when 'edit meatadata' form is opened in the left window.
521 lines
11 KiB
JavaScript
521 lines
11 KiB
JavaScript
//--------------------------------------------------------------------------------------------------------------------------------
|
|
//Side Playlist Functions
|
|
//--------------------------------------------------------------------------------------------------------------------------------
|
|
|
|
function isTimeValid(time) {
|
|
var regExpr = new RegExp("^\\d{2}[:]\\d{2}[:]\\d{2}([.]\\d{1,6})?$");
|
|
|
|
if (!regExpr.test(time)) {
|
|
return false;
|
|
}
|
|
|
|
return true;
|
|
}
|
|
|
|
function changeClipLength(pos, json) {
|
|
|
|
$("#spl_"+pos).find(".spl_playlength")
|
|
.empty()
|
|
.append(json.response.cliplength);
|
|
|
|
$("#spl_length")
|
|
.empty()
|
|
.append(json.response.length);
|
|
}
|
|
|
|
function showError(el, error) {
|
|
$(el).parent().next()
|
|
.empty()
|
|
.append(error)
|
|
.show();
|
|
}
|
|
|
|
function hideError(el) {
|
|
$(el).parent().next()
|
|
.empty()
|
|
.hide();
|
|
}
|
|
|
|
function changeCueIn(event) {
|
|
event.stopPropagation();
|
|
|
|
var pos, url, cueIn, div;
|
|
|
|
span = $(this);
|
|
pos = span.parent().attr("id").split("_").pop();
|
|
url = "/Playlist/set-cue";
|
|
cueIn = span.text().trim();
|
|
|
|
if(!isTimeValid(cueIn)){
|
|
showError(span, "please put in a time '00:00:00 (.000000)'");
|
|
return;
|
|
}
|
|
|
|
$.post(url, {format: "json", cueIn: cueIn, pos: pos}, function(json){
|
|
|
|
if(json.response.error) {
|
|
showError(span, json.response.error);
|
|
return;
|
|
}
|
|
|
|
changeClipLength(pos, json);
|
|
hideError(span);
|
|
});
|
|
}
|
|
|
|
function changeCueOut(event) {
|
|
event.stopPropagation();
|
|
|
|
var pos, url, cueOut, div;
|
|
|
|
span = $(this);
|
|
pos = span.parent().attr("id").split("_").pop();
|
|
url = "/Playlist/set-cue";
|
|
cueOut = span.text().trim();
|
|
|
|
if(!isTimeValid(cueOut)){
|
|
showError(span, "please put in a time '00:00:00 (.000000)'");
|
|
return;
|
|
}
|
|
|
|
$.post(url, {format: "json", cueOut: cueOut, pos: pos}, function(json){
|
|
|
|
if(json.response.error) {
|
|
showError(span, json.response.error);
|
|
return;
|
|
}
|
|
|
|
changeClipLength(pos, json);
|
|
hideError(span);
|
|
});
|
|
}
|
|
|
|
function changeFadeIn(event) {
|
|
event.stopPropagation();
|
|
|
|
var pos, url, fadeIn, div;
|
|
|
|
span = $(this);
|
|
pos = span.parent().attr("id").split("_").pop();
|
|
url = "/Playlist/set-fade";
|
|
fadeIn = span.text().trim();
|
|
|
|
if(!isTimeValid(fadeIn)){
|
|
showError(span, "please put in a time '00:00:00 (.000000)'");
|
|
return;
|
|
}
|
|
|
|
$.post(url, {format: "json", fadeIn: fadeIn, pos: pos}, function(json){
|
|
if(json.response.error) {
|
|
return;
|
|
}
|
|
|
|
hideError(span);
|
|
});
|
|
}
|
|
|
|
function changeFadeOut(event) {
|
|
event.stopPropagation();
|
|
|
|
var pos, url, fadeOut, div;
|
|
|
|
span = $(this);
|
|
pos = span.parent().attr("id").split("_").pop();
|
|
url = "/Playlist/set-fade";
|
|
fadeOut = span.text().trim();
|
|
|
|
if(!isTimeValid(fadeOut)){
|
|
showError(span, "please put in a time '00:00:00 (.000000)'");
|
|
return;
|
|
}
|
|
|
|
$.post(url, {format: "json", fadeOut: fadeOut, pos: pos}, function(json){
|
|
if(json.response.error) {
|
|
return;
|
|
}
|
|
|
|
hideError(span);
|
|
});
|
|
}
|
|
|
|
function submitOnEnter(event) {
|
|
//enter was pressed
|
|
if(event.keyCode === 13) {
|
|
event.preventDefault();
|
|
$(this).blur();
|
|
}
|
|
}
|
|
|
|
function setCueEvents(el) {
|
|
|
|
$(el).find(".spl_cue_in span:last").blur(changeCueIn);
|
|
$(el).find(".spl_cue_out span:last").blur(changeCueOut);
|
|
|
|
$(el).find(".spl_cue_in span:first, .spl_cue_out span:first")
|
|
.keydown(submitOnEnter);
|
|
}
|
|
|
|
function setFadeEvents(el) {
|
|
|
|
$(el).find(".spl_fade_in span:first").blur(changeFadeIn);
|
|
$(el).find(".spl_fade_out span:first").blur(changeFadeOut);
|
|
|
|
$(el).find(".spl_fade_in span:first, .spl_fade_out span:first")
|
|
.keydown(submitOnEnter);
|
|
}
|
|
|
|
function highlightActive(el) {
|
|
|
|
$(el).addClass("ui-state-active");
|
|
}
|
|
|
|
function openFadeEditor(event) {
|
|
event.stopPropagation();
|
|
|
|
var pos, url, li;
|
|
|
|
li = $(this).parent().parent();
|
|
pos = parseInt(li.attr("id").split("_").pop());
|
|
|
|
if($(this).hasClass("ui-state-active")) {
|
|
$(this).removeClass("ui-state-active");
|
|
|
|
$("#crossfade_"+pos+"-"+(pos+1))
|
|
.empty()
|
|
.hide();
|
|
|
|
return;
|
|
}
|
|
|
|
url = '/Playlist/set-fade';
|
|
|
|
highlightActive(this);
|
|
|
|
$.get(url, {format: "json", pos: pos}, function(json){
|
|
|
|
$("#crossfade_"+(pos)+"-"+(pos+1))
|
|
.empty()
|
|
.append(json.html)
|
|
.show();
|
|
|
|
setFadeEvents(li);
|
|
});
|
|
}
|
|
|
|
function openCueEditor(event) {
|
|
event.stopPropagation();
|
|
|
|
var pos, url, li, icon;
|
|
|
|
li = $(this).parent().parent().parent();
|
|
icon = $(this);
|
|
pos = li.attr("id").split("_").pop();
|
|
|
|
if(li.hasClass("ui-state-active")) {
|
|
li.removeClass("ui-state-active");
|
|
icon.attr("class", "spl_cue ui-state-default");
|
|
|
|
$("#cues_"+pos)
|
|
.empty()
|
|
.hide();
|
|
|
|
return;
|
|
}
|
|
|
|
icon.attr("class", "spl_cue ui-state-default ui-state-active");
|
|
url = '/Playlist/set-cue';
|
|
|
|
highlightActive(li);
|
|
|
|
$.get(url, {format: "json", pos: pos}, function(json){
|
|
|
|
$("#cues_"+pos)
|
|
.empty()
|
|
.append(json.html)
|
|
.show();
|
|
|
|
setCueEvents(li);
|
|
});
|
|
}
|
|
|
|
function setSPLContent(json) {
|
|
|
|
if(json.message) {
|
|
alert(json.message);
|
|
return;
|
|
}
|
|
|
|
$('#spl_name').empty()
|
|
.append(json.name);
|
|
$('#spl_length').empty()
|
|
.append(json.length);
|
|
$('#spl_sortable').empty()
|
|
.append(json.html);
|
|
$("#spl_editor")
|
|
.empty();
|
|
|
|
$("#spl_sortable .ui-icon-closethick").click(deleteSPLItem);
|
|
$(".spl_fade_control").click(openFadeEditor);
|
|
//$(".spl_playlength").click(openCueEditor);
|
|
$(".spl_cue").click(openCueEditor);
|
|
|
|
//redraw the library list
|
|
dt = $("#library_display").dataTable();
|
|
dt.fnStandingRedraw();
|
|
|
|
return false;
|
|
}
|
|
|
|
function addSPLItem(event, ui){
|
|
var url, tr, id, items, draggableOffset, elOffset, pos;
|
|
|
|
tr = ui.helper;
|
|
|
|
if(tr.get(0).tagName === 'LI')
|
|
return;
|
|
|
|
items = $(event.currentTarget).children();
|
|
|
|
draggableOffset = ui.offset;
|
|
|
|
$.each(items, function(i, val){
|
|
elOffset = $(this).offset();
|
|
|
|
if(elOffset.top > draggableOffset.top) {
|
|
pos = $(this).attr('id').split("_").pop();
|
|
return false;
|
|
}
|
|
});
|
|
|
|
id = tr.attr('id').split("_").pop();
|
|
|
|
url = '/Playlist/add-item';
|
|
|
|
$.post(url, {format: "json", id: id, pos: pos}, setSPLContent);
|
|
}
|
|
|
|
function deleteSPLItem(event){
|
|
event.stopPropagation();
|
|
|
|
var url, pos;
|
|
|
|
pos = $(this).parent().parent().attr("id").split("_").pop();
|
|
url = '/Playlist/delete-item';
|
|
|
|
$.post(url, {format: "json", pos: pos}, setSPLContent);
|
|
}
|
|
|
|
function moveSPLItem(event, ui) {
|
|
var li, newPos, oldPos, url;
|
|
|
|
li = ui.item;
|
|
|
|
newPos = li.index();
|
|
oldPos = li.attr('id').split("_").pop();
|
|
|
|
url = '/Playlist/move-item';
|
|
|
|
$.post(url, {format: "json", oldPos: oldPos, newPos: newPos}, setSPLContent);
|
|
}
|
|
|
|
function noOpenPL(json) {
|
|
$("#side_playlist")
|
|
.empty()
|
|
.append(json.html);
|
|
|
|
$("#spl_new")
|
|
.button()
|
|
.click(newSPL);
|
|
}
|
|
|
|
function closeSPL() {
|
|
var url;
|
|
|
|
url = '/Playlist/close/format/json';
|
|
|
|
$.post(url, noOpenPL);
|
|
}
|
|
|
|
function createPlaylistMetaForm(json) {
|
|
var submit, form;
|
|
|
|
form = $(json.form);
|
|
form.find("fieldset").addClass("simple-formblock metadata");
|
|
|
|
form.find("input, textarea")
|
|
.keydown(function(event){
|
|
//enter was pressed
|
|
if(event.keyCode === 13) {
|
|
event.preventDefault();
|
|
$("#new_playlist_submit").click();
|
|
}
|
|
})
|
|
|
|
form.find("#new_playlist_submit")
|
|
.button()
|
|
.click(function(event){
|
|
event.preventDefault();
|
|
|
|
var url, data;
|
|
|
|
url = '/Playlist/metadata/format/json';
|
|
data = $("#side_playlist form").serialize();
|
|
|
|
$.post(url, data, function(json){
|
|
openDiffSPL(json);
|
|
//redraw the library list
|
|
dt = $("#library_display").dataTable();
|
|
dt.fnStandingRedraw();
|
|
})
|
|
|
|
});
|
|
|
|
$("#side_playlist")
|
|
.empty()
|
|
.append(form);
|
|
|
|
currentlyOpenedSplId = json.pl_id;
|
|
}
|
|
|
|
function newSPL() {
|
|
var url;
|
|
|
|
url = '/Playlist/new/format/json';
|
|
|
|
$.post(url, createPlaylistMetaForm);
|
|
}
|
|
|
|
function deleteSPL() {
|
|
var url;
|
|
|
|
url = '/Playlist/delete-active/format/json';
|
|
|
|
$.post(url, function(){
|
|
noOpenPL;
|
|
//redraw the library list
|
|
dt = $("#library_display").dataTable();
|
|
dt.fnStandingRedraw();
|
|
});
|
|
}
|
|
|
|
function openDiffSPL(json) {
|
|
|
|
$("#side_playlist")
|
|
.empty()
|
|
.append(json.html);
|
|
|
|
currentlyOpenedSplId = json.pl_id;
|
|
|
|
setUpSPL();
|
|
}
|
|
|
|
function setUpSPL() {
|
|
|
|
$("#spl_sortable").sortable({
|
|
handle: 'div.list-item-container'
|
|
});
|
|
$("#spl_sortable" ).bind( "sortstop", moveSPLItem);
|
|
$("#spl_remove_selected").click(deleteSPLItem);
|
|
$("#spl_new")
|
|
.button()
|
|
.click(newSPL);
|
|
|
|
$("#spl_close")
|
|
.button()
|
|
.click(closeSPL);
|
|
|
|
$("#spl_crossfade").click(function(){
|
|
|
|
if($(this).hasClass("ui-state-active")) {
|
|
$(this).removeClass("ui-state-active");
|
|
$("#crossfade_main").hide();
|
|
}
|
|
else {
|
|
$(this).addClass("ui-state-active");
|
|
|
|
var url = '/Playlist/set-playlist-fades';
|
|
|
|
$.get(url, {format: "json"}, function(json){
|
|
$("#spl_fade_in_main").find("span")
|
|
.empty()
|
|
.append(json.fadeIn);
|
|
$("#spl_fade_out_main").find("span")
|
|
.empty()
|
|
.append(json.fadeOut);
|
|
|
|
$("#crossfade_main").show();
|
|
});
|
|
}
|
|
});
|
|
|
|
$("#spl_fade_in_main span:first").blur(function(event){
|
|
event.stopPropagation();
|
|
|
|
var url, fadeIn, span;
|
|
|
|
span = $(this);
|
|
url = "/Playlist/set-playlist-fades";
|
|
fadeIn = span.text().trim();
|
|
|
|
if(!isTimeValid(fadeIn)){
|
|
showError(span, "please put in a time '00:00:00 (.000000)'");
|
|
return;
|
|
}
|
|
|
|
$.post(url, {format: "json", fadeIn: fadeIn}, function(json){
|
|
if(json.response.error) {
|
|
return;
|
|
}
|
|
|
|
hideError(span);
|
|
});
|
|
});
|
|
|
|
$("#spl_fade_out_main span:first").blur(function(event){
|
|
event.stopPropagation();
|
|
|
|
var url, fadeIn, span;
|
|
|
|
span = $(this);
|
|
url = "/Playlist/set-playlist-fades";
|
|
fadeOut = span.text().trim();
|
|
|
|
if(!isTimeValid(fadeOut)){
|
|
showError(span, "please put in a time '00:00:00 (.000000)'");
|
|
return;
|
|
}
|
|
|
|
$.post(url, {format: "json", fadeOut: fadeOut}, function(json){
|
|
if(json.response.error) {
|
|
return;
|
|
}
|
|
|
|
hideError(span);
|
|
});
|
|
});
|
|
|
|
$("#spl_fade_in_main span:first, #spl_fade_out_main span:first")
|
|
.keydown(submitOnEnter);
|
|
|
|
$("#crossfade_main > .ui-icon-closethick").click(function(){
|
|
$("#spl_crossfade").removeClass("ui-state-active");
|
|
$("#crossfade_main").hide();
|
|
});
|
|
|
|
$("#spl_delete")
|
|
.button()
|
|
.click(deleteSPL);
|
|
|
|
$("#spl_sortable .ui-icon-closethick").click(deleteSPLItem);
|
|
$(".spl_fade_control").click(openFadeEditor);
|
|
//$(".spl_playlength").click(openCueEditor);
|
|
$(".spl_cue").click(openCueEditor);
|
|
|
|
$("#spl_sortable").droppable();
|
|
$("#spl_sortable" ).bind( "drop", addSPLItem);
|
|
}
|
|
|
|
$(document).ready(function() {
|
|
var currentlyOpenedSplId;
|
|
setUpSPL();
|
|
});
|