mirror of
https://github.com/beestat/app.git
synced 2025-05-24 02:14:03 -04:00
Added "More Info" temperature profiles modal with trendline formulas
This commit is contained in:
Jon Ziebell
parent
75337d4f1f
commit
b47debf3cc
@ -33,12 +33,17 @@ beestat.extend(beestat.component.card.temperature_profiles, beestat.component.ca
|
||||
* @param {rocket.Elements} parent
|
||||
*/
|
||||
beestat.component.card.temperature_profiles.prototype.decorate_contents_ = function(parent) {
|
||||
var container = $.createElement('div').style({
|
||||
'position': 'relative'
|
||||
});
|
||||
parent.appendChild(container);
|
||||
|
||||
var data = this.get_data_();
|
||||
|
||||
var chart_container = $.createElement('div');
|
||||
parent.appendChild(chart_container);
|
||||
container.appendChild(chart_container);
|
||||
|
||||
if (Object.keys(data.series).length === 0) {
|
||||
if (this.has_data_() === false) {
|
||||
chart_container.style('filter', 'blur(3px)');
|
||||
var no_data = $.createElement('div');
|
||||
no_data.style({
|
||||
@ -53,7 +58,7 @@ beestat.component.card.temperature_profiles.prototype.decorate_contents_ = funct
|
||||
'text-align': 'center'
|
||||
});
|
||||
no_data.innerHTML('No data to display.<br/><strong><a target="_blank" href="https://www.notion.so/beestat/Temperature-Profiles-9c0fba6793dd4bc68f798c1516f0ea25#a5e176aba4c847acb9e2b773f7aba73b">Why?</a></strong>');
|
||||
parent.appendChild(no_data);
|
||||
container.appendChild(no_data);
|
||||
}
|
||||
|
||||
this.chart_ = new beestat.component.chart.temperature_profiles(data);
|
||||
@ -315,6 +320,15 @@ beestat.component.card.temperature_profiles.prototype.decorate_top_right_ = func
|
||||
self.chart_.export();
|
||||
}));
|
||||
|
||||
if (this.has_data_() === true) {
|
||||
menu.add_menu_item(new beestat.component.menu_item()
|
||||
.set_text('More Info')
|
||||
.set_icon('information')
|
||||
.set_callback(function() {
|
||||
new beestat.component.modal.temperature_profiles_info().render();
|
||||
}));
|
||||
}
|
||||
|
||||
menu.add_menu_item(new beestat.component.menu_item()
|
||||
.set_text('Help')
|
||||
.set_icon('help_circle')
|
||||
@ -409,3 +423,13 @@ beestat.component.card.temperature_profiles.prototype.get_profile_extremes_ = fu
|
||||
|
||||
return extremes;
|
||||
};
|
||||
|
||||
/**
|
||||
* Get whether or not there is any data to be displayed.
|
||||
*
|
||||
* @return {boolean}
|
||||
*/
|
||||
beestat.component.card.temperature_profiles.prototype.has_data_ = function() {
|
||||
const data = this.get_data_();
|
||||
return Object.keys(data.series).length > 0;
|
||||
};
|
||||
|
||||
@ -1,106 +0,0 @@
|
||||
/**
|
||||
* Contribute video
|
||||
*/
|
||||
beestat.component.modal.contribute_video = function() {
|
||||
beestat.component.modal.apply(this, arguments);
|
||||
};
|
||||
beestat.extend(beestat.component.modal.contribute_video, beestat.component.modal);
|
||||
|
||||
/**
|
||||
* Decorate
|
||||
*
|
||||
* @param {rocket.Elements} parent
|
||||
*/
|
||||
beestat.component.modal.contribute_video.prototype.decorate_contents_ = function(parent) {
|
||||
const container = document.createElement('div');
|
||||
/**
|
||||
* The 16:9 aspect ratio corresponds to a height that is 56.25% of the width.
|
||||
* https://www.ankursheel.com/blog/full-width-you-tube-video-embed
|
||||
*/
|
||||
Object.assign(container.style, {
|
||||
'position': 'relative',
|
||||
'padding-bottom': '56.25%',
|
||||
'height': '0'
|
||||
});
|
||||
parent.appendChild(container);
|
||||
|
||||
const iframe = document.createElement('iframe');
|
||||
Object.assign(iframe.style, {
|
||||
'position': 'absolute',
|
||||
'top': '0',
|
||||
'left': '0',
|
||||
'width': '100%',
|
||||
'height': '100%'
|
||||
});
|
||||
iframe.setAttribute('src', 'https://player.vimeo.com/video/769222247?h=3e6436bc10');
|
||||
iframe.setAttribute('frameborder', '0');
|
||||
iframe.setAttribute('allow', 'autoplay; fullscreen; picture-in-picture');
|
||||
iframe.setAttribute('allowfullscreen', 'allowfullscreen');
|
||||
container.appendChild(iframe);
|
||||
};
|
||||
|
||||
/**
|
||||
* Get title.
|
||||
*
|
||||
* @return {string} The title.
|
||||
*/
|
||||
beestat.component.modal.contribute_video.prototype.get_title_ = function() {
|
||||
return 'I need your help!';
|
||||
};
|
||||
|
||||
/**
|
||||
* Get the buttons that go on the bottom of this modal.
|
||||
*
|
||||
* @return {[beestat.component.button]} The buttons.
|
||||
*/
|
||||
beestat.component.modal.contribute_video.prototype.get_buttons_ = function() {
|
||||
const give_other = new beestat.component.tile()
|
||||
.set_background_color('#fff')
|
||||
.set_text_color(beestat.style.color.gray.base)
|
||||
.set_text_hover_color(beestat.style.color.green.base)
|
||||
.set_shadow(false)
|
||||
.set_size('large')
|
||||
.set_text('Other ways to give')
|
||||
.addEventListener('click', function() {
|
||||
(new beestat.layer.contribute()).render();
|
||||
});
|
||||
|
||||
const pay_links = {
|
||||
'usd': {
|
||||
'dev': 'https://donate.stripe.com/test_bIY2by6pS1ii99u8wG',
|
||||
'live': 'https://donate.stripe.com/7sIcPp4Gt6APais144'
|
||||
},
|
||||
'cad': {
|
||||
'dev': 'https://donate.stripe.com/test_bIY2by6pS1ii99u8wG',
|
||||
'live': 'https://donate.stripe.com/28obLl4Gte3hfCMdR4'
|
||||
},
|
||||
'aud': {
|
||||
'dev': 'https://donate.stripe.com/test_bIY2by6pS1ii99u8wG',
|
||||
'live': 'https://donate.stripe.com/dR66r12ylcZd3U4aER'
|
||||
},
|
||||
'gbp': {
|
||||
'dev': 'https://donate.stripe.com/test_bIY2by6pS1ii99u8wG',
|
||||
'live': 'https://donate.stripe.com/4gwbLl3Cpe3hais3cs'
|
||||
}
|
||||
};
|
||||
|
||||
const give_one_time = 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')
|
||||
.set_icon('gift')
|
||||
.set_size('large')
|
||||
.set_text('Make a One-Time Contribution')
|
||||
.addEventListener('click', function() {
|
||||
window.open(
|
||||
pay_links[beestat.setting('units.currency')][window.environment] +
|
||||
'?prefilled_email=' + beestat.user.get().email_address +
|
||||
'&client_reference_id=' + beestat.user.get().user_id
|
||||
);
|
||||
});
|
||||
|
||||
return [
|
||||
give_other,
|
||||
give_one_time
|
||||
];
|
||||
};
|
||||
62
js/component/modal/temperature_profiles_info.js
Normal file
62
js/component/modal/temperature_profiles_info.js
Normal file
@ -0,0 +1,62 @@
|
||||
/**
|
||||
* Temperature Profiles Details
|
||||
*/
|
||||
beestat.component.modal.temperature_profiles_info = function() {
|
||||
beestat.component.modal.apply(this, arguments);
|
||||
};
|
||||
beestat.extend(beestat.component.modal.temperature_profiles_info, beestat.component.modal);
|
||||
|
||||
beestat.component.modal.temperature_profiles_info.prototype.decorate_contents_ = function(parent) {
|
||||
const thermostat = beestat.cache.thermostat[beestat.setting('thermostat_id')];
|
||||
|
||||
const container = $.createElement('div')
|
||||
.style({
|
||||
'display': 'grid',
|
||||
'grid-template-columns': 'repeat(auto-fill, minmax(150px, 1fr))',
|
||||
'margin': '0 0 16px -16px'
|
||||
});
|
||||
parent.appendChild(container);
|
||||
|
||||
const fields = [];
|
||||
|
||||
[
|
||||
'heat_1',
|
||||
'heat_2',
|
||||
'auxiliary_heat_1',
|
||||
'auxiliary_heat_2',
|
||||
'cool_1',
|
||||
'cool_2',
|
||||
'resist'
|
||||
].forEach(function(type) {
|
||||
if (thermostat.profile.temperature[type] !== null) {
|
||||
fields.push({
|
||||
'name': beestat.series['indoor_' + type + '_delta'].name,
|
||||
'value':
|
||||
'Slope = ' +
|
||||
thermostat.profile.temperature[type].linear_trendline.slope +
|
||||
'<br/>Intercept = ' +
|
||||
thermostat.profile.temperature[type].linear_trendline.intercept
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
fields.forEach(function(field) {
|
||||
var div = $.createElement('div')
|
||||
.style({
|
||||
'padding': '16px 0 0 16px'
|
||||
});
|
||||
container.appendChild(div);
|
||||
|
||||
div.appendChild($.createElement('div')
|
||||
.style({
|
||||
'font-weight': beestat.style.font_weight.bold,
|
||||
'margin-bottom': (beestat.style.size.gutter / 4)
|
||||
})
|
||||
.innerHTML(field.name));
|
||||
div.appendChild($.createElement('div').innerHTML(field.value));
|
||||
});
|
||||
};
|
||||
|
||||
beestat.component.modal.temperature_profiles_info.prototype.get_title_ = function() {
|
||||
return 'Temperature Profiles Info';
|
||||
};
|
||||
@ -135,7 +135,7 @@ if($setting->get('environment') === 'dev' || $setting->get('environment') === 'd
|
||||
echo '<script src="/js/component/modal/change_floor_plan.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/modal/floor_plan_elevation_help.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/modal/visualize_custom.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/modal/contribute_video.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/modal/temperature_profiles_info.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/input.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/input/text.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/input/checkbox.js"></script>' . PHP_EOL;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user