enabling spinners in all spinner required tabs

tabs/pid_tuning.css

@@ -1,3 +1,21 @@
+.tab-pid_tuning {
+}
+    .tab-pid_tuning .spinner {
+        float: right;
+        width: 16px;
+        height: 20px;
+        
+        background-image: url('../images/arrows.png');
+        background-repeat: no-repeat;
+        
+        background-color: white;
+    }
+        .tab-pid_tuning .spinner .up {
+            height: 10px;
+        }
+        .tab-pid_tuning .spinner .down {
+            height: 10px;
+        }
 .tab-pid_tuning table {
     float: left;
     

tabs/pid_tuning.js

@@ -2,6 +2,9 @@ function tab_initialize_pid_tuning() {
     ga_tracker.sendAppView('PID Tuning');
     GUI.active_tab = 'pid_tuning';
     
+    // enable custom spinners
+    add_custom_spinners();
+    
     send_message(MSP_codes.MSP_PID, MSP_codes.MSP_PID, false, function() {
         send_message(MSP_codes.MSP_RC_TUNING, MSP_codes.MSP_RC_TUNING, false, function() {
             // Fill in the data from PIDs array

tabs/receiver.css

@@ -1,5 +1,19 @@
 .tab-receiver {
 }
+    .tab-receiver .spinner {
+        float: right;
+        width: 15px;
+        height: 20px;
+        
+        background-image: url('../images/arrows.png');
+        background-repeat: no-repeat;
+    }
+        .tab-receiver .spinner .up {
+            height: 10px;
+        }
+        .tab-receiver .spinner .down {
+            height: 10px;
+        }
     .tab-receiver .bars {
         float: left;
     }

tabs/receiver.js

@@ -2,6 +2,9 @@ function tab_initialize_receiver() {
     ga_tracker.sendAppView('Receiver Page');
     GUI.active_tab = 'receiver';
     
+    // enable custom spinners
+    add_custom_spinners();
+    
     send_message(MSP_codes.MSP_RC_TUNING, MSP_codes.MSP_RC_TUNING, false, function() {
         // fill in data from RC_tuning
         $('.tunings .throttle input[name="mid"]').val(RC_tuning.throttle_MID.toFixed(2));

tabs/servos.css

@@ -1,3 +1,19 @@
+.tab-servos {
+}
+    .tab-servos .spinner {
+        float: right;
+        width: 15px;
+        height: 20px;
+        
+        background-image: url('../images/arrows.png');
+        background-repeat: no-repeat;
+    }
+        .tab-servos .spinner .up {
+            height: 10px;
+        }
+        .tab-servos .spinner .down {
+            height: 10px;
+        }
 .tab-servos .supported_wrapper, 
 .tab-servos .direction_wrapper {
     display: none;
@@ -40,12 +56,10 @@
         
         background-color: #ececec;
     }
-    .tab-servos table input[type="number"] {
+    .tab-servos table input[type="number"] {        
         width: 65px;
         height: 20px;
         
-        padding-right: 5px;
-        
         line-height: 20px;
         
         text-align: right;

tabs/servos.js

@@ -103,6 +103,9 @@ function tab_initialize_servos() {
                         }
                 }
                 
+                // enable custom spinners
+                add_custom_spinners();
+                
                 // UI hooks for dynamically generated elements
                 $('table.directions select, table.directions input, table.fields select, table.fields input').change(function() {
                     if ($('div.live input').is(':checked')) {