Cutlery/beestat
1
0
Fork 0
mirror of https://github.com/beestat/app.git synced 2025-05-24 02:14:03 -04:00
Code Actions Packages Releases Activity

Finished floor plan switcher and converted all buttons to tiles

Browse Source
This commit is contained in:
Jon Ziebell 2022-08-06 23:46:10 -04:00
parent fbbe95c85d
commit 5678b952a5
28 changed files with 303 additions and 627 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
css/dashboard.css
View File

@ -593,6 +593,6 @@ input[type=radio] {
.icon.f16:before { font-size: 16px; }
.icon.f24:before { font-size: 24px; }
.icon.f36:before { font-size: 36px; }
.icon.f32:before { font-size: 32px; }
.icon.f48:before { font-size: 48px; }
.icon.f64:before { font-size: 64px; }

59
js/beestat/floor_plan.js Normal file
View File

@ -0,0 +1,59 @@
beestat.floor_plan = {};
/**
* Get the area of an entire floor plan.
*
* @param {number} floor_plan_id
*
* @return {number} The area of the floor plan in sqft.
*/
beestat.floor_plan.get_area = function(floor_plan_id) {
const floor_plan = beestat.cache.floor_plan[floor_plan_id];
let area = 0;
floor_plan.data.groups.forEach(function(group) {
area += beestat.floor_plan.get_area_group(group, false);
});
return Math.round(area);
};
/**
* Get the area of a single floor plan group.
*
* @param {object} group The group.
* @param {boolean} round Whether or not to round the result.
*
* @return {number} Area of the group in sqft.
*/
beestat.floor_plan.get_area_group = function(group, round = true) {
let area = 0;
group.rooms.forEach(function(room) {
area += beestat.floor_plan.get_area_room(room, false);
});
if (round === true) {
return Math.round(area);
}
return area;
};
/**
* Get the area of a single floor plan room.
*
* @param {object} room The room.
* @param {boolean} round Whether or not to round the result.
*
* @return {number} Area of the room in sqft.
*/
beestat.floor_plan.get_area_room = function(room, round = true) {
let area = Math.abs(ClipperLib.Clipper.Area(room.points) / 144);
if (round === true) {
return Math.round(area);
}
return area;
};

4
js/component/alert.js
View File

@ -241,7 +241,7 @@ beestat.component.alert.prototype.decorate_detail_ = function(parent) {
});
button_container.appendChild(dismiss_container);
(new beestat.component.button())
(new beestat.component.tile())
.set_icon('bell_off')
.set_text('Dismiss')
.set_background_color(beestat.style.color.red.dark)
@ -278,7 +278,7 @@ beestat.component.alert.prototype.decorate_detail_ = function(parent) {
});
button_container.appendChild(restore_container);
(new beestat.component.button())
(new beestat.component.tile())
.set_icon('bell')
.set_text('Restore')
.set_background_color(beestat.style.color.red.dark)

278
js/component/button.js
View File

@ -1,278 +0,0 @@
/**
* A button-shaped component with text, an icon, and a background color.
*/
beestat.component.button = function() {
beestat.component.apply(this, arguments);
};
beestat.extend(beestat.component.button, beestat.component);
/**
* Decorate
*
* @param {rocket.Elements} parent
*/
beestat.component.button.prototype.decorate_ = function(parent) {
var self = this;
var border_radius;
if (this.type_ === 'pill') {
border_radius = '32px';
} else {
border_radius = beestat.style.size.border_radius;
}
this.button_ = $.createElement('div')
.style({
'display': 'inline-block',
'background': this.background_color_,
'color': this.text_color_,
'user-select': 'none',
'border-radius': border_radius,
'padding-top': '3px',
'padding-bottom': '3px',
'transition': 'color 200ms ease, background 200ms ease'
});
parent.appendChild(this.button_);
if (this.title_ !== undefined) {
this.button_.setAttribute('title', this.title_);
}
if (this.icon_ !== undefined && this.text_ !== undefined) {
// Text + Icon
this.button_.style({
'padding-left': (beestat.style.size.gutter / 2),
'padding-right': (beestat.style.size.gutter / 2)
});
(new beestat.component.icon(this.icon_))
.set_text(this.text_)
.set_bubble_text(this.bubble_text_)
.set_bubble_color(this.bubble_color_)
.render(this.button_);
} else if (this.icon_ === undefined && this.text_ !== undefined) {
// Text only
this.button_.style({
'padding': '0px ' + (beestat.style.size.gutter / 2) + 'px',
'line-height': '32px'
});
this.button_.innerText(this.text_);
} else {
// Icon only
this.button_.style({
'width': '32px',
'text-align': 'center'
});
(new beestat.component.icon(this.icon_))
.set_text(this.text_)
.set_bubble_text(this.bubble_text_)
.set_bubble_color(this.bubble_color_)
.render(this.button_);
}
if (
this.text_hover_color_ !== undefined ||
this.background_hover_color_ !== undefined
) {
this.button_.style({'cursor': 'pointer'});
var mouseenter_style = {};
if (this.text_hover_color_ !== undefined) {
mouseenter_style.color = this.text_hover_color_;
}
if (this.background_hover_color_ !== undefined) {
mouseenter_style.background = this.background_hover_color_;
}
var mouseleave_style = {};
mouseleave_style.color =
(this.text_color_ !== undefined) ? this.text_color_ : '';
mouseleave_style.background =
(this.background_color_ !== undefined) ? this.background_color_ : '';
this.button_.addEventListener('mouseenter', function() {
self.button_.style(mouseenter_style);
});
this.button_.addEventListener('mouseleave', function() {
self.button_.style(mouseleave_style);
});
}
this.button_.addEventListener('click', function() {
self.dispatchEvent('click');
});
this.button_.addEventListener('mousedown', function() {
self.dispatchEvent('mousedown');
});
};
/**
* Set the text.
*
* @param {string} text
*
* @return {beestat.component.button} This.
*/
beestat.component.button.prototype.set_text = function(text) {
this.text_ = text;
if (this.rendered_ === true) {
this.rerender();
}
return this;
};
/**
* Set the icon.
*
* @param {string} icon
*
* @return {beestat.component.button} This.
*/
beestat.component.button.prototype.set_icon = function(icon) {
this.icon_ = icon;
if (this.rendered_ === true) {
this.rerender();
}
return this;
};
/**
* Set the background color.
*
* @param {string} background_color
*
* @return {beestat.component.button} This.
*/
beestat.component.button.prototype.set_background_color = function(background_color) {
this.background_color_ = background_color;
if (this.rendered_ === true) {
this.rerender();
}
return this;
};
/**
* Set the text color.
*
* @param {string} text_color
*
* @return {beestat.component.button} This.
*/
beestat.component.button.prototype.set_text_color = function(text_color) {
this.text_color_ = text_color;
if (this.rendered_ === true) {
this.rerender();
}
return this;
};
/**
* Set the background hover color.
*
* @param {string} background_hover_color
*
* @return {beestat.component.button} This.
*/
beestat.component.button.prototype.set_background_hover_color = function(background_hover_color) {
this.background_hover_color_ = background_hover_color;
if (this.rendered_ === true) {
this.rerender();
}
return this;
};
/**
* Set the text hover color.
*
* @param {string} text_hover_color
*
* @return {beestat.component.button} This.
*/
beestat.component.button.prototype.set_text_hover_color = function(text_hover_color) {
this.text_hover_color_ = text_hover_color;
if (this.rendered_ === true) {
this.rerender();
}
return this;
};
/**
* Set the type.
*
* @param {string} type Valid value is "pill" for now.
*
* @return {beestat.component.button} This.
*/
beestat.component.button.prototype.set_type = function(type) {
this.type_ = type;
if (this.rendered_ === true) {
this.rerender();
}
return this;
};
/**
* Set the text of the bubble.
*
* @param {string} bubble_text
*
* @return {beestat.component.button} This.
*/
beestat.component.button.prototype.set_bubble_text = function(bubble_text) {
this.bubble_text_ = bubble_text;
if (this.rendered_ === true) {
this.rerender();
}
return this;
};
/**
* Set the color of the bubble.
*
* @param {string} bubble_color
*
* @return {beestat.component.button} This.
*/
beestat.component.button.prototype.set_bubble_color = function(bubble_color) {
this.bubble_color_ = bubble_color;
if (this.rendered_ === true) {
this.rerender();
}
return this;
};
/**
* Set the title for the button.
*
* @param {string} title
*
* @return {beestat.component.button} This.
*/
beestat.component.button.prototype.set_title = function(title) {
this.title_ = title;
if (this.rendered_ === true) {
this.rerender();
}
return this;
};
/**
* Do the normal event listener stuff.
*
* @return {beestat.component.button} This.
*/
beestat.component.button.prototype.addEventListener = function() {
rocket.EventTarget.prototype.addEventListener.apply(this, arguments);
return this;
};
/**
* Get the bounding box for the button.
*
* @return {array} The bounding box.
*/
beestat.component.button.prototype.getBoundingClientRect = function() {
return this.button_.getBoundingClientRect();
};

2
js/component/card/air_quality_not_supported.js
View File

@ -15,7 +15,7 @@ beestat.component.card.air_quality_not_supported.prototype.decorate_contents_ =
parent.style('background', beestat.style.color.blue.light);
parent.appendChild($.createElement('p').innerText('Access to Air Quality information requires a compatible thermostat. Support beestat by buying through this affiliate link.'));
new beestat.component.button()
new beestat.component.tile()
.set_icon('open_in_new')
.set_text('Buy an ecobee Smart Thermostat Premium on Amazon')
.set_background_color(beestat.style.color.green.dark)

8
js/component/card/comparison_settings.js
View File

@ -151,9 +151,9 @@ beestat.component.card.comparison_settings.prototype.decorate_region_ = function
var color = beestat.style.color.green.base;
var button_group = new beestat.component.button_group();
var button_group = new beestat.component.tile_group();
regions.forEach(function(region) {
var button = new beestat.component.button()
var button = new beestat.component.tile()
.set_background_hover_color(color)
.set_text_color('#fff')
.set_text(region.charAt(0).toUpperCase() + region.slice(1));
@ -233,9 +233,9 @@ beestat.component.card.comparison_settings.prototype.decorate_property_ = functi
var color = beestat.style.color.purple.base;
var button_group = new beestat.component.button_group();
var button_group = new beestat.component.tile_group();
property_types.forEach(function(property_type) {
var button = new beestat.component.button()
var button = new beestat.component.tile()
.set_background_hover_color(color)
.set_text_color('#fff')
.set_text(property_type.text);

2
js/component/card/floor_plan_editor.js
View File

@ -53,7 +53,7 @@ beestat.component.card.floor_plan_editor.prototype.decorate_contents_ = function
parent.appendChild(center_container);
center_container.appendChild($.createElement('p').innerText('You haven\'t created any floor plans yet.'));
const get_started_button = new beestat.component.button()
const get_started_button = new beestat.component.tile()
.set_icon('home_plus')
.set_text('Get Started')
.set_background_color(beestat.style.color.green.dark)

26
js/component/card/my_home.js
View File

@ -56,20 +56,20 @@ beestat.component.card.my_home.prototype.decorate_system_type_ = function(parent
);
const cool_stages_string = cool_stages > 1 ? ' (2 Stage)' : '';
var button_group = new beestat.component.button_group();
button_group.add_button(new beestat.component.button()
var button_group = new beestat.component.tile_group();
button_group.add_button(new beestat.component.tile()
.set_type('pill')
.set_background_color(beestat.series.compressor_heat_1.color)
.set_text_color('#fff')
.set_icon('fire')
.set_text(heat.charAt(0).toUpperCase() + heat.slice(1) + heat_stages_string));
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_type('pill')
.set_background_color(beestat.series.auxiliary_heat_1.color)
.set_text_color('#fff')
.set_icon('fire')
.set_text(auxiliary_heat.charAt(0).toUpperCase() + auxiliary_heat.slice(1)));
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_type('pill')
.set_background_color(beestat.series.compressor_cool_1.color)
.set_text_color('#fff')
@ -109,9 +109,9 @@ beestat.component.card.my_home.prototype.decorate_region_ = function(parent) {
region = null;
}
var button_group = new beestat.component.button_group();
var button_group = new beestat.component.tile_group();
if (region !== null) {
var button = new beestat.component.button()
var button = new beestat.component.tile()
.set_type('pill')
.set_background_color(beestat.style.color.green.base)
.set_text_color('#fff')
@ -119,7 +119,7 @@ beestat.component.card.my_home.prototype.decorate_region_ = function(parent) {
.set_text(region);
button_group.add_button(button);
} else {
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_type('pill')
.set_background_color(beestat.style.color.gray.dark)
.set_text_color('#fff')
@ -139,10 +139,10 @@ beestat.component.card.my_home.prototype.decorate_property_ = function(parent) {
(new beestat.component.title('Property')).render(parent);
var button_group = new beestat.component.button_group();
var button_group = new beestat.component.tile_group();
if (thermostat.property.structure_type !== null) {
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_type('pill')
.set_background_color(beestat.style.color.purple.base)
.set_text_color('#fff')
@ -159,7 +159,7 @@ beestat.component.card.my_home.prototype.decorate_property_ = function(parent) {
thermostat.property.structure_type === 'semi-detached'
)
) {
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_type('pill')
.set_background_color(beestat.style.color.purple.base)
.set_text_color('#fff')
@ -169,7 +169,7 @@ beestat.component.card.my_home.prototype.decorate_property_ = function(parent) {
}
if (thermostat.property.square_feet !== null) {
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_type('pill')
.set_background_color(beestat.style.color.purple.base)
.set_text_color('#fff')
@ -178,7 +178,7 @@ beestat.component.card.my_home.prototype.decorate_property_ = function(parent) {
}
if (thermostat.property.age !== null) {
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_type('pill')
.set_background_color(beestat.style.color.purple.base)
.set_text_color('#fff')
@ -187,7 +187,7 @@ beestat.component.card.my_home.prototype.decorate_property_ = function(parent) {
}
if (button_group.get_buttons().length === 0) {
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_type('pill')
.set_background_color(beestat.style.color.gray.dark)
.set_text_color('#fff')

10
js/component/card/patreon.js
View File

@ -28,9 +28,13 @@ beestat.component.card.patreon.prototype.decorate_contents_ = function(parent) {
parent.style('background', beestat.style.color.green.base);
new beestat.component.button()
new beestat.component.tile()
.set_icon('heart')
.set_text('Support this project on Patreon!')
.set_size('large')
.set_text([
'Support this project on Patreon!',
'Your contribution matters'
])
.set_background_color(beestat.style.color.green.dark)
.set_background_hover_color(beestat.style.color.green.light)
.addEventListener('click', function() {
@ -54,7 +58,7 @@ beestat.component.card.patreon.prototype.get_title_ = function() {
* @param {rocket.Elements} parent
*/
beestat.component.card.patreon.prototype.decorate_top_right_ = function(parent) {
new beestat.component.button()
new beestat.component.tile()
.set_type('pill')
.set_icon('close')
.set_text_color('#fff')

39
js/component/floor_plan.js
View File

@ -351,16 +351,16 @@ beestat.component.floor_plan.prototype.update_toolbar = function() {
this.button_group_floors_.dispose();
}
this.button_group_ = new beestat.component.button_group();
this.button_group_ = new beestat.component.tile_group();
// Add floor
this.button_group_.add_button(new beestat.component.button()
this.button_group_.add_button(new beestat.component.tile()
.set_icon('layers')
.set_text_color(beestat.style.color.lightblue.base)
);
// Add room
this.button_group_.add_button(new beestat.component.button()
this.button_group_.add_button(new beestat.component.tile()
.set_icon('card_plus_outline')
.set_title('Add Room [R]')
.set_text_color(beestat.style.color.gray.light)
@ -370,7 +370,7 @@ beestat.component.floor_plan.prototype.update_toolbar = function() {
);
// Remove room
const remove_room_button = new beestat.component.button()
const remove_room_button = new beestat.component.tile()
.set_icon('card_remove_outline')
.set_title('Remove Room [Delete]')
.set_background_color(beestat.style.color.bluegray.base);
@ -387,7 +387,7 @@ beestat.component.floor_plan.prototype.update_toolbar = function() {
}
// Add point
const add_point_button = new beestat.component.button()
const add_point_button = new beestat.component.tile()
.set_icon('vector_square_plus')
.set_title('Add Point [Double click]')
.set_background_color(beestat.style.color.bluegray.base);
@ -404,7 +404,7 @@ beestat.component.floor_plan.prototype.update_toolbar = function() {
}
// Remove point
const remove_point_button = new beestat.component.button()
const remove_point_button = new beestat.component.tile()
.set_background_color(beestat.style.color.bluegray.base)
.set_title('Remove Point [Delete]')
.set_icon('vector_square_remove');
@ -434,7 +434,7 @@ beestat.component.floor_plan.prototype.update_toolbar = function() {
snapping_title = 'Enable Snapping [S]';
}
this.button_group_.add_button(new beestat.component.button()
this.button_group_.add_button(new beestat.component.tile()
.set_icon(snapping_icon)
.set_title(snapping_title)
.set_text_color(beestat.style.color.gray.light)
@ -444,7 +444,7 @@ beestat.component.floor_plan.prototype.update_toolbar = function() {
);
// Zoom in
const zoom_in_button = new beestat.component.button()
const zoom_in_button = new beestat.component.tile()
.set_icon('magnify_plus_outline')
.set_title('Zoom In')
.set_background_color(beestat.style.color.bluegray.base);
@ -465,7 +465,7 @@ beestat.component.floor_plan.prototype.update_toolbar = function() {
}
// Zoom out
const zoom_out_button = new beestat.component.button()
const zoom_out_button = new beestat.component.tile()
.set_icon('magnify_minus_outline')
.set_title('Zoom out')
.set_background_color(beestat.style.color.bluegray.base);
@ -489,11 +489,11 @@ beestat.component.floor_plan.prototype.update_toolbar = function() {
this.button_group_.render(this.toolbar_container_);
// FLOORS
this.button_group_floors_ = new beestat.component.button_group();
this.button_group_floors_ = new beestat.component.tile_group();
const floor_plan = beestat.cache.floor_plan[this.floor_plan_id_];
floor_plan.data.groups.forEach(function(group) {
const button = new beestat.component.button()
const button = new beestat.component.tile()
.set_title(group.name)
.set_text_hover_color(beestat.style.color.lightblue.light)
.set_text_color(beestat.style.color.lightblue.base);
@ -534,20 +534,15 @@ beestat.component.floor_plan.prototype.update_infobox = function() {
if (this.state_.active_room !== undefined) {
parts.push(this.state_.active_room.name || 'Unnamed Room');
parts.push(
Math.abs(
Math.round(
ClipperLib.Clipper.Area(this.state_.active_room.points) / 144
)
).toLocaleString() + ' sqft'
beestat.floor_plan.get_area_room(this.state_.active_room)
.toLocaleString() + ' sqft'
);
} else {
parts.push(this.state_.active_group.name || 'Unnamed Floor');
let area = 0;
this.state_.active_group.rooms.forEach(function(room) {
area += Math.abs(ClipperLib.Clipper.Area(room.points));
});
parts.push(Math.round(area / 144).toLocaleString() + ' sqft');
parts.push(
beestat.floor_plan.get_area_group(this.state_.active_group)
.toLocaleString() + ' sqft'
);
}
this.infobox_container_.innerText(parts.join(' • '));
};

4
js/component/header.js
View File

@ -90,9 +90,9 @@ beestat.component.header.prototype.decorate_ = function(parent) {
});
row.appendChild(column_navigation);
var button_group = new beestat.component.button_group();
var button_group = new beestat.component.tile_group();
pages.forEach(function(page) {
var button = new beestat.component.button()
var button = new beestat.component.tile()
.set_icon(page.icon)
.set_text_color(beestat.style.color.bluegray.dark);

6
js/component/menu.js
View File

@ -11,7 +11,7 @@ beestat.component.menu.prototype.decorate_ = function(parent) {
this.menu_items_ = [];
this.icon_ = new beestat.component.button()
this.icon_ = new beestat.component.tile()
.set_type('pill')
.set_icon('dots_vertical')
.set_bubble_text(this.bubble_text_)
@ -67,14 +67,14 @@ beestat.component.menu.prototype.dispose = function() {
beestat.component.menu.prototype.open_ = function() {
var self = this;
var position = this.icon_.getBoundingClientRect();
var position = this.icon_.get_container().getBoundingClientRect();
var container = $.createElement('div')
.style({
'background': '#fff',
'color': '#444',
'position': 'absolute',
'top': position.bottom + 'px',
'top': (position.bottom + window.scrollY) + 'px',
'right': (window.innerWidth - position.right) + 'px',
'transition': 'all 200ms ease',
'transform': 'scale(0)',

4
js/component/modal.js
View File

@ -203,7 +203,7 @@ beestat.component.modal.prototype.decorate_title_ = function(parent) {
beestat.component.modal.prototype.decorate_close_ = function(parent) {
var self = this;
var close = new beestat.component.button()
var close = new beestat.component.tile()
.set_type('pill')
.set_icon('close')
.set_text_color(beestat.style.color.gray.dark)
@ -245,7 +245,7 @@ beestat.component.modal.prototype.decorate_buttons_ = function(parent) {
});
parent.appendChild(container);
var button_group = new beestat.component.button_group();
var button_group = new beestat.component.tile_group();
buttons.forEach(function(button) {
button_group.add_button(button);
});

12
js/component/modal/air_quality_detail_custom.js
View File

@ -43,9 +43,9 @@ beestat.component.modal.air_quality_detail_custom.prototype.decorate_contents_ =
beestat.component.modal.air_quality_detail_custom.prototype.decorate_range_type_ = function(parent) {
var self = this;
var button_group = new beestat.component.button_group();
var button_group = new beestat.component.tile_group();
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_background_hover_color(beestat.style.color.lightblue.base)
.set_text_color('#fff')
.set_background_color(
@ -59,7 +59,7 @@ beestat.component.modal.air_quality_detail_custom.prototype.decorate_range_type_
self.rerender();
}));
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_background_hover_color(beestat.style.color.lightblue.base)
.set_text_color('#fff')
.set_background_color(
@ -294,7 +294,7 @@ beestat.component.modal.air_quality_detail_custom.prototype.get_title_ = functio
beestat.component.modal.air_quality_detail_custom.prototype.get_buttons_ = function() {
var self = this;
var cancel = new beestat.component.button()
var cancel = new beestat.component.tile()
.set_background_color('#fff')
.set_text_color(beestat.style.color.gray.base)
.set_text_hover_color(beestat.style.color.red.base)
@ -310,12 +310,12 @@ beestat.component.modal.air_quality_detail_custom.prototype.get_buttons_ = funct
this.state_.error.invalid_range_end === true ||
this.state_.error.out_of_sync_range === true
) {
save = new beestat.component.button()
save = new beestat.component.tile()
.set_background_color(beestat.style.color.gray.base)
.set_text_color('#fff')
.set_text('Save');
} else {
save = new beestat.component.button()
save = new beestat.component.tile()
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff')

130
js/component/modal/change_floor_plan.js
View File

@ -6,112 +6,55 @@ beestat.component.modal.change_floor_plan = function() {
};
beestat.extend(beestat.component.modal.change_floor_plan, beestat.component.modal);
/**
* Decorate
*
* @param {rocket.Elements} parent
*/
beestat.component.modal.change_floor_plan.prototype.decorate_contents_ = function(parent) {
var self = this;
const self = this;
var container = $.createElement('div')
.style({
'display': 'grid',
'grid-template-columns': 'repeat(auto-fill, minmax(200px, 1fr))',
'margin': '0 0 16px -16px'
});
parent.appendChild(container);
const p = document.createElement('p');
p.innerText = 'You have multiple floor plans; which one would you like to view?';
parent.appendChild(p);
const grid = document.createElement('div');
grid.style.display = 'grid';
grid.style.gridTemplateColumns = 'repeat(auto-fit, minmax(150px, 1fr))';
grid.style.columnGap = beestat.style.size.gutter + 'px';
grid.style.rowGap = beestat.style.size.gutter + 'px';
parent.appendChild(grid);
var sorted_floor_plans = $.values(beestat.cache.floor_plan)
.sort(function(a, b) {
return a.name > b.name;
});
let div;
sorted_floor_plans.forEach(function(floor_plan) {
var div = $.createElement('div')
.style({
'padding': '16px 0 0 16px'
});
container.appendChild(div);
div = document.createElement('div');
grid.appendChild(div);
self.decorate_floor_plan_(div, floor_plan.floor_plan_id);
const tile = new beestat.component.tile.floor_plan(floor_plan.floor_plan_id)
.set_text_color('#fff')
.set_display('block');
if (floor_plan.floor_plan_id === beestat.setting('floor_plan_id')) {
tile.set_background_color(beestat.style.color.lightblue.base);
} else {
tile
.set_background_color(beestat.style.color.bluegray.base)
.set_background_hover_color(beestat.style.color.lightblue.base)
.addEventListener('click', function() {
beestat.setting('floor_plan_id', floor_plan.floor_plan_id);
self.dispose();
});
}
tile.render($(div));
});
};
/**
* Decorate the floor plan.
*
* @param {rocket.Elements} parent
* @param {number} floor_plan_id
*/
beestat.component.modal.change_floor_plan.prototype.decorate_floor_plan_ = function(parent, floor_plan_id) {
const self = this;
var floor_plan = beestat.cache.floor_plan[floor_plan_id];
var container_height = 60;
var gutter = beestat.style.size.gutter / 2;
var floor_plan_height = container_height - (gutter * 2);
var container = $.createElement('div')
.style({
'height': container_height,
'border-radius': container_height,
'padding-right': (beestat.style.size.gutter / 2),
'transition': 'background 200ms ease',
'user-select': 'none'
});
if (floor_plan_id == beestat.cache.floor_plan[beestat.setting('floor_plan_id')].floor_plan_id) {
container.style({
'background': '#4b6584',
'color': '#fff'
});
} else {
container.style({
'cursor': 'pointer'
});
container
.addEventListener('mouseover', function() {
container.style('background', beestat.style.color.gray.base);
})
.addEventListener('mouseout', function() {
container.style('background', '');
})
.addEventListener('click', function() {
container.removeEventListener();
self.dispose();
beestat.setting('floor_plan_id', floor_plan_id);
});
}
parent.appendChild(container);
var left = $.createElement('div')
.style({
'background': beestat.style.color.bluegray.dark,
'font-weight': beestat.style.font_weight.light,
'border-radius': '50%',
'width': floor_plan_height,
'height': floor_plan_height,
'line-height': floor_plan_height,
'color': '#fff',
'font-size': '20px',
'text-align': 'center',
'float': 'left',
'margin': gutter
})
.innerHTML('');
container.appendChild(left);
var right = $.createElement('div')
.style({
'line-height': container_height,
'font-weight': beestat.style.font_weight.bold,
'white-space': 'nowrap',
'overflow': 'hidden',
'text-overflow': 'ellipsis'
})
.innerHTML(floor_plan.name);
container.appendChild(right);
};
/**
* Get title.
*
@ -120,3 +63,4 @@ beestat.component.modal.change_floor_plan.prototype.decorate_floor_plan_ = funct
beestat.component.modal.change_floor_plan.prototype.get_title_ = function() {
return 'Change Floor Plan';
};

8
js/component/modal/change_system_type.js
View File

@ -62,14 +62,14 @@ beestat.component.modal.change_system_type.prototype.decorate_contents_ = functi
key
);
let button_group = new beestat.component.button_group();
let button_group = new beestat.component.tile_group();
options[key].forEach(function(system_type) {
let text = system_type.charAt(0).toUpperCase() + system_type.slice(1);
if (thermostat.system_type.detected[key].equipment === system_type) {
text += ' [Detected]';
}
let button = new beestat.component.button()
let button = new beestat.component.tile()
.set_background_hover_color(colors[key])
.set_text_color('#fff')
.set_text(text)
@ -113,7 +113,7 @@ beestat.component.modal.change_system_type.prototype.get_buttons_ = function() {
var self = this;
var cancel = new beestat.component.button()
var cancel = new beestat.component.tile()
.set_background_color('#fff')
.set_text_color(beestat.style.color.gray.base)
.set_text_hover_color(beestat.style.color.red.base)
@ -122,7 +122,7 @@ beestat.component.modal.change_system_type.prototype.get_buttons_ = function() {
self.dispose();
});
var save = new beestat.component.button()
var save = new beestat.component.tile()
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff')

125
js/component/modal/change_thermostat.js
View File

@ -6,110 +6,59 @@ beestat.component.modal.change_thermostat = function() {
};
beestat.extend(beestat.component.modal.change_thermostat, beestat.component.modal);
/**
* Decorate
*
* @param {rocket.Elements} parent
*/
beestat.component.modal.change_thermostat.prototype.decorate_contents_ = function(parent) {
var self = this;
const p = document.createElement('p');
p.innerText = 'You have multiple thermostats; which one would you like to view?';
parent.appendChild(p);
var container = $.createElement('div')
.style({
'display': 'grid',
'grid-template-columns': 'repeat(auto-fill, minmax(200px, 1fr))',
'margin': '0 0 16px -16px'
});
parent.appendChild(container);
const grid = document.createElement('div');
grid.style.display = 'grid';
grid.style.gridTemplateColumns = 'repeat(auto-fit, minmax(150px, 1fr))';
grid.style.columnGap = beestat.style.size.gutter + 'px';
grid.style.rowGap = beestat.style.size.gutter + 'px';
parent.appendChild(grid);
var sorted_thermostats = $.values(beestat.cache.thermostat)
.sort(function(a, b) {
return a.name > b.name;
});
let div;
sorted_thermostats.forEach(function(thermostat) {
var div = $.createElement('div')
.style({
'padding': '16px 0 0 16px'
});
container.appendChild(div);
div = document.createElement('div');
grid.appendChild(div);
self.decorate_thermostat_(div, thermostat.thermostat_id);
});
};
const tile = new beestat.component.tile.thermostat(thermostat.thermostat_id)
.set_text_color('#fff')
.set_display('block');
beestat.component.modal.change_thermostat.prototype.decorate_thermostat_ = function(parent, thermostat_id) {
var thermostat = beestat.cache.thermostat[thermostat_id];
var container_height = 60;
var gutter = beestat.style.size.gutter / 2;
var thermostat_height = container_height - (gutter * 2);
var container = $.createElement('div')
.style({
'height': container_height,
'border-radius': container_height,
'padding-right': (beestat.style.size.gutter / 2),
'transition': 'background 200ms ease',
'user-select': 'none'
});
if (thermostat_id == beestat.cache.thermostat[beestat.setting('thermostat_id')].thermostat_id) {
container.style({
'background': '#4b6584',
'color': '#fff'
});
} else {
container.style({
'cursor': 'pointer'
});
container
.addEventListener('mouseover', function() {
container.style('background', beestat.style.color.gray.base);
})
.addEventListener('mouseout', function() {
container.style('background', '');
})
.addEventListener('click', function() {
container.removeEventListener();
beestat.setting('thermostat_id', thermostat_id, function() {
window.location.reload();
if (thermostat.thermostat_id === beestat.setting('thermostat_id')) {
tile.set_background_color(beestat.style.color.lightblue.base);
} else {
tile
.set_background_color(beestat.style.color.bluegray.base)
.set_background_hover_color(beestat.style.color.lightblue.base)
.addEventListener('click', function() {
beestat.setting('thermostat_id', thermostat.thermostat_id, function() {
window.location.reload();
});
});
});
}
}
parent.appendChild(container);
var temperature = beestat.temperature({
'temperature': thermostat.temperature,
'round': 0
tile.render($(div));
});
var left = $.createElement('div')
.style({
'background': beestat.thermostat.get_color(thermostat_id),
'font-weight': beestat.style.font_weight.light,
'border-radius': '50%',
'width': thermostat_height,
'height': thermostat_height,
'line-height': thermostat_height,
'color': '#fff',
'font-size': '20px',
'text-align': 'center',
'float': 'left',
'margin': gutter
})
.innerHTML(temperature);
container.appendChild(left);
var right = $.createElement('div')
.style({
'line-height': container_height,
'font-weight': beestat.style.font_weight.bold,
'white-space': 'nowrap',
'overflow': 'hidden',
'text-overflow': 'ellipsis'
})
.innerHTML(thermostat.name);
container.appendChild(right);
};
/**
* Get title.
*
* @return {string} Title.
*/
beestat.component.modal.change_thermostat.prototype.get_title_ = function() {
return 'Change Thermostat';
};

4
js/component/modal/create_floor_plan.js
View File

@ -185,7 +185,7 @@ beestat.component.modal.create_floor_plan.prototype.get_title_ = function() {
beestat.component.modal.create_floor_plan.prototype.get_buttons_ = function() {
const self = this;
const cancel = new beestat.component.button()
const cancel = new beestat.component.tile()
.set_background_color('#fff')
.set_text_color(beestat.style.color.gray.base)
.set_text_hover_color(beestat.style.color.red.base)
@ -194,7 +194,7 @@ beestat.component.modal.create_floor_plan.prototype.get_buttons_ = function() {
self.dispose();
});
const save = new beestat.component.button()
const save = new beestat.component.tile()
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff')

4
js/component/modal/delete_floor_plan.js
View File

@ -50,7 +50,7 @@ beestat.component.modal.delete_floor_plan.prototype.get_title_ = function() {
beestat.component.modal.delete_floor_plan.prototype.get_buttons_ = function() {
const self = this;
const cancel_button = new beestat.component.button()
const cancel_button = new beestat.component.tile()
.set_background_color('#fff')
.set_text_color(beestat.style.color.gray.base)
.set_text_hover_color(beestat.style.color.red.base)
@ -59,7 +59,7 @@ beestat.component.modal.delete_floor_plan.prototype.get_buttons_ = function() {
self.dispose();
});
const delete_button = new beestat.component.button()
const delete_button = new beestat.component.tile()
.set_background_color(beestat.style.color.red.base)
.set_background_hover_color(beestat.style.color.red.light)
.set_text_color('#fff')

20
js/component/modal/download_data.js
View File

@ -121,19 +121,19 @@ beestat.component.modal.download_data.prototype.decorate_presets_ = function(par
'label': 'Today',
'range_begin': now.clone(),
'range_end': now.clone(),
'button': new beestat.component.button()
'button': new beestat.component.tile()
},
{
'label': 'Yesterday',
'range_begin': now.clone().subtract(1, 'day'),
'range_end': now.clone().subtract(1, 'day'),
'button': new beestat.component.button()
'button': new beestat.component.tile()
},
{
'label': 'This Week',
'range_begin': now.clone().startOf('week'),
'range_end': now.clone(),
'button': new beestat.component.button()
'button': new beestat.component.tile()
},
{
'label': 'Last Week',
@ -143,13 +143,13 @@ beestat.component.modal.download_data.prototype.decorate_presets_ = function(par
'range_end': now.clone()
.subtract(1, 'week')
.endOf('week'),
'button': new beestat.component.button()
'button': new beestat.component.tile()
},
{
'label': 'This Month',
'range_begin': now.clone().startOf('month'),
'range_end': now.clone(),
'button': new beestat.component.button()
'button': new beestat.component.tile()
},
{
'label': 'Last Month',
@ -159,17 +159,17 @@ beestat.component.modal.download_data.prototype.decorate_presets_ = function(par
'range_end': now.clone()
.subtract(1, 'month')
.endOf('month'),
'button': new beestat.component.button()
'button': new beestat.component.tile()
},
{
'label': 'All Time',
'range_begin': moment.max(moment(thermostat.data_begin), now.clone().subtract(1, 'year')),
'range_end': now.clone(),
'button': new beestat.component.button()
'button': new beestat.component.tile()
}
];
var button_group = new beestat.component.button_group();
var button_group = new beestat.component.tile_group();
presets.forEach(function(preset) {
preset.button
.set_background_color(beestat.style.color.bluegray.base)
@ -242,7 +242,7 @@ beestat.component.modal.download_data.prototype.get_title_ = function() {
beestat.component.modal.download_data.prototype.get_buttons_ = function() {
var self = this;
var cancel = new beestat.component.button()
var cancel = new beestat.component.tile()
.set_background_color('#fff')
.set_text_color(beestat.style.color.gray.base)
.set_text_hover_color(beestat.style.color.red.base)
@ -251,7 +251,7 @@ beestat.component.modal.download_data.prototype.get_buttons_ = function() {
self.dispose();
});
var save = new beestat.component.button()
var save = new beestat.component.tile()
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff')

6
js/component/modal/enjoy_beestat.js
View File

@ -55,7 +55,7 @@ beestat.component.modal.enjoy_beestat.prototype.hide_patreon_card_for_ = functio
beestat.component.modal.enjoy_beestat.prototype.get_buttons_ = function() {
var self = this;
var hide = new beestat.component.button()
var hide = new beestat.component.tile()
.set_background_color('#fff')
.set_text_color(beestat.style.color.gray.base)
.set_text_hover_color(beestat.style.color.bluegray.base)
@ -66,7 +66,7 @@ beestat.component.modal.enjoy_beestat.prototype.get_buttons_ = function() {
});
if (beestat.user.patreon_is_connected() === false) {
var link = new beestat.component.button()
var link = new beestat.component.tile()
.set_text('Link Patreon')
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
@ -83,7 +83,7 @@ beestat.component.modal.enjoy_beestat.prototype.get_buttons_ = function() {
];
}
var ok = new beestat.component.button()
var ok = new beestat.component.tile()
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff')

6
js/component/modal/newsletter.js
View File

@ -61,7 +61,7 @@ beestat.component.modal.newsletter.prototype.get_buttons_ = function() {
let buttons = [];
if (this.subscribed_ === true) {
const ok = new beestat.component.button()
const ok = new beestat.component.tile()
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff')
@ -71,7 +71,7 @@ beestat.component.modal.newsletter.prototype.get_buttons_ = function() {
});
buttons.push(ok);
} else {
const no_thanks = new beestat.component.button()
const no_thanks = new beestat.component.tile()
.set_background_color('#fff')
.set_text_color(beestat.style.color.gray.base)
.set_text_hover_color(beestat.style.color.red.base)
@ -81,7 +81,7 @@ beestat.component.modal.newsletter.prototype.get_buttons_ = function() {
});
buttons.push(no_thanks);
const subscribe = new beestat.component.button()
const subscribe = new beestat.component.tile()
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff')

2
js/component/modal/patreon_status.js
View File

@ -199,7 +199,7 @@ beestat.component.modal.patreon_status.prototype.get_title_ = function() {
*/
beestat.component.modal.patreon_status.prototype.get_buttons_ = function() {
if (beestat.user.patreon_is_connected() === true) {
var refresh = new beestat.component.button()
var refresh = new beestat.component.tile()
.set_text('Refresh Status')
.set_icon('refresh')
.set_background_color(beestat.style.color.green.base)

12
js/component/modal/runtime_sensor_detail_custom.js
View File

@ -43,9 +43,9 @@ beestat.component.modal.runtime_sensor_detail_custom.prototype.decorate_contents
beestat.component.modal.runtime_sensor_detail_custom.prototype.decorate_range_type_ = function(parent) {
var self = this;
var button_group = new beestat.component.button_group();
var button_group = new beestat.component.tile_group();
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_background_hover_color(beestat.style.color.lightblue.base)
.set_text_color('#fff')
.set_background_color(
@ -59,7 +59,7 @@ beestat.component.modal.runtime_sensor_detail_custom.prototype.decorate_range_ty
self.rerender();
}));
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_background_hover_color(beestat.style.color.lightblue.base)
.set_text_color('#fff')
.set_background_color(
@ -294,7 +294,7 @@ beestat.component.modal.runtime_sensor_detail_custom.prototype.get_title_ = func
beestat.component.modal.runtime_sensor_detail_custom.prototype.get_buttons_ = function() {
var self = this;
var cancel = new beestat.component.button()
var cancel = new beestat.component.tile()
.set_background_color('#fff')
.set_text_color(beestat.style.color.gray.base)
.set_text_hover_color(beestat.style.color.red.base)
@ -310,12 +310,12 @@ beestat.component.modal.runtime_sensor_detail_custom.prototype.get_buttons_ = fu
this.state_.error.invalid_range_end === true ||
this.state_.error.out_of_sync_range === true
) {
save = new beestat.component.button()
save = new beestat.component.tile()
.set_background_color(beestat.style.color.gray.base)
.set_text_color('#fff')
.set_text('Save');
} else {
save = new beestat.component.button()
save = new beestat.component.tile()
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff')

12
js/component/modal/runtime_thermostat_detail_custom.js
View File

@ -43,9 +43,9 @@ beestat.component.modal.runtime_thermostat_detail_custom.prototype.decorate_cont
beestat.component.modal.runtime_thermostat_detail_custom.prototype.decorate_range_type_ = function(parent) {
var self = this;
var button_group = new beestat.component.button_group();
var button_group = new beestat.component.tile_group();
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_background_hover_color(beestat.style.color.lightblue.base)
.set_text_color('#fff')
.set_background_color(
@ -59,7 +59,7 @@ beestat.component.modal.runtime_thermostat_detail_custom.prototype.decorate_rang
self.rerender();
}));
button_group.add_button(new beestat.component.button()
button_group.add_button(new beestat.component.tile()
.set_background_hover_color(beestat.style.color.lightblue.base)
.set_text_color('#fff')
.set_background_color(
@ -294,7 +294,7 @@ beestat.component.modal.runtime_thermostat_detail_custom.prototype.get_title_ =
beestat.component.modal.runtime_thermostat_detail_custom.prototype.get_buttons_ = function() {
var self = this;
var cancel = new beestat.component.button()
var cancel = new beestat.component.tile()
.set_background_color('#fff')
.set_text_color(beestat.style.color.gray.base)
.set_text_hover_color(beestat.style.color.red.base)
@ -310,12 +310,12 @@ beestat.component.modal.runtime_thermostat_detail_custom.prototype.get_buttons_
this.state_.error.invalid_range_end === true ||
this.state_.error.out_of_sync_range === true
) {
save = new beestat.component.button()
save = new beestat.component.tile()
.set_background_color(beestat.style.color.gray.base)
.set_text_color('#fff')
.set_text('Save');
} else {
save = new beestat.component.button()
save = new beestat.component.tile()
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff')

8
js/component/modal/runtime_thermostat_summary_custom.js
View File

@ -49,7 +49,7 @@ beestat.component.modal.runtime_thermostat_summary_custom.prototype.decorate_con
for (let key in options) {
let current_type = beestat.setting(key);
let button_group = new beestat.component.button_group();
let button_group = new beestat.component.tile_group();
options[key].forEach(function(value) {
let text = value.replace('runtime_thermostat_summary_', '')
.charAt(0)
@ -62,7 +62,7 @@ beestat.component.modal.runtime_thermostat_summary_custom.prototype.decorate_con
) ? 's' : ''
);
let button = new beestat.component.button()
let button = new beestat.component.tile()
.set_background_hover_color(beestat.style.color.lightblue.base)
.set_text_color('#fff')
.set_text(text)
@ -148,7 +148,7 @@ beestat.component.modal.runtime_thermostat_summary_custom.prototype.get_title_ =
beestat.component.modal.runtime_thermostat_summary_custom.prototype.get_buttons_ = function() {
var self = this;
var cancel = new beestat.component.button()
var cancel = new beestat.component.tile()
.set_background_color('#fff')
.set_text_color(beestat.style.color.gray.base)
.set_text_hover_color(beestat.style.color.red.base)
@ -157,7 +157,7 @@ beestat.component.modal.runtime_thermostat_summary_custom.prototype.get_buttons_
self.dispose();
});
var save = new beestat.component.button()
var save = new beestat.component.tile()
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff')

130
js/component/button_group.js → js/component/tile_group.js
View File

@ -1,65 +1,65 @@
/**
* A button-shaped component with text, an icon, and a background color.
*/
beestat.component.button_group = function() {
this.buttons_ = [];
beestat.component.apply(this, arguments);
};
beestat.extend(beestat.component.button_group, beestat.component);
/**
* Decorate
*
* @param {rocket.Elements} parent
*/
beestat.component.button_group.prototype.decorate_ = function(parent) {
var self = this;
// Only exists so that there can be spacing between wrapped elements.
var outer_container = $.createElement('div')
.style({
'margin-top': (beestat.style.size.gutter / -2)
});
parent.appendChild(outer_container);
this.buttons_.forEach(function(button, i) {
var container = $.createElement('div').style({
'display': 'inline-block',
'margin-right': (i < self.buttons_.length) ? (beestat.style.size.gutter / 2) : 0,
'margin-top': (beestat.style.size.gutter / 2)
});
button.render(container);
outer_container.appendChild(container);
});
};
/**
* Add a button to this group.
*
* @param {beestat.component.button} button The button to add.
*/
beestat.component.button_group.prototype.add_button = function(button) {
this.buttons_.push(button);
if (this.rendered_ === true) {
this.rerender();
}
};
/**
* Get all of the buttons in this button group.
*
* @return {[beestat.component.button]} The buttons in this group.
*/
beestat.component.button_group.prototype.get_buttons = function() {
return this.buttons_;
};
/**
* Remove this component from the page. Disposes the buttons first.
*/
beestat.component.button_group.prototype.dispose = function() {
this.buttons_.forEach(function(button) {
button.dispose();
});
beestat.component.prototype.dispose.apply(this, arguments);
};
/**
* A group of tiles.
*/
beestat.component.tile_group = function() {
this.buttons_ = [];
beestat.component.apply(this, arguments);
};
beestat.extend(beestat.component.tile_group, beestat.component);
/**
* Decorate
*
* @param {rocket.Elements} parent
*/
beestat.component.tile_group.prototype.decorate_ = function(parent) {
var self = this;
// Only exists so that there can be spacing between wrapped elements.
var outer_container = $.createElement('div')
.style({
'margin-top': (beestat.style.size.gutter / -2)
});
parent.appendChild(outer_container);
this.buttons_.forEach(function(button, i) {
var container = $.createElement('div').style({
'display': 'inline-block',
'margin-right': (i < self.buttons_.length) ? (beestat.style.size.gutter / 2) : 0,
'margin-top': (beestat.style.size.gutter / 2)
});
button.render(container);
outer_container.appendChild(container);
});
};
/**
* Add a button to this group.
*
* @param {beestat.component.button} button The button to add.
*/
beestat.component.tile_group.prototype.add_button = function(button) {
this.buttons_.push(button);
if (this.rendered_ === true) {
this.rerender();
}
};
/**
* Get all of the buttons in this button group.
*
* @return {[beestat.component.button]} The buttons in this group.
*/
beestat.component.tile_group.prototype.get_buttons = function() {
return this.buttons_;
};
/**
* Remove this component from the page. Disposes the buttons first.
*/
beestat.component.tile_group.prototype.dispose = function() {
this.buttons_.forEach(function(button) {
button.dispose();
});
beestat.component.prototype.dispose.apply(this, arguments);
};

7
js/js.php
View File

@ -42,6 +42,7 @@ if($setting->get('environment') === 'dev' || $setting->get('environment') === 'd
echo '<script src="/js/beestat/requestor.js"></script>' . PHP_EOL;
echo '<script src="/js/beestat/touch.js"></script>' . PHP_EOL;
echo '<script src="/js/beestat/crypto.js"></script>' . PHP_EOL;
echo '<script src="/js/beestat/floor_plan.js"></script>' . PHP_EOL;
// Layer
echo '<script src="/js/layer.js"></script>' . PHP_EOL;
@ -122,8 +123,10 @@ if($setting->get('environment') === 'dev' || $setting->get('environment') === 'd
echo '<script src="/js/component/input/checkbox.js"></script>' . PHP_EOL;
echo '<script src="/js/component/input/radio.js"></script>' . PHP_EOL;
echo '<script src="/js/component/input/select.js"></script>' . PHP_EOL;
echo '<script src="/js/component/button.js"></script>' . PHP_EOL;
echo '<script src="/js/component/button_group.js"></script>' . PHP_EOL;
echo '<script src="/js/component/tile_group.js"></script>' . PHP_EOL;
echo '<script src="/js/component/tile.js"></script>' . PHP_EOL;
echo '<script src="/js/component/tile/floor_plan.js"></script>' . PHP_EOL;
echo '<script src="/js/component/tile/thermostat.js"></script>' . PHP_EOL;
echo '<script src="/js/component/title.js"></script>' . PHP_EOL;
echo '<script src="/js/component/floor_plan_entity.js"></script>' . PHP_EOL;
echo '<script src="/js/component/floor_plan_entity/room.js"></script>' . PHP_EOL;