diff --git a/pom.xml b/pom.xml
index 3c65f7c..96ef656 100644
--- a/pom.xml
+++ b/pom.xml
@@ -22,7 +22,7 @@
2.6.0
2.5.0
- 24.3.9
+ 24.3.10
diff --git a/src/main/java/com/pi4j/boardinfoservice/views/BaseLayout.java b/src/main/java/com/pi4j/boardinfoservice/views/BaseLayout.java
index 09bfabc..eda9d9d 100644
--- a/src/main/java/com/pi4j/boardinfoservice/views/BaseLayout.java
+++ b/src/main/java/com/pi4j/boardinfoservice/views/BaseLayout.java
@@ -7,9 +7,9 @@
import com.vaadin.flow.component.button.ButtonVariant;
import com.vaadin.flow.component.html.*;
import com.vaadin.flow.component.icon.VaadinIcon;
-import com.vaadin.flow.component.sidenav.SideNav;
-import com.vaadin.flow.component.sidenav.SideNavItem;
import com.vaadin.flow.router.PageTitle;
+import com.vaadin.flow.router.RouterLink;
+import com.vaadin.flow.theme.lumo.LumoUtility;
/**
* The main view is a top-level placeholder for other views.
@@ -52,20 +52,34 @@ private Component createDrawerContent() {
return section;
}
- private SideNav createNavigation() {
- SideNav nav = new SideNav();
+ private Nav createNavigation() {
+ Nav nav = new Nav();
+ nav.addClassNames(LumoUtility.Display.FLEX, LumoUtility.Overflow.AUTO, LumoUtility.Padding.Horizontal.MEDIUM, LumoUtility.Padding.Vertical.XSMALL);
- nav.addItem(
- new SideNavItem("Board Information", BoardInfoView.class, VaadinIcon.DATABASE.create()),
- new SideNavItem("System Information", SystemInfoView.class, VaadinIcon.INFO.create()),
- new SideNavItem("Open API", "https://api.pi4j.com/api/docs/pi4j", VaadinIcon.GLOBE.create()),
- new SideNavItem("Swagger UI - API", "https://api.pi4j.com/swagger-ui/index.html", VaadinIcon.GLOBE.create()),
- new SideNavItem("Pi4J Docs", "https://pi4j.com", VaadinIcon.GLOBE.create())
- );
+ // Wrap the links in a list; improves accessibility
+ UnorderedList list = new UnorderedList();
+ //list.addClassNames(LumoUtility.Display.FLEX, LumoUtility.Gap.SMALL, LumoUtility.ListStyleType.NONE, LumoUtility.Margin.NONE, LumoUtility.Padding.NONE);
+ list.addClassNames(LumoUtility.Gap.SMALL, LumoUtility.ListStyleType.NONE, LumoUtility.Margin.NONE, LumoUtility.Padding.NONE);
+ nav.add(list);
+
+ for (ListItem menuItem : createMenuItems()) {
+ list.add(menuItem);
+ }
return nav;
}
+ private ListItem[] createMenuItems() {
+ return new ListItem[]{
+ new MenuItemComponent("Board Information", VaadinIcon.DATABASE.create(), BoardInfoView.class),
+ new MenuItemComponent("System Information", VaadinIcon.INFO.create(), SystemInfoView.class),
+ new MenuItemComponent("Thanks to...", VaadinIcon.HANDS_UP.create(), ThanksView.class),
+ new MenuItemExternalLink("Open API", VaadinIcon.GLOBE.create(), "https://api.pi4j.com/api/docs/pi4j"),
+ new MenuItemExternalLink("Swagger UI - API", VaadinIcon.GLOBE.create(), "https://api.pi4j.com/swagger-ui/index.html"),
+ new MenuItemExternalLink("Pi4J Docs", VaadinIcon.GLOBE.create(), "https://pi4j.com")
+ };
+ }
+
private Footer createFooter() {
Footer layout = new Footer();
layout.addClassNames("app-nav-footer");
@@ -83,4 +97,55 @@ private String getCurrentPageTitle() {
PageTitle title = getContent().getClass().getAnnotation(PageTitle.class);
return title == null ? "" : title.value();
}
+
+ public static class MenuItemComponent extends ListItem {
+ private final Class extends Component> view;
+
+ public MenuItemComponent(String menuTitle, Component icon, Class extends Component> view) {
+ this.view = view;
+ RouterLink link = new RouterLink();
+ // Use Lumo classnames for various styling
+ link.addClassNames(LumoUtility.Display.FLEX, LumoUtility.Gap.XSMALL, LumoUtility.Height.MEDIUM, LumoUtility.AlignItems.CENTER, LumoUtility.Padding.Horizontal.SMALL,
+ LumoUtility.TextColor.BODY);
+ link.setRoute(view);
+
+ Span text = new Span(menuTitle);
+ // Use Lumo classnames for various styling
+ text.addClassNames(LumoUtility.FontWeight.MEDIUM, LumoUtility.FontSize.MEDIUM, LumoUtility.Whitespace.NOWRAP);
+
+ if (icon != null) {
+ link.add(icon);
+ }
+ link.add(text);
+ add(link);
+ }
+
+ public Class> getView() {
+ return view;
+ }
+ }
+
+ public static class MenuItemExternalLink extends ListItem {
+ public MenuItemExternalLink(String menuTitle, Component icon, String url) {
+ Anchor link = new Anchor(url, "", AnchorTarget.BLANK);
+ link.addClassNames(LumoUtility.Display.FLEX,
+ LumoUtility.Gap.XSMALL,
+ LumoUtility.Height.MEDIUM,
+ LumoUtility.AlignItems.CENTER,
+ LumoUtility.Padding.Horizontal.SMALL,
+ LumoUtility.TextColor.BODY);
+
+ if (icon != null) {
+ link.add(icon);
+ }
+
+ Span text = new Span(menuTitle);
+ text.addClassNames(LumoUtility.FontWeight.MEDIUM,
+ LumoUtility.FontSize.MEDIUM,
+ LumoUtility.Whitespace.NOWRAP);
+ link.add(text);
+
+ add(link);
+ }
+ }
}
diff --git a/src/main/java/com/pi4j/boardinfoservice/views/ThanksView.java b/src/main/java/com/pi4j/boardinfoservice/views/ThanksView.java
new file mode 100644
index 0000000..e51cdc2
--- /dev/null
+++ b/src/main/java/com/pi4j/boardinfoservice/views/ThanksView.java
@@ -0,0 +1,40 @@
+package com.pi4j.boardinfoservice.views;
+
+import com.vaadin.flow.component.html.*;
+import com.vaadin.flow.component.orderedlayout.VerticalLayout;
+import com.vaadin.flow.router.PageTitle;
+import com.vaadin.flow.router.Route;
+
+@PageTitle("Thanks to...")
+@Route(value = "thanks", layout = BaseLayout.class)
+public class ThanksView extends VerticalLayout {
+
+ public ThanksView() {
+ setSpacing(false);
+
+ setSizeFull();
+ setJustifyContentMode(JustifyContentMode.START);
+
+ add(new H2("Pi4J"));
+ add(new Paragraph(
+ new Span("This website is part of the "),
+ new Anchor("http://pi4j.com/", "Pi4J project", AnchorTarget.BLANK),
+ new Span("""
+ , a friendly object-oriented I/O API and implementation libraries for Java Programmers
+ to access the full I/O capabilities of the Raspberry Pi platform. This project abstracts
+ the low-level native integration and interrupt monitoring to enable Java programmers
+ to focus on implementing their application business logic.
+ """)));
+
+ add(new H2("Thanks to..."));
+ add(new Paragraph(
+ new Anchor("http://finaltek.com/", "FinalTek", AnchorTarget.BLANK),
+ new Span(", for hosting this website on a Raspberry Pi in their data center!")));
+ add(new Paragraph(
+ new Anchor("https://vaadin.com/", "Vaadin", AnchorTarget.BLANK),
+ new Span(", for this amazing Java Web framework with which this website is made.")));
+ add(new Paragraph(
+ new Anchor("https://foojay.io/", "Foojay and the whole Java community", AnchorTarget.BLANK),
+ new Span(", for sharing a lot of knowledge about the complete Java and JDK ecosystem")));
+ }
+}