Pendant pin status (winder#2576)

* Fix UI for pin status in pendant header
* New pendant start UI with clickable link

ugs-pendant/src/main/webapp/src/components/AccessoryState.tsx

@@ -3,10 +3,11 @@ import "./AccessoryState.scss";
 
 type Props = {
    children: React.ReactNode;
+   title?: string;
 };
-const AccessoryState = ({ children }: Props) => {
+const AccessoryState = ({ children, title }: Props) => {
   return (
-    <Card bg="dark" className="accessoryState">
+    <Card bg="dark" className="accessoryState" title={title}>
       <Card.Body>{children}</Card.Body>
     </Card>
   );

ugs-pendant/src/main/webapp/src/components/Header.tsx

@@ -33,45 +33,18 @@ const Header = () => {
         </Nav.Item>
 
         <Nav.Item>
-          {status?.pins?.probe && <AccessoryState>P</AccessoryState>}
-          {status?.pins?.cycleStart && <AccessoryState>C</AccessoryState>}
-          {status?.pins?.hold && (
-            <Nav.Item>
-              <AccessoryState>H</AccessoryState>
-            </Nav.Item>
-          )}
-          {status?.pins?.door && (
-            <Nav.Item>
-              <AccessoryState>D</AccessoryState>
-            </Nav.Item>
-          )}
-
-          {status?.pins?.x && (
-            <Nav.Item>
-              <AccessoryState>X</AccessoryState>
-            </Nav.Item>
-          )}
-          {status?.pins?.z && (
-            <Nav.Item>
-              <AccessoryState>Y</AccessoryState>
-            </Nav.Item>
-          )}
-          {status?.pins?.a && (
-            <Nav.Item>
-              <AccessoryState>Z</AccessoryState>
-            </Nav.Item>
-          )}
-          {status?.pins?.b && (
-            <Nav.Item>
-              <AccessoryState>A</AccessoryState>
-            </Nav.Item>
-          )}
-          {status?.pins?.c && (
-            <Nav.Item>
-              <AccessoryState>B</AccessoryState>
-            </Nav.Item>
-          )}
+          {status?.pins?.probe && <AccessoryState title="Probe">P</AccessoryState>}
+          {status?.pins?.cycleStart && <AccessoryState title="Cycle start">C</AccessoryState>}
+          {status?.pins?.hold && <AccessoryState title="HOLD">H</AccessoryState>}
+          {status?.pins?.door && <AccessoryState title="Door">D</AccessoryState>}
+          {status?.pins?.x && <AccessoryState>X</AccessoryState>}
+          {status?.pins?.y && <AccessoryState>Y</AccessoryState>}
+          {status?.pins?.z && <AccessoryState>Z</AccessoryState>}
+          {status?.pins?.a && <AccessoryState>A</AccessoryState>}
+          {status?.pins?.b && <AccessoryState>B</AccessoryState>}
+          {status?.pins?.c && <AccessoryState>C</AccessoryState>}
         </Nav.Item>
+
         {isConnected && status?.state !== "DISCONNECTED" && (
           <Nav.Item className="ml-auto">
             <Button

ugs-platform/ugs-platform-ugscore/src/main/java/com/willwinder/ugs/nbp/core/actions/PendantAction.java

@@ -18,19 +18,10 @@ This file is part of Universal Gcode Sender (UGS).
  */
 package com.willwinder.ugs.nbp.core.actions;
 
+import com.willwinder.ugs.nbp.core.panels.QRPanel;
 import com.willwinder.ugs.nbp.core.services.PendantService;
-import com.willwinder.ugs.nbp.lib.lookup.CentralLookup;
 import com.willwinder.ugs.nbp.lib.services.LocalizingService;
-import com.willwinder.universalgcodesender.model.BackendAPI;
-import com.willwinder.universalgcodesender.pendantui.PendantUI;
 import com.willwinder.universalgcodesender.pendantui.PendantURLBean;
-import java.awt.event.ActionEvent;
-import java.util.Collection;
-import javax.swing.AbstractAction;
-import javax.swing.ImageIcon;
-import javax.swing.JLabel;
-import javax.swing.JOptionPane;
-import javax.swing.JPanel;
 import net.miginfocom.swing.MigLayout;
 import org.openide.awt.ActionID;
 import org.openide.awt.ActionReference;
@@ -39,8 +30,23 @@ This file is part of Universal Gcode Sender (UGS).
 import org.openide.util.ImageUtilities;
 import org.openide.util.Lookup;
 
+import javax.swing.AbstractAction;
+import javax.swing.JLabel;
+import javax.swing.JOptionPane;
+import javax.swing.JPanel;
+import javax.swing.SwingUtilities;
+import java.awt.Component;
+import java.awt.Cursor;
+import java.awt.Desktop;
+import java.awt.Window;
+import java.awt.event.ActionEvent;
+import java.awt.event.MouseAdapter;
+import java.awt.event.MouseEvent;
+import java.net.URI;
+import java.util.Collection;
+import java.util.Optional;
+
 /**
- *
  * @author wwinder
  */
 @ActionID(
@@ -61,11 +67,7 @@ public class PendantAction extends AbstractAction {
 
     public static final String ICON_BASE = "resources/icons/pendant.svg";
 
-    private final BackendAPI backend;
-
     public PendantAction() {
-        this.backend = CentralLookup.getDefault().lookup(BackendAPI.class);
-
         putValue("iconBase", ICON_BASE);
         putValue(SMALL_ICON, ImageUtilities.loadImageIcon(ICON_BASE, false));
         putValue("menuText", LocalizingService.PendantTitle);
@@ -78,20 +80,35 @@ public void actionPerformed(ActionEvent e) {
         Collection<PendantURLBean> results = pendantService.startPendant();
 
         JPanel panel = new JPanel();
-        panel.setLayout(new MigLayout("fill, wrap 1"));
-        String urlPattern = "<HTML>URL: <a href=\"%s\">%s</a></html>";
-        for (PendantURLBean result : results) {
-            panel.add(new JLabel(String.format(urlPattern, result.getUrlString(), result.getUrlString())),
-                    "al center");
-            panel.add(new JLabel(
-                    "",
-                    new ImageIcon(result.getQrCodeJpg(), "QR Code"),
-                    JLabel.CENTER),
-                    "al center");
+        panel.setLayout(new MigLayout("fill, inset 0"));
 
-            JOptionPane.showMessageDialog(null,panel,"Pendant Address",JOptionPane.PLAIN_MESSAGE);
-
-            return;
+        Optional<PendantURLBean> first = results.stream().findFirst();
+        if (first.isPresent()) {
+            panel.add(new QRPanel(first.get()), "grow, al center, wrap");
+            JLabel link = createLinkLabel(first.get());
+            panel.add(link, "al center, gaptop 10");
+        } else {
+            panel.add(new JLabel("No network interface detected"), "al center, gap 10");
         }
+
+        Window parent = SwingUtilities.getWindowAncestor((Component) e.getSource());
+        JOptionPane.showMessageDialog(parent, panel, "Web pendant", JOptionPane.PLAIN_MESSAGE);
+    }
+
+    private static JLabel createLinkLabel(PendantURLBean pendantURLBean) {
+        String urlPattern = "<html><a href=\"%s\">%s</a></html>";
+        JLabel link = new JLabel(String.format(urlPattern, pendantURLBean.getUrlString(), pendantURLBean.getUrlString()));
+        link.setCursor(new Cursor(Cursor.HAND_CURSOR));
+        link.addMouseListener(new MouseAdapter() {
+            @Override
+            public void mouseClicked(MouseEvent e) {
+                try {
+                    Desktop.getDesktop().browse(new URI(pendantURLBean.getUrlString()));
+                } catch (Exception ex) {
+                    // Never mind
+                }
+            }
+        });
+        return link;
     }
 }

ugs-platform/ugs-platform-ugscore/src/main/java/com/willwinder/ugs/nbp/core/panels/QRPanel.java

@@ -0,0 +1,57 @@
+/*
+    Copyright 2024 Will Winder
+
+    This file is part of Universal Gcode Sender (UGS).
+
+    UGS is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    UGS is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with UGS.  If not, see <http://www.gnu.org/licenses/>.
+ */
+package com.willwinder.ugs.nbp.core.panels;
+
+import com.willwinder.universalgcodesender.pendantui.PendantURLBean;
+import org.openide.util.ImageUtilities;
+
+import javax.swing.ImageIcon;
+import javax.swing.JPanel;
+import javax.swing.border.EmptyBorder;
+import java.awt.Dimension;
+import java.awt.Graphics;
+import java.awt.Graphics2D;
+
+/**
+ * A panel that will show the QR code for accessing the web pendant
+ *
+ * @author Joacim Breiler
+ */
+public class QRPanel extends JPanel {
+    private final ImageIcon imageIcon;
+    private final ImageIcon qrIcon;
+
+    public QRPanel(PendantURLBean pendantURLBean) {
+        this.imageIcon = ImageUtilities.loadImageIcon("/resources/images/cell-phone.svg", false);
+        this.qrIcon = new ImageIcon(pendantURLBean.getQrCodeJpg(), "QR Code");
+        setBorder(new EmptyBorder(0,0,0,0));
+        setMinimumSize(new Dimension(imageIcon.getIconWidth(), imageIcon.getIconHeight()));
+        setPreferredSize(new Dimension(imageIcon.getIconWidth(), imageIcon.getIconHeight()));
+        setMaximumSize(new Dimension(imageIcon.getIconWidth(), imageIcon.getIconHeight()));
+    }
+
+    @Override
+    public void paint(Graphics g) {
+        Graphics2D g2 = (Graphics2D) g;
+        g2.drawImage(imageIcon.getImage(), 0,0, null);
+
+        int x = (imageIcon.getIconWidth() - qrIcon.getIconWidth()) / 2;
+        g2.drawImage(qrIcon.getImage(), x, 120, null);
+    }
+}