mirror of
https://github.com/beestat/app.git
synced 2025-11-04 02:47:01 -05:00
386 lines
11 KiB
JavaScript
386 lines
11 KiB
JavaScript
/**
|
|
* Home comparison settings.
|
|
*
|
|
* @param {number} thermostat_id The thermostat_id this card is displaying
|
|
* data for.
|
|
*/
|
|
beestat.component.card.comparison_settings = function(thermostat_id) {
|
|
var self = this;
|
|
|
|
this.thermostat_id_ = thermostat_id;
|
|
|
|
/*
|
|
* If the thermostat changes that means the property_type could change and
|
|
* thus need to rerender.
|
|
*/
|
|
beestat.dispatcher.addEventListener(
|
|
[
|
|
'cache.thermostat',
|
|
'cache.data.metrics'
|
|
],
|
|
function() {
|
|
self.rerender();
|
|
}
|
|
);
|
|
|
|
beestat.component.card.apply(this, arguments);
|
|
};
|
|
beestat.extend(beestat.component.card.comparison_settings, beestat.component.card);
|
|
|
|
/**
|
|
* Decorate
|
|
*
|
|
* @param {rocket.Elements} parent
|
|
*/
|
|
beestat.component.card.comparison_settings.prototype.decorate_contents_ = function(parent) {
|
|
var thermostat = beestat.cache.thermostat[this.thermostat_id_];
|
|
|
|
var row;
|
|
|
|
// Row
|
|
row = $.createElement('div').addClass('row');
|
|
parent.appendChild(row);
|
|
|
|
var column_region = $.createElement('div').addClass([
|
|
'column',
|
|
'column_4'
|
|
]);
|
|
row.appendChild(column_region);
|
|
this.decorate_region_(column_region);
|
|
|
|
var column_property = $.createElement('div').addClass([
|
|
'column',
|
|
'column_8'
|
|
]);
|
|
row.appendChild(column_property);
|
|
this.decorate_property_(column_property);
|
|
|
|
row = $.createElement('div').addClass('row');
|
|
parent.appendChild(row);
|
|
|
|
var column_detail = $.createElement('div').addClass([
|
|
'column',
|
|
'column_12'
|
|
]);
|
|
row.appendChild(column_detail);
|
|
this.decorate_detail_(column_detail);
|
|
|
|
const sync_progress = beestat.thermostat.get_sync_progress(this.thermostat_id_);
|
|
|
|
if (sync_progress === null || sync_progress < 100) {
|
|
this.show_loading_('Fetching');
|
|
window.setTimeout(function() {
|
|
var api = new beestat.api();
|
|
api.add_call(
|
|
'thermostat',
|
|
'read_id',
|
|
{
|
|
'attributes': {
|
|
'inactive': 0
|
|
}
|
|
},
|
|
'thermostat'
|
|
);
|
|
|
|
api.set_callback(function(response) {
|
|
beestat.cache.set('thermostat', response);
|
|
});
|
|
|
|
api.send();
|
|
}, 10000);
|
|
} else {
|
|
if (thermostat.profile === null) {
|
|
this.show_loading_('Fetching');
|
|
new beestat.api()
|
|
.add_call(
|
|
'thermostat',
|
|
'generate_profile',
|
|
{
|
|
'thermostat_id': this.thermostat_id_
|
|
}
|
|
)
|
|
.add_call(
|
|
'thermostat',
|
|
'read_id',
|
|
{
|
|
'attributes': {
|
|
'inactive': 0
|
|
}
|
|
},
|
|
'thermostat'
|
|
)
|
|
.set_callback(function(response) {
|
|
beestat.cache.set('thermostat', response.thermostat);
|
|
})
|
|
.send();
|
|
} else if (beestat.cache.data.metrics === undefined) {
|
|
this.show_loading_('Fetching');
|
|
new beestat.api()
|
|
.add_call(
|
|
'thermostat',
|
|
'get_metrics',
|
|
{
|
|
'thermostat_id': this.thermostat_id_,
|
|
'attributes': beestat.comparisons.get_attributes()
|
|
}
|
|
)
|
|
.set_callback(function(response) {
|
|
beestat.cache.set('data.metrics', response);
|
|
})
|
|
.send();
|
|
}
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Decorate the region options.
|
|
*
|
|
* @param {rocket.ELements} parent
|
|
*/
|
|
beestat.component.card.comparison_settings.prototype.decorate_region_ = function(parent) {
|
|
var self = this;
|
|
|
|
(new beestat.component.title('Region')).render(parent);
|
|
|
|
var regions = [
|
|
'nearby',
|
|
'global'
|
|
];
|
|
|
|
var current_region = beestat.setting('comparison_region');
|
|
|
|
var color = beestat.style.color.green.base;
|
|
|
|
var tile_group = new beestat.component.tile_group();
|
|
regions.forEach(function(region) {
|
|
var button = new beestat.component.tile()
|
|
.set_background_hover_color(color)
|
|
.set_text_color('#fff')
|
|
.set_text(region.charAt(0).toUpperCase() + region.slice(1));
|
|
|
|
if (current_region === region) {
|
|
button.set_background_color(color);
|
|
} else {
|
|
button
|
|
.set_background_color(beestat.style.color.bluegray.light)
|
|
.addEventListener('click', function() {
|
|
// Delete from the cache to trigger the metrics loading screen
|
|
beestat.cache.delete('data.metrics');
|
|
|
|
// Update the setting
|
|
beestat.setting('comparison_region', region);
|
|
|
|
// Rerender real quick to change the selected button
|
|
self.rerender();
|
|
|
|
// Open up the loading window.
|
|
self.show_loading_('Fetching');
|
|
|
|
new beestat.api()
|
|
.add_call(
|
|
'thermostat',
|
|
'get_metrics',
|
|
{
|
|
'thermostat_id': self.thermostat_id_,
|
|
'attributes': beestat.comparisons.get_attributes()
|
|
}
|
|
)
|
|
.set_callback(function(response) {
|
|
beestat.cache.set('data.metrics', response);
|
|
})
|
|
.send();
|
|
});
|
|
}
|
|
|
|
tile_group.add_tile(button);
|
|
});
|
|
tile_group.render(parent);
|
|
};
|
|
|
|
/**
|
|
* Decorate the property type options.
|
|
*
|
|
* @param {rocket.ELements} parent
|
|
*/
|
|
beestat.component.card.comparison_settings.prototype.decorate_property_ = function(parent) {
|
|
var self = this;
|
|
|
|
var thermostat = beestat.cache.thermostat[this.thermostat_id_];
|
|
|
|
(new beestat.component.title('Property')).render(parent);
|
|
|
|
var property_types = [];
|
|
property_types.push({
|
|
'value': 'similar',
|
|
'text': 'Very Similar'
|
|
});
|
|
|
|
if (thermostat.property.structure_type !== null) {
|
|
property_types.push({
|
|
'value': 'same_structure',
|
|
'text': 'Type: ' +
|
|
thermostat.property.structure_type.charAt(0).toUpperCase() +
|
|
thermostat.property.structure_type.slice(1)
|
|
});
|
|
}
|
|
|
|
property_types.push({
|
|
'value': 'all',
|
|
'text': 'All'
|
|
});
|
|
|
|
var current_property_type = beestat.setting('comparison_property_type');
|
|
|
|
var color = beestat.style.color.purple.base;
|
|
|
|
var tile_group = new beestat.component.tile_group();
|
|
property_types.forEach(function(property_type) {
|
|
var button = new beestat.component.tile()
|
|
.set_background_hover_color(color)
|
|
.set_text_color('#fff')
|
|
.set_text(property_type.text);
|
|
|
|
if (current_property_type === property_type.value) {
|
|
button.set_background_color(color);
|
|
} else {
|
|
button
|
|
.set_background_color(beestat.style.color.bluegray.light)
|
|
.addEventListener('click', function() {
|
|
// Delete from the cache to trigger the metrics loading screen
|
|
beestat.cache.delete('data.metrics');
|
|
|
|
// Update the setting
|
|
beestat.setting('comparison_property_type', property_type.value);
|
|
|
|
// Rerender real quick to change the selected button
|
|
self.rerender();
|
|
|
|
// Open up the loading window.
|
|
self.show_loading_('Fetching');
|
|
|
|
new beestat.api()
|
|
.add_call(
|
|
'thermostat',
|
|
'get_metrics',
|
|
{
|
|
'thermostat_id': self.thermostat_id_,
|
|
'attributes': beestat.comparisons.get_attributes()
|
|
}
|
|
)
|
|
.set_callback(function(response) {
|
|
beestat.cache.set('data.metrics', response);
|
|
})
|
|
.send();
|
|
});
|
|
}
|
|
|
|
tile_group.add_tile(button);
|
|
});
|
|
tile_group.render(parent);
|
|
};
|
|
|
|
beestat.component.card.comparison_settings.prototype.decorate_detail_ = function(parent) {
|
|
var strings = [];
|
|
|
|
strings.push('Matching system type and stages');
|
|
|
|
var comparison_attributes = beestat.comparisons.get_attributes();
|
|
|
|
if (comparison_attributes.property_structure_type !== undefined) {
|
|
strings.push('Property Type: ' + this.get_comparison_string_(comparison_attributes.property_structure_type));
|
|
} else {
|
|
strings.push('Any property type');
|
|
}
|
|
|
|
if (comparison_attributes.property_age !== undefined) {
|
|
strings.push(this.get_comparison_string_(comparison_attributes.property_age, 'years old'));
|
|
} else {
|
|
strings.push('Any property age');
|
|
}
|
|
|
|
if (comparison_attributes.property_square_feet !== undefined) {
|
|
strings.push(this.get_comparison_string_(comparison_attributes.property_square_feet, 'ft²'));
|
|
} else {
|
|
strings.push('Any square footage');
|
|
}
|
|
|
|
if (comparison_attributes.property_stories !== undefined) {
|
|
strings.push(this.get_comparison_string_(comparison_attributes.property_stories, 'stories'));
|
|
} else {
|
|
strings.push('Any number of stories');
|
|
}
|
|
|
|
if (comparison_attributes.radius !== undefined) {
|
|
strings.push('Within ' + comparison_attributes.radius.value + ' miles of your location');
|
|
} else {
|
|
strings.push('Any region');
|
|
}
|
|
|
|
(new beestat.component.title('Comparing to homes like...')).render(parent);
|
|
|
|
strings.forEach(function(string) {
|
|
var div = $.createElement('div');
|
|
div.innerText(string);
|
|
if (string.match('Any') !== null) {
|
|
div.style({'color': beestat.style.color.gray.base});
|
|
}
|
|
parent.appendChild(div);
|
|
});
|
|
};
|
|
|
|
/**
|
|
* Get the title of the card.
|
|
*
|
|
* @return {string} The title of the card.
|
|
*/
|
|
beestat.component.card.comparison_settings.prototype.get_title_ = function() {
|
|
return 'Comparison Settings';
|
|
};
|
|
|
|
/**
|
|
* Decorate the menu.
|
|
*
|
|
* @param {rocket.Elements} parent
|
|
*/
|
|
beestat.component.card.comparison_settings.prototype.decorate_top_right_ = function(parent) {
|
|
var menu = (new beestat.component.menu()).render(parent);
|
|
|
|
menu.add_menu_item(new beestat.component.menu_item()
|
|
.set_text('Help')
|
|
.set_icon('help_circle')
|
|
.set_callback(function() {
|
|
window.open('https://doc.beestat.io/596040eadd014928830b4d1d54692761');
|
|
}));
|
|
};
|
|
|
|
/**
|
|
* Helper function to display various comparison strings in a human-readable
|
|
* way.
|
|
*
|
|
* @param {mixed} comparison_attribute The attribute
|
|
* @param {string} suffix If a suffix (ex: "years") should be placed on the
|
|
* end.
|
|
*
|
|
* @return {string} The human-readable string.
|
|
*/
|
|
beestat.component.card.comparison_settings.prototype.get_comparison_string_ = function(comparison_attribute, suffix) {
|
|
var s = (suffix !== undefined ? (' ' + suffix) : '');
|
|
if (comparison_attribute.operator !== undefined) {
|
|
if (comparison_attribute.operator === 'between') {
|
|
return 'Between ' + comparison_attribute.value[0] + ' and ' + comparison_attribute.value[1] + s;
|
|
} else if (comparison_attribute.operator === '>=') {
|
|
return 'At least ' + comparison_attribute.value + s;
|
|
} else if (comparison_attribute.operator === '<=') {
|
|
return 'Less than or equal than ' + comparison_attribute.value + s;
|
|
} else if (comparison_attribute.operator === '>') {
|
|
return 'Greater than ' + comparison_attribute.value + s;
|
|
} else if (comparison_attribute.operator === '<') {
|
|
return 'Less than' + comparison_attribute.value + s;
|
|
}
|
|
return comparison_attribute.operator + ' ' + comparison_attribute.value + s;
|
|
} else if (Array.isArray(comparison_attribute.value) === true) {
|
|
return 'One of ' + comparison_attribute.value.join(', ') + s;
|
|
}
|
|
return comparison_attribute + s;
|
|
};
|