mirror of
https://github.com/lidarr/lidarr.git
synced 2025-08-20 21:43:33 -07:00
Quality Size knobbed, other quality changes
This commit is contained in:
Mark McDowall
parent
a3a1cf26ee
commit
f78f396940
25 changed files with 888 additions and 405 deletions
|
|
@ -14,7 +14,6 @@ define(['app',
|
|||
'click .x-add': 'openSchemaModal'
|
||||
},
|
||||
|
||||
|
||||
openSchemaModal: function () {
|
||||
var self = this;
|
||||
//TODO: Is there a better way to deal with changing URLs?
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||||
<h3>Edit: Quality Profile</h3>
|
||||
{{#if id}}
|
||||
<h3>Edit</h3>
|
||||
{{else}}
|
||||
<h3>Add</h3>
|
||||
{{/if}}
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="form-horizontal">
|
||||
|
|
@ -16,9 +20,9 @@
|
|||
<div class="control-group">
|
||||
<label class="control-label">Cutoff</label>
|
||||
<div class="controls">
|
||||
<select class="x-cutoff" name="cutoff">
|
||||
<select class="x-cutoff" name="cutoff.id">
|
||||
{{#each allowed}}
|
||||
<option value="{{id}}">{{name}}</option>
|
||||
<option value="{{id}}">{{name}}</option>
|
||||
{{/each}}
|
||||
</select>
|
||||
<span class="help-inline">
|
||||
|
|
@ -47,7 +51,9 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button class="btn btn-danger pull-left x-remove">delete</button>
|
||||
{{#if id}}
|
||||
<button class="btn btn-danger pull-left x-remove">delete</button>
|
||||
{{/if}}
|
||||
<button class="btn" data-dismiss="modal">cancel</button>
|
||||
<button class="btn btn-primary x-save">save</button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,12 +4,20 @@ define(['app', 'marionette', 'Mixins/AsModelBoundView'], function (App, Marionet
|
|||
var view = Marionette.ItemView.extend({
|
||||
template: 'Settings/Quality/Profile/EditQualityProfileTemplate',
|
||||
|
||||
ui: {
|
||||
cutoff: '.x-cutoff'
|
||||
},
|
||||
|
||||
events: {
|
||||
'click .x-save' : 'saveQualityProfile',
|
||||
'click .x-save' : '_saveQualityProfile',
|
||||
'dblclick .x-available-list': '_moveQuality',
|
||||
'dblclick .x-allowed-list' : '_moveQuality'
|
||||
},
|
||||
|
||||
initialize: function (options) {
|
||||
this.profileCollection = options.profileCollection;
|
||||
},
|
||||
|
||||
_moveQuality: function (event) {
|
||||
|
||||
var quality;
|
||||
|
|
@ -39,19 +47,25 @@ define(['app', 'marionette', 'Mixins/AsModelBoundView'], function (App, Marionet
|
|||
throw 'couldnt find quality id ' + qualityId;
|
||||
}
|
||||
|
||||
|
||||
this.model.set('available', availableCollection.toJSON());
|
||||
this.model.set('allowed', allowedCollection.toJSON());
|
||||
|
||||
this.render();
|
||||
},
|
||||
|
||||
saveQualityProfile: function () {
|
||||
//Todo: Make sure model is updated with Allowed, Cutoff, Name
|
||||
_saveQualityProfile: function () {
|
||||
var self = this;
|
||||
var cutoff = _.findWhere(this.model.get('allowed'), { id: parseInt(this.ui.cutoff.val())});
|
||||
this.model.set('cutoff', cutoff);
|
||||
|
||||
this.model.save();
|
||||
this.trigger('saved');
|
||||
App.modalRegion.closeModal();
|
||||
var promise = this.model.save();
|
||||
|
||||
if (promise) {
|
||||
promise.done(function () {
|
||||
self.profileCollection.add(self.model, { merge: true });
|
||||
App.modalRegion.closeModal();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,13 @@
|
|||
<fieldset>
|
||||
<legend>Quality Profiles</legend>
|
||||
<ul class="quality-profiles"></ul>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<button class="btn btn-success x-add">Add Profile</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<ul class="quality-profiles"></ul>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
|
|
@ -1,9 +1,35 @@
|
|||
'use strict';
|
||||
|
||||
define(['marionette', 'Settings/Quality/Profile/QualityProfileView'], function (Marionette, QualityProfileView) {
|
||||
define(['app',
|
||||
'marionette',
|
||||
'Settings/Quality/Profile/QualityProfileView',
|
||||
'Settings/Quality/Profile/EditQualityProfileView',
|
||||
'Settings/Quality/Profile/QualityProfileSchemaCollection'],
|
||||
function (App, Marionette, QualityProfileView, EditProfileView, ProfileCollection) {
|
||||
|
||||
return Marionette.CompositeView.extend({
|
||||
itemView : QualityProfileView,
|
||||
itemViewContainer: '.quality-profiles',
|
||||
template : 'Settings/Quality/Profile/QualityProfileCollectionTemplate'
|
||||
template : 'Settings/Quality/Profile/QualityProfileCollectionTemplate',
|
||||
|
||||
events: {
|
||||
'click .x-add': '_addProfile'
|
||||
},
|
||||
|
||||
_addProfile: function () {
|
||||
var self = this;
|
||||
var schemaCollection = new ProfileCollection();
|
||||
schemaCollection.fetch({
|
||||
success: function (collection) {
|
||||
var model = _.first(collection.models);
|
||||
model.set('id', undefined);
|
||||
model.set('name', '');
|
||||
model.collection = self.collection;
|
||||
|
||||
var view = new EditProfileView({ model: model, profileCollection: self.collection});
|
||||
App.modalRegion.show(view);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -0,0 +1,13 @@
|
|||
"use strict";
|
||||
|
||||
define(
|
||||
[
|
||||
'backbone',
|
||||
'Quality/QualityProfileModel'
|
||||
], function (Backbone, QualityProfileModel) {
|
||||
|
||||
return Backbone.Collection.extend({
|
||||
model: QualityProfileModel,
|
||||
url : window.ApiRoot + '/qualityprofiles/schema'
|
||||
});
|
||||
});
|
||||
|
|
@ -1,9 +1,9 @@
|
|||
<div class="quality-profile-item">
|
||||
<div>
|
||||
<h2>{{name}}</h2>
|
||||
<h2 name="name"></h2>
|
||||
<span class="btn-group pull-right">
|
||||
<button class="btn btn-mini btn-danger x-delete">Delete</button>
|
||||
<button class="btn btn-mini x-edit">Edit</button>
|
||||
<button class="btn btn-mini btn-danger x-delete">Delete</button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -24,8 +24,12 @@ define(
|
|||
'click .x-delete': '_deleteProfile'
|
||||
},
|
||||
|
||||
initialize: function () {
|
||||
this.listenTo(this.model, 'sync', this.render);
|
||||
},
|
||||
|
||||
_editProfile: function () {
|
||||
var view = new EditProfileView({ model: this.model});
|
||||
var view = new EditProfileView({ model: this.model, profileCollection: this.model.collection });
|
||||
App.modalRegion.show(view);
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
'use strict';
|
||||
"use strict";
|
||||
|
||||
define(
|
||||
[
|
||||
'marionette',
|
||||
|
|
@ -11,7 +12,6 @@ define(
|
|||
template: 'Settings/Quality/QualityLayoutTemplate',
|
||||
|
||||
regions: {
|
||||
qualityStandard: '#quality-standard',
|
||||
qualityProfile : '#quality-profile',
|
||||
qualitySize : '#quality-size'
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,7 +1,4 @@
|
|||
<div class="row">
|
||||
<div class="span12" id="quality-standard"/>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12" id="quality-profile"/>
|
||||
</div>
|
||||
<div class="row">
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<fieldset>
|
||||
<legend>Quality Size Limits</legend>
|
||||
<div id="quality-sizes-container"/>
|
||||
<ul class="quality-sizes"/>
|
||||
</fieldset>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
define(['marionette', 'Settings/Quality/Size/QualitySizeView'], function (Marionette, QualitySizeView) {
|
||||
return Marionette.CompositeView.extend({
|
||||
itemView : QualitySizeView,
|
||||
itemViewContainer: '#quality-sizes-container',
|
||||
itemViewContainer: '.quality-sizes',
|
||||
template : 'Settings/Quality/Size/QualitySizeCollectionTemplate'
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,5 +1,8 @@
|
|||
<b>{{name}}</b>
|
||||
<div class="quality-slider-container">
|
||||
<input type="text" class="span4 slider"/>
|
||||
</div>
|
||||
30 minute size: <span name="thirtyMinuteSize" class="thirty-minute-size"></span>MB | 60 minute size: <span name="sixtyMinuteSize" class="sixty-minute-size"></span>MB
|
||||
<div class="quality-size-item">
|
||||
<h2 class="center-block">{{name}}</h2>
|
||||
<div class="size">
|
||||
<input type="text" name="maxSize" class="knob x-knob" />
|
||||
</div>
|
||||
<div class="size-value">30 minute limit: <span name="thirtyMinuteSize" class="thirty-minute-size"></span>MB</div>
|
||||
<div class="size-value">60 minute limit: <span name="sixtyMinuteSize" class="sixty-minute-size"></span>MB</div>
|
||||
</div>
|
||||
|
|
@ -1,19 +1,19 @@
|
|||
'use strict';
|
||||
|
||||
define(['marionette', 'bootstrap.slider'], function (Marionette) {
|
||||
define(['marionette', 'Mixins/AsModelBoundView', 'jquery.knob'], function (Marionette, AsModelBoundView) {
|
||||
|
||||
return Marionette.ItemView.extend({
|
||||
var view = Marionette.ItemView.extend({
|
||||
template : 'Settings/Quality/Size/QualitySizeTemplate',
|
||||
className: 'quality-size-item',
|
||||
tagName : 'li',
|
||||
|
||||
ui: {
|
||||
slider : '.slider',
|
||||
knob : '.x-knob',
|
||||
thirtyMinuteSize: '.thirty-minute-size',
|
||||
sixtyMinuteSize : '.sixty-minute-size'
|
||||
},
|
||||
|
||||
events: {
|
||||
'slide .slider': 'slide'
|
||||
'change .x-knob': '_changeMaxSize'
|
||||
},
|
||||
|
||||
initialize: function (options) {
|
||||
|
|
@ -21,23 +21,25 @@ define(['marionette', 'bootstrap.slider'], function (Marionette) {
|
|||
},
|
||||
|
||||
onRender: function () {
|
||||
var self = this;
|
||||
this.ui.slider.slider({
|
||||
min : 0,
|
||||
max : 200,
|
||||
step : 1,
|
||||
value : self.model.get('maxSize'),
|
||||
tooltip: 'hide'
|
||||
this.ui.knob.knob({
|
||||
min : 0,
|
||||
max : 200,
|
||||
step : 10,
|
||||
cursor : 25,
|
||||
width : 100,
|
||||
stopper : true
|
||||
});
|
||||
},
|
||||
|
||||
slide: function (e) {
|
||||
var newSize = e.value;
|
||||
_changeMaxSize: function (e, value) {
|
||||
this.model.set({
|
||||
maxSize: value
|
||||
});
|
||||
|
||||
this.model.set({ maxSize: newSize, thirtyMinuteSize: newSize * 30, sixtyMinuteSize: newSize * 60 });
|
||||
|
||||
this.ui.thirtyMinuteSize.html(newSize * 30);
|
||||
this.ui.sixtyMinuteSize.html(newSize * 60);
|
||||
this.ui.thirtyMinuteSize.html(value * 30);
|
||||
this.ui.sixtyMinuteSize.html(value * 60);
|
||||
}
|
||||
});
|
||||
|
||||
return AsModelBoundView.call(view);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
@import "../../Shared/Styles/card";
|
||||
|
||||
.quality-profiles {
|
||||
.quality-profiles, .quality-sizes {
|
||||
li {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
|
|
@ -23,4 +23,36 @@
|
|||
.btn-group {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.quality-size-item {
|
||||
|
||||
.card;
|
||||
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
padding: 10px 15px;
|
||||
|
||||
h2 {
|
||||
margin-top: 0px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.size {
|
||||
height: 100px;
|
||||
margin: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.knob {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.size-value {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
#quality-size {
|
||||
overflow: hidden;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue