mirror of
https://github.com/Readarr/Readarr.git
synced 2026-04-16 21:16:24 -04:00
Updated QualityProfile to contain a list of Items each with a 'Allowed' bool.
This commit is contained in:
Taloth Saldono
@@ -7,13 +7,14 @@ define(
|
||||
Handlebars.registerHelper('allowedLabeler', function () {
|
||||
var ret = '';
|
||||
var cutoff = this.cutoff;
|
||||
_.each(this.allowed, function (allowed) {
|
||||
if (allowed.id === cutoff.id) {
|
||||
ret += '<span class="label label-info" title="Cutoff">' + allowed.name + '</span> ';
|
||||
}
|
||||
|
||||
else {
|
||||
ret += '<span class="label">' + allowed.name + '</span> ';
|
||||
_.each(this.items, function (item) {
|
||||
if (item.allowed) {
|
||||
if (item.quality.id === cutoff.id) {
|
||||
ret += '<span class="label label-info" title="Cutoff">' + item.quality.name + '</span> ';
|
||||
}
|
||||
else {
|
||||
ret += '<span class="label">' + item.quality.name + '</span> ';
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
<span class="move-handle x-move"><i class="move-left-handle pull-left icon-chevron-left" /></span>
|
||||
<span>{{name}}</span>
|
||||
<i class="select-handle pull-left icon-chevron-right x-select" />
|
||||
<span class="quality-label">{{quality.name}}</span>
|
||||
<i class="drag-handle pull-right icon-resize-vertical advanced-setting x-drag-handle" />
|
||||
<span class="move-handle x-move"><i class="move-right-handle pull-right icon-chevron-right" /><span>
|
||||
|
||||
@@ -15,7 +15,6 @@ define(
|
||||
template: 'Settings/Quality/Profile/EditQualityProfileViewTemplate',
|
||||
|
||||
ui: {
|
||||
available: '.x-available-list',
|
||||
allowed : '.x-allowed-list',
|
||||
cutoff : '.x-cutoff'
|
||||
},
|
||||
@@ -26,101 +25,62 @@ define(
|
||||
|
||||
initialize: function (options) {
|
||||
this.profileCollection = options.profileCollection;
|
||||
|
||||
this.availableCollection = new Backbone.Collection(this.model.get('available'));
|
||||
this.availableCollection.comparator = function (model) { return -model.get('weight'); };
|
||||
this.availableCollection.sort();
|
||||
|
||||
this.allowedCollection = new Backbone.Collection(this.model.get('allowed'));
|
||||
this.allowedCollection.comparator = function (model) { return -model.get('weight'); };
|
||||
this.allowedCollection.sort();
|
||||
this.allowedCollection.comparator = undefined;
|
||||
|
||||
this.allowedCollection = new Backbone.Collection(_.toArray(this.model.get('items')).reverse());
|
||||
},
|
||||
|
||||
onRender: function() {
|
||||
var listViewAvailable = new BackboneSortableCollectionView({
|
||||
el : this.ui.available,
|
||||
modelView : EditQualityProfileItemView,
|
||||
selectable: false,
|
||||
sortable : false,
|
||||
collection: this.availableCollection
|
||||
});
|
||||
|
||||
var listViewAllowed = new BackboneSortableCollectionView({
|
||||
el : this.ui.allowed,
|
||||
modelView : EditQualityProfileItemView,
|
||||
selectable: false,
|
||||
sortable : true,
|
||||
onRender: function() {
|
||||
var MyCollectionView = BackboneSortableCollectionView.extend({
|
||||
events : {
|
||||
// Backbone.CollectionView used mousedown for the click event, which interferes with the sortable.
|
||||
"click li, td" : "_listItem_onMousedown",
|
||||
"dblclick li, td" : "_listItem_onDoubleClick",
|
||||
"click" : "_listBackground_onClick",
|
||||
"click ul.collection-list, table.collection-list" : "_listBackground_onClick",
|
||||
"keydown" : "_onKeydown"
|
||||
}
|
||||
});
|
||||
var listViewAllowed = new MyCollectionView({
|
||||
el : this.ui.allowed,
|
||||
modelView : EditQualityProfileItemView,
|
||||
selectable : true,
|
||||
selectMultiple : true,
|
||||
clickToSelect : true,
|
||||
clickToToggle : true,
|
||||
sortable : true,
|
||||
sortableOptions : {
|
||||
handle: '.x-drag-handle'
|
||||
},
|
||||
collection : this.allowedCollection
|
||||
});
|
||||
|
||||
listViewAvailable.render();
|
||||
listViewAllowed.setSelectedModels(this.allowedCollection.filter(function(item) { return item.get('allowed') === true; }));
|
||||
|
||||
listViewAllowed.render();
|
||||
|
||||
this.listenTo(listViewAvailable, 'doubleClick', this._moveQuality);
|
||||
this.listenTo(listViewAllowed, 'doubleClick', this._moveQuality);
|
||||
|
||||
this.listenTo(listViewAvailable, 'moveClicked', this._moveQuality);
|
||||
this.listenTo(listViewAllowed, 'moveClicked', this._moveQuality);
|
||||
|
||||
this.listenTo(listViewAllowed, 'selectionChanged', this._selectionChanged);
|
||||
this.listenTo(listViewAllowed, 'sortStop', this._updateModel);
|
||||
},
|
||||
|
||||
_moveQuality: function (event) {
|
||||
|
||||
var quality;
|
||||
var qualityId = event.get('id');
|
||||
|
||||
_selectionChanged: function(newSelectedModels, oldSelectedModels) {
|
||||
var addedModels = _.difference(newSelectedModels, oldSelectedModels);
|
||||
var removeModels = _.difference(oldSelectedModels, newSelectedModels);
|
||||
|
||||
if (this.availableCollection.get(qualityId)) {
|
||||
quality = this.availableCollection.get(qualityId);
|
||||
var idealIndex = 0;
|
||||
var idealMismatches = 1000;
|
||||
// Insert it at the best possible spot.
|
||||
for (var i = 0; i <= this.allowedCollection.length; i++) {
|
||||
var mismatches = 0;
|
||||
for (var j = 0; j < i; j++) {
|
||||
if (this.allowedCollection.at(j).get('weight') < quality.get('weight'))
|
||||
mismatches++;
|
||||
}
|
||||
for (j = i; j < this.allowedCollection.length; j++) {
|
||||
if (this.allowedCollection.at(j).get('weight') > quality.get('weight'))
|
||||
mismatches++;
|
||||
}
|
||||
if (mismatches <= idealMismatches) {
|
||||
idealIndex = i;
|
||||
idealMismatches = mismatches;
|
||||
}
|
||||
}
|
||||
|
||||
this.availableCollection.remove(quality);
|
||||
this.allowedCollection.add(quality, {at: idealIndex});
|
||||
}
|
||||
else if (this.allowedCollection.get(qualityId)) {
|
||||
quality = this.allowedCollection.get(qualityId);
|
||||
|
||||
this.allowedCollection.remove(quality);
|
||||
this.availableCollection.add(quality);
|
||||
}
|
||||
else {
|
||||
throw 'couldnt find quality id ' + qualityId;
|
||||
}
|
||||
_.each(removeModels, function(item) { item.set('allowed', false); });
|
||||
_.each(addedModels, function(item) { item.set('allowed', true); });
|
||||
|
||||
this._updateModel();
|
||||
},
|
||||
|
||||
_updateModel: function() {
|
||||
this.model.set('available', this.availableCollection.toJSON().reverse());
|
||||
this.model.set('allowed', this.allowedCollection.toJSON().reverse());
|
||||
this.model.set('items', this.allowedCollection.toJSON().reverse());
|
||||
|
||||
this.render();
|
||||
},
|
||||
|
||||
_saveQualityProfile: function () {
|
||||
var self = this;
|
||||
var cutoff = _.findWhere(this.model.get('allowed'), { id: parseInt(this.ui.cutoff.val(), 10)});
|
||||
var cutoff = _.findWhere(_.pluck(this.model.get('items'), 'quality'), { id: parseInt(self.ui.cutoff.val(), 10)});
|
||||
this.model.set('cutoff', cutoff);
|
||||
|
||||
var promise = this.model.save();
|
||||
|
||||
@@ -18,8 +18,10 @@
|
||||
<label class="control-label">Cutoff</label>
|
||||
<div class="controls">
|
||||
<select class="x-cutoff" name="cutoff.id" validation-name="cutoff">
|
||||
{{#eachReverse allowed}}
|
||||
<option value="{{id}}">{{name}}</option>
|
||||
{{#eachReverse items}}
|
||||
{{#if allowed}}
|
||||
<option value="{{quality.id}}">{{quality.name}}</option>
|
||||
{{/if}}
|
||||
{{/eachReverse}}
|
||||
</select>
|
||||
<span class="help-inline">
|
||||
@@ -30,11 +32,6 @@
|
||||
</div>
|
||||
<div>
|
||||
<div class="offset1 span2">
|
||||
<h3>Available</h3>
|
||||
<ul class="available-list x-available-list">
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span2">
|
||||
<h3>
|
||||
Allowed
|
||||
<span class="help-inline">
|
||||
|
||||
@@ -36,7 +36,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
ul.available-list, ul.allowed-list {
|
||||
ul.allowed-list {
|
||||
.user-select(none);
|
||||
|
||||
min-height: 100px;
|
||||
@@ -52,51 +52,41 @@ ul.available-list, ul.allowed-list {
|
||||
border: 1px solid #AAA;
|
||||
border-radius: 4px; /* may need vendor varients */
|
||||
background: #FAFAFA;
|
||||
cursor: default;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
border-color: #888;
|
||||
background: #EEE;
|
||||
.quality-label {
|
||||
color: #CCC;
|
||||
}
|
||||
|
||||
.drag-handle, .move-left-handle, .move-right-handle {
|
||||
opacity: 0.0;
|
||||
.drag-handle, .select-handle {
|
||||
opacity: 0.2;
|
||||
line-height: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.move-handle {
|
||||
|
||||
.drag-handle:hover {
|
||||
opacity: 1.0;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul.available-list li {
|
||||
.move-right-handle {
|
||||
opacity: 0.2;
|
||||
|
||||
li.selected {
|
||||
.select-handle {
|
||||
opacity: 1.0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.quality-label {
|
||||
color: #444;
|
||||
}
|
||||
}
|
||||
|
||||
.drag-handle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:hover .move-right-handle {
|
||||
opacity: 1.0;
|
||||
}
|
||||
}
|
||||
|
||||
ul.allowed-list li {
|
||||
.drag-handle, .move-left-handle {
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
.drag-handle:hover {
|
||||
opacity: 1.0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&:hover .move-left-handle {
|
||||
opacity: 1.0;
|
||||
li:hover {
|
||||
border-color: #888;
|
||||
background: #EEE;
|
||||
|
||||
.select-handle {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user