mirror of
https://github.com/Sonarr/Sonarr.git
synced 2024-12-16 11:37:58 +02:00
UI Cleanup - Updated Rename and SeasonPass subtrees.
This commit is contained in:
parent
860f55996c
commit
1bf433872a
@ -2,26 +2,33 @@ var Backbone = require('backbone');
|
||||
var RenamePreviewModel = require('./RenamePreviewModel');
|
||||
|
||||
module.exports = Backbone.Collection.extend({
|
||||
url : window.NzbDrone.ApiRoot + '/rename',
|
||||
model : RenamePreviewModel,
|
||||
url : window.NzbDrone.ApiRoot + '/rename',
|
||||
model : RenamePreviewModel,
|
||||
|
||||
originalFetch : Backbone.Collection.prototype.fetch,
|
||||
initialize : function(options){
|
||||
if(!options.seriesId) {
|
||||
|
||||
initialize : function(options) {
|
||||
if (!options.seriesId) {
|
||||
throw 'seriesId is required';
|
||||
}
|
||||
|
||||
this.seriesId = options.seriesId;
|
||||
this.seasonNumber = options.seasonNumber;
|
||||
},
|
||||
fetch : function(options){
|
||||
if(!this.seriesId) {
|
||||
|
||||
fetch : function(options) {
|
||||
if (!this.seriesId) {
|
||||
throw 'seriesId is required';
|
||||
}
|
||||
|
||||
options = options || {};
|
||||
options.data = {};
|
||||
options.data.seriesId = this.seriesId;
|
||||
if(this.seasonNumber) {
|
||||
|
||||
if (this.seasonNumber) {
|
||||
options.data.seasonNumber = this.seasonNumber;
|
||||
}
|
||||
|
||||
return this.originalFetch.call(this, options);
|
||||
}
|
||||
});
|
@ -1,4 +1,6 @@
|
||||
var Marionette = require('marionette');
|
||||
var RenamePreviewItemView = require('./RenamePreviewItemView');
|
||||
|
||||
module.exports = Marionette.CollectionView.extend({itemView : RenamePreviewItemView});
|
||||
module.exports = Marionette.CollectionView.extend({
|
||||
itemView : RenamePreviewItemView
|
||||
});
|
@ -1,4 +1,6 @@
|
||||
var vent = require('vent');
|
||||
var vent = require('vent');
|
||||
var Marionette = require('marionette');
|
||||
|
||||
module.exports = Marionette.ItemView.extend({template : 'Rename/RenamePreviewEmptyCollectionViewTemplate'});
|
||||
module.exports = Marionette.ItemView.extend({
|
||||
template : 'Rename/RenamePreviewEmptyCollectionViewTemplate'
|
||||
});
|
@ -3,15 +3,17 @@ var Marionette = require('marionette');
|
||||
var NamingModel = require('../Settings/MediaManagement/Naming/NamingModel');
|
||||
|
||||
module.exports = Marionette.ItemView.extend({
|
||||
template : 'Rename/RenamePreviewFormatViewTemplate',
|
||||
templateHelpers : function(){
|
||||
template : 'Rename/RenamePreviewFormatViewTemplate',
|
||||
|
||||
templateHelpers : function() {
|
||||
var type = this.model.get('seriesType');
|
||||
return {
|
||||
rename : this.naming.get('renameEpisodes'),
|
||||
format : this.naming.get(type + 'EpisodeFormat')
|
||||
};
|
||||
},
|
||||
initialize : function(){
|
||||
|
||||
initialize : function() {
|
||||
this.naming = new NamingModel();
|
||||
this.naming.fetch();
|
||||
this.listenTo(this.naming, 'sync', this.render);
|
||||
|
@ -1,3 +1,3 @@
|
||||
{{#if rename}}
|
||||
{{#if rename}}
|
||||
Naming pattern: {{format}}
|
||||
{{/if}}
|
||||
|
@ -1,36 +1,39 @@
|
||||
var vent = require('vent');
|
||||
var vent = require('vent');
|
||||
var Marionette = require('marionette');
|
||||
var AsModelBoundView = require('../Mixins/AsModelBoundView');
|
||||
|
||||
module.exports = (function(){
|
||||
var view = Marionette.ItemView.extend({
|
||||
template : 'Rename/RenamePreviewItemViewTemplate',
|
||||
ui : {
|
||||
itemDiv : '.rename-preview-item',
|
||||
checkboxIcon : '.rename-checkbox i'
|
||||
},
|
||||
onRender : function(){
|
||||
this._setItemState();
|
||||
this.listenTo(this.model, 'change', this._setItemState);
|
||||
this.listenTo(this.model, 'rename:select', this._onRenameAll);
|
||||
},
|
||||
_setItemState : function(){
|
||||
var checked = this.model.get('rename');
|
||||
this.model.trigger('rename:select', this.model, checked);
|
||||
if(checked) {
|
||||
this.ui.itemDiv.removeClass('do-not-rename');
|
||||
this.ui.checkboxIcon.addClass('icon-check');
|
||||
this.ui.checkboxIcon.removeClass('icon-check-empty');
|
||||
}
|
||||
else {
|
||||
this.ui.itemDiv.addClass('do-not-rename');
|
||||
this.ui.checkboxIcon.addClass('icon-check-empty');
|
||||
this.ui.checkboxIcon.removeClass('icon-check');
|
||||
}
|
||||
},
|
||||
_onRenameAll : function(model, checked){
|
||||
this.model.set('rename', checked);
|
||||
var view = Marionette.ItemView.extend({
|
||||
template : 'Rename/RenamePreviewItemViewTemplate',
|
||||
|
||||
ui : {
|
||||
itemDiv : '.rename-preview-item',
|
||||
checkboxIcon : '.rename-checkbox i'
|
||||
},
|
||||
|
||||
onRender : function() {
|
||||
this._setItemState();
|
||||
this.listenTo(this.model, 'change', this._setItemState);
|
||||
this.listenTo(this.model, 'rename:select', this._onRenameAll);
|
||||
},
|
||||
|
||||
_setItemState : function() {
|
||||
var checked = this.model.get('rename');
|
||||
this.model.trigger('rename:select', this.model, checked);
|
||||
|
||||
if (checked) {
|
||||
this.ui.itemDiv.removeClass('do-not-rename');
|
||||
this.ui.checkboxIcon.addClass('icon-check');
|
||||
this.ui.checkboxIcon.removeClass('icon-check-empty');
|
||||
} else {
|
||||
this.ui.itemDiv.addClass('do-not-rename');
|
||||
this.ui.checkboxIcon.addClass('icon-check-empty');
|
||||
this.ui.checkboxIcon.removeClass('icon-check');
|
||||
}
|
||||
});
|
||||
return AsModelBoundView.apply(view);
|
||||
}).call(this);
|
||||
},
|
||||
|
||||
_onRenameAll : function(model, checked) {
|
||||
this.model.set('rename', checked);
|
||||
}
|
||||
});
|
||||
|
||||
module.exports = AsModelBoundView.apply(view);
|
@ -9,66 +9,79 @@ var LoadingView = require('../Shared/LoadingView');
|
||||
var CommandController = require('../Commands/CommandController');
|
||||
|
||||
module.exports = Marionette.Layout.extend({
|
||||
className : 'modal-lg',
|
||||
template : 'Rename/RenamePreviewLayoutTemplate',
|
||||
regions : {
|
||||
className : 'modal-lg',
|
||||
template : 'Rename/RenamePreviewLayoutTemplate',
|
||||
|
||||
regions : {
|
||||
renamePreviews : '#rename-previews',
|
||||
formatRegion : '.x-format-region'
|
||||
},
|
||||
ui : {
|
||||
|
||||
ui : {
|
||||
pathInfo : '.x-path-info',
|
||||
renameAll : '.x-rename-all',
|
||||
checkboxIcon : '.x-rename-all-button i'
|
||||
},
|
||||
events : {
|
||||
"click .x-organize" : '_organizeFiles',
|
||||
"change .x-rename-all" : '_toggleAll'
|
||||
|
||||
events : {
|
||||
'click .x-organize' : '_organizeFiles',
|
||||
'change .x-rename-all' : '_toggleAll'
|
||||
},
|
||||
initialize : function(options){
|
||||
|
||||
initialize : function(options) {
|
||||
this.model = options.series;
|
||||
this.seasonNumber = options.seasonNumber;
|
||||
|
||||
var viewOptions = {};
|
||||
viewOptions.seriesId = this.model.id;
|
||||
viewOptions.seasonNumber = this.seasonNumber;
|
||||
|
||||
this.collection = new RenamePreviewCollection(viewOptions);
|
||||
this.listenTo(this.collection, 'sync', this._showPreviews);
|
||||
this.listenTo(this.collection, 'rename:select', this._itemRenameChanged);
|
||||
|
||||
this.collection.fetch();
|
||||
},
|
||||
onRender : function(){
|
||||
|
||||
onRender : function() {
|
||||
this.renamePreviews.show(new LoadingView());
|
||||
this.formatRegion.show(new RenamePreviewFormatView({model : this.model}));
|
||||
this.formatRegion.show(new RenamePreviewFormatView({ model : this.model }));
|
||||
},
|
||||
_showPreviews : function(){
|
||||
if(this.collection.length === 0) {
|
||||
|
||||
_showPreviews : function() {
|
||||
if (this.collection.length === 0) {
|
||||
this.ui.pathInfo.hide();
|
||||
this.renamePreviews.show(new EmptyCollectionView());
|
||||
return;
|
||||
}
|
||||
|
||||
this.ui.pathInfo.show();
|
||||
this.collection.invoke('set', {rename : true});
|
||||
this.renamePreviews.show(new RenamePreviewCollectionView({collection : this.collection}));
|
||||
this.collection.invoke('set', { rename : true });
|
||||
this.renamePreviews.show(new RenamePreviewCollectionView({ collection : this.collection }));
|
||||
},
|
||||
_organizeFiles : function(){
|
||||
if(this.collection.length === 0) {
|
||||
|
||||
_organizeFiles : function() {
|
||||
if (this.collection.length === 0) {
|
||||
vent.trigger(vent.Commands.CloseModalCommand);
|
||||
}
|
||||
var files = _.map(this.collection.where({rename : true}), function(model){
|
||||
|
||||
var files = _.map(this.collection.where({ rename : true }), function(model) {
|
||||
return model.get('episodeFileId');
|
||||
});
|
||||
if(files.length === 0) {
|
||||
|
||||
if (files.length === 0) {
|
||||
vent.trigger(vent.Commands.CloseModalCommand);
|
||||
return;
|
||||
}
|
||||
if(this.seasonNumber) {
|
||||
|
||||
if (this.seasonNumber) {
|
||||
CommandController.Execute('renameFiles', {
|
||||
name : 'renameFiles',
|
||||
seriesId : this.model.id,
|
||||
seasonNumber : this.seasonNumber,
|
||||
files : files
|
||||
});
|
||||
}
|
||||
else {
|
||||
} else {
|
||||
CommandController.Execute('renameFiles', {
|
||||
name : 'renameFiles',
|
||||
seriesId : this.model.id,
|
||||
@ -76,30 +89,35 @@ module.exports = Marionette.Layout.extend({
|
||||
files : files
|
||||
});
|
||||
}
|
||||
|
||||
vent.trigger(vent.Commands.CloseModalCommand);
|
||||
},
|
||||
_setCheckedState : function(checked){
|
||||
if(checked) {
|
||||
|
||||
_setCheckedState : function(checked) {
|
||||
if (checked) {
|
||||
this.ui.checkboxIcon.addClass('icon-check');
|
||||
this.ui.checkboxIcon.removeClass('icon-check-empty');
|
||||
}
|
||||
else {
|
||||
} else {
|
||||
this.ui.checkboxIcon.addClass('icon-check-empty');
|
||||
this.ui.checkboxIcon.removeClass('icon-check');
|
||||
}
|
||||
},
|
||||
_toggleAll : function(){
|
||||
|
||||
_toggleAll : function() {
|
||||
var checked = this.ui.renameAll.prop('checked');
|
||||
this._setCheckedState(checked);
|
||||
this.collection.each(function(model){
|
||||
|
||||
this.collection.each(function(model) {
|
||||
model.trigger('rename:select', model, checked);
|
||||
});
|
||||
},
|
||||
_itemRenameChanged : function(model, checked){
|
||||
var allChecked = this.collection.all(function(m){
|
||||
|
||||
_itemRenameChanged : function(model, checked) {
|
||||
var allChecked = this.collection.all(function(m) {
|
||||
return m.get('rename');
|
||||
});
|
||||
if(!checked || allChecked) {
|
||||
|
||||
if (!checked || allChecked) {
|
||||
this._setCheckedState(checked);
|
||||
}
|
||||
}
|
||||
|
@ -1,4 +1,4 @@
|
||||
<div class="modal-content">
|
||||
<div class="modal-content">
|
||||
<div class="rename-preview-modal">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||||
|
@ -7,59 +7,75 @@ var ToolbarLayout = require('../Shared/Toolbar/ToolbarLayout');
|
||||
require('../Mixins/backbone.signalr.mixin');
|
||||
|
||||
module.exports = Marionette.Layout.extend({
|
||||
template : 'SeasonPass/SeasonPassLayoutTemplate',
|
||||
regions : {
|
||||
template : 'SeasonPass/SeasonPassLayoutTemplate',
|
||||
|
||||
regions : {
|
||||
toolbar : '#x-toolbar',
|
||||
series : '#x-series'
|
||||
},
|
||||
initialize : function(){
|
||||
|
||||
initialize : function() {
|
||||
this.seriesCollection = SeriesCollection.clone();
|
||||
this.seriesCollection.shadowCollection.bindSignalR();
|
||||
|
||||
this.listenTo(this.seriesCollection, 'sync', this.render);
|
||||
|
||||
this.filteringOptions = {
|
||||
type : 'radio',
|
||||
storeState : true,
|
||||
menuKey : 'seasonpass.filterMode',
|
||||
defaultAction : 'all',
|
||||
items : [{
|
||||
key : 'all',
|
||||
title : '',
|
||||
tooltip : 'All',
|
||||
icon : 'icon-circle-blank',
|
||||
callback : this._setFilter
|
||||
}, {
|
||||
key : 'monitored',
|
||||
title : '',
|
||||
tooltip : 'Monitored Only',
|
||||
icon : 'icon-nd-monitored',
|
||||
callback : this._setFilter
|
||||
}, {
|
||||
key : 'continuing',
|
||||
title : '',
|
||||
tooltip : 'Continuing Only',
|
||||
icon : 'icon-play',
|
||||
callback : this._setFilter
|
||||
}, {
|
||||
key : 'ended',
|
||||
title : '',
|
||||
tooltip : 'Ended Only',
|
||||
icon : 'icon-stop',
|
||||
callback : this._setFilter
|
||||
}]
|
||||
items : [
|
||||
{
|
||||
key : 'all',
|
||||
title : '',
|
||||
tooltip : 'All',
|
||||
icon : 'icon-circle-blank',
|
||||
callback : this._setFilter
|
||||
},
|
||||
{
|
||||
key : 'monitored',
|
||||
title : '',
|
||||
tooltip : 'Monitored Only',
|
||||
icon : 'icon-nd-monitored',
|
||||
callback : this._setFilter
|
||||
},
|
||||
{
|
||||
key : 'continuing',
|
||||
title : '',
|
||||
tooltip : 'Continuing Only',
|
||||
icon : 'icon-play',
|
||||
callback : this._setFilter
|
||||
},
|
||||
{
|
||||
key : 'ended',
|
||||
title : '',
|
||||
tooltip : 'Ended Only',
|
||||
icon : 'icon-stop',
|
||||
callback : this._setFilter
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
onRender : function(){
|
||||
this.series.show(new SeriesCollectionView({collection : this.seriesCollection}));
|
||||
|
||||
onRender : function() {
|
||||
this.series.show(new SeriesCollectionView({
|
||||
collection : this.seriesCollection
|
||||
}));
|
||||
|
||||
this._showToolbar();
|
||||
},
|
||||
_showToolbar : function(){
|
||||
|
||||
_showToolbar : function() {
|
||||
this.toolbar.show(new ToolbarLayout({
|
||||
right : [this.filteringOptions],
|
||||
context : this
|
||||
}));
|
||||
},
|
||||
_setFilter : function(buttonContext){
|
||||
|
||||
_setFilter : function(buttonContext) {
|
||||
var mode = buttonContext.model.get('key');
|
||||
|
||||
this.seriesCollection.setFilterMode(mode);
|
||||
}
|
||||
});
|
@ -1,4 +1,6 @@
|
||||
var Marionette = require('marionette');
|
||||
var SeriesLayout = require('./SeriesLayout');
|
||||
|
||||
module.exports = Marionette.CollectionView.extend({itemView : SeriesLayout});
|
||||
module.exports = Marionette.CollectionView.extend({
|
||||
itemView : SeriesLayout
|
||||
});
|
@ -4,113 +4,149 @@ var Backgrid = require('backgrid');
|
||||
var SeasonCollection = require('../Series/SeasonCollection');
|
||||
|
||||
module.exports = Marionette.Layout.extend({
|
||||
template : 'SeasonPass/SeriesLayoutTemplate',
|
||||
ui : {
|
||||
template : 'SeasonPass/SeriesLayoutTemplate',
|
||||
|
||||
ui : {
|
||||
seasonSelect : '.x-season-select',
|
||||
expander : '.x-expander',
|
||||
seasonGrid : '.x-season-grid',
|
||||
seriesMonitored : '.x-series-monitored'
|
||||
},
|
||||
events : {
|
||||
"change .x-season-select" : '_seasonSelected',
|
||||
"click .x-expander" : '_expand',
|
||||
"click .x-latest" : '_latest',
|
||||
"click .x-all" : '_all',
|
||||
"click .x-monitored" : '_toggleSeasonMonitored',
|
||||
"click .x-series-monitored" : '_toggleSeriesMonitored'
|
||||
|
||||
events : {
|
||||
'change .x-season-select' : '_seasonSelected',
|
||||
'click .x-expander' : '_expand',
|
||||
'click .x-latest' : '_latest',
|
||||
'click .x-all' : '_all',
|
||||
'click .x-monitored' : '_toggleSeasonMonitored',
|
||||
'click .x-series-monitored' : '_toggleSeriesMonitored'
|
||||
},
|
||||
regions : {seasonGrid : '.x-season-grid'},
|
||||
initialize : function(){
|
||||
|
||||
regions : {
|
||||
seasonGrid : '.x-season-grid'
|
||||
},
|
||||
|
||||
initialize : function() {
|
||||
this.listenTo(this.model, 'sync', this._setSeriesMonitoredState);
|
||||
this.seasonCollection = new SeasonCollection(this.model.get('seasons'));
|
||||
this.expanded = false;
|
||||
},
|
||||
onRender : function(){
|
||||
if(!this.expanded) {
|
||||
|
||||
onRender : function() {
|
||||
if (!this.expanded) {
|
||||
this.ui.seasonGrid.hide();
|
||||
}
|
||||
|
||||
this._setExpanderIcon();
|
||||
this._setSeriesMonitoredState();
|
||||
},
|
||||
_seasonSelected : function(){
|
||||
|
||||
_seasonSelected : function() {
|
||||
var seasonNumber = parseInt(this.ui.seasonSelect.val(), 10);
|
||||
if(seasonNumber === -1 || isNaN(seasonNumber)) {
|
||||
|
||||
if (seasonNumber === -1 || isNaN(seasonNumber)) {
|
||||
return;
|
||||
}
|
||||
|
||||
this._setSeasonMonitored(seasonNumber);
|
||||
},
|
||||
_expand : function(){
|
||||
if(this.expanded) {
|
||||
|
||||
_expand : function() {
|
||||
if (this.expanded) {
|
||||
this.ui.seasonGrid.slideUp();
|
||||
this.expanded = false;
|
||||
}
|
||||
|
||||
else {
|
||||
this.ui.seasonGrid.slideDown();
|
||||
this.expanded = true;
|
||||
}
|
||||
|
||||
this._setExpanderIcon();
|
||||
},
|
||||
_setExpanderIcon : function(){
|
||||
if(this.expanded) {
|
||||
|
||||
_setExpanderIcon : function() {
|
||||
if (this.expanded) {
|
||||
this.ui.expander.removeClass('icon-chevron-right');
|
||||
this.ui.expander.addClass('icon-chevron-down');
|
||||
}
|
||||
|
||||
else {
|
||||
this.ui.expander.removeClass('icon-chevron-down');
|
||||
this.ui.expander.addClass('icon-chevron-right');
|
||||
}
|
||||
},
|
||||
_latest : function(){
|
||||
var season = _.max(this.model.get('seasons'), function(s){
|
||||
|
||||
_latest : function() {
|
||||
var season = _.max(this.model.get('seasons'), function(s) {
|
||||
return s.seasonNumber;
|
||||
});
|
||||
|
||||
this._setSeasonMonitored(season.seasonNumber);
|
||||
},
|
||||
_all : function(){
|
||||
var minSeasonNotZero = _.min(_.reject(this.model.get('seasons'), {seasonNumber : 0}), 'seasonNumber');
|
||||
|
||||
_all : function() {
|
||||
var minSeasonNotZero = _.min(_.reject(this.model.get('seasons'), { seasonNumber : 0 }), 'seasonNumber');
|
||||
|
||||
this._setSeasonMonitored(minSeasonNotZero.seasonNumber);
|
||||
},
|
||||
_setSeasonMonitored : function(seasonNumber){
|
||||
|
||||
_setSeasonMonitored : function(seasonNumber) {
|
||||
var self = this;
|
||||
|
||||
this.model.setSeasonPass(seasonNumber);
|
||||
|
||||
var promise = this.model.save();
|
||||
promise.done(function(data){
|
||||
|
||||
promise.done(function(data) {
|
||||
self.seasonCollection = new SeasonCollection(data);
|
||||
self.render();
|
||||
});
|
||||
},
|
||||
_toggleSeasonMonitored : function(e){
|
||||
|
||||
_toggleSeasonMonitored : function(e) {
|
||||
var seasonNumber = 0;
|
||||
var element;
|
||||
if(e.target.localName === 'i') {
|
||||
|
||||
if (e.target.localName === 'i') {
|
||||
seasonNumber = parseInt(this.$(e.target).parent('td').attr('data-season-number'), 10);
|
||||
element = this.$(e.target);
|
||||
}
|
||||
|
||||
else {
|
||||
seasonNumber = parseInt(this.$(e.target).attr('data-season-number'), 10);
|
||||
element = this.$(e.target).children('i');
|
||||
}
|
||||
|
||||
this.model.setSeasonMonitored(seasonNumber);
|
||||
|
||||
var savePromise = this.model.save().always(this.render.bind(this));
|
||||
element.spinForPromise(savePromise);
|
||||
},
|
||||
_afterToggleSeasonMonitored : function(){
|
||||
|
||||
_afterToggleSeasonMonitored : function() {
|
||||
this.render();
|
||||
},
|
||||
_setSeriesMonitoredState : function(){
|
||||
|
||||
_setSeriesMonitoredState : function() {
|
||||
var monitored = this.model.get('monitored');
|
||||
|
||||
this.ui.seriesMonitored.removeAttr('data-idle-icon');
|
||||
if(monitored) {
|
||||
|
||||
if (monitored) {
|
||||
this.ui.seriesMonitored.addClass('icon-nd-monitored');
|
||||
this.ui.seriesMonitored.removeClass('icon-nd-unmonitored');
|
||||
}
|
||||
else {
|
||||
} else {
|
||||
this.ui.seriesMonitored.addClass('icon-nd-unmonitored');
|
||||
this.ui.seriesMonitored.removeClass('icon-nd-monitored');
|
||||
}
|
||||
},
|
||||
_toggleSeriesMonitored : function(){
|
||||
var savePromise = this.model.save('monitored', !this.model.get('monitored'), {wait : true});
|
||||
|
||||
_toggleSeriesMonitored : function() {
|
||||
var savePromise = this.model.save('monitored', !this.model.get('monitored'), {
|
||||
wait : true
|
||||
});
|
||||
|
||||
this.ui.seriesMonitored.spinForPromise(savePromise);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user