From 3f0bf78d8b172e5c0ec4e7cf26f2c46a80aeffd4 Mon Sep 17 00:00:00 2001
From: Stewart Allen <so@a3z.co>
Date: Sun, 9 Jun 2024 19:29:50 -0700
Subject: [PATCH] add hover titles for machining modes

---
 src/kiri-mode/cam/client.js |  1 +
 web/kiri/index.html         | 14 +++++++-------
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/kiri-mode/cam/client.js b/src/kiri-mode/cam/client.js
index ebeaa4ad..ccb10065 100644
--- a/src/kiri-mode/cam/client.js
+++ b/src/kiri-mode/cam/client.js
@@ -554,6 +554,7 @@ CAM.init = function(kiri, api) {
                 poprec.use(rec);
                 hoveredOp = el;
                 if (!clock) {
+                    // offset Y position of pop div by % of Y screen location of button
                     el.appendChild(poprec.div);
                     poprec.addNote();
                     const { innerHeight } = window;
diff --git a/web/kiri/index.html b/web/kiri/index.html
index 7d2426c0..d10066e2 100644
--- a/web/kiri/index.html
+++ b/web/kiri/index.html
@@ -148,32 +148,32 @@
                 <div class="top-menu-drop top-menu-right">
                     <div class="content">
                         <div id="mode-fdm">
-                            <label>FDM</label>
+                            <label title="3D Additive Printing Processes">FDM</label>
                             <span><i class="fas fa-layer-group"></i></span>
                         </div>
                         <div id="mode-cam">
-                            <label>CNC</label>
+                            <label title="CNC Mills and Subtractive Processes">CNC</label>
                             <span><i class="fas fa-bore-hole"></i></span>
                         </div>
                         <div id="mode-sla">
-                            <label>SLA</label>
+                            <label title="mSLA Resin Printing">SLA</label>
                             <span><i class="fas fa-cube"></i></span>
                         </div>
                         <hr>
                         <div id="mode-laser">
-                            <label>Laser</label>
+                            <label title="Laser Cutting and Engraving">Laser</label>
                             <span><i class="fas fa-bolt"></i></span>
                         </div>
                         <div id="mode-wjet">
-                            <label>Water</label>
+                            <label title="WaterJet Cutting">Water</label>
                             <span><i class="fas fa-location-pin"></i></span>
                         </div>
                         <div id="mode-wedm">
-                            <label>Wire</label>
+                            <label title="Wire EDM Cutting">Wire</label>
                             <span><i class="fas fa-ellipsis-vertical"></i></span>
                         </div>
                         <div id="mode-drag">
-                            <label>Drag</label>
+                            <label title="Drag Knife Cutting">Drag</label>
                             <span><i class="fas fa-caret-left"></i></span>
                         </div>
                     </div>