/** * Alerts */ beestat.component.card.alerts = function() { beestat.component.card.apply(this, arguments); this.alert_components_ = []; }; beestat.extend(beestat.component.card.alerts, beestat.component.card); /** * Decorate all of the individual alert components. * * @param {rocket.Elements} parent */ beestat.component.card.alerts.prototype.decorate_contents_ = function(parent) { var self = this; parent.style({ 'transition': 'background 200ms ease', 'position': 'relative', 'min-height': '100px' // Gives the thumbs up a bit of space }); this.parent_ = parent; var thermostat = beestat.cache.thermostat[beestat.setting('thermostat_id')]; // No alerts this.no_alerts_ = $.createElement('div') .style({ 'position': 'absolute', 'top': '50%', 'left': '50%', 'transform': 'translate(-50%, -50%) scale(0)', 'transition': 'transform 200ms ease' }); parent.appendChild(this.no_alerts_); (new beestat.component.icon('thumb_up') .set_size(64) .set_color(beestat.style.color.bluegray.light) ).render(this.no_alerts_); thermostat.alerts.forEach(function(alert) { var alert_component = new beestat.component.alert(alert); alert_component.addEventListener('click', function() { self.pin_(alert_component); }); alert_component.addEventListener('dismiss', function() { if (beestat.setting('show_dismissed_alerts') === false) { this.hide(); } self.back_(); }); alert_component.addEventListener('restore', function() { self.back_(); }); alert_component.render(parent); self.alert_components_.push(alert_component); }); self.show_or_hide_(); // Back handler this.addEventListener('back', function() { self.unpin_(); }); }; /** * Expand the passed alert component, then hide the rest. * * @param {beestat.component.alert} alert_component */ beestat.component.card.alerts.prototype.pin_ = function(alert_component) { var self = this; this.show_back_(); this.pinned_alert_component_ = alert_component; this.pinned_alert_component_.expand(); this.alert_components_.forEach(function(this_alert_component) { if (this_alert_component !== self.pinned_alert_component_) { this_alert_component.hide(); } }); }; /** * Collapse the open alert component, then show the hidden ones. */ beestat.component.card.alerts.prototype.unpin_ = function() { var self = this; if (this.pinned_alert_component_ !== undefined) { this.pinned_alert_component_.collapse(); } this.alert_components_.forEach(function(this_alert_component) { if (this_alert_component !== self.pinned_alert_component_) { this_alert_component.show(); } }); this.show_or_hide_(); delete this.pinned_alert_component_; }; /** * Get the title of the card. * * @return {string} The title. */ beestat.component.card.alerts.prototype.get_title_ = function() { return 'Alerts'; }; /** * Decorate the menu. * * @param {rocket.Elements} parent */ beestat.component.card.alerts.prototype.decorate_top_right_ = function(parent) { var self = this; var menu = (new beestat.component.menu()).render(parent); var menu_item_show; var menu_item_hide; menu_item_show = new beestat.component.menu_item() .set_text('Show dismissed') .set_icon('bell') .set_callback(function() { menu_item_hide.show(); menu_item_show.hide(); beestat.setting('show_dismissed_alerts', true); self.show_or_hide_(); self.unpin_(); }); menu.add_menu_item(menu_item_show); menu_item_hide = new beestat.component.menu_item() .set_text('Hide dismissed') .set_icon('bell_off') .set_callback(function() { menu_item_hide.hide(); menu_item_show.show(); beestat.setting('show_dismissed_alerts', false); self.show_or_hide_(); self.unpin_(); }); menu.add_menu_item(menu_item_hide); if (beestat.setting('show_dismissed_alerts') === true) { menu_item_hide.show(); menu_item_show.hide(); } else { menu_item_hide.hide(); menu_item_show.show(); } var menu_item_help = new beestat.component.menu_item() .set_text('Help') .set_icon('help_circle') .set_callback(function() { window.open('https://doc.beestat.io/dd453829dc7c47019a775130c93bde0c'); }); menu.add_menu_item(menu_item_help); }; /** * Look at all of the existing alerts and determine if any UI changes need to * be made (show/hide, background colors, etc). */ beestat.component.card.alerts.prototype.show_or_hide_ = function() { var has_alerts = false; this.alert_components_.forEach(function(alert_component) { var should_show = alert_component.should_show(); has_alerts = has_alerts || should_show; if (should_show === true) { alert_component.show(); } else { alert_component.hide(); } }); if (has_alerts === true) { this.parent_.style('background', beestat.style.color.red.base); this.no_alerts_.style('transform', 'translate(-50%, -50%) scale(0)'); } else { this.parent_.style('background', beestat.style.color.bluegray.base); this.no_alerts_.style('transform', 'translate(-50%, -50%) scale(1)'); } };