Settings forms are fixed.

NzbDrone.Web/Content/NzbDrone.css

@@ -169,18 +169,6 @@ hr
     margin-right: 135px;
 }
 
-button, input[type="button"], input[type="submit"], input[type="reset"]
-{
-    color: white;
-    background-color: #065EFE;
-    border-style: solid;
-    border-color: #065EFE;
-}
-
-button:active, input[type="button"]:active, input[type="submit"]:active, input[type="reset"]:active
-{
-    border-color: #0C48B6;
-}
 
 input[type=text], select
 {

NzbDrone.Web/Content/Settings.css

@@ -1,11 +1,19 @@
-body 
+body
 {
-    /*font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
+    /*font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;     font-size:12px;*/
-    font-size:12px;*/
 }
 
-p, h1, form, button{border:0; margin:0; padding:0;}
+p, h1, form, button
-.spacer{clear:both; height:1px;}
+{
+    border: 0;
+    margin: 0;
+    padding: 0;
+}
+.spacer
+{
+    clear: both;
+    height: 1px;
+}
 
 .settingsForm
 {
@@ -15,47 +23,47 @@ p, h1, form, button{border:0; margin:0; padding:0;}
 
 #stylized h1
 {
-    font-size:20px;
+    font-size: 20px;
-    font-weight:bold;
+    font-weight: bold;
-    margin-bottom:8px;
+    margin-bottom: 8px;
 }
 
 #stylized p
 {
-    font-size:11px;
+    font-size: 11px;
-    color:#666666;
+    color: #666666;
-    margin-bottom:20px;
+    margin-bottom: 20px;
-    border-bottom:solid 1px #b7ddf2;
+    border-bottom: solid 1px #b7ddf2;
-    padding-bottom:10px;
+    padding-bottom: 10px;
 }
 
 #stylized .labelClass
 {
-    display:block;
+    display: block;
-    font-weight:bold;
+    font-weight: bold;
-    text-align:right;
+    text-align: right;
-    width:340px;
+    width: 340px;
-    float:left;
+    float: left;
     margin-bottom: -10px;
 }
 
 #stylized .small
 {
-    color:#666666;
+    color: #666666;
-    display:block;
+    display: block;
-    font-size:11px;
+    font-size: 11px;
-    font-weight:normal;
+    font-weight: normal;
-    text-align:right;
+    text-align: right;
-    width:340px;
+    width: 340px;
 }
 
 #stylized .inputClass
 {
-    float:left;
+    float: left;
-    padding:4px 2px;
+    padding: 4px 2px;
-    border:solid 1px #aacfe4;
+    border: solid 1px #aacfe4;
-    width:200px;
+    width: 200px;
-    margin:2px 0 20px 10px;
+    margin: 2px 0 20px 10px;
 }
 
 #stylized .selectClass
@@ -65,31 +73,22 @@ p, h1, form, button{border:0; margin:0; padding:0;}
 
 #stylized .checkClass
 {
-    margin:10px 0 10px 10px;
+    margin: 10px 0 10px 10px;
 }
 
 #stylized button
 {
-    clear:both;
+    clear: both;
-    margin-left:220px;
+    margin-left: 220px;
     margin-bottom: 10px;
-    width:125px;
+    width: 125px;
-    height:31px;
+    height: 31px;
-    background:#666666;
+    text-align: center;
-    text-align:center;
+    line-height: 31px;
-    line-height:31px;
+    font-size: 11px;
-    color:#FFFFFF;
+    font-weight: bold;
-    font-size:11px;
-    font-weight:bold;
 }
 
-#save_button:hover
-{
-    border-bottom-style: solid;
-    border-bottom-width: 4px;
-    border-color: #3C3C3C;
-    padding-bottom: 2px;
-}
 
 #saveAjax
 {
@@ -101,9 +100,9 @@ p, h1, form, button{border:0; margin:0; padding:0;}
 }
 
 #save_button[disabled="disabled"]
-{      
+{
     padding: 0px 6px 0px 6px;
     border: 2px outset ButtonFace;
     color: lightgrey;
     cursor: progress;
-}
+}

NzbDrone.Web/NzbDrone.Web.csproj

@@ -372,6 +372,7 @@
     <Content Include="Scripts\jquery-1.7.1.js" />
     <Content Include="Scripts\jquery-1.7.1.min.js" />
     <Content Include="Scripts\jquery.hotkeys.js" />
+    <Content Include="Scripts\jquery.livequery.js" />
     <Content Include="Scripts\jquery.validate-vsdoc.js" />
     <Content Include="Scripts\jquery.validate.js" />
     <Content Include="Scripts\jquery.validate.min.js" />
@@ -383,7 +384,7 @@
     <Content Include="Scripts\NzbDrone\LocalSearch.js" />
     <Content Include="Scripts\NzbDrone\Notification.js" />
     <Content Include="Scripts\NzbDrone\seriesDetails.js" />
-    <Content Include="Scripts\NzbDrone\settingsForm.js" />
+    <Content Include="Scripts\NzbDrone\AutoBind.js" />
     <Content Include="Scripts\jquery-ui-1.8.16.js" />
     <Content Include="Scripts\jquery-ui-1.8.16.min.js" />
     <Content Include="Scripts\jquery.gritter.js" />
@@ -414,7 +415,6 @@
     <Content Include="Views\Settings\Notifications.cshtml" />
     <Content Include="Views\Settings\Quality.cshtml" />
     <Content Include="Views\AddSeries\RootDir.cshtml" />
-    <Content Include="Views\Settings\SubMenu.cshtml" />
     <Content Include="Views\Shared\_Layout.cshtml" />
     <Content Include="Views\Shared\Footer.cshtml" />
     <Content Include="Views\_ViewStart.cshtml" />
@@ -464,9 +464,6 @@
   <ItemGroup>
     <Content Include="Views\AddSeries\RootList.cshtml" />
   </ItemGroup>
-  <ItemGroup>
-    <Content Include="Views\Settings\Test.cshtml" />
-  </ItemGroup>
   <ItemGroup>
     <Content Include="Views\Misnamed\Index.cshtml" />
   </ItemGroup>

NzbDrone.Web/Scripts/NzbDrone/AutoBind.js

@@ -0,0 +1,25 @@
+$(document).ready(function () {
+
+    //All forms are ajax forms
+    $("form").livequery(function () {
+
+        var options = {
+            type: 'post',
+            resetForm: false
+        };
+
+        $(this).ajaxForm(options);
+
+    });
+
+    $('Form button').livequery(function () {
+        $(this).removeAttr('disabled');
+    });
+
+    
+    //All buttons are jQueryUI buttons
+    $('button, input[type="button"], input[type="submit"], input[type="reset"]').livequery(function () {
+        $(this).button();
+    });
+
+});

NzbDrone.Web/Scripts/NzbDrone/Notification.js

@@ -13,8 +13,6 @@
 
         jqXHR.success(function (data) {
             //Check if the response is a message type,
-
-            console.log(this.url);
             if (data.IsMessage) {
                 if (data.NotificationType === 0) {
                     $.gritter.add({

NzbDrone.Web/Scripts/NzbDrone/settingsForm.js

@@ -1,8 +0,0 @@
-$(document).ready(function () {
-    var options = {
-        type: 'post',
-        resetForm: false
-    };
-    $('#form').ajaxForm(options);
-    $('#save_button').removeAttr('disabled');
-});

NzbDrone.Web/Scripts/jquery.livequery.js

@@ -0,0 +1,226 @@
+/*! Copyright (c) 2010 Brandon Aaron (http://brandonaaron.net)
+* Dual licensed under the MIT (MIT_LICENSE.txt)
+* and GPL Version 2 (GPL_LICENSE.txt) licenses.
+*
+* Version: 1.1.1
+* Requires jQuery 1.3+
+* Docs: http://docs.jquery.com/Plugins/livequery
+*/
+
+(function ($) {
+
+    $.extend($.fn, {
+        livequery: function (type, fn, fn2) {
+            var self = this, q;
+
+            // Handle different call patterns
+            if ($.isFunction(type))
+                fn2 = fn, fn = type, type = undefined;
+
+            // See if Live Query already exists
+            $.each($.livequery.queries, function (i, query) {
+                if (self.selector == query.selector && self.context == query.context &&
+				type == query.type && (!fn || fn.$lqguid == query.fn.$lqguid) && (!fn2 || fn2.$lqguid == query.fn2.$lqguid))
+                // Found the query, exit the each loop
+                    return (q = query) && false;
+            });
+
+            // Create new Live Query if it wasn't found
+            q = q || new $.livequery(this.selector, this.context, type, fn, fn2);
+
+            // Make sure it is running
+            q.stopped = false;
+
+            // Run it immediately for the first time
+            q.run();
+
+            // Contnue the chain
+            return this;
+        },
+
+        expire: function (type, fn, fn2) {
+            var self = this;
+
+            // Handle different call patterns
+            if ($.isFunction(type))
+                fn2 = fn, fn = type, type = undefined;
+
+            // Find the Live Query based on arguments and stop it
+            $.each($.livequery.queries, function (i, query) {
+                if (self.selector == query.selector && self.context == query.context &&
+				(!type || type == query.type) && (!fn || fn.$lqguid == query.fn.$lqguid) && (!fn2 || fn2.$lqguid == query.fn2.$lqguid) && !this.stopped)
+                    $.livequery.stop(query.id);
+            });
+
+            // Continue the chain
+            return this;
+        }
+    });
+
+    $.livequery = function (selector, context, type, fn, fn2) {
+        this.selector = selector;
+        this.context = context;
+        this.type = type;
+        this.fn = fn;
+        this.fn2 = fn2;
+        this.elements = [];
+        this.stopped = false;
+
+        // The id is the index of the Live Query in $.livequery.queries
+        this.id = $.livequery.queries.push(this) - 1;
+
+        // Mark the functions for matching later on
+        fn.$lqguid = fn.$lqguid || $.livequery.guid++;
+        if (fn2) fn2.$lqguid = fn2.$lqguid || $.livequery.guid++;
+
+        // Return the Live Query
+        return this;
+    };
+
+    $.livequery.prototype = {
+        stop: function () {
+            var query = this;
+
+            if (this.type)
+            // Unbind all bound events
+                this.elements.unbind(this.type, this.fn);
+            else if (this.fn2)
+            // Call the second function for all matched elements
+                this.elements.each(function (i, el) {
+                    query.fn2.apply(el);
+                });
+
+            // Clear out matched elements
+            this.elements = [];
+
+            // Stop the Live Query from running until restarted
+            this.stopped = true;
+        },
+
+        run: function () {
+            // Short-circuit if stopped
+            if (this.stopped) return;
+            var query = this;
+
+            var oEls = this.elements,
+			els = $(this.selector, this.context),
+			nEls = els.not(oEls);
+
+            // Set elements to the latest set of matched elements
+            this.elements = els;
+
+            if (this.type) {
+                // Bind events to newly matched elements
+                nEls.bind(this.type, this.fn);
+
+                // Unbind events to elements no longer matched
+                if (oEls.length > 0)
+                    $.each(oEls, function (i, el) {
+                        if ($.inArray(el, els) < 0)
+                            $.event.remove(el, query.type, query.fn);
+                    });
+            }
+            else {
+                // Call the first function for newly matched elements
+                nEls.each(function () {
+                    query.fn.apply(this);
+                });
+
+                // Call the second function for elements no longer matched
+                if (this.fn2 && oEls.length > 0)
+                    $.each(oEls, function (i, el) {
+                        if ($.inArray(el, els) < 0)
+                            query.fn2.apply(el);
+                    });
+            }
+        }
+    };
+
+    $.extend($.livequery, {
+        guid: 0,
+        queries: [],
+        queue: [],
+        running: false,
+        timeout: null,
+
+        checkQueue: function () {
+            if ($.livequery.running && $.livequery.queue.length) {
+                var length = $.livequery.queue.length;
+                // Run each Live Query currently in the queue
+                while (length--)
+                    $.livequery.queries[$.livequery.queue.shift()].run();
+            }
+        },
+
+        pause: function () {
+            // Don't run anymore Live Queries until restarted
+            $.livequery.running = false;
+        },
+
+        play: function () {
+            // Restart Live Queries
+            $.livequery.running = true;
+            // Request a run of the Live Queries
+            $.livequery.run();
+        },
+
+        registerPlugin: function () {
+            $.each(arguments, function (i, n) {
+                // Short-circuit if the method doesn't exist
+                if (!$.fn[n]) return;
+
+                // Save a reference to the original method
+                var old = $.fn[n];
+
+                // Create a new method
+                $.fn[n] = function () {
+                    // Call the original method
+                    var r = old.apply(this, arguments);
+
+                    // Request a run of the Live Queries
+                    $.livequery.run();
+
+                    // Return the original methods result
+                    return r;
+                }
+            });
+        },
+
+        run: function (id) {
+            if (id != undefined) {
+                // Put the particular Live Query in the queue if it doesn't already exist
+                if ($.inArray(id, $.livequery.queue) < 0)
+                    $.livequery.queue.push(id);
+            }
+            else
+            // Put each Live Query in the queue if it doesn't already exist
+                $.each($.livequery.queries, function (id) {
+                    if ($.inArray(id, $.livequery.queue) < 0)
+                        $.livequery.queue.push(id);
+                });
+
+            // Clear timeout if it already exists
+            if ($.livequery.timeout) clearTimeout($.livequery.timeout);
+            // Create a timeout to check the queue and actually run the Live Queries
+            $.livequery.timeout = setTimeout($.livequery.checkQueue, 20);
+        },
+
+        stop: function (id) {
+            if (id != undefined)
+            // Stop are particular Live Query
+                $.livequery.queries[id].stop();
+            else
+            // Stop all Live Queries
+                $.each($.livequery.queries, function (id) {
+                    $.livequery.queries[id].stop();
+                });
+        }
+    });
+
+    // Register core DOM manipulation methods
+    $.livequery.registerPlugin('append', 'prepend', 'after', 'before', 'wrap', 'attr', 'removeAttr', 'addClass', 'removeClass', 'toggleClass', 'empty', 'remove', 'html');
+
+    // Run Live Queries when the Document is ready
+    $(function () { $.livequery.play(); });
+
+})(jQuery);

NzbDrone.Web/Views/Settings/Indexers.cshtml

@@ -14,7 +14,7 @@
 <div class="infoBox">
     RSS feeds are checked every 15 minutes for new episodes.</div>
 <div id="stylized">
-    @using (Html.BeginForm("SaveIndexers", "Settings", FormMethod.Post, new { id = "form", name = "form", @class = "settingsForm" }))
+    @using (Html.BeginForm("SaveIndexers", "Settings", FormMethod.Post, new { id = "IndexersForm", name = "IndexersForm", @class = "settingsForm" }))
     {
         @Html.ValidationSummary(true, "Unable to save your settings. Please correct the errors and try again.")
         <div id="accordion">
@@ -106,12 +106,12 @@
             </div>
         </div>
         <br />
-        <button type="submit" id="save_button" disabled="disabled">
+        <button type="submit" class="save_button" disabled="disabled">
             Save</button>
     }
 </div>
 @section Scripts{
-    <script src="../../Scripts/NzbDrone/settingsForm.js" type="text/javascript"></script>
+
     <script type="text/javascript">
         $("#addItem").live('click', function () {
             $.ajax({

NzbDrone.Web/Views/Settings/Naming.cshtml

@@ -18,7 +18,7 @@
     </style>
 }
 <div id="stylized">
-    @using (Html.BeginForm("SaveNaming", "Settings", FormMethod.Post, new { id = "form", name = "form", @class = "settingsForm" }))
+    @using (Html.BeginForm("SaveNaming", "Settings", FormMethod.Post, new { id = "NamingForm", name = "NamingForm", @class = "settingsForm" }))
     {
         <div class="settingsContainer">
             @Html.ValidationSummary(true, "Unable to save your settings. Please correct the errors and try again.")
@@ -68,12 +68,12 @@
             </div>
         </div>
         
-        <button type="submit" id="save_button" disabled="disabled">
+        <button type="submit" class="save_button" disabled="disabled">
             Save</button>
     }
 </div>
 @section Scripts{
-    <script src="../../Scripts/NzbDrone/settingsForm.js" type="text/javascript"></script>
+
     <script type="text/javascript">
         $(document).ready(function () {
             createExamples();

NzbDrone.Web/Views/Settings/Notifications.cshtml

@@ -30,7 +30,7 @@
     </style>
 }
 <div id="stylized">
-    @using (Html.BeginForm("SaveNotifications", "Settings", FormMethod.Post, new { id = "form", name = "form", @class = "settingsForm" }))
+    @using (Html.BeginForm("SaveNotifications", "Settings", FormMethod.Post, new { id = "NotificationForm", name = "NotificationForm", @class = "settingsForm" }))
     {
         <div id="accordion2">
             <h3>
@@ -50,12 +50,12 @@
             @{Html.RenderPartial("Prowl", Model);}
         </div>
             
-        <button type="submit" id="save_button" disabled="disabled">
+        <button type="submit" class="save_button" disabled="disabled">
             Save</button>
     }
 </div>
 @section Scripts{
-    <script src="../../Scripts/NzbDrone/settingsForm.js" type="text/javascript"></script>
+
     <script type="text/javascript">
         $(function () {
             $("#accordion2").accordion({

NzbDrone.Web/Views/Settings/Quality.cshtml

@@ -7,7 +7,7 @@
     <link href="../../Content/QualitySettings.css" rel="stylesheet" type="text/css" />
 }
 <div id="stylized">
-    @using (Html.BeginForm("SaveQuality", "Settings", FormMethod.Post, new { id = "form", name = "form" }))
+    @using (Html.BeginForm("SaveQuality", "Settings", FormMethod.Post, new { id = "QualityForm", name = "QualityForm" }))
     {
         <div id="top" class="settingsForm">
             <label class="labelClass">@Html.LabelFor(m => m.DefaultQualityProfileId)
@@ -81,14 +81,14 @@
                 </div>
             </div>
             <br />
-            <button type="submit" id="save_button" disabled="disabled">
+            <button type="submit" class="save_button" disabled="disabled">
                 Save</button>
         </div>
     }
 </div>
 @section Scripts{
     <script src="../../Scripts/MicrosoftAjax.js" type="text/javascript"></script>
-    <script src="../../Scripts/NzbDrone/settingsForm.js" type="text/javascript"></script>
+
     <script type="text/javascript">
         var deleteQualityProfileUrl = '@Url.Action("DeleteQualityProfile", "Settings")';
 

NzbDrone.Web/Views/Settings/Sabnzbd.cshtml

@@ -5,7 +5,7 @@
     <link rel="stylesheet" type="text/css" href="../../Content/Settings.css" />
 }
 <div id="stylized">
-    @using (Html.BeginForm("SaveSabnzbd", "Settings", FormMethod.Post, new { id = "form", name = "form", @class = "settingsForm" }))
+    @using (Html.BeginForm("SaveSabnzbd", "Settings", FormMethod.Post, new { id = "SabForm", name = "SabForm", @class = "settingsForm" }))
     {
         <label class="labelClass">
             Auto-Configure <span class="small">If access to SABnzbd doesn't require a username +
@@ -54,14 +54,14 @@
         </label>
         @Html.TextBoxFor(m => m.SabDropDirectory, new { @class = "inputClass folderLookup" })
 
-        <button type="submit" id="save_button" disabled="disabled">
+        <button type="submit" class="save_button" disabled="disabled">
             Save</button>
     }
 </div>
 <div id="result" class="hiddenResult">
 </div>
 @section Scripts{
-    <script src="../../Scripts/NzbDrone/settingsForm.js" type="text/javascript"></script>
+
     <script type="text/javascript">
         var autoConfigureSabUrl = '@Url.Action("AutoConfigureSab", "Settings")';
 

NzbDrone.Web/Views/Settings/SubMenu.cshtml

@@ -1,10 +0,0 @@
-<ul class="sub-menu">
-    <li>@Html.ActionLink("Indexers", "Indexers", "Settings")</li>
-    <li>@Html.ActionLink("Quality", "Quality", "Settings")</li>
-    <li>@Html.ActionLink("Naming", "Naming", "Settings")</li>
-    <li>@Html.ActionLink("Notifications", "Notifications", "Settings")</li>
-    <li>@Html.ActionLink("SABnzbd", "Sabnzbd", "Settings")</li>
-    <li>@Html.ActionLink("System", "System", "Settings")</li>
-</ul>
-<div style="margin-bottom: 10px">
-</div>

NzbDrone.Web/Views/Settings/System.cshtml

@@ -6,7 +6,7 @@
     <link rel="stylesheet" type="text/css" href="../../Content/Settings.css" />
 }
 <div id="stylized">
-    @using (Html.BeginForm("SaveSystem", "Settings", FormMethod.Post, new { id = "form", name = "form", @class = "settingsForm" }))
+    @using (Html.BeginForm("SaveSystem", "Settings", FormMethod.Post, new { id = "SystemForm", name = "SystemForm", @class = "settingsForm" }))
     {
         @Html.ValidationSummary(true, "Unable to save your settings. Please correct the errors and try again.")
         <label class="labelClass">@Html.LabelFor(m => m.LaunchBrowser)
@@ -24,10 +24,10 @@
         </label>
         @Html.DropDownListFor(m => m.AuthenticationType, Model.AuthTypeSelectList, new { @class = "inputClass" })
         
-        <button type="submit" id="save_button" disabled="disabled">
+        <button type="submit" class="save_button" disabled="disabled">
             Save</button>
     }
 </div>
 @section Scripts{
-    <script src="../../Scripts/NzbDrone/settingsForm.js" type="text/javascript"></script>
+
 }

NzbDrone.Web/Views/Settings/Test.cshtml

@@ -1,12 +0,0 @@
-<script>
-    $(function () {
-//        $(".quality-selectee").each(function() {
-//            $(this).button();
-//        });
-        $('#test').button();
-    });
-</script>
-
-<input type="checkbox" id="test" class="quality-selectee" /><label for="shuffle">SDTV</label>
-<input type="checkbox" class="quality-selectee" /><label for="shuffle">DVD</label>
-<input type="checkbox" class="quality-selectee" /><label for="shuffle">HDTV</label>

NzbDrone.Web/Views/Shared/_RefrenceLayout.cshtml

@@ -20,6 +20,7 @@
     @RenderBody()
     @(Html.Telerik().ScriptRegistrar().jQuery(true))
     <script type="text/javascript" src="../../Scripts/jquery-ui-1.8.16.min.js"></script>
+    <script type="text/javascript" src="../../Scripts/jquery.livequery.js"></script>
     <script type="text/javascript" src="../../Scripts/MicrosoftAjax.js"></script>
     <script type="text/javascript" src="../../Scripts/MicrosoftMvcAjax.js"></script>
     <script type="text/javascript" src="../../Scripts/jquery.gritter.js"></script>
@@ -32,6 +33,7 @@
     <script type="text/javascript" src="../../Scripts/NzbDrone/AutoComplete.js"></script>
     <script type="text/javascript" src="../../Scripts/NzbDrone/LocalSearch.js"></script>
     <script type="text/javascript" src="../../Scripts/NzbDrone/Notification.js"></script>
+    <script type="text/javascript" src="../../Scripts/NzbDrone/AutoBind.js"></script>
     @RenderSection("Scripts", required: false)
 </body>
 </html>