UI Cleanup - Updated Episode subtree.

pull/4/head
Taloth Saldono 9 years ago
parent 7b7f199587
commit fb7988edb8

@ -4,18 +4,28 @@ var Marionette = require('marionette');
var NzbDroneCell = require('../../Cells/NzbDroneCell');
module.exports = NzbDroneCell.extend({
className : 'episode-actions-cell',
events : {"click .x-failed" : '_markAsFailed'},
render : function(){
className : 'episode-actions-cell',
events : {
'click .x-failed' : '_markAsFailed'
},
render : function() {
this.$el.empty();
if(this.model.get('eventType') === 'grabbed') {
if (this.model.get('eventType') === 'grabbed') {
this.$el.html('<i class="icon-nd-delete x-failed" title="Mark download as failed"></i>');
}
return this;
},
_markAsFailed : function(){
_markAsFailed : function() {
var url = window.NzbDrone.ApiRoot + '/history/failed';
var data = {id : this.model.get('id')};
var data = {
id : this.model.get('id')
};
$.ajax({
url : url,
type : 'POST',

@ -7,10 +7,13 @@ require('bootstrap');
module.exports = NzbDroneCell.extend({
className : 'episode-activity-details-cell',
render : function(){
render : function() {
this.$el.empty();
this.$el.html('<i class="icon-info-sign"></i>');
var html = new HistoryDetailsView({model : this.model}).render().$el;
var html = new HistoryDetailsView({ model : this.model }).render().$el;
this.$el.popover({
content : html,
html : true,
@ -19,6 +22,7 @@ module.exports = NzbDroneCell.extend({
placement : 'left',
container : this.$el
});
return this;
}
});

@ -10,39 +10,52 @@ var NoActivityView = require('./NoActivityView');
var LoadingView = require('../../Shared/LoadingView');
module.exports = Marionette.Layout.extend({
template : 'Episode/Activity/EpisodeActivityLayoutTemplate',
regions : {activityTable : '.activity-table'},
columns : [{
name : 'eventType',
label : '',
cell : EventTypeCell,
cellValue : 'this'
}, {
name : 'sourceTitle',
label : 'Source Title',
cell : 'string'
}, {
name : 'quality',
label : 'Quality',
cell : QualityCell
}, {
name : 'date',
label : 'Date',
cell : RelativeDateCell
}, {
name : 'this',
label : '',
cell : EpisodeActivityDetailsCell,
sortable : false
}, {
name : 'this',
label : '',
cell : EpisodeActivityActionsCell,
sortable : false
}],
initialize : function(options){
template : 'Episode/Activity/EpisodeActivityLayoutTemplate',
regions : {
activityTable : '.activity-table'
},
columns : [
{
name : 'eventType',
label : '',
cell : EventTypeCell,
cellValue : 'this'
},
{
name : 'sourceTitle',
label : 'Source Title',
cell : 'string'
},
{
name : 'quality',
label : 'Quality',
cell : QualityCell
},
{
name : 'date',
label : 'Date',
cell : RelativeDateCell
},
{
name : 'this',
label : '',
cell : EpisodeActivityDetailsCell,
sortable : false
},
{
name : 'this',
label : '',
cell : EpisodeActivityActionsCell,
sortable : false
}
],
initialize : function(options) {
this.model = options.model;
this.series = options.series;
this.collection = new HistoryCollection({
episodeId : this.model.id,
tableName : 'episodeActivity'
@ -50,17 +63,20 @@ module.exports = Marionette.Layout.extend({
this.collection.fetch();
this.listenTo(this.collection, 'sync', this._showTable);
},
onRender : function(){
onRender : function() {
this.activityTable.show(new LoadingView());
},
_showTable : function(){
if(this.collection.any()) {
_showTable : function() {
if (this.collection.any()) {
this.activityTable.show(new Backgrid.Grid({
collection : this.collection,
columns : this.columns,
className : 'table table-hover table-condensed'
}));
}
else {
this.activityTable.show(new NoActivityView());
}

@ -1,3 +1,5 @@
var Marionette = require('marionette');
module.exports = Marionette.ItemView.extend({template : 'Episode/Activity/NoActivityViewTemplate'});
module.exports = Marionette.ItemView.extend({
template : 'Episode/Activity/NoActivityViewTemplate'
});

@ -6,97 +6,123 @@ var SeriesCollection = require('../Series/SeriesCollection');
var Messenger = require('../Shared/Messenger');
module.exports = Marionette.Layout.extend({
className : 'modal-lg',
template : 'Episode/EpisodeDetailsLayoutTemplate',
regions : {
className : 'modal-lg',
template : 'Episode/EpisodeDetailsLayoutTemplate',
regions : {
summary : '#episode-summary',
activity : '#episode-activity',
search : '#episode-search'
},
ui : {
ui : {
summary : '.x-episode-summary',
activity : '.x-episode-activity',
search : '.x-episode-search',
monitored : '.x-episode-monitored'
},
events : {
"click .x-episode-summary" : '_showSummary',
"click .x-episode-activity" : '_showActivity',
"click .x-episode-search" : '_showSearch',
"click .x-episode-monitored" : '_toggleMonitored'
events : {
'click .x-episode-summary' : '_showSummary',
'click .x-episode-activity' : '_showActivity',
'click .x-episode-search' : '_showSearch',
'click .x-episode-monitored' : '_toggleMonitored'
},
templateHelpers : {},
initialize : function(options){
templateHelpers : {},
initialize : function(options) {
this.templateHelpers.hideSeriesLink = options.hideSeriesLink;
this.series = SeriesCollection.get(this.model.get('seriesId'));
this.templateHelpers.series = this.series.toJSON();
this.openingTab = options.openingTab || 'summary';
this.listenTo(this.model, 'sync', this._setMonitoredState);
},
onShow : function(){
this.searchLayout = new SearchLayout({model : this.model});
if(this.openingTab === 'search') {
onShow : function() {
this.searchLayout = new SearchLayout({ model : this.model });
if (this.openingTab === 'search') {
this.searchLayout.startManualSearch = true;
this._showSearch();
}
else {
this._showSummary();
}
this._setMonitoredState();
if(this.series.get('monitored')) {
if (this.series.get('monitored')) {
this.$el.removeClass('series-not-monitored');
}
else {
this.$el.addClass('series-not-monitored');
}
},
_showSummary : function(e){
if(e) {
_showSummary : function(e) {
if (e) {
e.preventDefault();
}
this.ui.summary.tab('show');
this.summary.show(new SummaryLayout({
model : this.model,
series : this.series
}));
},
_showActivity : function(e){
if(e) {
_showActivity : function(e) {
if (e) {
e.preventDefault();
}
this.ui.activity.tab('show');
this.activity.show(new EpisodeActivityLayout({
model : this.model,
series : this.series
}));
},
_showSearch : function(e){
if(e) {
_showSearch : function(e) {
if (e) {
e.preventDefault();
}
this.ui.search.tab('show');
this.search.show(this.searchLayout);
},
_toggleMonitored : function(){
if(!this.series.get('monitored')) {
_toggleMonitored : function() {
if (!this.series.get('monitored')) {
Messenger.show({
message : 'Unable to change monitored state when series is not monitored',
type : 'error'
});
return;
}
var name = 'monitored';
this.model.set(name, !this.model.get(name), {silent : true});
this.model.set(name, !this.model.get(name), { silent : true });
this.ui.monitored.addClass('icon-spinner icon-spin');
this.model.save();
},
_setMonitoredState : function(){
_setMonitoredState : function() {
this.ui.monitored.removeClass('icon-spin icon-spinner');
if(this.model.get('monitored')) {
if (this.model.get('monitored')) {
this.ui.monitored.addClass('icon-bookmark');
this.ui.monitored.removeClass('icon-bookmark-empty');
}
else {
} else {
this.ui.monitored.addClass('icon-bookmark-empty');
this.ui.monitored.removeClass('icon-bookmark');
}

@ -1,3 +1,5 @@
var Marionette = require('marionette');
module.exports = Marionette.ItemView.extend({template : 'Episode/Search/ButtonsViewTemplate'});
module.exports = Marionette.ItemView.extend({
template : 'Episode/Search/ButtonsViewTemplate'
});

@ -9,55 +9,75 @@ var LoadingView = require('../../Shared/LoadingView');
var NoResultsView = require('./NoResultsView');
module.exports = Marionette.Layout.extend({
template : 'Episode/Search/EpisodeSearchLayoutTemplate',
regions : {main : '#episode-search-region'},
events : {
"click .x-search-auto" : '_searchAuto',
"click .x-search-manual" : '_searchManual',
"click .x-search-back" : '_showButtons'
},
initialize : function(){
template : 'Episode/Search/EpisodeSearchLayoutTemplate',
regions : {
main : '#episode-search-region'
},
events : {
'click .x-search-auto' : '_searchAuto',
'click .x-search-manual' : '_searchManual',
'click .x-search-back' : '_showButtons'
},
initialize : function() {
this.mainView = new ButtonsView();
this.releaseCollection = new ReleaseCollection();
this.listenTo(this.releaseCollection, 'sync', this._showSearchResults);
},
onShow : function(){
if(this.startManualSearch) {
onShow : function() {
if (this.startManualSearch) {
this._searchManual();
}
else {
this._showMainView();
}
},
_searchAuto : function(e){
if(e) {
_searchAuto : function(e) {
if (e) {
e.preventDefault();
}
CommandController.Execute('episodeSearch', {episodeIds : [this.model.get('id')]});
CommandController.Execute('episodeSearch', {
episodeIds : [this.model.get('id')]
});
vent.trigger(vent.Commands.CloseModalCommand);
},
_searchManual : function(e){
if(e) {
_searchManual : function(e) {
if (e) {
e.preventDefault();
}
this.mainView = new LoadingView();
this._showMainView();
this.releaseCollection.fetchEpisodeReleases(this.model.id);
},
_showMainView : function(){
_showMainView : function() {
this.main.show(this.mainView);
},
_showButtons : function(){
_showButtons : function() {
this.mainView = new ButtonsView();
this._showMainView();
},
_showSearchResults : function(){
if(this.releaseCollection.length === 0) {
_showSearchResults : function() {
if (this.releaseCollection.length === 0) {
this.mainView = new NoResultsView();
}
else {
this.mainView = new ManualSearchLayout({collection : this.releaseCollection});
this.mainView = new ManualSearchLayout({ collection : this.releaseCollection });
}
this._showMainView();
}
});

@ -11,48 +11,63 @@ var PeersCell = require('../../Release/PeersCell');
module.exports = Marionette.Layout.extend({
template : 'Episode/Search/ManualLayoutTemplate',
regions : {grid : '#episode-release-grid'},
columns : [{
name : 'protocol',
label : 'Source',
cell : ProtocolCell
}, {
name : 'age',
label : 'Age',
cell : AgeCell
}, {
name : 'title',
label : 'Title',
cell : ReleaseTitleCell
}, {
name : 'indexer',
label : 'Indexer',
cell : Backgrid.StringCell
}, {
name : 'size',
label : 'Size',
cell : FileSizeCell
}, {
name : 'seeders',
label : 'Peers',
cell : PeersCell
}, {
name : 'quality',
label : 'Quality',
cell : QualityCell
}, {
name : 'rejections',
label : '',
cell : ApprovalStatusCell,
sortable : false
}, {
name : 'download',
label : '',
cell : DownloadReportCell,
sortable : true
}],
onShow : function(){
if(!this.isClosed) {
regions : {
grid : '#episode-release-grid'
},
columns : [
{
name : 'protocol',
label : 'Source',
cell : ProtocolCell
},
{
name : 'age',
label : 'Age',
cell : AgeCell
},
{
name : 'title',
label : 'Title',
cell : ReleaseTitleCell
},
{
name : 'indexer',
label : 'Indexer',
cell : Backgrid.StringCell
},
{
name : 'size',
label : 'Size',
cell : FileSizeCell
},
{
name : 'seeders',
label : 'Peers',
cell : PeersCell
},
{
name : 'quality',
label : 'Quality',
cell : QualityCell
},
{
name : 'rejections',
label : '',
cell : ApprovalStatusCell,
sortable : false
},
{
name : 'download',
label : '',
cell : DownloadReportCell,
sortable : true
}
],
onShow : function() {
if (!this.isClosed) {
this.grid.show(new Backgrid.Grid({
row : Backgrid.Row,
columns : this.columns,

@ -1,3 +1,5 @@
var Marionette = require('marionette');
module.exports = Marionette.ItemView.extend({template : 'Episode/Search/NoResultsViewTemplate'});
module.exports = Marionette.ItemView.extend({
template : 'Episode/Search/NoResultsViewTemplate'
});

@ -10,66 +10,84 @@ var NoFileView = require('./NoFileView');
var LoadingView = require('../../Shared/LoadingView');
module.exports = Marionette.Layout.extend({
template : 'Episode/Summary/EpisodeSummaryLayoutTemplate',
regions : {
template : 'Episode/Summary/EpisodeSummaryLayoutTemplate',
regions : {
overview : '.episode-overview',
activity : '.episode-file-info'
},
columns : [{
name : 'path',
label : 'Path',
cell : 'string',
sortable : false
}, {
name : 'size',
label : 'Size',
cell : FileSizeCell,
sortable : false
}, {
name : 'quality',
label : 'Quality',
cell : QualityCell,
sortable : false,
editable : true
}, {
name : 'this',
label : '',
cell : DeleteEpisodeFileCell,
sortable : false
}],
templateHelpers : {},
initialize : function(options){
if(!this.model.series) {
columns : [
{
name : 'path',
label : 'Path',
cell : 'string',
sortable : false
},
{
name : 'size',
label : 'Size',
cell : FileSizeCell,
sortable : false
},
{
name : 'quality',
label : 'Quality',
cell : QualityCell,
sortable : false,
editable : true
},
{
name : 'this',
label : '',
cell : DeleteEpisodeFileCell,
sortable : false
}
],
templateHelpers : {},
initialize : function(options) {
if (!this.model.series) {
this.templateHelpers.series = options.series.toJSON();
}
},
onShow : function(){
if(this.model.get('hasFile')) {
onShow : function() {
if (this.model.get('hasFile')) {
var episodeFileId = this.model.get('episodeFileId');
if(reqres.hasHandler(reqres.Requests.GetEpisodeFileById)) {
if (reqres.hasHandler(reqres.Requests.GetEpisodeFileById)) {
var episodeFile = reqres.request(reqres.Requests.GetEpisodeFileById, episodeFileId);
this.episodeFileCollection = new EpisodeFileCollection(episodeFile, {seriesId : this.model.get('seriesId')});
this.episodeFileCollection = new EpisodeFileCollection(episodeFile, { seriesId : this.model.get('seriesId') });
this.listenTo(episodeFile, 'destroy', this._episodeFileDeleted);
this._showTable();
}
else {
this.activity.show(new LoadingView());
var self = this;
var newEpisodeFile = new EpisodeFileModel({id : episodeFileId});
this.episodeFileCollection = new EpisodeFileCollection(newEpisodeFile, {seriesId : this.model.get('seriesId')});
var newEpisodeFile = new EpisodeFileModel({ id : episodeFileId });
this.episodeFileCollection = new EpisodeFileCollection(newEpisodeFile, { seriesId : this.model.get('seriesId') });
var promise = newEpisodeFile.fetch();
this.listenTo(newEpisodeFile, 'destroy', this._episodeFileDeleted);
promise.done(function(){
promise.done(function() {
self._showTable();
});
}
this.listenTo(this.episodeFileCollection, 'add remove', this._collectionChanged);
}
else {
this._showNoFileView();
}
},
_showTable : function(){
_showTable : function() {
this.activity.show(new Backgrid.Grid({
collection : this.episodeFileCollection,
columns : this.columns,
@ -77,18 +95,22 @@ module.exports = Marionette.Layout.extend({
emptyText : 'Nothing to see here!'
}));
},
_showNoFileView : function(){
_showNoFileView : function() {
this.activity.show(new NoFileView());
},
_collectionChanged : function(){
if(!this.episodeFileCollection.any()) {
_collectionChanged : function() {
if (!this.episodeFileCollection.any()) {
this._showNoFileView();
}
else {
this._showTable();
}
},
_episodeFileDeleted : function(){
_episodeFileDeleted : function() {
this.model.set({
episodeFileId : 0,
hasFile : false

@ -1,3 +1,5 @@
var Marionette = require('marionette');
module.exports = Marionette.ItemView.extend({template : 'Episode/Summary/NoFileViewTemplate'});
module.exports = Marionette.ItemView.extend({
template : 'Episode/Summary/NoFileViewTemplate'
});
Loading…
Cancel
Save