-
Гостинная
(label)
-
Температура и влажность в гостинной
(custom)
<style>
.flex-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-around;
align-content: space-around;
padding: 10 10 10 10;
}
.flex-column {
max-width: 40%;
height: 100%;
}
.flex-column2 {
max-width: 20%;
height: 100%;
}
</style>
<div class="flex-container">
<div class="flex-column">
<i class="fa fa-thermometer-full" aria-hidden="true"></i> %Livingroom.Temperature%°C
</div>
<div class="flex-column">
<i class="fa fa-tint" aria-hidden="true"></i> %Livingroom.Humidity%%
</div>
<div class="flex-column">
<i class="fa" aria-hidden="true" id="livingroom-battery"></i> %tempLivingroom.batteryLevel%%
</div>
<div class="flex-column">
<i class="fa fa-sun-o fa-lg text-danger" aria-hidden="true" id="livingroom-heating"></i>
</div>
</div>
<script>
if (%Livingroom.heatingStatus% == 0) $("#livingroom-heating").hide();
if (%tempLivingroom.batteryLevel% >= 80)
{ $("#livingroom-battery").addClass('fa-battery-4') }
else if (%tempLivingroom.batteryLevel% >= 60)
{ $("#livingroom-battery").addClass('fa-battery-3') }
else if (%tempLivingroom.batteryLevel% >= 40)
{ $("#livingroom-battery").addClass('fa-battery-2') }
else if (%tempLivingroom.batteryLevel% >= 20)
{ $("#livingroom-battery").addClass('fa-battery-1') }
else { $("#livingroom-battery").addClass('fa-battery-0') }
</script>
-
Желаемая температура
(sliderbox)
-
Гостевая комната
(label)
-
Температура и влажность в гостевой
(custom)
<style>
.flex-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-around;
align-content: space-around;
padding: 10 10 10 10;
}
.flex-column {
max-width: 40%;
height: 100%;
}
.flex-column2 {
max-width: 20%;
height: 100%;
}
</style>
<div class="flex-container">
<div class="flex-column">
<i class="fa fa-thermometer-full" aria-hidden="true"></i> %Gostevaya.Temperature%°C
</div>
<div class="flex-column">
<i class="fa fa-tint" aria-hidden="true"></i> %Gostevaya.Humidity%%
</div>
<div class="flex-column">
<i class="fa" aria-hidden="true" id="gostevaya-battery"></i> %tempGostevaya.batteryLevel%%
</div>
<div class="flex-column">
<i class="fa fa-sun-o fa-lg text-danger" aria-hidden="true" id="gostevaya-heating"></i>
</div>
</div>
<script>
if (%Gostevaya.heatingStatus% == 0) $("#gostevaya-heating").hide();
if (%tempGostevaya.batteryLevel% >= 80)
{ $("#gostevaya-battery").addClass('fa-battery-4') }
else if (%tempGostevaya.batteryLevel% >= 60)
{ $("#gostevaya-battery").addClass('fa-battery-3') }
else if (%tempGostevaya.batteryLevel% >= 40)
{ $("#gostevaya-battery").addClass('fa-battery-2') }
else if (%tempGostevaya.batteryLevel% >= 20)
{ $("#gostevaya-battery").addClass('fa-battery-1') }
else { $("#gostevaya-battery").addClass('fa-battery-0') }
</script>
-
Желаемая температура
(sliderbox)
-
Прихожая
(label)
-
Температура и влажность в прихожей
(custom)
<style>
.flex-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-around;
align-content: space-around;
padding: 10 10 10 10;
}
.flex-column {
max-width: 25%;
height: 100%;
}
</style>
<div class="flex-container">
<div class="flex-column">
<i class="fa fa-thermometer-full" aria-hidden="true"></i> %Hall.Temperature%°C
</div>
<div class="flex-column">
<i class="fa fa-tint" aria-hidden="true"></i> %Hall.Humidity%%
</div>
<div class="flex-column">
<i class="fa" aria-hidden="true" id="hall-battery"></i> %tempHall.batteryLevel%%
</div>
<div class="flex-column">
<i class="fa fa-sun-o fa-lg text-danger" aria-hidden="true" id="hall-heating"></i>
</div>
</div>
<script>
if (%Hall.heatingStatus% == 0) $("#hall-heating").hide();
if (%tempHall.batteryLevel% >= 80)
{ $("#hall-battery").addClass('fa-battery-4') }
else if (%tempHall.batteryLevel% >= 60)
{ $("#hall-battery").addClass('fa-battery-3') }
else if (%tempHall.batteryLevel% >= 40)
{ $("#hall-battery").addClass('fa-battery-2') }
else if (%tempHall.batteryLevel% >= 20)
{ $("#hall-battery").addClass('fa-battery-1') }
else { $("#hall-battery").addClass('fa-battery-0') }
</script>
-
Желаемая температура
(sliderbox)
-
Ванная
(label)
-
Температура и влажность в ванной
(custom)
<style>
.flex-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-around;
align-content: space-around;
padding: 10 10 10 10;
}
.flex-column {
max-width: 33%;
height: 100%;
}
</style>
<div class="flex-container">
<div class="flex-column">
<i class="fa fa-thermometer-full" aria-hidden="true"></i> %Toilet.Temperature%°C
</div>
<div class="flex-column">
<i class="fa fa-tint" aria-hidden="true"></i> %Toilet.Humidity%%
</div>
<div class="flex-column">
<i class="fa" aria-hidden="true" id="toilet-battery"></i> %tempToilet.batteryLevel%%
</div>
</div>
<script>
if (%tempToilet.batteryLevel% >= 80)
{ $("#toilet-battery").addClass('fa-battery-4') }
else if (%tempToilet.batteryLevel% >= 60)
{ $("#toilet-battery").addClass('fa-battery-3') }
else if (%tempToilet.batteryLevel% >= 40)
{ $("#toilet-battery").addClass('fa-battery-2') }
else if (%tempToilet.batteryLevel% >= 20)
{ $("#toilet-battery").addClass('fa-battery-1') }
else { $("#toilet-battery").addClass('fa-battery-0') }
</script>
-
Детская Ульяны
(label)
-
Температура и влажность в детской Ульяны
(custom)
<style>
.flex-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-around;
align-content: space-around;
padding: 10 10 10 10;
}
.flex-column {
max-width: 33%;
height: 100%;
}
</style>
<div class="flex-container">
<div class="flex-column">
<i class="fa fa-thermometer-full" aria-hidden="true"></i> %Ulyanaroom.Temperature%°C
</div>
<div class="flex-column">
<i class="fa fa-tint" aria-hidden="true"></i> %Ulyanaroom.Humidity%%
</div>
<div class="flex-column">
<i class="fa" aria-hidden="true" id="ulyanaroom-battery"></i> %tempUlyanaroom.batteryLevel%%
</div>
</div>
<script>
if (%tempUlyanaroom.batteryLevel% >= 80)
{ $("#ulyanaroom-battery").addClass('fa-battery-4') }
else if (%tempUlyanaroom.batteryLevel% >= 60)
{ $("#ulyanaroom-battery").addClass('fa-battery-3') }
else if (%tempUlyanaroom.batteryLevel% >= 40)
{ $("#ulyanaroom-battery").addClass('fa-battery-2') }
else if (%tempUlyanaroom.batteryLevel% >= 20)
{ $("#ulyanaroom-battery").addClass('fa-battery-1') }
else { $("#ulyanaroom-battery").addClass('fa-battery-0') }
</script>
-
Гараж
(label)
-
Температура и влажность в гараже
(custom)
<style>
.flex-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-around;
align-content: space-around;
padding: 10 10 10 10;
}
.flex-column {
max-width: 33%;
height: 100%;
}
</style>
<div class="flex-container">
<div class="flex-column">
<i class="fa fa-thermometer-full" aria-hidden="true"></i> %Garage.Temperature%°C
</div>
<div class="flex-column">
<i class="fa fa-tint" aria-hidden="true"></i> %Garage.Humidity%%
</div>
<div class="flex-column">
<i class="fa" aria-hidden="true" id="garage-battery"></i> %tempGarage.batteryLevel%%
</div>
</div>
<script>
if (%tempGarage.batteryLevel% >= 80)
{ $("#garage-battery").addClass('fa-battery-4') }
else if (%tempGarage.batteryLevel% >= 60)
{ $("#garage-battery").addClass('fa-battery-3') }
else if (%tempGarage.batteryLevel% >= 40)
{ $("#garage-battery").addClass('fa-battery-2') }
else if (%tempGarage.batteryLevel% >= 20)
{ $("#garage-battery").addClass('fa-battery-1') }
else { $("#boilerroom-battery").addClass('fa-battery-0') }
</script>
-
CSS
(custom)
<link rel="stylesheet" href="/css/font-awesome.min.css">