Some cosmetic fixes.

git-svn-id: https://src.develer.com/svnoss/bertos/trunk@5171 38d2e660-2303-0410-9eaa-f027e97ec537

diff --git a/boards/sam3x-ek/examples/sam3x-ek_http_server/sd_data/etc/style.css b/boards/sam3x-ek/examples/sam3x-ek_http_server/sd_data/etc/style.css
index 904b0c127c0fde5b4ac90053a6057e0f777efae3..d371b4016b767931763204caeb2b1bd27c24711f 100644 (file)
--- a/boards/sam3x-ek/examples/sam3x-ek_http_server/sd_data/etc/style.css
+++ b/boards/sam3x-ek/examples/sam3x-ek_http_server/sd_data/etc/style.css
@@ -14,7 +14,7 @@ body {
 #header h1,#header h3, #header div, #header img {
        display: inline-block;
        vertical-align: top;
-       
+
 }
 
 #header {
@@ -44,7 +44,7 @@ body {
        width: 800px;
        margin:0px auto;
        background-color: #ffffff;
-       
+
 }
 
 #footer {
@@ -84,7 +84,7 @@ body {
        margin: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
-       border-radius: 5px;     
+       border-radius: 5px;
 }
 
 .led-on span {
@@ -99,19 +99,37 @@ body {
        display: inline-block;
 }
 
+#led-0.led-on {
+       background-color:#0BC713;
+       color:#000000;
+       border: 1px solid #09580D;
+}
+
+#led-1.led-on {
+       background-color:#FAC52B;
+       color:#000000;
+       border: 1px solid #BB9010;
+}
+
+#led-2.led-on {
+       background-color:#1FC2E2;
+       color:#000000;
+       border: 1px solid #00697E;
+}
+
 .led-off {
        color:#FFFFFF;
        font-size: 0.9em;
        cursor:pointer;
        width:55px;
        display:inline-block;
-       background-color:#F58220;
-       border: 1px solid #F58220;
+       background-color:#A7A7A7;
+       border: 1px solid #A7A7A7;
        padding: 2px;
        margin: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
-       border-radius: 5px;     
+       border-radius: 5px;
 }
 
 .led-off span {
@@ -133,7 +151,7 @@ body {
        margin: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
-       border-radius: 5px;     
+       border-radius: 5px;
 }
 
 .trigger span {
@@ -164,8 +182,12 @@ body {
        text-align:center;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
-       border-radius: 5px;     
+       border-radius: 5px;
 }
 
+.label {
+ width: 150px;
+ display: inline-block;
+}
 
 

diff --git a/boards/sam3x-ek/examples/sam3x-ek_http_server/sd_data/index.htm b/boards/sam3x-ek/examples/sam3x-ek_http_server/sd_data/index.htm
index 0d52c0c177f64e8b740cd9ecf4143e31c2885d09..fc2e701b2edb16b7a4da8ccc1cf5ce92bcce75cc 100644 (file)
--- a/boards/sam3x-ek/examples/sam3x-ek_http_server/sd_data/index.htm
+++ b/boards/sam3x-ek/examples/sam3x-ek_http_server/sd_data/index.htm
@@ -10,32 +10,16 @@
                <script type="text/javascript" src="etc/js/jqflot.js"></script>
                <script type="text/javascript">
                        $(document).ready(function() {
-
                                $.ajax({
                                          url: "get_chipinfo",
                                          dataType :'json',
+                                         async: false,
                                          success: function(data){
                                                $.each(data,function(k,v){
                                                        $('#'+k).text(v);
                                                });
                                          }
                                        });
-                               $.ajax({
-                                         url: "get_ledStatus",
-                                         dataType :'json',
-                                         success: function(data){
-                                               $.each(data,function(k,v){
-
-                                                       if (v == 1) {
-                                                               $('#led-'+k).addClass('led-on').removeClass('led-off').text('ON').append("<span>&nbsp;</span>");
-                                                       } else {
-                                                               $('#led-'+k).addClass('led-off').removeClass('led-on').text('OFF').prepend("<span>&nbsp;</span>");
-                                                       }
-
-                                               });
-                                         }
-                                       });
-
                                var set_led_status = function(elm,status) {
 
                                        if (status == 1) {
@@ -43,68 +27,68 @@
                                        } else {
                                                elm.addClass('led-off').removeClass('led-on').text('OFF').prepend("<span>&nbsp;</span>");
                                        }
-
-                                       $.ajax({
+                               }
+                               $("span[id^=led]").click(function(){
+                                       var elm = $(this);
+                                       if (elm.hasClass('led-off')) {
+                                               var status = 1;
+                                       } else {
+                                               var status = 0;
+                                       }
+                                       set_led_status(elm, status);
+                                       $.ajax({
                                          url: "set_led",
+                                         async: false,
                                          data:{'n':elm.attr('name'),'set':status},
                                          dataType :'json',
                                          success: function(){
-
                                          }
                                        });
-                               }
-
-
-                               $("span[id^=led]").click(function(){
-                                       var elm = $(this);
-                                       if (elm.hasClass('led-on')) {
-                                               set_led_status(elm,0);
-                                       } else {
-                                               set_led_status(elm,1);
-                                       }
                                });
-
-
                                var options = {
                                series: { shadowSize: 0 },
-                               yaxis: { min: 0},
-                               xaxis: {min:0}
+                               yaxis:  { min: 0},
+                               xaxis:  {min:0}
                            };
 
                                var temperature_data = [];
-                               var plot_temperature = $.plot($("#temperature-plot"), [temperature_data], options);
-
+                               var plot_temperature = $.plot($("#temperature-plot"), [{label: "Temperature", data:temperature_data}], options);
 
                            function updateStatus() {
 
                        $.ajax({
                                          url: "status",
+                                         async: false,
                                          dataType :'json',
                                          success: function(data){
 
                                                 $('#potentiometer').width(200*(parseInt(data['volt'])/4095));
+                                                $('#potentiometer-value').text(data['volt'])
                                                 $('#uptime').text(data['up_time'] +' sec');
                                                 $('#temperature').text(data['temp']+' °C');
+                                                $('#local_ip').text(data['local_ip']);
+                                                $('#last_connected_ip').text(data['last_connected_ip']);
+                                                $('#tot_req').text(data['tot_req']);
+
+                                                $.each(data['leds'], function (key,v) {
+                                                       set_led_status($('#led-' + key), v);
+                                                       });
+
                                                 temperature_data.push([data['up_time'],data['temp']]);
 
                                                 var x = plot_temperature.getAxes().xaxis.options;
                                                 var y = plot_temperature.getAxes().yaxis.options;
                                                 x.max = Math.max(25,data['up_time']);
                                                 x.min = Math.max(0,(x.max - 25));
-                                                y.autoscale = true;
-                                                plot_temperature.setData([temperature_data]);
+
+                                                plot_temperature.setData([{label: "Temperature", data:temperature_data}]);
                                                 plot_temperature.setupGrid();
                                                 plot_temperature.draw();
                                                 setTimeout(updateStatus, 1000);
-
                                          }
                                        });
-
                            }
-
                           updateStatus();
-
-
                        });
 
                </script>
@@ -125,16 +109,21 @@
                                </div>
                                <div class="content">
                                        <b>Hardware Info:</b><br>
-                                       <b>Core name:</b><span id="core_name"></span>
-                                       <b>Arch name:</b><span id="arch_name"></span>
-                                       <b>Sram size:</b><span id="sram_size"></span>
-                                       <b>Flash size:</b><span id="flash_size"></span>
-                                       <b>Mem boot type:</b><span id="mem_boot_type"></span>
+                                       <b>CPU Core:</b><span id="core_name">--</span><br>
+                                       <b>Chip name:</b><span id="arch_name">--</span><br>
+                                       <b>SRAM size:</b><span id="sram_size">--</span><br>
+                                       <b>Flash size:</b><span id="flash_size">--</span><br>
+                                       <b>Boot from memory:</b><span id="mem_boot_type">--</span>
+                                       <br>
+                                       <b>Connections Info:</b><br>
+                                       <b>Board IP:</b><span id="local_ip">--</span><br>
+                                       <b>Your IP:</b><span id="last_connected_ip">--</span><br>
+                                       <b>Total status requests:</b><span id="tot_req">--</span><br>
                                </div>
                                <div class="content">
                                        <div class="control">
-                                               <b>BeRTOS uptime:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</b><span id="uptime" class="box">--</span><br>
-                                               <b>Current temperature:</b><span id="temperature" class="box">--</span><br/>
+                                               <b class="label">BeRTOS uptime:</b><span id="uptime" class="box">--</span><br>
+                                               <b class="label">Current temperature:</b><span id="temperature" class="box">--</span><br/>
                                        </div>
                                        <div class="control">
                                                <b>Led status:</b><br/>
@@ -142,7 +131,7 @@
                                        </div>
                                        <div class="control">
                                                <b>Potentiometer Value:</b><br/>
-                                               <span class="trigger"><span id="potentiometer">&nbsp;</span></span>
+                                               <span class="trigger"><span id="potentiometer">&nbsp;</span></span>&nbsp;<span id="potentiometer-value">--</span>
                                        </div>
                                </div>
                                <div class="content">