Make analog progress bar show color and value in ajax

Web/htdocs/gui/buttons/analog.php

@@ -29,13 +29,14 @@ $perc=(floatval($button['status'])-floatval($button['minval']))*100/(floatval($b
             <h4 class="devlist-name"><?=$button['button_name']?></h4>
             <div class="progress">
                <div class="progress-bar <?=$anacol?>" role="progressbar" aria-valuenow="<?=floatval($button['status'])/$button['divider']?>" aria-valuemin="<?=$button['minval']?>" 
-                  aria-valuemax="<?=$button['maxval']?>" style="width: <?=$perc?>%;"
+                  aria-valuemax="<?=$button['maxval']?>" style="width: <?=$perc?>%;" 
                   data-dmcolor-min="<?=$pbcoln.$dmcolors[$button['color_min']]?>" data-dmcolor-low="<?=$pbcoln.$dmcolors[$button['color_low']]?>"
                   data-dmcolor-med="<?=$pbcoln.$dmcolors[$button['color_medium']]?>" data-dmcolor-high="<?=$pbcoln.$dmcolors[$button['color_high']]?>"
                   data-dmval-min="<?=floatval($button['minval'])?>" data-dmval-low="<?=floatval($button['lowval'])?>"
                   data-dmval-high="<?=floatval($button['highval'])?>" data-dmval-max="<?=floatval($button['maxval'])?>"
-                  data-dmval-divider="<?=floatval($button['divider'])?>" data-domotika-anaprog="<?=$button['id']?>">
-               <span class="sr-only"><?=floatval($button['status'])/$button['divider']?></span>
+                  data-domotika-anaprog="<?=$button['id']?>">
+               <span class="sr-only" data-domotika-anat="<?=$button['id']?>" 
+                  data-dmval-divider="<?=floatval($button['divider'])?>"><?=floatval($button['status'])/$button['divider']?></span>
             </div>
          </div>
       </div>
@@ -43,7 +44,10 @@ $perc=(floatval($button['status'])-floatval($button['minval']))*100/(floatval($b
          <button class="btn devlist-button <?=$btncol?>" data-domotika-anaid="<?=$button['id']?>" 
             data-dmcolor-min="btn-<?=$dmcolors[$button['color_min']]?>" data-dmcolor-low="btn-<?=$dmcolors[$button['color_low']]?>"
             data-dmcolor-med="btn-<?=$dmcolors[$button['color_medium']]?>" data-dmcolor-high="btn-<?=$dmcolors[$button['color_high']]?>"
-            ><span><?=$button['unit']?>:</span> <span><?=floatval($button['status'])/$button['divider']?></span></button>
+            data-dmval-min="<?=floatval($button['minval'])?>" data-dmval-low="<?=floatval($button['lowval'])?>"
+            data-dmval-high="<?=floatval($button['highval'])?>" data-dmval-max="<?=floatval($button['maxval'])?>"
+            ><span><?=$button['unit']?>:</span> <span data-dmval-divider="<?=floatval($button['divider'])?>"
+                                                       data-domotika-anab="<?=$button['id']?>" ><?=floatval($button['status'])/$button['divider']?></span></button>
       </div> <!-- devlist-rightpart-->
    </div> <!-- devlist-row -->
 </div> <!-- devlist item -->

Web/htdocs/gui/js/domotika.js

@@ -478,9 +478,45 @@
                );
                $("[data-domotika-anaid="+val[0]+"]").each(
                   function() {
-                    console.debug("anaid");
+                     if(val[1]<=$(this).attr('data-dmval-min')) {
+                        $(this).alterClass('btn-*', $(this).attr('data-dmcolor-min'));
+                     } else if(val[1]<=$(this).attr('data-dmval-low')) {
+                        $(this).alterClass('btn-*', $(this).attr('data-dmcolor-low'));
+                     } else if(val[1]<$(this).attr('data-dmval-high')) {
+                        $(this).alterClass('btn-*', $(this).attr('data-dmcolor-med'));
+                     } else if(val[1]>=$(this).attr('data-dmval-high')) {
+                        $(this).alterClass('btn-*', $(this).attr('data-dmcolor-high'));
+                     }
+
+                  }
+               );
+
+               $("[data-domotika-anaprog="+val[0]+"]").each(
+                  function() {
+                     if(val[1]<=$(this).attr('data-dmval-min')) {
+                        $(this).alterClass('progress-bar-*', $(this).attr('data-dmcolor-min'));
+                     } else if(val[1]<=$(this).attr('data-dmval-low')) {
+                        $(this).alterClass('progress-bar-*', $(this).attr('data-dmcolor-low'));
+                     } else if(val[1]<$(this).attr('data-dmval-high')) {
+                        $(this).alterClass('progress-bar-*', $(this).attr('data-dmcolor-med'));
+                     } else if(val[1]>=$(this).attr('data-dmval-high')) {
+                        $(this).alterClass('progress-bar-*', $(this).attr('data-dmcolor-high'));
+                     }
                   }
                );
+               $("[data-domotika-anat="+val[0]+"]").each(
+                  function() {
+                     v=val[1]/$(this).attr('data-dmval-divider');
+                     $(this).text(v);
+                  }
+               );
+               $("[data-domotika-anab="+val[0]+"]").each(
+                  function() {
+                     v=val[1]/$(this).attr('data-dmval-divider');
+                     $(this).text(v);
+                  }
+               );
+
 
                break;
             case 'action':

Web/htdocs/gui/panels/content/graph.php

@@ -42,7 +42,7 @@ if($panel && is_array($panel)) {
       //print_r($chart);
       $_SESSION['PANELS_CHARTS'][$chart['name']."-".$panel['id']]=$chart;
    ?>
-      <div id="<?=$chart['name']."-".$panel['id']?>" style="height:200px;width:550px"><?=$chart['name']?></div>
+      <div id="<?=$chart['name']."-".$panel['id']?>" style="height:200px;width:550px"></div>
    <?
    }?>
          </div>

Web/resources/js/jquery.alterclass.js

@@ -13,27 +13,28 @@
 $.fn.alterClass = function ( removals, additions ) {
 
    var self = this;
+   if ( typeof(removals)!='undefined') {
+      if ( removals.indexOf( '*' ) === -1 ) {
+         // Use native jQuery methods if there is no wildcard matching
+         self.removeClass( removals );
+         return !additions ? self : self.addClass( additions );
+      }
 
-   if ( removals.indexOf( '*' ) === -1 ) {
-      // Use native jQuery methods if there is no wildcard matching
-      self.removeClass( removals );
-      return !additions ? self : self.addClass( additions );
-   }
-
-   var patt = new RegExp( '\\s' +
+      var patt = new RegExp( '\\s' +
          removals.
             replace( /\*/g, '[A-Za-z0-9-_]+' ).
             split( ' ' ).
             join( '\\s|\\s' ) +
          '\\s', 'g' );
 
-   self.each( function ( i, it ) {
-      var cn = ' ' + it.className + ' ';
-      while ( patt.test( cn ) ) {
-         cn = cn.replace( patt, ' ' );
-      }
-      it.className = $.trim( cn );
-   });
+      self.each( function ( i, it ) {
+         var cn = ' ' + it.className + ' ';
+         while ( patt.test( cn ) ) {
+            cn = cn.replace( patt, ' ' );
+         }
+         it.className = $.trim( cn );
+      });
+   }
 
    return !additions ? self : self.addClass( additions );
 };