Add resizing top_tiles contents using viewports

This commit is contained in:
wez3 2017-01-21 17:06:33 +01:00
parent 72c2f35707
commit a7dbbe7375
4 changed files with 18 additions and 13 deletions

View File

@ -1 +1 @@
1.0.2
1.0.3

View File

@ -467,7 +467,7 @@ table.no-margin .progress {
@media(max-width:768px) {
.tile_stats_count .count {
font-size: 30px !important;
font-size: 5.5vw !important;
}
.tile_stats_count .right span {
font-size: 12px;
@ -1961,7 +1961,7 @@ span.right {
}
.tile_stats_count .count {
font-size: 40px;
font-size: 2.5vw;
line-height: 47px;
font-weight: 600;
}

View File

@ -39,7 +39,6 @@ function setDimmerState(id, idx) {
var url = "/api?type=devices&rid=" + idx;
requestAPI(flask_server + url, function(d) {
_json = JSON.parse(d);
console.log(id);
if (_json['result'][0]['Data'] != 'Off') {
$('#' + id).css({'background-image': '-webkit-linear-gradient(top, #f9f9f9 0%, green 100%)', 'background-image': '-o-linear-gradient(top, #f9f9f9 0%, green 100%)', 'background-image': 'linear-gradient(to bottom, #f9f9f9 0%, green 100%)'});
} else {
@ -107,15 +106,22 @@ function refreshTopTiles(updateDivs, block, tilesPreviousArray, updateDivsTypeAr
if (updateDivsUnitsArray[i]) {
tilesArray[2] = updateDivsUnitsArray[i];
}
if (tilesArray[1] < tilesPreviousArray[i]) {
$("#" + block + divID + "_" + updateDivsTypeArray[i]).html(tilesArray[1] + "<font size='3'>" + tilesArray[2] + " <i class='fa fa-caret-down fa-lg' style='color:red'></font>");
if (parseFloat(tilesArray[1]) < parseFloat(tilesPreviousArray[i])) {
$("#" + block + divID + "_" + updateDivsTypeArray[i]).html(tilesArray[1] + "<font size=2vw>" + tilesArray[2] + "</font>");
$("#" + block + divID + "_" + updateDivsTypeArray[i] + "_arrow").removeClass("green");
$("#" + block + divID + "_" + updateDivsTypeArray[i] + "_arrow").addClass("red");
$("#" + block + divID + "_" + updateDivsTypeArray[i] + "_arrow").removeClass("fa-caret-up");
$("#" + block + divID + "_" + updateDivsTypeArray[i] + "_arrow").addClass("fa-caret-down");
tilesPreviousArray[i] = tilesArray[1];
} else if (tilesArray[1] > tilesPreviousArray[i]) {
$("#" + block + divID + "_" + updateDivsTypeArray[i]).html(tilesArray[1] + "<font size='3'>" + tilesArray[2] + " <i class='fa fa-caret-up fa-lg' style='color:green'></font>");
} else if (parseFloat(tilesArray[1]) > parseFloat(tilesPreviousArray[i])) {
$("#" + block + divID + "_" + updateDivsTypeArray[i]).html(tilesArray[1] + "<font size=2vw>" + tilesArray[2] + "</font>");
$("#" + block + divID + "_" + updateDivsTypeArray[i] + "_arrow").removeClass("red");
$("#" + block + divID + "_" + updateDivsTypeArray[i] + "_arrow").addClass("green");
$("#" + block + divID + "_" + updateDivsTypeArray[i] + "_arrow").removeClass("fa-caret-down");
$("#" + block + divID + "_" + updateDivsTypeArray[i] + "_arrow").addClass("fa-caret-up");
tilesPreviousArray[i] = tilesArray[1];
} else {
$("#" + block + divID + "_" + updateDivsTypeArray[i]).html(tilesArray[1] + "<font size='3'>" + tilesArray[2] + " <i class='fa fa-caret-up fa-lg' style='color:green'></font>");
$("#" + block + divID + "_" + updateDivsTypeArray[i]).html(tilesArray[1] + "<font size=2vw>" + tilesArray[2] + "</font>");
}
} else {
$("#" + block + divID + "_" + updateDivsTypeArray[i]).html(data);
@ -338,7 +344,6 @@ function changeSetpoint(idx, val) {
function refreshSetpoints(updateSetpoints, block) {
$.each(updateSetpoints, function(i, setpointID) {
console.log(setpointID);
var url = flask_server + "/api?type=devices&rid="+ setpointID;
var setpointVal = document.getElementById("setpoint_" + setpointID + "_block_" + block);
requestAPI(url, function(d) {

View File

@ -4,8 +4,8 @@
<div class="animated flipInY col-md-2 col-sm-4 col-xs-4 tile_stats_count">
<div class="left"></div>
<div class="right">
<span class="count_top"><i class="fa fa-{{v[2]}}"></i> {{k}}</span>
<div class="count{% if v[2] == "On" %} green{% elif v[2] == "Off" %} red{% endif %} loading" id="top_tiles_block_{{count}}_{{v[1]}}_{% if v[3] %}{{v[3]}}{% else %}Data{% endif %}" style="white-space: nowrap;"></div>
<span class="count_top"><i class="fa fa-{{v[2]}}"></i> {{k}} <i id="top_tiles_block_{{count}}_{{v[1]}}_{% if v[3] %}{{v[3]}}{% else %}Data{% endif %}_arrow" class='fa fa-lg'></i></span>
<div class="count loading" id="top_tiles_block_{{count}}_{{v[1]}}_{% if v[3] %}{{v[3]}}{% else %}Data{% endif %}" style="white-space: nowrap"></div>
</div>
</div>
{% endfor %}