simon
/
domoboard
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
VERSION.md
View File

@ -1 +1 @@
1.0.2 1.0.3

4
static/css/custom.css
View File

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

21
static/js/domoboard.js
View File

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

4
templates/top_tiles.html
View File

@ -4,8 +4,8 @@
<div class="animated flipInY col-md-2 col-sm-4 col-xs-4 tile_stats_count"> <div class="animated flipInY col-md-2 col-sm-4 col-xs-4 tile_stats_count">
<div class="left"></div> <div class="left"></div>
<div class="right"> <div class="right">
<span class="count_top"><i class="fa fa-{{v[2]}}"></i> {{k}}</span> <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{% 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> <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>
</div> </div>
{% endfor %} {% endfor %}