From fc038d8400ffec73d951610c75a23040ae3d39fc Mon Sep 17 00:00:00 2001
From: Peuuuur-Noel <Peuuuur-Noel@users.noreply.github.com>
Date: Tue, 25 Jul 2023 20:24:30 +0000
Subject: [PATCH] fix: tooltip on "Small" footer style

---
 .../emhttp/plugins/nut/include/nut_footer.php      | 14 +++++++-------
 .../usr/local/emhttp/plugins/nut/nutFooter.page    | 12 ++++++++++--
 2 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/source/nut/usr/local/emhttp/plugins/nut/include/nut_footer.php b/source/nut/usr/local/emhttp/plugins/nut/include/nut_footer.php
index d3183434..6439f634 100644
--- a/source/nut/usr/local/emhttp/plugins/nut/include/nut_footer.php
+++ b/source/nut/usr/local/emhttp/plugins/nut/include/nut_footer.php
@@ -79,10 +79,10 @@ function format_time($seconds) {
 
   if ($battery !== false) {
     $battery_runtime = array_key_exists($nut_runtime, $ups_status) ? format_time($ups_status[$nut_runtime]) : "n/a";
-    if ($online && $battery < 100) $icon = "<span id='".($config['FOOTER_STYLE'] == 1 ? "copyright" : "nut_battery")."' class='tooltip-nut ".($config['FOOTER_STYLE'] == 1 ? "$black" : "$green")."' data='[{$nut_name}] Online - Battery is charging'><i class='fa fa-battery-charging'></i>&thinsp;{$battery}&thinsp;%</span>";
-    else if ($online && $battery  == 100) $icon = "<span id='".($config['FOOTER_STYLE'] == 1 ? "copyright" : "nut_battery")."' class='tooltip-nut ".($config['FOOTER_STYLE'] == 1 ? "$black" : "$green")."' data='[{$nut_name}] Online - Battery is full'><i class='fa fa-battery-full'></i>&thinsp;{$battery}&thinsp;%</span>";
-    else if (!$online) $icon = "<span id='".($config['FOOTER_STYLE'] == 1 ? "copyright" : "nut_battery")."' class='tooltip-nut $red' data='[{$nut_name}] Offline - Battery is discharging - Est. $battery_runtime left'><i class='fa fa-battery-discharging'></i>&thinsp;{$battery}&thinsp;%</span>";
-    else $icon = "<span id='".($config['FOOTER_STYLE'] == 1 ? "copyright" : "nut_battery")."' class='tooltip-nut ".($config['FOOTER_STYLE'] == 1 ? "$black" : "$green")."' data='[{$nut_name}] Battery status unknown'><i class='fa fa-battery-discharging'></i>n/a</span>";
+    if ($online && $battery < 100) $icon = "<span id='".($config['FOOTER_STYLE'] == 0 ? "nut_battery" : "")."' class='tooltip-nut ".($config['FOOTER_STYLE'] == 1 ? "$black" : "$green")."' data='[{$nut_name}] Online - Battery is charging'><i class='fa fa-battery-charging'></i>&thinsp;{$battery}&thinsp;%</span>";
+    else if ($online && $battery  == 100) $icon = "<span id='".($config['FOOTER_STYLE'] == 0 ? "nut_battery" : "")."' class='tooltip-nut ".($config['FOOTER_STYLE'] == 1 ? "$black" : "$green")."' data='[{$nut_name}] Online - Battery is full'><i class='fa fa-battery-full'></i>&thinsp;{$battery}&thinsp;%</span>";
+    else if (!$online) $icon = "<span id='".($config['FOOTER_STYLE'] == 0 ? "nut_battery" : "")."' class='tooltip-nut $red' data='[{$nut_name}] Offline - Battery is discharging - Est. $battery_runtime left'><i class='fa fa-battery-discharging'></i>&thinsp;{$battery}&thinsp;%</span>";
+    else $icon = "<span id='".($config['FOOTER_STYLE'] == 0 ? "nut_battery" : "")."' class='tooltip-nut ".($config['FOOTER_STYLE'] == 1 ? "$black" : "$green")."' data='[{$nut_name}] Battery status unknown'><i class='fa fa-battery-discharging'></i>n/a</span>";
 
     $status[0] = $icon;
   } else {
@@ -99,11 +99,11 @@ function format_time($seconds) {
     $realPower = $realPowerNominal && $load ? round($realPowerNominal * $load * 0.01) : -1;
 
   if ($realPower >= 0 && $apparentPower >= 0) {
-    $status[1] = "<span id='".($config['FOOTER_STYLE'] == 1 ? "copyright" : "nut_power")."' class='tooltip-nut " . ($load >= 90 ? "$red" : ($config['FOOTER_STYLE'] == 1 ? "$black" : "$green")) . "' data='[{$nut_name}] Load: $load&thinsp;% - Real power: $realPower&thinsp;W - Apparent power: $apparentPower&thinsp;VA'><i class='fa fa-plug'></i>&thinsp;{$realPower}&thinsp;W ({$apparentPower}&thinsp;VA)</span>";
+    $status[1] = "<span id='".($config['FOOTER_STYLE'] == 0 ? "nut_power" : "")."' class='tooltip-nut " . ($load >= 90 ? "$red" : ($config['FOOTER_STYLE'] == 1 ? "$black" : "$green")) . "' data='[{$nut_name}] Load: $load&thinsp;% - Real power: $realPower&thinsp;W - Apparent power: $apparentPower&thinsp;VA'><i class='fa fa-plug'></i>&thinsp;{$realPower}&thinsp;W ({$apparentPower}&thinsp;VA)</span>";
   } else if ($realPower >= 0 && $load) {
-    $status[1] = "<span id='".($config['FOOTER_STYLE'] == 1 ? "copyright" : "nut_power")."' class='tooltip-nut " . ($load >= 90 ? "$red" : ($config['FOOTER_STYLE'] == 1 ? "$black" : "$green")) . "' data='[{$nut_name}] Load: $load&thinsp;% - Real power: $realPower&thinsp;W'><i class='fa fa-plug'></i>&thinsp;{$realPower}&thinsp;W</span>";
+    $status[1] = "<span id='".($config['FOOTER_STYLE'] == 0 ? "nut_power" : "")."' class='tooltip-nut " . ($load >= 90 ? "$red" : ($config['FOOTER_STYLE'] == 1 ? "$black" : "$green")) . "' data='[{$nut_name}] Load: $load&thinsp;% - Real power: $realPower&thinsp;W'><i class='fa fa-plug'></i>&thinsp;{$realPower}&thinsp;W</span>";
   } else if ($apparentPower >= 0){
-    $status[1] = "<span id='".($config['FOOTER_STYLE'] == 1 ? "copyright" : "nut_power")."' class='tooltip-nut " . ($load >= 90 ? "$red" : ($config['FOOTER_STYLE'] == 1 ? "$black" : "$green"))."' data='[{$nut_name}] Load: $load&thinsp;% - Apparent power: $apparentPower&thinsp;VA'><i class='fa fa-plug'></i>&thinsp;{$apparentPower}&thinsp;VA</span>";
+    $status[1] = "<span id='".($config['FOOTER_STYLE'] == 0 ? "nut_power" : "")."' class='tooltip-nut " . ($load >= 90 ? "$red" : ($config['FOOTER_STYLE'] == 1 ? "$black" : "$green"))."' data='[{$nut_name}] Load: $load&thinsp;% - Apparent power: $apparentPower&thinsp;VA'><i class='fa fa-plug'></i>&thinsp;{$apparentPower}&thinsp;VA</span>";
   }
 
   echo "<span style='margin:0 6px 0 12px'>".implode('</span><span style="margin:0 6px 0 6px">', $status)."</span>";
diff --git a/source/nut/usr/local/emhttp/plugins/nut/nutFooter.page b/source/nut/usr/local/emhttp/plugins/nut/nutFooter.page
index 09c48c2d..762b8dde 100644
--- a/source/nut/usr/local/emhttp/plugins/nut/nutFooter.page
+++ b/source/nut/usr/local/emhttp/plugins/nut/nutFooter.page
@@ -40,6 +40,7 @@ EOT;
 ?>
 
 <?require_once '/usr/local/emhttp/plugins/nut/include/nut_config.php';?>
+<?$config = parse_ini_file('/boot/config/plugins/nut/nut.cfg');?>
 <?if ($nut_footer == "enable" && $nut_running):?>
 <?$update= $nut_refresh == "enable" ? true : false;?>
 <style type="text/css">
@@ -119,7 +120,15 @@ EOT;
 
   $(function()
     {
-      footer = $("<span id='nut_footer'></span>").insertAfter("div#footer > span#copyright").css("float","right").css("margin-right", "6px");
+      var footer = $("<span id='nut_footer'></span>").insertAfter("div#footer > span#copyright").css({"float": "right", "margin-right": "6px"});
+      <?if ($config['FOOTER_STYLE'] == 1): ?>
+        footer.css({
+          "font-family": "bitstream",
+          "font-size": "1.1rem",
+          "float": "right",
+          "padding-right": "10px"
+        });
+      <?endif;?>
       getNUTfooter();
       $('body').on('mouseenter', '.tooltip-nut', function()
       {
@@ -138,7 +147,6 @@ EOT;
               instance.content($(helper.origin).attr("data"));
             }
           }).tooltipster('open');
-
         }
       });
     }