From d61df6fc8241944cb9cd332913ce7b60413d67b4 Mon Sep 17 00:00:00 2001
From: cTn <ctndesigner@gmail.com>
Date: Tue, 9 Apr 2013 01:49:49 +0200
Subject: [PATCH] pid tuning improvements

---
 css/style.css           | 26 +++++++++++++++++++++++
 tabs/initial_setup.html |  6 +++---
 tabs/pid_tuning.html    |  1 +
 tabs/pid_tuning.js      | 47 ++++++++++++++++++++++++++++++++++++++++-
 4 files changed, 76 insertions(+), 4 deletions(-)

diff --git a/css/style.css b/css/style.css
index d14de53c8d..08bdccb3ac 100644
--- a/css/style.css
+++ b/css/style.css
@@ -239,4 +239,30 @@ table.pid_tuning {
     table.pid_tuning a.update:hover {
         text-decoration: none;
         background-color: #13b723;
+    }
+    .tab-pid_tuning .update {
+        display: block;
+        float: right;
+        
+        width: 120px;
+        height: 60px;
+        line-height: 60px;
+        
+        font-size: 14px;
+        color: white;
+        text-align: center;
+        
+        border: 1px solid silver;
+        
+        background-color: #6f1515;
+    }
+    .tab-pid_tuning .update:hover {
+        cursor: default;
+    }
+    .tab-pid_tuning .update.active {
+        background-color: #0fab16;
+    }
+    .tab-pid_tuning .update.active:hover {
+        cursor: pointer;
+        background-color: #13d81d;
     }
\ No newline at end of file
diff --git a/tabs/initial_setup.html b/tabs/initial_setup.html
index 2aba512079..ac16eb2a3b 100644
--- a/tabs/initial_setup.html
+++ b/tabs/initial_setup.html
@@ -2,14 +2,14 @@
     <div class="section">
         <a class="calibrateAccel" href="#">Calibrate Accelerometer</a>
         <p>
-            Place frame on a level surface, proceed with calibration, ensure it is not moving during this period.
+            Place frame on a <strong style="color: green;">level</strong> surface, proceed with calibration, ensure it is <strong style="color: red;">not</strong> moving during this period.
         </p>
     </div>
     <div class="section">
         <a class="calibrateMag" href="#">Calibrate Magnetometer</a>
         <p>
-            Click the button, move multirotor atleast 360 degrees on all axis of rotation. <br />
-            You have 30 seconds to perform this task.
+            Click the button, move multirotor atleast <strong>360</strong> degrees on all axis of rotation. <br />
+            You have <strong style="color: red;">30 seconds</strong> to perform this task.
         </p>
     </div>
 </div>
\ No newline at end of file
diff --git a/tabs/pid_tuning.html b/tabs/pid_tuning.html
index 3b1b0172f4..44b7265bd7 100644
--- a/tabs/pid_tuning.html
+++ b/tabs/pid_tuning.html
@@ -59,4 +59,5 @@
             <td><input type="text" name="p" value="" /></td>
         </tr>        
     </table>
+    <a class="update" href="#">Update</a>
 </div>
\ No newline at end of file
diff --git a/tabs/pid_tuning.js b/tabs/pid_tuning.js
index d02786a32c..f1cd2bd58a 100644
--- a/tabs/pid_tuning.js
+++ b/tabs/pid_tuning.js
@@ -1,4 +1,5 @@
 function tab_initialize_pid_tuning() {
+    // Fill in the data from PIDs array
     var needle = 0;
 
     var i = 0;
@@ -53,6 +54,50 @@ function tab_initialize_pid_tuning() {
     $('.pid_tuning .MAG input').each(function() {
         $(this).val(PIDs[needle][i++].toFixed(2));       
     });
-    needle++;    
+    needle++;  
+
+    // UI Hooks
+    
+    $('.pid_tuning input').change(function() {
+        // if any of the fields changed, unlock update button
+        $('a.update').addClass('active');
+    });
+    
+    $('a.update').click(function() {
+        if ($(this).hasClass('active')) {
+            // Catch all the changes and stuff the inside PIDs array
+            var needle_main = 0;
+            var needle_secondary = 0;
+            
+            $('.pid_tuning input').each(function() {
+                PIDs[needle_main][needle_secondary] = parseFloat($(this).val());
+                needle_secondary++;
+                
+                // exceptions (required for the "shorter" PID arrays, 2 fields, 1 field, etc)
+                if (needle_main == 4) {
+                    if (needle_secondary >= 2) {
+                        needle_main++;
+                        needle_secondary = 0;
+                    }
+                } else if (needle_main == 8) {
+                    if (needle_secondary >= 1) {
+                        needle_main++;
+                        needle_secondary = 0;
+                    }
+                } else {
+                    if (needle_secondary >= 3) {
+                        needle_main++;
+                        needle_secondary = 0;
+                    }
+                }
+            });
+            
+            // Send over the changes
+            
+            
+            // remove the active status
+            $(this).removeClass('active');
+        }
+    });
     
 }
\ No newline at end of file