diff --git a/js/beestat/setting.js b/js/beestat/setting.js index 8cef0e7..3195dff 100644 --- a/js/beestat/setting.js +++ b/js/beestat/setting.js @@ -85,7 +85,9 @@ beestat.setting = function(argument_1, opt_value, opt_callback) { 'date_format': 'M/D/YYYY', - 'units.currency': 'usd' + 'units.currency': 'usd', + + 'ui.always_dock_tooltips': false }; // Figure out what we're trying to do. diff --git a/js/beestat/touch.js b/js/beestat/touch.js deleted file mode 100644 index 6cacd29..0000000 --- a/js/beestat/touch.js +++ /dev/null @@ -1,37 +0,0 @@ -/** - * Detect if the device is touch enabled. - * - * @link https://developer.mozilla.org/en-US/docs/Web/HTTP/Browser_detection_using_the_user_agent - * @return {boolean} Whether or not the device is touch enabled. - */ -beestat.touch = function() { - if (beestat.touch_ !== undefined) { - return beestat.touch_; - } - - let touch = false; - if ('maxTouchPoints' in navigator) { - touch = navigator.maxTouchPoints > 0; - } else if ('msMaxTouchPoints' in navigator) { - touch = navigator.msMaxTouchPoints > 0; - } else { - var mq = window.matchMedia && matchMedia('(pointer:coarse)'); - if (mq && mq.media === '(pointer:coarse)') { - touch = Boolean(mq.matches); - } else if ('orientation' in window) { - // Deprecated, but good fallback - touch = true; - } else { - // Only as a last resort, fall back to user agent sniffing - var UA = navigator.userAgent; - touch = ( - (/\b(BlackBerry|webOS|iPhone|IEMobile)\b/i).test(UA) || - (/\b(Android|Windows Phone|iPad|iPod)\b/i).test(UA) - ); - } - } - - // Cache result - beestat.touch_ = touch; - return beestat.touch_; -}; diff --git a/js/component/card/settings.js b/js/component/card/settings.js index 9220b24..91fde9c 100644 --- a/js/component/card/settings.js +++ b/js/component/card/settings.js @@ -16,6 +16,33 @@ beestat.component.card.settings.prototype.decorate_contents_ = function(parent) beestat.setting('thermostat_id') ]; + /** + * User Interface + */ + parent.appendChild( + $.createElement('p') + .style('font-weight', '400') + .innerText('User Interface') + ); + + // Always dock tooltips + const always_dock_tooltips = new beestat.component.input.checkbox(); + always_dock_tooltips + .set_label('Always Dock Tooltips') + .set_checked(beestat.setting('ui.always_dock_tooltips')) + .render(parent); + + always_dock_tooltips.addEventListener('change', function() { + always_dock_tooltips.set_enabled(false); + beestat.setting( + 'ui.always_dock_tooltips', + always_dock_tooltips.get_checked(), + function() { + always_dock_tooltips.set_enabled(true); + } + ); + }); + /** * Units */ diff --git a/js/component/chart.js b/js/component/chart.js index fc03e0f..2c3681c 100644 --- a/js/component/chart.js +++ b/js/component/chart.js @@ -36,6 +36,12 @@ beestat.component.chart.prototype.decorate_ = function(parent) { options.chart.renderTo = parent[0]; this.chart_ = Highcharts.chart(options); + + this.docked_tooltip_container_ = $.createElement('div'); + this.docked_tooltip_container_.style({ + 'margin-top': (beestat.style.size.gutter / 2) + 'px' + }); + parent.appendChild(this.docked_tooltip_container_); }; /** @@ -638,7 +644,25 @@ beestat.component.chart.prototype.tooltip_formatter_helper_ = function(title, se } }); - return tooltip[0].outerHTML; + if (this.get_dock_tooltip_() === true) { + this.docked_tooltip_container_.innerHTML(tooltip[0].outerHTML); + return ''; + } else { + this.docked_tooltip_container_.innerHTML(''); + return tooltip[0].outerHTML; + } +}; + +/** + * Get whether or not the tooltip should be docked. + * + * @return {boolean} + */ +beestat.component.chart.prototype.get_dock_tooltip_ = function() { + return ( + beestat.setting('ui.always_dock_tooltips') === true || + beestat.width < 600 + ); }; /** diff --git a/js/component/chart/runtime_thermostat_detail_temperature.js b/js/component/chart/runtime_thermostat_detail_temperature.js index c17811c..edb82b4 100644 --- a/js/component/chart/runtime_thermostat_detail_temperature.js +++ b/js/component/chart/runtime_thermostat_detail_temperature.js @@ -405,3 +405,12 @@ beestat.component.chart.runtime_thermostat_detail_temperature.prototype.get_opti beestat.component.chart.runtime_thermostat_detail_temperature.prototype.get_options_chart_marginLeft_ = function() { return 45; }; + +/** + * Get the height of the chart. + * + * @return {number} The height of the chart. + */ +beestat.component.chart.runtime_thermostat_detail_temperature.prototype.get_options_chart_height_ = function() { + return 350; +}; diff --git a/js/component/chart/runtime_thermostat_summary.js b/js/component/chart/runtime_thermostat_summary.js index b1cb2dd..dfa6a37 100755 --- a/js/component/chart/runtime_thermostat_summary.js +++ b/js/component/chart/runtime_thermostat_summary.js @@ -325,3 +325,12 @@ beestat.component.chart.runtime_thermostat_summary.prototype.get_options_xAxis_c beestat.component.chart.runtime_thermostat_summary.prototype.get_options_xAxis_crosshair_snap_ = function() { return true; }; + +/** + * Get the height of the chart. + * + * @return {number} The height of the chart. + */ +beestat.component.chart.runtime_thermostat_summary.prototype.get_options_chart_height_ = function() { + return 350; +}; diff --git a/js/js.php b/js/js.php index ab489d2..89a6e51 100755 --- a/js/js.php +++ b/js/js.php @@ -43,7 +43,6 @@ if($setting->get('environment') === 'dev' || $setting->get('environment') === 'd echo '' . PHP_EOL; echo '' . PHP_EOL; echo '' . PHP_EOL; - echo '' . PHP_EOL; echo '' . PHP_EOL; echo '' . PHP_EOL; echo '' . PHP_EOL;