directman

<<< Back

Индикаторы о заряде батареек без использования картинок

Очень интересное решение - в качестве индикаторов остатка и заряда батарей использовать графический шрифт. Делюсь своими наработками в этом вопросе.

Этот код вставляем в меню или сцену

<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
</head>
<font color="%admin.batterycolor%"><i class="fa %admin.batteryfa% " title="Dmitriy %admin.BattLevel%%"></i></font>
<font color="%Katy.batterycolor%"><i class="fa %Katy.batteryfa% " title="Katy %Katy.BattLevel%%"></i></font>
<font color="%Alex.batterycolor%"><i class="fa %Alex.batteryfa% " title="Alex %Alex.BattLevel%%"></i></font>
<font color="%Chuwi.batterycolor%"><i class="fa %Chuwi.batteryfa% " title="Chuwi %Chuwi.BattLevel%%"></i></font>

Код в меню для логотипов online

<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

 <!-- примеры шрифтов смотреть тут https://html5book.ru/shrift-awesome/ -->
</head>

<script type="text/javascript">
// Popup window code
function newPopup(url) {
    popupWindow = window.open(
        url,'popUpWindow','height=300,width=400,left=10,top=10,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no,status=yes')
}
</script>

<a href="JavaScript:newPopup('/javascript/examples/sample_popup.cfm');"> 
<font size="4" color="%ESP01.stateColor%" title="ESP01 %ip.ESP01%"><i class="fa fa-share-square-o "></i></font></a>

 <font size="4" color="%Relay12.stateColor%" title="sontouch %ip.sontouch% "><i class="fa fa-hand-pointer-o "></i></font>  

<font size="4" color="%Relay09.stateColor%" title="sonoff sofit %ip.sonsofit%"><i class="fa fa-ticket "></i></font>  
<font size="4" color="%Relay10.stateColor%" title="RGBSonoff %ip.SONOFFRGB%"><i class="fa fa-ticket  "></i></font>   
<font size="4" color="%Relay07.stateColor%" title="sonoff gostinaya light %ip.songostligh% "><i class="fa fa-ticket "></i></font>  
<font size="4" color="%Relay06.stateColor%" title="sonoff spalnya %ip.sonspalna%"><i class="fa fa-ticket "></i></font>  
<font size="4" color="%Relay11.stateColor%" title="sonoff vanna %ip.sonoffvanna% "><i class="fa fa-ticket "></i></font>  

<font size="4" color="%RGBkitchen.stateColor%" title="RGBPWM %ip.ESPRGB%"><i class="fa fa-tachometer "></i></font>    

<font size="4" color="%NVR.stateColor%" title="NVR %ip.NVR% %ip.nvr%"><i class="fa fa-hdd-o "></i></font>  
<font size="4" color="%ALEXHOME.stateColor%" title="ALEXHOME %ip.ALEXHOME%"><i class="fa fa-laptop "></i></font>  
<font size="4" color="%DMSHOME.stateColor%" title="DMSHOME %ip.DMSHOME%"><i class="fa fa-laptop "></i></font>  

<font size="4" color="%slinex.stateColor%" title="slinex %ip.Slinex%"><i class="fa fa-phone"></i></font>  

<font size="4" color="%mag250_rostelekom.stateColor%" title="MAG250_ROSTELEKOM %ip.mag250_rostelecom%"><i class="fa fa-television "></i></font>  
<font size="4" color="%mag250_gostinaya.stateColor%" title="MAG250_PLANETA %ip.mag250_planeta%"><i class="fa fa-television "></i></font>  
<font size="4" color="%mag250_spalnya.stateColor%" title="WR320 %ip.wr320%"><i class="fa fa-television "></i></font>  

<font size="4" color="%H264_KORIDOR.stateColor%" title="H264_PRIHOJAYA %ip.H264_PRIHOJAYA% %H264_KORIDOR.stateColor%  " ><i class="fa fa-camera "></i></font>  
<font size="4" color="%H264_OBSHIY.stateColor%" title="H264_LIFT %ip.H264_OBSHIYKORIDOR%"><i class="fa fa-camera "></i></font>  

<font size="4" color="%xiaomi_RN3PRO_GOLD.stateColor%" title="xiaomi_RN3PRO_GOLD %ip.Xiaomi_RN3_GOLD% "><i class="fa fa-mobile "></i></font>  
<font size="4" color="%xiaomi_RN3PRO_BLACK.stateColor%" title="xiaomi_RN3PRO_BLACK %ip.Xiaomi_RN3_BLACK% "><i class="fa fa-mobile "></i></font>  
<font size="4" color="%xiaomi_RN4.stateColor%" title="xiaomi_RN4 %ip.Xiaomi_RN4% "><i class="fa fa-mobile "></i></font>  

<font size="4" color="%mqttserver.stateColor%" title="MQTT"><i class="fa fa-qrcode"></i></font> 
<font size="4" color="%mysdr.stateColor%" title="rtl_433 %mysdr.lasttime%"><i class="fa fa-qrcode"></i></font>  

<font size="4" color="%all_in_one.zaoknom_stateColor%" title="t в гостиной %all_in_one.zaoknomtemp%/%all_in_one.zaoknomhum% bat:%all_in_one.zaoknombattery% %all_in_one.zaoknom_last%"><i class="fa fa-pagelines"></i></font>  
<font size="4" color="%all_in_one.zaoknom2_stateColor%" title="t леши %all_in_one.zaoknom2temp%/%all_in_one.zaoknom2hum% bat:%all_in_one.zaoknom2battery% %all_in_one.zaoknom2_last%"><i class="fa fa-pagelines"></i></font>  
 <font size="4" color="green" title="email: %unreademail%"><i class="fa fa-envelope-o"></i></font>  

В переменных batterycolor - хранится цвет, green, red etc
в batteryfa хранится название картинки из нашего шрифта fa-battery-three-quarters или что-то другое.

Для заполнения этих полей используется скрипт updatebaterry:

$objects=getObjectsByClass("Users");
foreach($objects as $obj)
 {
//$name='admin';

 $name=$obj['TITLE'];
$charging=gg($name.'.Charging');
$bl=gg($name.'.BattLevel');
 echo  $charging;
echo $bl;
if ( $charging== 1){
 sg($name.'.batterypic',"charge/batterycharged256.png");
 //sg($name.'.batteryfa',"fa-bolt");
 //sg($name.'.batteryfa',"fa-battery-three-quarters fa-border");
 //sg($name.'.batteryfa',"fa-battery-three-quarters");
 sg($name.'.batterycolor', 'red');    } 
  else {  sg($name.'.batterycolor', 'green');}

  if  ($bl == 100){
sg($name.'.batterypic',"charge/batteryfull256.png");
sg($name.'.batteryfa',"fa-battery-full");  
        } 
 if  ($bl   <= 95) {
  sg($name.'.batterypic',"charge/battery3256.png");   
  sg($name.'.batteryfa',"fa-battery-three-quarters");
     }
 if  ($bl   <= 50) {
  sg($name.'batterypic',"charge/batteryhalf256.png");   
 sg($name.'.batteryfa',"fa-battery-half");
     }

 if ($bl   <= 20) {
  sg($name.'batterypic',"charge/battery1256.png");   
sg($name.'.batteryfa',"fa-battery-quarter"); 
     }

 if ($bl   <= 5) {
  sg($name.'batterypic',"charge/batteryempty256.png");   
 sg($name.'.batteryfa',"fa-battery-empty");      } 
}

Discuss (3) (4)

Екатеринбург, Россия

На форуме: directman66