fix gauge temp over max issue #399

j7126 · Mar 8, 2024 · 6a48b12 · 6a48b12
1 parent ab02502
commit 6a48b12
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/octoprint_dashboard/static/js/dashboard.js b/octoprint_dashboard/static/js/dashboard.js
@@ -902,7 +902,7 @@ $(function () {
 
         self.formatTempOffset = function (temp, range) {
             if (temp) {
-                return (self.tempGaugePathLen() * (1 - temp / range)).toFixed(2);
+                return (self.tempGaugePathLen() * (1 - Math.min(temp, range) / range)).toFixed(2);
             } else return self.tempGaugePathLen();
         };
 

diff --git a/octoprint_dashboard/templates/dashboard_tab.jinja2 b/octoprint_dashboard/templates/dashboard_tab.jinja2
@@ -148,6 +148,9 @@
 
           <path class="dashboard_threeQuarterGauge_target" stroke="black" fill="none" data-bind="attr: { 'stroke-dashoffset': $parent.formatTempOffset(target(), $parent.dashboardSettings.hotendTempMax()),
               'd': $parent.tempGaugeSvgPath(), 'stroke-dasharray': $parent.tempGaugePathLen() }" />
+          <circle data-bind="visible: actual() > $parent.dashboardSettings.hotendTempMax()" cx="50%" cy="calc(50% - 32px)" r="8" fill="#ff6700">
+            <title>{{ _('Temperature is off the scale. Adjust the maximum temperature in settings!') }}</title>
+          </circle>
           <text class="dashboardGauge" font-size="30" x="50%" y="50%" dominant-baseline="middle" text-anchor="middle"
             fill="#08c" data-bind="html: Math.round(actual()) + '°C'"></text>
           <text class="dashboardGauge" font-size="20" x="50%" y="65%" dominant-baseline="middle" text-anchor="middle"
@@ -181,6 +184,9 @@
 
           <path class="dashboard_threeQuarterGauge_target" stroke="black" fill="none"
             data-bind="attr: { 'stroke-dashoffset': formatTempOffset(temperatureModel.bedTemp.target(), dashboardSettings.bedTempMax()), 'd': tempGaugeSvgPath(), 'stroke-dasharray': tempGaugePathLen() }" />
+          <circle data-bind="visible: temperatureModel.bedTemp.target() > dashboardSettings.bedTempMax()" cx="50%" cy="calc(50% - 32px)" r="8" fill="#ff6700">
+            <title>{{ _('Temperature is off the scale. Adjust the maximum temperature in settings!') }}</title>
+          </circle>
           <text class="dashboardGauge" font-size="30" x="50%" y="50%" dominant-baseline="middle" text-anchor="middle"
             fill="#08c" data-bind="html: Math.round(temperatureModel.bedTemp.actual()) + '°C'"></text>
           <text class="dashboardGauge" font-size="20" x="50%" y="65%" dominant-baseline="middle" text-anchor="middle"
@@ -213,6 +219,9 @@
 
           <path class="dashboard_threeQuarterGauge_target" stroke="black" fill="none" data-bind="attr: { 'stroke-dashoffset': formatTempOffset(temperatureModel.chamberTemp.target(), dashboardSettings.chamberTempMax()),
               'd': tempGaugeSvgPath(), 'stroke-dasharray': tempGaugePathLen() }" />
+          <circle data-bind="visible: temperatureModel.chamberTemp.target() > dashboardSettings.chamberTempMax()" cx="50%" cy="calc(50% - 32px)" r="8" fill="#ff6700">
+            <title>{{ _('Temperature is off the scale. Adjust the maximum temperature in settings!') }}</title>
+          </circle>
           <text class="dashboardGauge" font-size="30" x="50%" y="50%" dominant-baseline="middle" text-anchor="middle"
             fill="#08c" data-bind="html: Math.round(temperatureModel.chamberTemp.actual()) + '°C'"></text>
           <text class="dashboardGauge" font-size="20" x="50%" y="65%" dominant-baseline="middle" text-anchor="middle"
@@ -278,6 +287,9 @@
             data-bind="html: Math.round($data * $parents[1].dashboardSettings.chamberTempMax()), attr: { 'x': $parents[1].tempGaugeTickTextX($data), 'y': $parents[1].tempGaugeTickTextY($data) }"></text>
           <!-- /ko -->
 
+          <circle data-bind="visible: temp_sensor_temp() > $parent.dashboardSettings.chamberTempMax()" cx="50%" cy="calc(50% - 32px)" r="8" fill="#ff6700">
+            <title>{{ _('Temperature is off the scale. Adjust the maximum temperature in settings!') }}</title>
+          </circle>
           <text class="dashboardGauge" font-size="20" x="50%" y="85%" dominant-baseline="middle" text-anchor="middle"
             fill="#08c" data-bind="text: label"></text>
         </svg>