119 lines
4.1 KiB
JavaScript
119 lines
4.1 KiB
JavaScript
|
|
$(document).ready(function() {
|
|
let base_url = "http://192.168.1.105:8000/";
|
|
let ids_list = [];
|
|
|
|
$.get("ip.txt", function(data) {
|
|
console.log(data);
|
|
base_url = `http://${data}:8000/`;
|
|
init_wesite();
|
|
});
|
|
|
|
function append_element(image_urls, descriptions, title, id) {
|
|
ids_list.push(id);
|
|
|
|
let template = `
|
|
<div class="wsList hey">
|
|
<div></div>
|
|
<img src="${image_urls[0]}" alt="#" class="obrazok_small">
|
|
<div id="list_item_holder${id}" class="list_item_holder">
|
|
<div class="title${id}">${title}</div>
|
|
<div class="short_description">${descriptions[0]}</div>
|
|
</div>
|
|
<div id="arrow${id}" class="arrow">▼</div>
|
|
</div>
|
|
<!-- Rozšírené malé zobrazenie -->
|
|
<div id="listExpand${id}" class="listHide">
|
|
<img src="${image_urls[1]}" alt="#" class="obrazok_big">
|
|
<div class="text_small">${descriptions[1]}</div>
|
|
<div id="sensors_small${id}" class="sensors_small">
|
|
</div>
|
|
<div class="info_small"></div>
|
|
</div>
|
|
<!-- Veľké zobrazenie -->
|
|
<div id="big${id}" class="big">
|
|
<div class="imgBig"><img class="wsImg" src="${image_urls[1]}" alt="#"></div>
|
|
<div class="text_big">${descriptions[1]}</div>
|
|
<div id="sensors_big${id}" class="sensors_big">
|
|
</div>
|
|
<div class="info_big"></div>
|
|
</div>`;
|
|
|
|
$("body").append(template);
|
|
|
|
$.get(`${base_url}${id}/sensors`, function(data1) {
|
|
Object.keys(data1).forEach(function(key) {
|
|
let value = data1[key];
|
|
|
|
// removing [translate]-
|
|
if (key.startsWith("[translate]-")) {
|
|
key = key.slice(12);
|
|
}
|
|
if (value.startsWith("[translate]-")) {
|
|
value = value.slice(12);
|
|
}
|
|
|
|
// appending to DOM
|
|
$(`#sensors_small${id}`).append(`<p class="sens_style_heat">${key}: ${value}</p>`);
|
|
$(`#sensors_big${id}`).append(`<p class="sens_style_heat">${key}: ${value}</p>`);
|
|
});
|
|
});
|
|
|
|
$(".arrow").click(function() {
|
|
|
|
let id = this.id;
|
|
id = id.slice(id.length-1, id.length);
|
|
|
|
$(`#arrow${id}`).toggleClass("mystyle");
|
|
$(`#listExpand${id}`).toggleClass("expand");
|
|
id.a();
|
|
});
|
|
|
|
$(".list_item_holder").click(function() {
|
|
let id = this.id;
|
|
id = id.slice(id.length-1, id.length);
|
|
|
|
clear_big_display();
|
|
$(`#big${id}`).show();
|
|
});
|
|
|
|
}
|
|
|
|
function clear_big_display(){
|
|
ids_list.forEach(function(id) {
|
|
$(`#big${id}`).hide();
|
|
});
|
|
}
|
|
|
|
function init_wesite() {
|
|
$.get(`${base_url}devices_list`, function(data) {
|
|
|
|
let connected_id = data[0]["connected_id"];
|
|
let urls = ["", ""];
|
|
let descriptions = ["", ""];
|
|
let title = "";
|
|
let query = [[]];
|
|
|
|
for (let i = 1; i < data.length; i++) {
|
|
let spot_data = data[i];
|
|
let spot_id = spot_data["ID"]
|
|
urls = [`${base_url}files/${spot_id}/${spot_data["description"]["photo_s"]}`,
|
|
`${base_url}files/${spot_id}/${spot_data["description"]["photo_b"]}`];
|
|
descriptions = [spot_data["description"]["description_s"],
|
|
spot_data["description"]["description_l"]];
|
|
title = spot_data["description"]["title"];
|
|
|
|
if (spot_id == connected_id) {
|
|
query[0] = [urls, descriptions, title, parseInt(spot_id)];
|
|
} else {
|
|
query.push([urls, descriptions, title, parseInt(spot_id)]);
|
|
}
|
|
}
|
|
|
|
for (let i = 0; i < query.length; i++) {
|
|
append_element(query[i][0], query[i][1], query[i][2], query[i][3]);
|
|
}
|
|
|
|
})
|
|
}
|
|
}) |