new quality profile edit view.

NzbDrone.Api/Qualities/QualityProfileResource.cs

@@ -8,7 +8,7 @@ namespace NzbDrone.Api.Qualities
     {
         public String Name { get; set; }
         public QualityResource Cutoff { get; set; }
-        public List<QualityResource> Qualities { get; set; }
+        public List<QualityResource> Available { get; set; }
         public List<QualityResource> Allowed { get; set; }
     }
 

NzbDrone.Api/Qualities/QualityProfilesModule.cs

@@ -75,7 +75,10 @@ namespace NzbDrone.Api.Qualities
             return new QualityProfileResource
                 {
                     Cutoff = profile.Cutoff.InjectTo<QualityResource>(),
-                    Qualities = Quality.All().InjectTo<List<QualityResource>>(),
+                    Available = Quality.All()
+                        .Where(c => !profile.Allowed.Any(q => c.Id == q.Id))
+                        .InjectTo<List<QualityResource>>(),
+
                     Allowed = profile.Allowed.InjectTo<List<QualityResource>>(),
                     Name = profile.Name,
                     Id = profile.Id

UI/Quality/qualityProfileModel.js

@@ -5,7 +5,6 @@ define(['app'], function () {
         defaults: {
             id    : null,
             name  : '',
-            //'qualities.allowed': false,
             cutoff: null
         }
     });

UI/Settings/Quality/Profile/EditQualityProfileTemplate.html

@@ -1,13 +1,11 @@
 <div class="modal-header">
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
-    <h3>Edit</h3>
+    <h3>Edit: Quality Profile</h3>
 </div>
 <div class="modal-body">
     <div class="form-horizontal">
-
         <div class="control-group">
             <label class="control-label">Name</label>
-
             <div class="controls">
                 <input type="text" name="name">
                 <span class="help-inline">
@@ -15,15 +13,12 @@
                 </span>
             </div>
         </div>
-
         <div class="control-group">
             <label class="control-label">Cutoff</label>
-
             <div class="controls">
-
                 <select class="x-cutoff" name="cutoff">
                     {{#each allowed}}
-                        <option value="{{id}}">{{name}}</option>
+                    <option value="{{id}}">{{name}}</option>
                     {{/each}}
                 </select>
                 <span class="help-inline">
@@ -31,33 +26,28 @@
                 </span>
             </div>
         </div>
-
-
-        <!--Todo: Why is a null allowed being treated as a true?-->
-        {{debug}}
-        {{#each qualities}}
-            <div class="control-group">
-                <label class="control-label">{{name}}</label>
-
-                <div class="controls">
-                    <label class="checkbox toggle well">
-                        <input type="checkbox" name="qualities.{{@index}}.allowed"/>
-                        <p>
-                            <span>Yes</span>
-                            <span>No</span>
-                        </p>
-
-                        <div class="btn btn-primary slide-button"></div>
-                    </label>
-                </div>
-            </div>
-        {{/each}}
-
-
+    </div>
+    <div>
+        <div class="offset1 span3">
+            <h3>Available</h3>
+            <select multiple="multiple" class="x-available-list">
+                {{#each available}}
+                <option value="{{id}}">{{name}}</option>
+                {{/each}}
+            </select>
+        </div>
+        <div class="span3">
+            <h3>Allowed</h3>
+            <select multiple="multiple" class="x-allowed-list">
+                {{#each allowed}}
+                <option value="{{id}}">{{name}}</option>
+                {{/each}}
+            </select>
+        </div>
     </div>
 </div>
 <div class="modal-footer">
     <button class="btn btn-danger pull-left x-remove">delete</button>
     <button class="btn" data-dismiss="modal">cancel</button>
     <button class="btn btn-primary x-save">save</button>
-</div>
+</div>

UI/Settings/Quality/Profile/EditQualityProfileView.js

@@ -2,10 +2,48 @@
 define(['app', 'Quality/QualityProfileModel'], function () {
 
     NzbDrone.Settings.Quality.Profile.EditQualityProfileView = Backbone.Marionette.ItemView.extend({
-        template : 'Settings/Quality/Profile/EditQualityProfileTemplate',
+        template: 'Settings/Quality/Profile/EditQualityProfileTemplate',
 
         events: {
-            'click .x-save': 'saveQualityProfile'
+            'click .x-save'             : 'saveQualityProfile',
+            'dblclick .x-available-list': '_moveQuality',
+            'dblclick .x-allowed-list'  : '_moveQuality'
+        },
+
+        _moveQuality: function (event) {
+
+            var quality;
+            var qualityId = event.target.value;
+            var availableCollection = new Backbone.Collection(this.model.get('available'));
+            availableCollection.comparator = function (model) {
+                return model.get('weight');
+            };
+
+            var allowedCollection = new Backbone.Collection(this.model.get('allowed'));
+            allowedCollection.comparator = function (model) {
+                return model.get('weight');
+            };
+
+            if (availableCollection.get(qualityId)) {
+                quality = availableCollection.get(qualityId);
+                availableCollection.remove(quality);
+                allowedCollection.add(quality);
+            }
+            else if (allowedCollection.get(qualityId)) {
+                quality = allowedCollection.get(qualityId);
+
+                allowedCollection.remove(quality);
+                availableCollection.add(quality);
+            }
+            else {
+                throw 'couldnt find quality id ' + qualityId;
+            }
+
+
+            this.model.set('available', availableCollection.toJSON());
+            this.model.set('allowed', allowedCollection.toJSON());
+
+            this.render();
         },
 
         saveQualityProfile: function () {