Sugared quality size knobs

UI/Quality/QualitySizeModel.js

@@ -8,10 +8,22 @@ define(
 
             mutators: {
                 thirtyMinuteSize: function () {
-                    return this.get('maxSize') * 30;
+                    var maxSize = this.get('maxSize');
+
+                    if (maxSize === 0) {
+                        return 'No Limit';
+                    }
+
+                    return (maxSize * 1024 * 1024 * 30).bytes(1);
                 },
                 sixtyMinuteSize : function () {
-                    return this.get('maxSize') * 60;
+                    var maxSize = this.get('maxSize');
+
+                    if (maxSize === 0) {
+                        return 'No Limit';
+                    }
+
+                    return (maxSize * 1024 * 1024 * 60).bytes(1);
                 }
             }
         });

UI/Settings/Quality/Size/QualitySizeTemplate.html

@@ -5,13 +5,13 @@
             <div>
                 <span class="label label-large label-warning x-size-thirty"
                       name="thirtyMinuteSize"
-                      title="Maximum size for a 30 minute episode in Megabytes">
+                      title="Maximum size for a 30 minute episode">
                 </span>
             </div>
             <div>
                 <span class="label label-large label-info x-size-sixty"
                       name="sixtyMinuteSize"
-                      title="Maximum size for a 60 minute episode in Megabytes">
+                      title="Maximum size for a 60 minute episode">
                 </span>
             </div>
         </div>

UI/Settings/Quality/Size/QualitySizeView.js

@@ -24,7 +24,7 @@ define(['marionette', 'Mixins/AsModelBoundView', 'jquery.knob'], function (Mario
             this.ui.knob.knob({
                 min          : 0,
                 max          : 200,
-                step         : 10,
+                step         : 5,
                 cursor       : 25,
                 width        : 150,
                 stopper      : true,
@@ -32,11 +32,19 @@ define(['marionette', 'Mixins/AsModelBoundView', 'jquery.knob'], function (Mario
             });
         },
 
-        _changeMaxSize: function (e) {
+        _changeMaxSize: function () {
-            var value = this.model.get('maxSize');
+            var maxSize = this.model.get('maxSize');
+            var bytes = maxSize * 1024 * 1024;
+            var thirty = (bytes * 30).bytes(1);
+            var sixty = (bytes * 60).bytes(1);
 
-            this.ui.thirtyMinuteSize.html(value * 30);
+            if (parseInt(maxSize) === 0) {
-            this.ui.sixtyMinuteSize.html(value * 60);
+                thirty = 'No Limit';
+                sixty = 'No Limit';
+            }
+
+            this.ui.thirtyMinuteSize.html(thirty);
+            this.ui.sixtyMinuteSize.html(sixty);
         }
     });