Congegni/sintonia
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Completed smart block, playlist, and webstream editor form overhauls

Browse source 
* CC-6088: Smart Block form needs to have a form layout
* CC-6089: Editor view name fields must be made <input> fields
* CC-6103: Cannot create webstreams
* Reworked a big chunk of the smart block editor flow to send only the
  playlist contents back rather than the entire HTML fragment for the
  editor.
* Keep more of the playlist/smartblock editor view persistent across
  saves, generates, and shuffles.
This commit is contained in:
Albert Santoni 2015-08-27 19:00:23 -04:00
parent 98ac8fd851
commit b6f33f6083
13 changed files with 229 additions and 106 deletions
Download patch file Download diff file Expand all files Collapse all files

108
airtime_mvc/public/js/airtime/library/spl.js
View file

@ -31,8 +31,6 @@ var AIRTIME = (function(AIRTIME){
function playlistError(json) {
alert(json.error);
//closeTab();
//openPlaylist(json);
}
function stopAudioPreview() {
@ -71,7 +69,7 @@ var AIRTIME = (function(AIRTIME){
cueIn = $.trim(span.text()),
li = span.parents("li"),
unqid = li.attr("unqid"),
lastMod = getModified(),
lastMod = mod.getModified(),
type = $pl.find('.obj_type').val();
if (!isTimeValid(cueIn)){
@ -108,7 +106,7 @@ var AIRTIME = (function(AIRTIME){
cueOut = $.trim(span.text()),
li = span.parents("li"),
unqid = li.attr("unqid"),
lastMod = getModified(),
lastMod = mod.getModified(),
type = $pl.find('.obj_type').val();
if (!isTimeValid(cueOut)){
@ -142,7 +140,7 @@ var AIRTIME = (function(AIRTIME){
function changeCues($el, id, cueIn, cueOut) {
var url = baseUrl+"playlist/set-cue",
lastMod = getModified(),
lastMod = mod.getModified(),
type = $pl.find('.obj_type').val(),
li,
span;
@ -212,7 +210,7 @@ var AIRTIME = (function(AIRTIME){
function changeCrossfade($el, id1, id2, fadeIn, fadeOut, offset, id) {
var url = baseUrl+"playlist/set-crossfade",
lastMod = getModified(),
lastMod = mod.getModified(),
type = $pl.find('.obj_type').val();
$.post(url,
@ -244,7 +242,7 @@ var AIRTIME = (function(AIRTIME){
fadeIn = $.trim(span.text()),
li = span.parents("li"),
unqid = li.attr("unqid"),
lastMod = getModified(),
lastMod = mod.getModified(),
type = $pl.find('.obj_type').val();
if (!isFadeValid(fadeIn)){
@ -282,7 +280,7 @@ var AIRTIME = (function(AIRTIME){
fadeOut = $.trim(span.text()),
li = span.parents("li"),
unqid = li.attr("unqid"),
lastMod = getModified(),
lastMod = mod.getModified(),
type = $pl.find('.obj_type').val();
if (!isFadeValid(fadeOut)){
@ -354,13 +352,15 @@ var AIRTIME = (function(AIRTIME){
}
}
function editName() {
function updateActiveTabName(newTabName) {
/*
var nameElement = $(this);
//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").val();
$(".nav.nav-tabs .active a > span.tab-name").text(name);
*/
$(".nav.nav-tabs .active a > span.tab-name").text(newTabName);
}
function redrawLib() {
@ -389,7 +389,9 @@ var AIRTIME = (function(AIRTIME){
.append($html);
setCueEvents();
setFadeEvents();
setModified(json.modified);
mod.setModified(json.modified);
updateActiveTabName(json.name);
AIRTIME.playlist.validatePlaylistElements();
redrawLib();
}
@ -423,14 +425,19 @@ var AIRTIME = (function(AIRTIME){
return parseInt($pl.find(".obj_id").val(), 10);
}
function getModified() {
mod.getModified = function() {
return parseInt($pl.find(".obj_lastMod").val(), 10);
}
function setModified(modified) {
mod.setModified = function(modified) {
$pl.find(".obj_lastMod").val(modified);
}
function setTitleLabel(title) {
$pl.find(".title_obj_name").text(title);
}
/*
* Should all be moved to builder.js eventually
*/
@ -712,7 +719,7 @@ var AIRTIME = (function(AIRTIME){
//main playlist fades events
$pl.on("click", "#spl_crossfade", function() {
var lastMod = getModified(),
var lastMod = mod.getModified(),
type = $pl.find('.obj_type').val();
if ($(this).hasClass("ui-state-active")) {
@ -762,7 +769,7 @@ var AIRTIME = (function(AIRTIME){
var url = baseUrl+"playlist/set-playlist-fades",
span = $(this),
fadeIn = $.trim(span.text()),
lastMod = getModified(),
lastMod = mod.getModified(),
type = $pl.find('.obj_type').val();
if (!isFadeValid(fadeIn)){
@ -775,7 +782,7 @@ var AIRTIME = (function(AIRTIME){
function(json){
hideError(span);
if (json.modified !== undefined) {
setModified(json.modified);
mod.setModified(json.modified);
}
});
});
@ -786,7 +793,7 @@ var AIRTIME = (function(AIRTIME){
var url = baseUrl+"playlist/set-playlist-fades",
span = $(this),
fadeOut = $.trim(span.text()),
lastMod = getModified(),
lastMod = mod.getModified(),
type = $pl.find('.obj_type').val();
if (!isFadeValid(fadeOut)){
@ -799,7 +806,7 @@ var AIRTIME = (function(AIRTIME){
function(json){
hideError(span);
if (json.modified !== undefined) {
setModified(json.modified);
mod.setModified(json.modified);
}
});
});
@ -814,7 +821,7 @@ var AIRTIME = (function(AIRTIME){
//edit playlist name event
$pl.on("keydown", ".playlist_name_display", submitOnEnter);
$pl.on("blur", ".playlist_name_display", editName);
//$pl.on("blur", ".playlist_name_display", editName);
//edit playlist description events
$pl.on("click", "legend", function(){
@ -838,14 +845,12 @@ var AIRTIME = (function(AIRTIME){
if (json.error !== undefined) {
alert(json.error);
}
if (json.html !== undefined) {
closeTab();
openPlaylist(json);
}
if (json.result == "0") {
$pl.find('.success').text($.i18n._('Playlist shuffled'));
$pl.find('.success').show();
} else {
if (json.result == "0") {
$pl.find('.success').text($.i18n._('Playlist shuffled'));
$pl.find('.success').show();
mod.playlistResponse(json);
}
}
disableLoadingIcon();
setTimeout(removeSuccessMsg, 5000);
@ -886,12 +891,15 @@ var AIRTIME = (function(AIRTIME){
$status.show();
setTimeout(function(){$status.fadeOut("slow", function(){$status.empty()})}, 5000);
$pl.find(".title_obj_name").val(name);
updateActiveTabName(name);
var $ws_id = $(".active-tab .obj_id");
$ws_id.attr("value", json.streamId);
var $ws_id = $("#ws_delete");
$ws_id.show();
editName();
var length = $(".side_playlist.active-tab .ws_length");
length.text(json.length);
@ -978,7 +986,7 @@ var AIRTIME = (function(AIRTIME){
save_action = baseUrl+'playlist/save',
obj_id = $pl.find(".obj_id").val(),
obj_type = $pl.find('.obj_type').val(),
lastMod = getModified(),
lastMod = mod.getModified(),
dt = $('table[id="library_display"]').dataTable();
enableLoadingIcon();
$.post(save_action,
@ -986,19 +994,19 @@ var AIRTIME = (function(AIRTIME){
function(json){
if (json.error !== undefined) {
alert(json.error);
}
if (json.html !== undefined) {
closeTab();
openPlaylist(json);
}
setModified(json.modified);
if (obj_type == "block") {
callback(json, "save");
} else {
$pl.find('.success').text($.i18n._('Playlist saved'));
$pl.find('.success').show();
setTimeout(removeSuccessMsg, 5000);
dt.fnStandingRedraw();
setTitleLabel(json.name);
mod.setModified(json.modified);
if (obj_type == "block") {
callback(json, "save");
} else {
$pl.find('.success').text($.i18n._('Playlist saved'));
$pl.find('.success').show();
setTimeout(removeSuccessMsg, 5000);
dt.fnStandingRedraw();
}
}
setFadeIcon();
disableLoadingIcon();
@ -1011,6 +1019,13 @@ var AIRTIME = (function(AIRTIME){
oData = {};
playlistRequest(sUrl, oData);
});
$pl.find(".toggle-editor-form").unbind().on("click", function(event) {
$pl.find(".inner_editor_wrapper").slideToggle(200);
var buttonIcon = $(this).find('span.icon-white');
buttonIcon.toggleClass('icon-chevron-up');
buttonIcon.toggleClass('icon-chevron-down');
});
}
function setUpPlaylist() {
@ -1094,6 +1109,7 @@ var AIRTIME = (function(AIRTIME){
//handle: 'div.list-item-container',
start: function(event, ui) {
ui.placeholder.height(56);
ui.placeholder.css('min-height', 56);
},
axis: "y",
containment: "document",
@ -1168,7 +1184,7 @@ var AIRTIME = (function(AIRTIME){
stopAudioPreview();
id = (plid === undefined) ? getId() : plid;
lastMod = getModified();
lastMod = mod.getModified();
type = pl.find('.obj_type').val();
url = baseUrl+'playlist/delete';
@ -1185,7 +1201,7 @@ var AIRTIME = (function(AIRTIME){
stopAudioPreview();
id = (wsid === undefined) ? getId() : wsid;
lastMod = getModified();
lastMod = mod.getModified();
type = $pl.find('.obj_type').val();
url = baseUrl+'webstream/delete';
@ -1223,7 +1239,7 @@ var AIRTIME = (function(AIRTIME){
setupUI();
};
function playlistResponse(json){
mod.playlistResponse = function(json){
if (json.error !== undefined) {
playlistError(json);
}
@ -1241,7 +1257,7 @@ var AIRTIME = (function(AIRTIME){
mod.disableUI();
lastMod = getModified();
lastMod = mod.getModified();
oData["modified"] = lastMod;
oData["obj_type"] = obj_type;
@ -1250,7 +1266,7 @@ var AIRTIME = (function(AIRTIME){
$.post(
sUrl,
oData,
playlistResponse
mod.playlistResponse
);
}

53
airtime_mvc/public/js/airtime/playlist/smart_blockbuilder.js
View file

@ -5,7 +5,7 @@ $(document).ready(function() {
function setSmartBlockEvents() {
var activeTab = $('.active-tab'),
form = activeTab.find('.smart-block-form');
/********** ADD CRITERIA ROW **********/
form.find('#criteria_add').live('click', function(){
@ -190,7 +190,7 @@ function setSmartBlockEvents() {
/********** SAVE ACTION **********/
// moved to spl.js
/********** GENERATE ACTION **********/
activeTab.find('button[id="generate_button"]').live("click", function(){
buttonClickAction('generate', 'playlist/smart-block-generate');
@ -203,6 +203,8 @@ function setSmartBlockEvents() {
/********** CHANGE PLAYLIST TYPE **********/
form.find('dd[id="sp_type-element"]').live("change", function(){
//buttonClickAction('generate', 'playlist/empty-content');
$(".active-tab").find('button[id="save_button"]').click();
setupUI();
AIRTIME.library.checkAddButton();
});
@ -336,7 +338,9 @@ function buttonClickAction(clickType, url){
obj_id = $('.active-tab .obj_id').val();
enableLoadingIcon();
$.post(url, {format: "json", data: data, obj_id: obj_id}, function(data){
$.post(url, {format: "json", data: data, obj_id: obj_id, obj_type: "block",
modified: AIRTIME.playlist.getModified()
}, function(data){
callback(data, clickType);
disableLoadingIcon();
});
@ -351,7 +355,9 @@ function setupUI() {
*/
var sortable = activeTab.find('.spl_sortable'),
plContents = sortable.children(),
shuffleButton = activeTab.find('button[name="shuffle_button"], #pl-bl-clear-content');
shuffleButton = activeTab.find('button[name="shuffle_button"], #pl-bl-clear-content'),
generateButton = activeTab.find('button[name="generate_button"], #pl-bl-clear-content'),
fadesButton = activeTab.find('#spl_crossfade, #pl-bl-clear-content');
if (!plContents.hasClass('spl_empty')) {
if (shuffleButton.hasClass('ui-state-disabled')) {
@ -365,11 +371,15 @@ function setupUI() {
if (activeTab.find('.obj_type').val() == 'block') {
if (playlist_type == "0") {
shuffleButton.parent().show();
sortable.show();
shuffleButton.removeAttr("disabled");
generateButton.removeAttr("disabled");
fadesButton.removeAttr("disabled");
//sortable.children().show();
} else {
shuffleButton.parent().hide();
sortable.hide();
shuffleButton.attr("disabled", "disabled");
generateButton.attr("disabled", "disabled");
fadesButton.attr("disabled", "disabled");
//sortable.children().hide();
}
}
@ -481,41 +491,47 @@ function callback(json, type) {
var dt = $('table[id="library_display"]').dataTable(),
form = $('.active-tab .smart-block-form');
if (json.modified !== undefined) {
AIRTIME.playlist.setModified(json.modified);
}
if (type == 'shuffle' || type == 'generate') {
if (json.error !== undefined) {
alert(json.error);
}
AIRTIME.playlist.closeTab();
AIRTIME.playlist.fnOpenPlaylist(json);
if (json.result == "0") {
if (type == 'shuffle') {
form.find('.success').text($.i18n._('Smart block shuffled'));
} else if (type == 'generate') {
form.find('.success').text($.i18n._('Smart block generated and criteria saved'));
//redraw library table so the length gets updated
//redraw library table so the length gets updated
dt.fnStandingRedraw();
}
AIRTIME.playlist.playlistResponse(json);
form.find('.success').show();
}
form.find('#smart_block_options').removeClass("closed");
form.find('.smart-block-form').removeClass("closed");
} else {
AIRTIME.playlist.closeTab();
AIRTIME.playlist.fnOpenPlaylist(json);
if (json.result == "0") {
$('.active-tab #sp-success-saved').text($.i18n._('Smart block saved')).show();
AIRTIME.playlist.playlistResponse(json);
//redraw library table so the length gets updated
dt.fnStandingRedraw();
}
form.find('#smart_block_options').removeClass("closed");
form.find('.smart-block-form').removeClass("closed");
}
setTimeout(removeSuccessMsg, 5000);
}
function appendAddButton() {
/*
var add_button = "<a class='btn btn-small' id='criteria_add'>" +
"<i class='icon-white icon-plus'></i></a>";
var rows = $('.active-tab #smart_block_options'),
"<i class='icon-white icon-plus'></i>Add Criteria</a>";
var rows = $('.active-tab .smart-block-form'),
enabled = rows.find('select[name^="sp_criteria_field"]:enabled');
rows.find('#criteria_add').remove();
@ -528,6 +544,7 @@ function appendAddButton() {
enabled.siblings('span[id="extra_criteria"]')
.after(add_button);
}
*/
}
function removeButtonCheck() {