SAAS-948 - showbuilder styling
This commit is contained in:
parent
0c3d9a8af4
commit
e6609896a5
19 changed files with 429 additions and 279 deletions
|
@ -529,7 +529,7 @@ var AIRTIME = (function(AIRTIME) {
|
|||
// https://wiki.sourcefabric.org/display/CC/Adding+a+new+library+datatable+column
|
||||
"aoColumns": [
|
||||
/* ftype */ { "sTitle" : "" , "mDataProp" : "ftype" , "bSearchable" : false , "bVisible" : false } ,
|
||||
/* Checkbox */ { "sTitle" : "" , "mDataProp" : "checkbox" , "bSortable" : false , "bSearchable" : false , "sWidth" : "10px" , "sClass" : "library_checkbox" } ,
|
||||
/* Checkbox */ { "sTitle" : "" , "mDataProp" : "checkbox" , "bSortable" : false , "bSearchable" : false , "sWidth" : "16px" , "sClass" : "library_checkbox" } ,
|
||||
/* Type */ { "sTitle" : "" , "mDataProp" : "image" , "bSearchable" : false , "sWidth" : "16px" , "sClass" : "library_type" , "iDataSort" : 0 } ,
|
||||
/* Is Scheduled */ { "sTitle" : $.i18n._("Scheduled") , "mDataProp" : "is_scheduled" , "bVisible" : false , "bSearchable" : false , "sWidth" : "90px" , "sClass" : "library_is_scheduled"} ,
|
||||
///* Is Playlist */ { "sTitle" : $.i18n._("Playlist / Block") , "mDataProp" : "is_playlist" , "bSearchable" : false , "sWidth" : "110px" , "sClass" : "library_is_playlist"} ,
|
||||
|
|
|
@ -362,7 +362,7 @@ var AIRTIME = (function(AIRTIME){
|
|||
//remove any newlines if user somehow snuck them in (easy to do if dragging/dropping text)
|
||||
nameElement.text(nameElement.text().replace("\n", ""));
|
||||
|
||||
var name = $pl.find("#playlist_name_display").text();
|
||||
var name = $pl.find(".playlist_name_display").text();
|
||||
$(".nav.nav-tabs .active a > span.tab-name").text(name);
|
||||
}
|
||||
|
||||
|
@ -379,7 +379,7 @@ var AIRTIME = (function(AIRTIME){
|
|||
$('#spl_name > a')
|
||||
.empty()
|
||||
.append(json.name);
|
||||
$('#obj_length')
|
||||
$pl.find('.obj_length')
|
||||
.empty()
|
||||
.append(json.length);
|
||||
$('#fieldset-metadate_change textarea')
|
||||
|
@ -448,11 +448,11 @@ var AIRTIME = (function(AIRTIME){
|
|||
pane = $(".editor_pane_wrapper:last"),
|
||||
name = json.type == "md" ? // file
|
||||
pane.append(json.html).find("#track_title").val() + $.i18n._(" - Metadata Editor")
|
||||
: pane.append(json.html).find("#playlist_name_display").text(),
|
||||
: pane.append(json.html).find(".playlist_name_display").text(),
|
||||
tab =
|
||||
"<li tab-id='" + $tabCount + "' tab-type='" + json.type + "' id='pl-tab-" + $tabCount + "' role='presentation' class='active'>" +
|
||||
"<a href='#'><span class='tab-name'></span>" +
|
||||
"<span href='#' class='close-round lib_pl_close'></span>" +
|
||||
"<span href='#' class='lib_pl_close icon-remove'></span>" +
|
||||
"</a>" +
|
||||
"</li>",
|
||||
tabs = $(".nav.nav-tabs");
|
||||
|
@ -482,6 +482,7 @@ var AIRTIME = (function(AIRTIME){
|
|||
newTab.wrapper.find(".md-cancel").on("click", function() {
|
||||
closeTab();
|
||||
});
|
||||
initialEvents();
|
||||
}
|
||||
|
||||
function openPlaylist(json) {
|
||||
|
@ -517,8 +518,9 @@ var AIRTIME = (function(AIRTIME){
|
|||
var pane = $(".active-tab"),
|
||||
tab = $(".nav.nav-tabs .active"),
|
||||
toPane = pane.next().length > 0 ? pane.next() : pane.prev(),
|
||||
toTab = tab.next().length > 0 ? tab.next() : tab.prev();
|
||||
delete $openTabs[tab.attr("tab-type") + pane.find(".obj_id").val()];
|
||||
toTab = tab.next().length > 0 ? tab.next() : tab.prev(),
|
||||
objId = pane.find(".obj_id").val();
|
||||
delete $openTabs[tab.attr("tab-type") + objId];
|
||||
tab.remove();
|
||||
$pl.remove();
|
||||
AIRTIME.showbuilder.switchTab(toPane, toTab);
|
||||
|
@ -799,8 +801,8 @@ var AIRTIME = (function(AIRTIME){
|
|||
//end main playlist fades.
|
||||
|
||||
//edit playlist name event
|
||||
$pl.on("keydown", "#playlist_name_display", submitOnEnter);
|
||||
$pl.on("blur", "#playlist_name_display", editName);
|
||||
$pl.on("keydown", ".playlist_name_display", submitOnEnter);
|
||||
$pl.on("blur", ".playlist_name_display", editName);
|
||||
|
||||
//edit playlist description events
|
||||
$pl.on("click", "legend", function(){
|
||||
|
@ -845,7 +847,7 @@ var AIRTIME = (function(AIRTIME){
|
|||
var description = $pl.find("#description").val();
|
||||
var streamurl = $pl.find("#streamurl-element input").val();
|
||||
var length = $pl.find("#streamlength-element input").val();
|
||||
var name = $pl.find("#playlist_name_display").text();
|
||||
var name = $pl.find(".playlist_name_display").text();
|
||||
|
||||
//hide any previous errors (if any)
|
||||
$(".side_playlist.active-tab .errors").empty().hide();
|
||||
|
@ -876,7 +878,7 @@ var AIRTIME = (function(AIRTIME){
|
|||
$ws_id.show();
|
||||
|
||||
|
||||
var length = $(".side_playlist.active-tab #ws_length");
|
||||
var length = $(".side_playlist.active-tab .ws_length");
|
||||
length.text(json.length);
|
||||
|
||||
//redraw the library to show the new webstream
|
||||
|
@ -903,7 +905,13 @@ var AIRTIME = (function(AIRTIME){
|
|||
});
|
||||
});
|
||||
|
||||
$(".lib_pl_close").unbind().click(function() {
|
||||
// Unbind so each tab is only handled by its own close button
|
||||
$(".lib_pl_close").unbind().click(function(e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
$(this).unbind("click"); // Prevent repeated clicks in quick succession from closing multiple tabs
|
||||
|
||||
var tabId = $(this).closest("li").attr("tab-id");
|
||||
AIRTIME.showbuilder.switchTab($("#pl-tab-content-" + tabId), $("#pl-tab-" + tabId));
|
||||
|
||||
|
@ -913,7 +921,7 @@ var AIRTIME = (function(AIRTIME){
|
|||
// We also need to run the draw callback to update how dragged items are drawn
|
||||
AIRTIME.library.fnDrawCallback();
|
||||
|
||||
var name = $pl.find('#playlist_name_display').text().trim();
|
||||
var name = $pl.find('.playlist_name_display').text().trim();
|
||||
|
||||
if ((name == "Untitled Playlist"
|
||||
|| name == "Untitled Smart Block")
|
||||
|
@ -941,7 +949,7 @@ var AIRTIME = (function(AIRTIME){
|
|||
* Playlists: get name, description
|
||||
*/
|
||||
var criteria = $pl.find('form').serializeArray(),
|
||||
block_name = $pl.find('#playlist_name_display').text(),
|
||||
block_name = $pl.find('.playlist_name_display').text(),
|
||||
block_desc = $pl.find('textarea[name="description"]').val(),
|
||||
save_action = baseUrl+'new-playlist/save',
|
||||
obj_id = $pl.find(".obj_id").val(),
|
||||
|
|
|
@ -187,8 +187,8 @@ var AIRTIME = (function(AIRTIME) {
|
|||
aMediaIds.push(new Array(data.id, data.ftype));
|
||||
|
||||
// check if a playlist/block is open before adding items
|
||||
if ($('input[id="obj_type"]').val() == 'playlist'
|
||||
|| $('input[id="obj_type"]').val() == 'block') {
|
||||
if ($('.active-tab .obj_type').val() == 'playlist'
|
||||
|| $('.active-tab .obj_type').val() == 'block') {
|
||||
AIRTIME.playlist.fnAddItems(aMediaIds, undefined, 'after');
|
||||
}
|
||||
}
|
||||
|
@ -196,7 +196,7 @@ var AIRTIME = (function(AIRTIME) {
|
|||
|
||||
function addToCurrentOrNext(arr) {
|
||||
var el;
|
||||
// Add to the end of the current show by getting the footer
|
||||
// Add to the end of the current or next show by getting the footer
|
||||
el = $(".sb-footer.sb-future:first");
|
||||
var data = el.prev().data("aData");
|
||||
|
||||
|
@ -236,39 +236,53 @@ var AIRTIME = (function(AIRTIME) {
|
|||
if (AIRTIME.button.isDisabled('btn-group #library-plus') === true) {
|
||||
return;
|
||||
}
|
||||
|
||||
var selected = AIRTIME.library.getSelectedData(), data, i, length, temp, aMediaIds = [], aSchedIds = [], aData = [];
|
||||
|
||||
// process selected files/playlists.
|
||||
for (i = 0, length = selected.length; i < length; i++) {
|
||||
data = selected[i];
|
||||
aMediaIds.push( {
|
||||
"id" : data.id,
|
||||
"type" : data.ftype
|
||||
});
|
||||
}
|
||||
|
||||
$("#show_builder_table tr.sb-selected")
|
||||
.each(function(i, el) {
|
||||
aData.push($(el).data("aData"));
|
||||
});
|
||||
|
||||
// process selected schedule rows to add media
|
||||
// after.
|
||||
for (i = 0, length = aData.length; i < length; i++) {
|
||||
temp = aData[i];
|
||||
aSchedIds.push( {
|
||||
"id" : temp.id,
|
||||
"instance" : temp.instance,
|
||||
"timestamp" : temp.timestamp
|
||||
});
|
||||
}
|
||||
|
||||
if (aSchedIds.length == 0) {
|
||||
addToCurrentOrNext(aSchedIds);
|
||||
var selected = AIRTIME.library.getSelectedData(), data, i, length, temp, aMediaIds = [], aSchedIds = [], aData = [];
|
||||
|
||||
if ($("#show_builder_table").is(":visible")) {
|
||||
for (i = 0, length = selected.length; i < length; i++) {
|
||||
data = selected[i];
|
||||
aMediaIds.push( {
|
||||
"id" : data.id,
|
||||
"type" : data.ftype
|
||||
});
|
||||
}
|
||||
|
||||
// process selected files/playlists.
|
||||
$("#show_builder_table tr.sb-selected").each(function(i, el) {
|
||||
aData.push($(el).data("aData"));
|
||||
});
|
||||
|
||||
// process selected schedule rows to add media
|
||||
// after.
|
||||
for (i = 0, length = aData.length; i < length; i++) {
|
||||
temp = aData[i];
|
||||
aSchedIds.push( {
|
||||
"id" : temp.id,
|
||||
"instance" : temp.instance,
|
||||
"timestamp" : temp.timestamp
|
||||
});
|
||||
}
|
||||
|
||||
if (aSchedIds.length == 0) {
|
||||
if (!addToCurrentOrNext(aSchedIds)) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
AIRTIME.showbuilder.fnAdd(aMediaIds, aSchedIds);
|
||||
} else {
|
||||
for (i = 0, length = selected.length; i < length; i++) {
|
||||
data = selected[i];
|
||||
aMediaIds.push([data.id, data.ftype]);
|
||||
}
|
||||
|
||||
// check if a playlist/block is open before adding items
|
||||
if ($('.active-tab .obj_type').val() == 'playlist'
|
||||
|| $('.active-tab .obj_type').val() == 'block') {
|
||||
AIRTIME.playlist.fnAddItems(aMediaIds, undefined, 'after');
|
||||
}
|
||||
}
|
||||
|
||||
AIRTIME.showbuilder.fnAdd(aMediaIds, aSchedIds);
|
||||
});
|
||||
|
||||
// delete from library.
|
||||
|
|
|
@ -394,7 +394,7 @@ var AIRTIME = (function(AIRTIME){
|
|||
$('#spl_name > a')
|
||||
.empty()
|
||||
.append(json.name);
|
||||
$('#obj_length')
|
||||
$('.obj_length')
|
||||
.empty()
|
||||
.append(json.length);
|
||||
$('#fieldset-metadate_change textarea')
|
||||
|
@ -746,8 +746,8 @@ var AIRTIME = (function(AIRTIME){
|
|||
//end main playlist fades.
|
||||
|
||||
//edit playlist name event
|
||||
$pl.on("keydown", "#playlist_name_display", submitOnEnter);
|
||||
$pl.on("blur", "#playlist_name_display", editName);
|
||||
$pl.on("keydown", ".playlist_name_display", submitOnEnter);
|
||||
$pl.on("blur", ".playlist_name_display", editName);
|
||||
|
||||
//edit playlist description events
|
||||
$pl.on("click", "legend", function(){
|
||||
|
@ -792,7 +792,7 @@ var AIRTIME = (function(AIRTIME){
|
|||
var description = $pl.find("#description").val();
|
||||
var streamurl = $pl.find("#streamurl-element input").val();
|
||||
var length = $pl.find("#streamlength-element input").val();
|
||||
var name = $pl.find("#playlist_name_display").text();
|
||||
var name = $pl.find(".playlist_name_display").text();
|
||||
|
||||
//hide any previous errors (if any)
|
||||
$(".side_playlist .errors").empty().hide();
|
||||
|
@ -823,7 +823,7 @@ var AIRTIME = (function(AIRTIME){
|
|||
$ws_id.show();
|
||||
|
||||
|
||||
var length = $(".side_playlist #ws_length");
|
||||
var length = $(".side_playlist .ws_length");
|
||||
length.text(json.length);
|
||||
|
||||
//redraw the library to show the new webstream
|
||||
|
@ -873,7 +873,7 @@ var AIRTIME = (function(AIRTIME){
|
|||
* Playlists: get name, description
|
||||
*/
|
||||
var criteria = $('form').serializeArray(),
|
||||
block_name = $('#playlist_name_display').text(),
|
||||
block_name = $('.playlist_name_display').text(),
|
||||
block_desc = $('textarea[name="description"]').val(),
|
||||
save_action = baseUrl+'Playlist/save',
|
||||
obj_id = $('input[id="obj_id"]').val(),
|
||||
|
|
|
@ -14,7 +14,8 @@ var AIRTIME = (function(AIRTIME){
|
|||
headerFooter = [],
|
||||
DISABLED_CLASS = 'ui-state-disabled',
|
||||
selected,
|
||||
$previouslySelected;
|
||||
$previouslySelected,
|
||||
flagForDeselection;
|
||||
|
||||
if (AIRTIME.showbuilder === undefined) {
|
||||
AIRTIME.showbuilder = {};
|
||||
|
@ -244,15 +245,16 @@ var AIRTIME = (function(AIRTIME){
|
|||
|
||||
mod.selectAll = function () {
|
||||
var $trs = $sbTable.find("tr.lib-audio").not(".sb-past, .sb-empty");
|
||||
$trs.addClass(SB_SELECTED_CLASS);
|
||||
$trs.addClass(SB_SELECTED_CLASS).find(".sb-checkbox > input").prop('checked', true);
|
||||
|
||||
mod.checkToolBarIcons();
|
||||
};
|
||||
|
||||
mod.selectNone = function () {
|
||||
var $trs = $sbTable.find("tr.lib-audio");
|
||||
$trs.removeClass(SB_SELECTED_CLASS);
|
||||
$trs.removeClass(SB_SELECTED_CLASS).find(".sb-checkbox > input").prop('checked', false);
|
||||
$previouslySelected = undefined;
|
||||
selected = undefined;
|
||||
|
||||
mod.checkToolBarIcons();
|
||||
};
|
||||
|
@ -422,6 +424,7 @@ var AIRTIME = (function(AIRTIME){
|
|||
|
||||
oSchedTable = $sbTable.dataTable( {
|
||||
"aoColumns": [
|
||||
/* checkbox */ {"mDataProp": "allowed", "sTitle": "", "sWidth": "16px", "sClass": "sb-checkbox"},
|
||||
/* Type */ {"mDataProp": "image", "sTitle": "", "sClass": "library_image sb-image", "sWidth": "16px"},
|
||||
/* starts */ {"mDataProp": "starts", "sTitle": $.i18n._("Start"), "sClass": "sb-starts", "sWidth": "60px"},
|
||||
/* ends */ {"mDataProp": "ends", "sTitle": $.i18n._("End"), "sClass": "sb-ends", "sWidth": "60px"},
|
||||
|
@ -629,6 +632,14 @@ var AIRTIME = (function(AIRTIME){
|
|||
hide: 'mouseout'
|
||||
});
|
||||
}
|
||||
|
||||
$node = $(nRow.children[0]);
|
||||
if (aData.allowed === true && aData.scheduled >= 1 && aData.linked_allowed) {
|
||||
$node.html('<input type="checkbox" name="'+aData.id+'"></input>');
|
||||
}
|
||||
else {
|
||||
$node.empty();
|
||||
}
|
||||
}
|
||||
|
||||
//add the show colour to the leftmost td
|
||||
|
@ -764,48 +775,93 @@ var AIRTIME = (function(AIRTIME){
|
|||
"bScrollCollapseY": false
|
||||
});
|
||||
|
||||
$sbTable.find("tbody").on("mousedown", "tr:not(.sb-past, .sb-empty)", function(ev) {
|
||||
//$sbTable.find("tbody").on("mousedown", "tr:not(.sb-past, .sb-empty)", function(ev) {
|
||||
//
|
||||
// var $tr = $(this),
|
||||
// // Get the ID of the selected row
|
||||
// $rowId = $tr.attr("id");
|
||||
//
|
||||
// if (ev.shiftKey && $previouslySelected !== undefined) {
|
||||
// if ($previouslySelected.attr("id") == $rowId) {
|
||||
// return;
|
||||
// }
|
||||
//
|
||||
// // If the selected row comes before the previously selected row,
|
||||
// // we want to select previous rows, otherwise we select next
|
||||
// if ($previouslySelected.prevAll("#"+$rowId).length !== 0) {
|
||||
// $previouslySelected.prevUntil($tr).each(function(i, el){
|
||||
// $(el).addClass(SB_SELECTED_CLASS);
|
||||
// });
|
||||
// } else {
|
||||
// $previouslySelected.nextUntil($tr).each(function(i, el){
|
||||
// $(el).addClass(SB_SELECTED_CLASS);
|
||||
// });
|
||||
// }
|
||||
// $tr.addClass(SB_SELECTED_CLASS);
|
||||
// } else if (ev.ctrlKey && $previouslySelected !== undefined) {
|
||||
// $tr.addClass(SB_SELECTED_CLASS);
|
||||
// } else {
|
||||
// if (!$tr.hasClass(SB_SELECTED_CLASS)) {
|
||||
// $("."+SB_SELECTED_CLASS).removeClass(SB_SELECTED_CLASS);
|
||||
// }
|
||||
// $tr.addClass(SB_SELECTED_CLASS);
|
||||
// }
|
||||
//
|
||||
// // Remember this row so we can properly multiselect
|
||||
// $previouslySelected = $tr;
|
||||
//
|
||||
// mod.checkToolBarIcons();
|
||||
//});
|
||||
//
|
||||
//$sbTable.find("tbody").on("click", "tr:not(.sb-past, .sb-empty)", function(ev) {
|
||||
// if (!ev.ctrlKey && !ev.shiftKey) {
|
||||
// $("."+SB_SELECTED_CLASS).removeClass(SB_SELECTED_CLASS);
|
||||
// $(this).addClass(SB_SELECTED_CLASS);
|
||||
// }
|
||||
//});
|
||||
|
||||
$sbTable.find("tbody").on("mousedown", "tr:not(.sb-past, .sb-empty)", function(ev) {
|
||||
var $tr = $(this),
|
||||
// Get the ID of the selected row
|
||||
$rowId = $tr.attr("id");
|
||||
|
||||
if (ev.shiftKey && $previouslySelected !== undefined) {
|
||||
if ($previouslySelected.attr("id") == $rowId) {
|
||||
return;
|
||||
}
|
||||
if (!$tr.hasClass(SB_SELECTED_CLASS)) {
|
||||
if (ev.shiftKey && $previouslySelected !== undefined) {
|
||||
if ($previouslySelected.attr("id") == $rowId) {
|
||||
return;
|
||||
}
|
||||
|
||||
// If the selected row comes before the previously selected row,
|
||||
// we want to select previous rows, otherwise we select next
|
||||
if ($previouslySelected.prevAll("#"+$rowId).length !== 0) {
|
||||
$previouslySelected.prevUntil($tr).each(function(i, el){
|
||||
$(el).addClass(SB_SELECTED_CLASS);
|
||||
});
|
||||
} else {
|
||||
$previouslySelected.nextUntil($tr).each(function(i, el){
|
||||
$(el).addClass(SB_SELECTED_CLASS);
|
||||
});
|
||||
// If the selected row comes before the previously selected row,
|
||||
// we want to select previous rows, otherwise we select next
|
||||
if ($previouslySelected.prevAll("#" + $rowId).length !== 0) {
|
||||
$previouslySelected.prevUntil($tr).each(function (i, el) {
|
||||
$(el).addClass(SB_SELECTED_CLASS);
|
||||
$(el).find(".sb-checkbox > input").prop('checked', true);
|
||||
});
|
||||
} else {
|
||||
$previouslySelected.nextUntil($tr).each(function (i, el) {
|
||||
$(el).addClass(SB_SELECTED_CLASS);
|
||||
$(el).find(".sb-checkbox > input").prop('checked', true);
|
||||
});
|
||||
}
|
||||
}
|
||||
$tr.addClass(SB_SELECTED_CLASS);
|
||||
} else if (ev.ctrlKey && $previouslySelected !== undefined) {
|
||||
$tr.addClass(SB_SELECTED_CLASS);
|
||||
$tr.find(".sb-checkbox > input").prop('checked', true);
|
||||
} else {
|
||||
if (!$tr.hasClass(SB_SELECTED_CLASS)) {
|
||||
$("."+SB_SELECTED_CLASS).removeClass(SB_SELECTED_CLASS);
|
||||
}
|
||||
$tr.addClass(SB_SELECTED_CLASS);
|
||||
flagForDeselection = true;
|
||||
}
|
||||
|
||||
// Remember this row so we can properly multiselect
|
||||
$previouslySelected = $tr;
|
||||
|
||||
mod.checkToolBarIcons();
|
||||
});
|
||||
|
||||
$sbTable.find("tbody").on("click", "tr:not(.sb-past, .sb-empty)", function(ev) {
|
||||
if (!ev.ctrlKey && !ev.shiftKey) {
|
||||
$("."+SB_SELECTED_CLASS).removeClass(SB_SELECTED_CLASS);
|
||||
$(this).addClass(SB_SELECTED_CLASS);
|
||||
if (flagForDeselection) {
|
||||
flagForDeselection = false;
|
||||
$(this).removeClass(SB_SELECTED_CLASS);
|
||||
$(this).find(".sb-checkbox > input").prop('checked', false);
|
||||
} else {
|
||||
$(this).find(".sb-checkbox > input").prop('checked', true);
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
@ -146,13 +146,18 @@ AIRTIME = (function(AIRTIME) {
|
|||
mod.onReady = function() {
|
||||
// Normally we would just use audio/*, but it includes file types that we can't handle (like .m4a)
|
||||
// We initialize the acceptedMimeTypes variable in Bootstrap so we don't have to duplicate the list
|
||||
Dropzone.options.uploadForm = {
|
||||
Dropzone.options.content = {
|
||||
url:'/rest/media',
|
||||
clickable: false,
|
||||
acceptedFiles: acceptedMimeTypes.join(),
|
||||
init: function () {
|
||||
this.on("sending", function (file, xhr, data) {
|
||||
data.append("csrf_token", $("#csrf").val());
|
||||
});
|
||||
}
|
||||
},
|
||||
dictDefaultMessage: '',
|
||||
createImageThumbnails: false,
|
||||
previewTemplate : '<div style="display:none"></div>'
|
||||
};
|
||||
|
||||
// define module vars.
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue