SAAS-1165 - initial work on left-hand pane for podcast episodes
This commit is contained in:
parent
b4ec3eeb3f
commit
e7869b54c7
|
@ -16,6 +16,7 @@
|
||||||
<div class="outer-datatable-wrapper">
|
<div class="outer-datatable-wrapper">
|
||||||
<table id="library_display" cellpadding="0" cellspacing="0" class="datatable"></table>
|
<table id="library_display" cellpadding="0" cellspacing="0" class="datatable"></table>
|
||||||
<table id="podcast_table" cellpadding="0" cellspacing="0" class="datatable"></table>
|
<table id="podcast_table" cellpadding="0" cellspacing="0" class="datatable"></table>
|
||||||
|
<table id="podcast_episodes_table" cellpadding="0" cellspacing="0" class="datatable"></table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -8,7 +8,8 @@ var AIRTIME = (function(AIRTIME) {
|
||||||
chosenItems = {},
|
chosenItems = {},
|
||||||
visibleChosenItems = {},
|
visibleChosenItems = {},
|
||||||
$previouslySelected,
|
$previouslySelected,
|
||||||
flagForDeselection = false;
|
flagForDeselection = false,
|
||||||
|
$datatables = {};
|
||||||
|
|
||||||
|
|
||||||
// we need to know whether the criteria value is string or
|
// we need to know whether the criteria value is string or
|
||||||
|
@ -87,6 +88,13 @@ var AIRTIME = (function(AIRTIME) {
|
||||||
"stream": "ws"
|
"stream": "ws"
|
||||||
});
|
});
|
||||||
|
|
||||||
|
mod.DataTableTypeEnum = Object.freeze({
|
||||||
|
//FILE: "au",
|
||||||
|
LIBRARY : "library",
|
||||||
|
PODCAST : "podcast",
|
||||||
|
PODCAST_EPISODES: "podcastEpisodes"
|
||||||
|
});
|
||||||
|
|
||||||
// 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) {
|
||||||
|
@ -744,7 +752,7 @@ var AIRTIME = (function(AIRTIME) {
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
$datatables[mod.DataTableTypeEnum.LIBRARY] = mod.libraryDataTable;
|
||||||
|
|
||||||
/* ############################################
|
/* ############################################
|
||||||
END DATATABLES
|
END DATATABLES
|
||||||
|
@ -864,7 +872,14 @@ var AIRTIME = (function(AIRTIME) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
AIRTIME.library.setCurrentTable();
|
var selected = $("a[href$='"+location.hash+"']"), table;
|
||||||
|
if (selected.parent().data("selection-id") == AIRTIME.library.MediaTypeIntegerEnum.PODCAST) {
|
||||||
|
table = mod.DataTableTypeEnum.PODCAST;
|
||||||
|
} else {
|
||||||
|
table = mod.DataTableTypeEnum.LIBRARY;
|
||||||
|
}
|
||||||
|
|
||||||
|
AIRTIME.library.setCurrentTable(table);
|
||||||
setColumnFilter(oTable);
|
setColumnFilter(oTable);
|
||||||
oTable.fnSetFilteringDelay(350);
|
oTable.fnSetFilteringDelay(350);
|
||||||
|
|
||||||
|
@ -1230,20 +1245,20 @@ var AIRTIME = (function(AIRTIME) {
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
mod.setCurrentTable = function() {
|
mod.setCurrentTable = function (table) {
|
||||||
var selected = $("a[href$='"+location.hash+"']");
|
var dt = $datatables[table],
|
||||||
if (selected.parent().data("selection-id") == AIRTIME.library.MediaTypeIntegerEnum.PODCAST) {
|
wrapper = $(dt).closest(".dataTables_wrapper");
|
||||||
$("#library_display_wrapper").hide();
|
$("#library_content").find(".dataTables_wrapper").hide();
|
||||||
$('#podcast_table_wrapper').show();
|
wrapper.show();
|
||||||
oTable = mod.podcastDataTable;
|
oTable = dt;
|
||||||
} else {
|
oTable.fnDraw();
|
||||||
$('#podcast_table_wrapper').hide();
|
|
||||||
$("#library_display_wrapper").show();
|
|
||||||
oTable = mod.libraryDataTable;
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
/** Create the podcast datatable widget */
|
/**
|
||||||
|
* Create the podcast datatable widget
|
||||||
|
*
|
||||||
|
* XXX: should this be moved to podcast.js
|
||||||
|
*/
|
||||||
mod.initPodcastDatatable = function()
|
mod.initPodcastDatatable = function()
|
||||||
{
|
{
|
||||||
var aoColumns = [
|
var aoColumns = [
|
||||||
|
@ -1286,9 +1301,59 @@ var AIRTIME = (function(AIRTIME) {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
mod._initPodcastEpisodeDatatable();
|
||||||
|
mod.podcastTableWidget.assignDblClickHandler(function () {
|
||||||
|
var podcast = mod.podcastDataTable.fnGetData($(this).index());
|
||||||
|
mod.podcastEpisodeTableWidget.reload(podcast.id);
|
||||||
|
mod.setCurrentTable(mod.DataTableTypeEnum.PODCAST_EPISODES);
|
||||||
|
});
|
||||||
|
|
||||||
mod.podcastDataTable = mod.podcastTableWidget.getDatatable();
|
mod.podcastDataTable = mod.podcastTableWidget.getDatatable();
|
||||||
|
$datatables[mod.DataTableTypeEnum.PODCAST] = mod.podcastDataTable;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Initialize the podcast episode view for the left-hand pane
|
||||||
|
*
|
||||||
|
* @private
|
||||||
|
*/
|
||||||
|
mod._initPodcastEpisodeDatatable = function () {
|
||||||
|
var buttons = {
|
||||||
|
addToScheduleBtn: {
|
||||||
|
// TODO: compatibility with checkAddButton function
|
||||||
|
title : $.i18n._('Add to Schedule'),
|
||||||
|
iconClass : '',
|
||||||
|
extraBtnClass : 'btn-small',
|
||||||
|
elementId : '',
|
||||||
|
eventHandlers : {
|
||||||
|
click: function (e) {
|
||||||
|
console.log(mod.podcastEpisodeDataTable.fnGetData($(this).index()));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
mod.podcastEpisodeTableWidget = AIRTIME.podcast.initPodcastEpisodeDatatable(
|
||||||
|
$("#podcast_episodes_table"),
|
||||||
|
{
|
||||||
|
bServerSide : false,
|
||||||
|
sAjaxSource : null,
|
||||||
|
// Initialize the table with empty data so we can defer loading
|
||||||
|
// If we load sequentially there's a delay before the table appears
|
||||||
|
aaData : {},
|
||||||
|
aoColumns : [
|
||||||
|
/* GUID */ { "sTitle" : "" , "mDataProp" : "guid" , "sClass" : "podcast_episodes_guid" , "bVisible" : false },
|
||||||
|
/* Title */ { "sTitle" : $.i18n._("Title") , "mDataProp" : "title" , "sClass" : "podcast_episodes_title" , "sWidth" : "170px" },
|
||||||
|
/* Author */ { "sTitle" : $.i18n._("Author") , "mDataProp" : "author" , "sClass" : "podcast_episodes_author" , "sWidth" : "170px" },
|
||||||
|
/* Description */ { "sTitle" : $.i18n._("Description") , "mDataProp" : "description" , "sClass" : "podcast_episodes_description" , "sWidth" : "300px" },
|
||||||
|
/* Link */ { "sTitle" : $.i18n._("Link") , "mDataProp" : "link" , "sClass" : "podcast_episodes_link" , "sWidth" : "170px" },
|
||||||
|
/* Publication Date */ { "sTitle" : $.i18n._("Publication Date") , "mDataProp" : "pub_date" , "sClass" : "podcast_episodes_pub_date" , "sWidth" : "170px" }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
buttons
|
||||||
|
);
|
||||||
|
|
||||||
|
mod.podcastEpisodeDataTable = $datatables[mod.DataTableTypeEnum.PODCAST_EPISODES] = mod.podcastEpisodeTableWidget.getDatatable();
|
||||||
|
};
|
||||||
|
|
||||||
mod.libraryInit = libraryInit;
|
mod.libraryInit = libraryInit;
|
||||||
|
|
||||||
|
|
|
@ -122,8 +122,12 @@ var AIRTIME = (function (AIRTIME) {
|
||||||
/* Publication Date */ { "sTitle" : $.i18n._("Publication Date") , "mDataProp" : "pub_date" , "sClass" : "podcast_episodes_pub_date" , "sWidth" : "170px" }
|
/* Publication Date */ { "sTitle" : $.i18n._("Publication Date") , "mDataProp" : "pub_date" , "sClass" : "podcast_episodes_pub_date" , "sWidth" : "170px" }
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
buttons = {};
|
buttons = { slideToggle: {} };
|
||||||
self.episodeTable = AIRTIME.podcast.initPodcastEpisodeDatatable($scope.podcast, $scope.tab, params, buttons);
|
self.episodeTable = AIRTIME.podcast.initPodcastEpisodeDatatable(
|
||||||
|
$scope.tab.contents.find('.podcast_episodes'),
|
||||||
|
params,
|
||||||
|
buttons
|
||||||
|
);
|
||||||
self.reloadEpisodeTable();
|
self.reloadEpisodeTable();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -172,7 +176,6 @@ var AIRTIME = (function (AIRTIME) {
|
||||||
$stationPodcastTab = undefined;
|
$stationPodcastTab = undefined;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* For the station podcast.
|
* For the station podcast.
|
||||||
*
|
*
|
||||||
|
@ -239,8 +242,8 @@ var AIRTIME = (function (AIRTIME) {
|
||||||
self.deleteSelectedEpisodes();
|
self.deleteSelectedEpisodes();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
|
slideToggle: {}
|
||||||
},
|
},
|
||||||
params = {
|
params = {
|
||||||
sAjaxSource : endpoint + $scope.podcast.id + '/episodes',
|
sAjaxSource : endpoint + $scope.podcast.id + '/episodes',
|
||||||
|
@ -251,7 +254,11 @@ var AIRTIME = (function (AIRTIME) {
|
||||||
]
|
]
|
||||||
};
|
};
|
||||||
|
|
||||||
this.episodeTable = AIRTIME.podcast.initPodcastEpisodeDatatable($scope.podcast, $scope.tab, params, buttons);
|
this.episodeTable = AIRTIME.podcast.initPodcastEpisodeDatatable(
|
||||||
|
$scope.tab.contents.find('.podcast_episodes'),
|
||||||
|
params,
|
||||||
|
buttons
|
||||||
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -441,23 +448,23 @@ var AIRTIME = (function (AIRTIME) {
|
||||||
*
|
*
|
||||||
* Selection for the internal table represents episodes marked for ingest and is disabled for ingested episodes.
|
* Selection for the internal table represents episodes marked for ingest and is disabled for ingested episodes.
|
||||||
*
|
*
|
||||||
* @param {Object} podcast the podcast data JSON object.
|
* @param {Object} domNode the jQuery DOM node to create the table inside.
|
||||||
* @param {Tab} tab Tab object the podcast will be opened in
|
|
||||||
* @param {Object} params JSON object containing datatables parameters to override
|
* @param {Object} params JSON object containing datatables parameters to override
|
||||||
* @param {Object} buttons JSON object containing datatables button parameters
|
* @param {Object} buttons JSON object containing datatables button parameters
|
||||||
*
|
*
|
||||||
* @returns {*} the created Table object
|
* @returns {*} the created Table object
|
||||||
*/
|
*/
|
||||||
mod.initPodcastEpisodeDatatable = function(podcast, tab, params, buttons) {
|
mod.initPodcastEpisodeDatatable = function(domNode, params, buttons) {
|
||||||
buttons = $.extend({
|
if ('slideToggle' in buttons)
|
||||||
slideToggle: {
|
buttons = $.extend(true, {
|
||||||
title : '',
|
slideToggle: {
|
||||||
iconClass : 'spl-no-r-margin icon-chevron-up',
|
title : '',
|
||||||
extraBtnClass : 'toggle-editor-form',
|
iconClass : 'spl-no-r-margin icon-chevron-up',
|
||||||
elementId : '',
|
extraBtnClass : 'toggle-editor-form',
|
||||||
eventHandlers : {}
|
elementId : '',
|
||||||
}
|
eventHandlers : {}
|
||||||
}, buttons);
|
}
|
||||||
|
}, buttons);
|
||||||
params = $.extend(params,
|
params = $.extend(params,
|
||||||
{
|
{
|
||||||
oColVis: {
|
oColVis: {
|
||||||
|
@ -476,12 +483,11 @@ var AIRTIME = (function (AIRTIME) {
|
||||||
_initPodcastTable();
|
_initPodcastTable();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Set up the div with id "podcast_table" as a datatable.
|
|
||||||
var podcastEpisodesTableWidget = new PodcastTable(
|
var podcastEpisodesTableWidget = new PodcastTable(
|
||||||
tab.contents.find('.podcast_episodes'), // DOM node to create the table inside.
|
domNode, // DOM node to create the table inside.
|
||||||
true, // Enable item selection
|
true, // Enable item selection
|
||||||
buttons, // Toolbar buttons
|
buttons, // Toolbar buttons
|
||||||
params // Datatables overrides.
|
params // Datatables overrides.
|
||||||
);
|
);
|
||||||
|
|
||||||
podcastEpisodesTableWidget.getDatatable().addTitles("td");
|
podcastEpisodesTableWidget.getDatatable().addTitles("td");
|
||||||
|
|
|
@ -140,27 +140,21 @@ AIRTIME = (function(AIRTIME) {
|
||||||
$(window).on('hashchange', function() {
|
$(window).on('hashchange', function() {
|
||||||
var selected = $("a[href$='"+location.hash+"']"),
|
var selected = $("a[href$='"+location.hash+"']"),
|
||||||
dashboardLink = $(".media_type_selector:first"),
|
dashboardLink = $(".media_type_selector:first"),
|
||||||
t;
|
tableType;
|
||||||
|
|
||||||
if (selected.parent().data("selection-id") == AIRTIME.library.MediaTypeIntegerEnum.PODCAST) {
|
if (selected.parent().data("selection-id") == AIRTIME.library.MediaTypeIntegerEnum.PODCAST) {
|
||||||
$("#library_display_wrapper").hide();
|
tableType = AIRTIME.library.DataTableTypeEnum.PODCAST;
|
||||||
$("#podcast_table_wrapper").show();
|
|
||||||
t = AIRTIME.library.podcastDataTable;
|
|
||||||
} else {
|
} else {
|
||||||
$("#library_display_wrapper").show();
|
tableType = AIRTIME.library.DataTableTypeEnum.LIBRARY;
|
||||||
$("#podcast_table_wrapper").hide();
|
|
||||||
t = AIRTIME.library.libraryDataTable;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
AIRTIME.library.setCurrentTable();
|
|
||||||
|
|
||||||
dashboardLink.find("a").attr("href", selected.attr("href"));
|
dashboardLink.find("a").attr("href", selected.attr("href"));
|
||||||
AIRTIME.library.selectNone();
|
AIRTIME.library.selectNone();
|
||||||
$(".media_type_selector").each(function () {
|
$(".media_type_selector").each(function () {
|
||||||
$(this).removeClass("selected");
|
$(this).removeClass("selected");
|
||||||
});
|
});
|
||||||
selected.parent().addClass("selected");
|
selected.parent().addClass("selected");
|
||||||
t.fnDraw();
|
AIRTIME.library.setCurrentTable(tableType);
|
||||||
$("#library_filter").text(selected.text());
|
$("#library_filter").text(selected.text());
|
||||||
// Highlight the dashboard link
|
// Highlight the dashboard link
|
||||||
dashboardLink.addClass("highlight");
|
dashboardLink.addClass("highlight");
|
||||||
|
|
|
@ -94,6 +94,10 @@ var AIRTIME = (function(AIRTIME) {
|
||||||
return self;
|
return self;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
Table.prototype.assignDblClickHandler = function(fn) {
|
||||||
|
$(this._datatable, 'tbody tr').on('dblclick', this._SELECTORS.SELECTION_TABLE_ROW, fn);
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
/* Set up global event handlers for the datatable.
|
/* Set up global event handlers for the datatable.
|
||||||
* @param bItemSelection Whether or not row selection behaviour should be enabled for this widget.
|
* @param bItemSelection Whether or not row selection behaviour should be enabled for this widget.
|
||||||
|
|
Loading…
Reference in New Issue