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

Refactor tabs functionality

Browse source
This commit is contained in:
Duncan Sommerville 2015-09-22 15:27:08 -04:00
parent cf1de5fb66
commit 4238d5a201
7 changed files with 230 additions and 180 deletions
Download patch file Download diff file Expand all files Collapse all files

6
airtime_mvc/application/controllers/PlaylistController.php
View file

@ -102,7 +102,7 @@ class PlaylistController extends Zend_Controller_Action
$this->view->form = $form; $this->view->form = $form;
$this->view->obj = $obj; $this->view->obj = $obj;
$this->view->type = "sb"; //$this->view->type = "sb";
$this->view->id = $obj->getId(); $this->view->id = $obj->getId();
if ($isJson) { if ($isJson) {
@ -112,7 +112,7 @@ class PlaylistController extends Zend_Controller_Action
} }
} else { } else {
$this->view->obj = $obj; $this->view->obj = $obj;
$this->view->type = "pl"; //$this->view->type = "pl";
$this->view->id = $obj->getId(); $this->view->id = $obj->getId();
if ($isJson) { if ($isJson) {
return $this->view->html = $this->view->render($viewPath); return $this->view->html = $this->view->render($viewPath);
@ -573,7 +573,7 @@ class PlaylistController extends Zend_Controller_Action
$this->view->result = 1; $this->view->result = 1;
} }
$this->view->name = $bl->getName(); $this->view->name = $bl->getName();
$this->view->type = "sb"; //$this->view->type = "sb";
$this->view->id = $bl->getId(); $this->view->id = $bl->getId();
$this->view->modified = $bl->getLastModified("U"); $this->view->modified = $bl->getLastModified("U");
} else if ($params['type'] == 'playlist') { } else if ($params['type'] == 'playlist') {

8
airtime_mvc/public/js/airtime/library/events/library_showbuilder.js
View file

@ -336,11 +336,11 @@ var AIRTIME = (function(AIRTIME) {
var selection = $(".media_type_selector.selected").data("selection-id"); var selection = $(".media_type_selector.selected").data("selection-id");
if (selection == AIRTIME.library.MediaTypeEnum.PLAYLIST) { if (selection == AIRTIME.library.MediaTypeIntegerEnum.PLAYLIST) {
AIRTIME.playlist.fnNew(); AIRTIME.playlist.fnNew();
} else if (selection == AIRTIME.library.MediaTypeEnum.BLOCK) { } else if (selection == AIRTIME.library.MediaTypeIntegerEnum.BLOCK) {
AIRTIME.playlist.fnNewBlock(); AIRTIME.playlist.fnNewBlock();
} else if (selection == AIRTIME.library.MediaTypeEnum.WEBSTREAM) { } else if (selection == AIRTIME.library.MediaTypeIntegerEnum.WEBSTREAM) {
AIRTIME.playlist.fnWsNew(); AIRTIME.playlist.fnWsNew();
} }
}); });
@ -358,7 +358,7 @@ var AIRTIME = (function(AIRTIME) {
if (data.ftype === "audioclip") { if (data.ftype === "audioclip") {
$.get(baseUrl + "library/edit-file-md/id/" + data.id, {format: "json"}, function (json) { $.get(baseUrl + "library/edit-file-md/id/" + data.id, {format: "json"}, function (json) {
AIRTIME.playlist.fileMdEdit(json); AIRTIME.playlist.fileMdEdit(json, data.tr_id);
//buildEditMetadataDialog(json); //buildEditMetadataDialog(json);
}); });
} else if (data.ftype === "playlist" || data.ftype === "block") { } else if (data.ftype === "playlist" || data.ftype === "block") {

35
airtime_mvc/public/js/airtime/library/library.js
View file

@ -63,7 +63,7 @@ var AIRTIME = (function(AIRTIME) {
CONFIGURATION CONFIGURATION
############################################ */ ############################################ */
mod.MediaTypeEnum = Object.freeze({ mod.MediaTypeIntegerEnum = Object.freeze({
DEFAULT: 1, DEFAULT: 1,
FILE: 1, FILE: 1,
PLAYLIST: 2, PLAYLIST: 2,
@ -72,39 +72,54 @@ var AIRTIME = (function(AIRTIME) {
PODCAST: 5 PODCAST: 5
}); });
mod.MediaTypeStringEnum = Object.freeze({
FILE: "au",
PLAYLIST: "pl",
BLOCK: "bl",
WEBSTREAM: "ws",
PODCAST: "pc"
});
mod.MediaTypeFullToStringEnum = Object.freeze({
//FILE: "au",
"playlist": "pl",
"block": "bl",
"stream": "ws"
});
// TODO: once the new manual pages are added, change links! // TODO: once the new manual pages are added, change links!
mod.placeholder = function(mediaType) { mod.placeholder = function(mediaType) {
switch (mediaType) { switch (mediaType) {
// TODO: remove duplication in a nice way? // TODO: remove duplication in a nice way?
case mod.MediaTypeEnum.FILE: case mod.MediaTypeIntegerEnum.FILE:
return { return {
"media": "tracks", "media": "tracks",
"icon": "icon-music", "icon": "icon-music",
"subtext": "Click 'Upload' to add some now.", "subtext": "Click 'Upload' to add some now.",
"href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/add-media/" "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/add-media/"
}; };
case mod.MediaTypeEnum.PLAYLIST: case mod.MediaTypeIntegerEnum.PLAYLIST:
return { return {
"media": "playlists", "media": "playlists",
"icon": "icon-list", "icon": "icon-list",
"subtext": "Click 'New' to create one now.", "subtext": "Click 'New' to create one now.",
"href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/" "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/"
}; };
case mod.MediaTypeEnum.BLOCK: case mod.MediaTypeIntegerEnum.BLOCK:
return { return {
"media": "smart blocks", "media": "smart blocks",
"icon": "icon-time", "icon": "icon-time",
"subtext": "Click 'New' to create one now.", "subtext": "Click 'New' to create one now.",
"href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/" "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/"
}; };
case mod.MediaTypeEnum.WEBSTREAM: case mod.MediaTypeIntegerEnum.WEBSTREAM:
return { return {
"media": "webstreams", "media": "webstreams",
"icon": "icon-random", "icon": "icon-random",
"subtext": "Click 'New' to create one now.", "subtext": "Click 'New' to create one now.",
"href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/" "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/"
}; };
case mod.MediaTypeEnum.PODCAST: case mod.MediaTypeIntegerEnum.PODCAST:
return { return {
"media": "podcasts", "media": "podcasts",
"icon": "icon-headphones", "icon": "icon-headphones",
@ -256,7 +271,7 @@ var AIRTIME = (function(AIRTIME) {
var selected = $(".media_type_selector.selected").data("selection-id"), var selected = $(".media_type_selector.selected").data("selection-id"),
check = false; check = false;
if (selected != AIRTIME.library.MediaTypeEnum.FILE) { if (selected != AIRTIME.library.MediaTypeIntegerEnum.FILE) {
check = true; check = true;
} }
@ -631,7 +646,7 @@ var AIRTIME = (function(AIRTIME) {
// push whether to search files/playlists or all. // push whether to search files/playlists or all.
type = $(".media_type_selector.selected").data("selection-id"); type = $(".media_type_selector.selected").data("selection-id");
type = (type === undefined) ? AIRTIME.library.MediaTypeEnum.DEFAULT : type; type = (type === undefined) ? AIRTIME.library.MediaTypeIntegerEnum.DEFAULT : type;
aoData.push({name: "type", value: type}); aoData.push({name: "type", value: type});
//getUsabilityHint(); //getUsabilityHint();
@ -805,7 +820,7 @@ var AIRTIME = (function(AIRTIME) {
//Set up the datatables string translation table with different strings depending on //Set up the datatables string translation table with different strings depending on
//whether you're viewing files, playlists, smart blocks, etc. //whether you're viewing files, playlists, smart blocks, etc.
var type = parseInt($(".media_type_selector.selected").data("selection-id")); var type = parseInt($(".media_type_selector.selected").data("selection-id"));
type = (type === undefined) ? AIRTIME.library.MediaTypeEnum.DEFAULT : type; type = (type === undefined) ? AIRTIME.library.MediaTypeIntegerEnum.DEFAULT : type;
//FIXME: The code that calls this function doesn't work as intended because you can't //FIXME: The code that calls this function doesn't work as intended because you can't
// change the oLanguage property of a datatable dynamically. :( // change the oLanguage property of a datatable dynamically. :(
@ -855,7 +870,7 @@ var AIRTIME = (function(AIRTIME) {
} }
var selected = $("a[href$='"+location.hash+"']"); var selected = $("a[href$='"+location.hash+"']");
if (selected.parent().data("selection-id") == AIRTIME.library.MediaTypeEnum.PODCAST) { if (selected.parent().data("selection-id") == AIRTIME.library.MediaTypeIntegerEnum.PODCAST) {
$("#library_display_wrapper").hide(); $("#library_display_wrapper").hide();
$('#podcast_table_wrapper').show(); $('#podcast_table_wrapper').show();
oTable = mod.podcastDataTable; oTable = mod.podcastDataTable;

42
airtime_mvc/public/js/airtime/library/podcast.js
View file

@ -3,7 +3,6 @@ var endpoint = 'rest/podcast/';
var podcastApp = angular.module('podcast', []) var podcastApp = angular.module('podcast', [])
.controller('RestController', function($scope, $http, podcast) { .controller('RestController', function($scope, $http, podcast) {
$scope.podcast = podcast; $scope.podcast = podcast;
console.log(podcast);
AIRTIME.tabs.setActiveTabName($scope.podcast.title); AIRTIME.tabs.setActiveTabName($scope.podcast.title);
$scope.savePodcast = function() { $scope.savePodcast = function() {
@ -14,7 +13,7 @@ var podcastApp = angular.module('podcast', [])
}; };
$scope.discard = function() { $scope.discard = function() {
AIRTIME.tabs.closeTab(); AIRTIME.tabs.getActiveTab().close();
$scope.podcast = {}; $scope.podcast = {};
}; };
}); });
@ -42,7 +41,7 @@ var AIRTIME = (function (AIRTIME) {
function _bootstrapAngularApp(podcast) { function _bootstrapAngularApp(podcast) {
podcastApp.value('podcast', JSON.parse(podcast)); podcastApp.value('podcast', JSON.parse(podcast));
var wrapper = AIRTIME.tabs.getActiveTab().find(".editor_pane_wrapper"); var wrapper = AIRTIME.tabs.getActiveTab().contents.find(".editor_pane_wrapper");
wrapper.attr("ng-controller", "RestController"); wrapper.attr("ng-controller", "RestController");
angular.bootstrap(wrapper.get(0), ["podcast"]); angular.bootstrap(wrapper.get(0), ["podcast"]);
} }
@ -62,17 +61,20 @@ var AIRTIME = (function (AIRTIME) {
mod.addPodcast = function() { mod.addPodcast = function() {
$.post(endpoint, $("#podcast_url_dialog").find("form").serialize(), function(json) { $.post(endpoint, $("#podcast_url_dialog").find("form").serialize(), function(json) {
AIRTIME.tabs.openTab(json, AIRTIME.podcast.init); var uid = AIRTIME.library.MediaTypeStringEnum.PODCAST+"_"+json.id;
AIRTIME.tabs.openTab(json, uid);
_bootstrapAngularApp(json.podcast); _bootstrapAngularApp(json.podcast);
$("#podcast_url_dialog").dialog("close"); $("#podcast_url_dialog").dialog("close");
mod.initPodcastEpisodeDatatable(JSON.parse(el.podcast).episodes); console.log(json);
mod.initPodcastEpisodeDatatable(JSON.parse(json.podcast).episodes);
}); });
}; };
mod.editSelectedPodcasts = function() { mod.editSelectedPodcasts = function() {
_bulkAction("GET", function(json) { _bulkAction("GET", function(json) {
json.forEach(function(el) { json.forEach(function(el) {
AIRTIME.tabs.openTab(el, AIRTIME.podcast.init); var uid = AIRTIME.library.MediaTypeStringEnum.PODCAST+"_"+el.id;
AIRTIME.tabs.openTab(el, uid, AIRTIME.podcast.init);
_bootstrapAngularApp(el.podcast); _bootstrapAngularApp(el.podcast);
mod.initPodcastEpisodeDatatable(JSON.parse(el.podcast).episodes); mod.initPodcastEpisodeDatatable(JSON.parse(el.podcast).episodes);
}); });
@ -87,32 +89,6 @@ var AIRTIME = (function (AIRTIME) {
} }
}; };
/*
* Callback when creating podcast tabs to initialize bindings
*/
mod.init = function(newTab) {
// FIXME: get rid of this duplication by abstracting out functionality in tabs
newTab.tab.on("click", function() {
if (!$(this).hasClass('active')) {
AIRTIME.tabs.switchTab(newTab.pane, newTab.tab);
}
});
$(".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("data-tab-id");
// We need to update the text on the add button
AIRTIME.library.checkAddButton();
// We also need to run the draw callback to update how dragged items are drawn
AIRTIME.library.fnDrawCallback();
AIRTIME.tabs.closeTab(tabId);
});
};
mod.initPodcastEpisodeDatatable = function(episodes) { mod.initPodcastEpisodeDatatable = function(episodes) {
console.log(episodes); console.log(episodes);
var aoColumns = [ var aoColumns = [
@ -128,7 +104,7 @@ var AIRTIME = (function (AIRTIME) {
// Set up the div with id "podcast_table" as a datatable. // Set up the div with id "podcast_table" as a datatable.
mod.podcastEpisodesTableWidget = new AIRTIME.widgets.Table( mod.podcastEpisodesTableWidget = new AIRTIME.widgets.Table(
AIRTIME.tabs.getActiveTab().find('#podcast_episodes'), // DOM node to create the table inside. AIRTIME.tabs.getActiveTab().contents.find('#podcast_episodes'), // DOM node to create the table inside.
true, // Enable item selection true, // Enable item selection
podcastToolbarButtons, // Toolbar buttons podcastToolbarButtons, // Toolbar buttons
{ // Datatables overrides. { // Datatables overrides.

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

@ -835,22 +835,24 @@ var AIRTIME = (function(AIRTIME){
$(this).unbind("click"); // Prevent repeated clicks in quick succession from closing multiple tabs $(this).unbind("click"); // Prevent repeated clicks in quick succession from closing multiple tabs
var tabId = $(this).closest("li").attr("data-tab-id"); var tabId = $(this).closest("li").attr("data-tab-id"),
tab = AIRTIME.tabs.get(tabId);
// We need to update the text on the add button // We need to update the text on the add button
AIRTIME.library.checkAddButton(); AIRTIME.library.checkAddButton();
// We also need to run the draw callback to update how dragged items are drawn // We also need to run the draw callback to update how dragged items are drawn
AIRTIME.library.fnDrawCallback(); AIRTIME.library.fnDrawCallback();
var playlistNameElem = AIRTIME.tabs.get(tabId).find('.tab-name'); var playlistNameElem = tab.tab.find('.tab-name');
var name = playlistNameElem.text().trim(); var name = playlistNameElem.text().trim();
// TODO: refactor - this code is pretty finicky...
if ((name == $.i18n._("Untitled Playlist") if ((name == $.i18n._("Untitled Playlist")
|| name == $.i18n._("Untitled Smart Block")) || name == $.i18n._("Untitled Smart Block"))
&& $pl.find(".spl_sortable .spl_empty").length == 1) { && $pl.find(".spl_sortable .spl_empty").length == 1) {
mod.fnDelete(undefined, tabId); mod.fnDelete(undefined, tab);
} else { } else {
AIRTIME.tabs.closeTab(tabId); tab.close();
} }
$.ajax( { $.ajax( {
@ -1022,7 +1024,8 @@ var AIRTIME = (function(AIRTIME){
$.post(url, $.post(url,
{format: "json", type: 'playlist'}, {format: "json", type: 'playlist'},
function(json) { function(json) {
AIRTIME.tabs.openPlaylistTab(json); var uid = AIRTIME.library.MediaTypeStringEnum.PLAYLIST+"_"+json.id;
AIRTIME.tabs.openPlaylistTab(json, uid);
redrawLib(); redrawLib();
}); });
}; };
@ -1035,7 +1038,8 @@ var AIRTIME = (function(AIRTIME){
$.post(url, $.post(url,
{format: "json"}, {format: "json"},
function(json) { function(json) {
AIRTIME.tabs.openPlaylistTab(json); var uid = AIRTIME.library.MediaTypeStringEnum.WEBSTREAM+"_"+json.id;
AIRTIME.tabs.openPlaylistTab(json, uid);
redrawLib(); redrawLib();
}); });
}; };
@ -1049,13 +1053,14 @@ var AIRTIME = (function(AIRTIME){
$.post(url, $.post(url,
{format: "json", type: 'block'}, {format: "json", type: 'block'},
function(json){ function(json){
AIRTIME.tabs.openPlaylistTab(json); var uid = AIRTIME.library.MediaTypeStringEnum.BLOCK+"_"+json.id;
AIRTIME.tabs.openPlaylistTab(json, uid);
redrawLib(); redrawLib();
}); });
}; };
mod.fileMdEdit = function(json) { mod.fileMdEdit = function(json, uid) {
AIRTIME.tabs.openFileMdEditorTab(json); AIRTIME.tabs.openFileMdEditorTab(json, uid);
}; };
mod.fnEdit = function(id, type, url) { mod.fnEdit = function(id, type, url) {
@ -1065,14 +1070,15 @@ var AIRTIME = (function(AIRTIME){
$.post(url, $.post(url,
{format: "json", id: id, type: type}, {format: "json", id: id, type: type},
function(json) { function(json) {
AIRTIME.tabs.openPlaylistTab(json); var uid = AIRTIME.library.MediaTypeFullToStringEnum.type+"_"+id;
AIRTIME.tabs.openPlaylistTab(json, uid);
redrawLib(); redrawLib();
}); });
}; };
mod.fnDelete = function(plid, tabId) { mod.fnDelete = function(plid, tab) {
var url, id, lastMod, type, pl = (tabId === undefined) ? $pl : $('#pl-tab-content-' + tabId); var url, id, lastMod, type, pl = tab.contents;
stopAudioPreview(); stopAudioPreview();
id = (plid === undefined) ? mod.getId(pl) : plid; id = (plid === undefined) ? mod.getId(pl) : plid;
@ -1083,7 +1089,7 @@ var AIRTIME = (function(AIRTIME){
$.post(url, $.post(url,
{format: "json", ids: id, modified: lastMod, type: type}, {format: "json", ids: id, modified: lastMod, type: type},
function(json) { function(json) {
AIRTIME.tabs.closeTab(tabId); tab.close();
redrawLib(); redrawLib();
}); });
}; };
@ -1100,7 +1106,8 @@ var AIRTIME = (function(AIRTIME){
$.post(url, $.post(url,
{format: "json", ids: id, modified: lastMod, type: type}, {format: "json", ids: id, modified: lastMod, type: type},
function(json){ function(json){
AIRTIME.tabs.openPlaylistTab(json); var uid = AIRTIME.library.MediaTypeStringEnum.WEBSTREAM+"_"+id;
AIRTIME.tabs.openPlaylistTab(json, uid);
redrawLib(); redrawLib();
}); });
}; };
@ -1120,10 +1127,6 @@ var AIRTIME = (function(AIRTIME){
}); });
}; };
mod.fnOpenPlaylist = function(json) {
AIRTIME.tabs.openPlaylistTab(json);
};
mod.enableUI = function() { mod.enableUI = function() {
$lib.unblock(); $lib.unblock();
$pl.unblock(); $pl.unblock();
@ -1151,7 +1154,8 @@ var AIRTIME = (function(AIRTIME){
mod.replaceForm = function(json){ mod.replaceForm = function(json){
$pl.find('.editor_pane_wrapper').html(json.html); $pl.find('.editor_pane_wrapper').html(json.html);
AIRTIME.tabs.openPlaylistTab(json); var uid = AIRTIME.library.MediaTypeStringEnum.BLOCK+"_"+json.id;
AIRTIME.tabs.openPlaylistTab(json, uid);
}; };

8
airtime_mvc/public/js/airtime/showbuilder/main_builder.js
View file

@ -141,7 +141,7 @@ AIRTIME = (function(AIRTIME) {
dashboardLink = $(".media_type_selector:first"), dashboardLink = $(".media_type_selector:first"),
t; t;
if (selected.parent().data("selection-id") == AIRTIME.library.MediaTypeEnum.PODCAST) { if (selected.parent().data("selection-id") == AIRTIME.library.MediaTypeIntegerEnum.PODCAST) {
$("#library_display_wrapper").hide(); $("#library_display_wrapper").hide();
$("#podcast_table_wrapper").show(); $("#podcast_table_wrapper").show();
t = AIRTIME.library.podcastDataTable; t = AIRTIME.library.podcastDataTable;
@ -187,12 +187,6 @@ AIRTIME = (function(AIRTIME) {
$builder = $("#show_builder"); $builder = $("#show_builder");
$fs = $builder.find('fieldset'); $fs = $builder.find('fieldset');
$("#schedule-tab").on("click", function() {
if (!$(this).hasClass('active')) {
AIRTIME.tabs.switchTab($("#show_builder .outer-datatable-wrapper"), $(this));
}
});
//Highlight the media type selector we're currently on. //Highlight the media type selector we're currently on.
highlightMediaTypeSelector(); highlightMediaTypeSelector();

257
airtime_mvc/public/js/airtime/showbuilder/tabs.js
View file

@ -1,9 +1,10 @@
var AIRTIME = (function(AIRTIME){ var AIRTIME = (function(AIRTIME){
var mod, var mod,
$tabCount = 0, $tabCount = 0,
$tabMap = {},
$openTabs = {}, $openTabs = {},
$activeTab, $activeTab,
$activeTabPane; $scheduleTab;
if (AIRTIME.tabs === undefined) { if (AIRTIME.tabs === undefined) {
AIRTIME.tabs = {}; AIRTIME.tabs = {};
@ -14,24 +15,26 @@ var AIRTIME = (function(AIRTIME){
Internal Functions Internal Functions
##################################################### */ ##################################################### */
function _buildNewTab(json) { var Tab = function(json, uid) {
var self = this;
AIRTIME.library.selectNone(); AIRTIME.library.selectNone();
var tabId = $openTabs[json.type + json.id]; var existingTab = $openTabs[uid];
if (tabId !== undefined) { if (existingTab) {
mod.switchTab($("#pl-tab-content-" + tabId), $("#pl-tab-" + tabId)); existingTab.switchTo();
return undefined; return existingTab;
} }
$tabCount++; self.id = ++$tabCount;
self.uid = uid;
var wrapper = "<div data-tab-type='" + json.type + "' data-tab-id='" + $tabCount + "' id='pl-tab-content-" + $tabCount + "' class='side_playlist pl-content'><div class='editor_pane_wrapper'></div></div>", var wrapper = "<div data-tab-type='" + json.type + "' data-tab-id='" + self.id + "' id='pl-tab-content-" + self.id + "' class='side_playlist pl-content'><div class='editor_pane_wrapper'></div></div>",
t = $("#show_builder").append(wrapper).find("#pl-tab-content-" + $tabCount), t = $("#show_builder").append(wrapper).find("#pl-tab-content-" + self.id),
pane = $(".editor_pane_wrapper:last"), pane = $(".editor_pane_wrapper:last").append(json.html),
name = json.type == "md" ? // file name = pane.find("#track_title").length > 0 ? pane.find("#track_title").val() + $.i18n._(" - Metadata Editor")
pane.append(json.html).find("#track_title").val() + $.i18n._(" - Metadata Editor") : pane.find(".playlist_name_display").val(),
: pane.append(json.html).find(".playlist_name_display").val(),
tab = tab =
"<li data-tab-id='" + $tabCount + "' data-tab-type='" + json.type + "' id='pl-tab-" + $tabCount + "' role='presentation' class='active'>" + "<li data-tab-id='" + self.id + "' data-tab-type='" + json.type + "' id='pl-tab-" + self.id + "' role='presentation' class='active'>" +
"<a href='javascript:void(0)'>" + "<a href='javascript:void(0)'>" +
"<span class='tab-name'>" + name + "</span>" + "<span class='tab-name'>" + name + "</span>" +
"<span href='#' class='lib_pl_close icon-remove'></span>" + "<span href='#' class='lib_pl_close icon-remove'></span>" +
@ -39,29 +42,110 @@ var AIRTIME = (function(AIRTIME){
"</li>", "</li>",
tabs = $(".nav.nav-tabs"); tabs = $(".nav.nav-tabs");
$openTabs[json.type + json.id] = $tabCount;
$(".nav.nav-tabs li").removeClass("active"); $(".nav.nav-tabs li").removeClass("active");
tabs.append(tab); tabs.append(tab);
var newTab = $("#pl-tab-" + $tabCount); var newTab = $("#pl-tab-" + self.id);
mod.switchTab(t, newTab);
return {wrapper: pane, tab: newTab, pane: t}; self.wrapper = pane;
self.contents = t;
self.tab = newTab;
$openTabs[uid] = self;
$tabMap[self.id] = uid;
self.switchTo();
return self;
};
Tab.prototype.switchTo = function() {
_switchTab(this.contents, this.tab);
};
Tab.prototype.close = function() {
var self = this;
var toPane = self.contents.next().length > 0 ? self.contents.next() : self.contents.prev(),
toTab = self.tab.next().length > 0 ? self.tab.next() : self.tab.prev();
delete $openTabs[self.uid]; // Remove this tab from the open tab array
delete $tabMap[self.id]; // Remove this tab from the internal tab mapping
// Remove the relevant DOM elements (the tab and its contents)
self.tab.remove();
self.contents.remove();
if (self.isActive()) { // Closing the current tab, otherwise we don't need to switch tabs
_switchTab(toPane, toTab);
} }
// If we close a tab that was causing tabs to wrap to the next row
// we need to resize to change the margin for the tab nav
AIRTIME.playlist.onResize();
};
Tab.prototype.isActive = function() {
return this.contents.get(0) == $activeTab.contents.get(0);
};
Tab.prototype.assignTabClickHandler = function(f) {
this.tab.unbind("click").on("click", f);
};
Tab.prototype.assignTabCloseClickHandler = function(f) {
this.tab.find(".lib_pl_close").unbind("click").click(f);
};
Tab.prototype._init = function() {
var self = this;
self.assignTabClickHandler(function() {
if (!$(this).hasClass('active')) {
self.switchTo();
}
});
self.assignTabCloseClickHandler(function(e) {
e.preventDefault();
e.stopPropagation();
$(this).unbind("click"); // Prevent repeated clicks in quick succession from closing multiple tabs
// We need to update the text on the add button
AIRTIME.library.checkAddButton();
// We also need to run the draw callback to update how dragged items are drawn
AIRTIME.library.fnDrawCallback();
self.close();
});
};
var ScheduleTab = function() {
var self = this, uid = 0,
tab = $("#schedule-tab"),
pane = $("#show_builder"),
contents = pane.find(".outer-datatable-wrapper");
self.id = 0;
tab.data("tab-id", self.id);
tab.on("click", function() {
if (!$(this).hasClass('active')) {
_switchTab(contents, $(this));
}
});
self.wrapper = pane;
self.contents = contents;
self.tab = tab;
$openTabs[uid] = self;
$tabMap[self.id] = uid;
};
ScheduleTab.prototype = Object.create(Tab.prototype);
ScheduleTab.prototype.constructor = ScheduleTab;
function _initFileMdEvents(newTab) { function _initFileMdEvents(newTab) {
newTab.tab.on("click", function() { newTab.contents.find(".md-cancel").on("click", function() {
if (!$(this).hasClass('active')) { newTab.close();
mod.switchTab(newTab.pane, newTab.tab);
}
}); });
newTab.wrapper.find(".md-cancel").on("click", function() { newTab.contents.find(".md-save").on("click", function() {
mod.closeTab();
});
newTab.wrapper.find(".md-save").on("click", function() {
var file_id = newTab.wrapper.find('#file_id').val(), var file_id = newTab.wrapper.find('#file_id').val(),
data = newTab.wrapper.find("#edit-md-dialog form").serializeArray(); data = newTab.wrapper.find("#edit-md-dialog form").serializeArray();
$.post(baseUrl+'library/edit-file-md', {format: "json", id: file_id, data: data}, function() { $.post(baseUrl+'library/edit-file-md', {format: "json", id: file_id, data: data}, function() {
@ -72,7 +156,7 @@ var AIRTIME = (function(AIRTIME){
} }
}); });
mod.closeTab(); newTab.close();
}); });
newTab.wrapper.find('#edit-md-dialog').on("keyup", function(event) { newTab.wrapper.find('#edit-md-dialog').on("keyup", function(event) {
@ -85,9 +169,9 @@ var AIRTIME = (function(AIRTIME){
} }
function _initPlaylistEvents(newTab) { function _initPlaylistEvents(newTab) {
newTab.tab.on("click", function() { newTab.assignTabClickHandler(function() {
if (!$(this).hasClass('active')) { if (!$(this).hasClass('active')) {
mod.switchTab(newTab.pane, newTab.tab); newTab.switchTo();
$.post(baseUrl+'playlist/edit', { $.post(baseUrl+'playlist/edit', {
format: "json", format: "json",
id: newTab.pane.find(".obj_id").val(), id: newTab.pane.find(".obj_id").val(),
@ -106,99 +190,75 @@ var AIRTIME = (function(AIRTIME){
AIRTIME.playlist.setFadeIcon(); AIRTIME.playlist.setFadeIcon();
} }
/* ##################################################### function _switchTab(tabPane, tab) {
External Functions $activeTab.contents.hide().removeClass("active-tab");
##################################################### */
mod.openFileMdEditorTab = function(json) {
mod.openTab(json, _initFileMdEvents);
};
mod.openPlaylistTab = function(json) {
mod.openTab(json, _initPlaylistEvents);
};
mod.openTab = function(json, callback) {
var newTab = _buildNewTab(json);
if (newTab === undefined) {
return;
}
callback(newTab);
};
mod.closeTab = function(id) {
var pane = id ? mod.get(id, true) : $activeTabPane,
tab = id ? mod.get(id) : $activeTab,
toPane = pane.next().length > 0 ? pane.next() : pane.prev(),
toTab = tab.next().length > 0 ? tab.next() : tab.prev(),
objId = pane.find(".obj_id").val(),
contents = id ? pane : $activeTabPane;
delete $openTabs[tab.data("tab-type") + objId]; // Remove the closed tab from our open tabs array
// Remove the relevant DOM elements (the tab and its contents)
tab.remove();
contents.remove();
if (pane.get(0) == $activeTabPane.get(0)) { // Closing the current tab, otherwise we don't need to switch tabs
mod.switchTab(toPane, toTab);
}
// If we close a tab that was causing tabs to wrap to the next row
// we need to resize to change the margin for the tab nav
AIRTIME.playlist.onResize();
};
mod.switchTab = function(tabPane, tab) {
$activeTabPane.hide().removeClass("active-tab");
tabPane.addClass("active-tab").show(); tabPane.addClass("active-tab").show();
$activeTab.removeClass("active"); $activeTab.tab.removeClass("active");
tab.addClass("active"); tab.addClass("active");
mod.updateActiveTab(); mod.updateActiveTab();
AIRTIME.playlist.onResize(); AIRTIME.playlist.onResize();
AIRTIME.library.fnRedraw(); AIRTIME.library.fnRedraw();
}
/* #####################################################
External Functions
##################################################### */
mod.init = function() {
$scheduleTab = new ScheduleTab();
};
mod.openFileMdEditorTab = function(json, uid) {
mod.openTab(json, uid, _initFileMdEvents);
};
mod.openPlaylistTab = function(json, uid) {
mod.openTab(json, uid, _initPlaylistEvents);
};
mod.openTab = function(json, uid, callback) {
var newTab = new Tab(json, uid);
newTab._init();
if (callback) callback(newTab);
};
mod.closeTab = function(id) {
$openTabs[$tabMap[id]].close();
}; };
mod.setActiveTabName = function(name) { mod.setActiveTabName = function(name) {
$activeTab.find(".tab-name").text(name); $activeTab.tab.find(".tab-name").text(name);
}; };
mod.updateActiveTab = function() { mod.updateActiveTab = function() {
$activeTabPane = $(".active-tab"); var t = $(".nav.nav-tabs .active");
$activeTab = $(".nav.nav-tabs .active"); $activeTab = mod.get(t.data("tab-id"));
if ($activeTabPane.hasClass("pl-content")) { if ($activeTab.contents.hasClass("pl-content")) {
mod.updatePlaylist(); mod.updatePlaylist();
} }
}; };
mod.updatePlaylist = function() { mod.updatePlaylist = function() {
AIRTIME.playlist.setCurrent($activeTabPane); AIRTIME.playlist.setCurrent($activeTab.contents);
$.post(baseUrl + "playlist/change-playlist", { $.post(baseUrl + "playlist/change-playlist", {
"id": AIRTIME.playlist.getId($activeTabPane), "id": AIRTIME.playlist.getId($activeTab.contents),
"type": $activeTabPane.find('.obj_type').val() "type": $activeTab.contents.find('.obj_type').val()
}); });
}; };
mod.getScheduleTab = function() {
return $scheduleTab;
};
mod.getActiveTab = function() { mod.getActiveTab = function() {
return $activeTabPane; return $activeTab;
}; };
mod.get = function(id, getContents) { mod.get = function(id) {
var allTabs = getContents ? $(".pl-content") : $(".nav.nav-tabs li"); return $openTabs[$tabMap[id]];
if (id) {
var t = null;
allTabs.each(function() {
if ($(this).data("tab-id") == id) {
t = $(this);
return false; // Break out of the loop
}
});
return t;
}
return allTabs;
}; };
return AIRTIME; return AIRTIME;
@ -207,4 +267,5 @@ var AIRTIME = (function(AIRTIME){
$(document).ready(function() { $(document).ready(function() {
$("#show_builder").textScroll(".tab-name"); $("#show_builder").textScroll(".tab-name");
AIRTIME.tabs.init();
}); });