feature(map): add tooltip displaying wormhole static information in s…

…ystem info view
updraft0 · Jun 15, 2024 · a2acb29 · a2acb29
1 parent a037524
commit a2acb29
Show file tree

Hide file tree

Showing 6 changed files with 108 additions and 16 deletions.
diff --git a/constant/src/main/scala/org/updraft0/controltower/constant/enum.scala b/constant/src/main/scala/org/updraft0/controltower/constant/enum.scala
@@ -37,6 +37,8 @@ enum WormholeClass(val value: Int, val spaceType: SpaceType) derives CanEqual:
   // pochven
   case Pochven extends WormholeClass(25, SpaceType.Pochven)
 
+  def isDrifter: Boolean = value > 13 && value < 19
+
 object WormholeClasses:
   lazy val ById = WormholeClass.values.map(c => c.value -> c).toMap
 

diff --git a/protocol/shared/src/main/scala/org/updraft0/controltower/protocol/reference.scala b/protocol/shared/src/main/scala/org/updraft0/controltower/protocol/reference.scala
@@ -43,6 +43,9 @@ case class WormholeType(
     else if (maxJumpMass >= 62_000_000) WormholeMassSize.M
     else WormholeMassSize.S
 
+  def stablePoints: Double = (maxStableMass / 10_000_000).toDouble / 10.0d
+  def jumpPoints: Double   = (maxJumpMass / 10_000_000).toDouble / 10.0d
+
 /** Signature group/name/wormhole class
   */
 case class SignatureInGroup(signatureGroup: SignatureGroup, name: String, targetClasses: Array[WormholeClass])

diff --git a/ui/src/main/css/app.css b/ui/src/main/css/app.css
@@ -6,6 +6,7 @@
 
 /* controls */
 @import 'components/option-dropdown.css';
+@import 'components/tooltip.css';
 
 /* pages */
 @import 'views/landing-page.css';
@@ -15,6 +16,7 @@
 
 /* map views */
 @import 'views/nav-top-view.css';
+@import 'views/solar-system-info-view.css';
 @import 'views/map-system-signature-view.css';
 
 /* ok? */
@@ -427,11 +429,7 @@ mark.system-map-name {
     white-space: nowrap;
 }
 
-mark.system-wormhole-static {
-    background: inherit;
-    margin-left: 2px;
-    margin-right: 2px;
-}
+
 
 /* FIXME colors wrong here */
 .system-stance-hostile {

diff --git a/ui/src/main/css/components/tooltip.css b/ui/src/main/css/components/tooltip.css
@@ -0,0 +1,25 @@
+.tooltip {
+    visibility: hidden;
+    position: absolute;
+    background-color: $gray-dark;
+
+    transition-delay: 200ms;
+    transition-property: visibility;
+
+    /* TODO standardise */
+    box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
+    border: 1px solid $gray-darker;
+    border-radius: 5px;
+
+    font-size: 0.8em;
+    color: $gray-lighter;
+    opacity: 90%;
+
+    & h3.tooltip-title {
+        color: $gray-light;
+        font-size: 1em;
+        margin-top: 0.1em;
+        margin-bottom: 0.2em;
+        border-bottom: 1px solid $gray-darker;
+    }
+}
diff --git a/ui/src/main/css/views/solar-system-info-view.css b/ui/src/main/css/views/solar-system-info-view.css
@@ -0,0 +1,29 @@
+/* TODO - move styles over from app.css */
+
+mark.system-wormhole-static {
+    background: inherit;
+    margin-left: 2px;
+    margin-right: 2px;
+
+
+    &:hover {
+        cursor: help;
+    }
+
+    &:hover + .tooltip {
+        visibility: visible;
+    }
+}
+
+.wormhole-static-tooltip {
+    left: anchor(var(--anchor-var) right);
+    margin-left: 0.5em;
+    z-index: 1000;
+
+    & table.wormhole-static-info {
+        & tr td:nth-child(even) {
+            text-align: left;
+            font-weight: bold;
+        }
+    }
+}
diff --git a/ui/src/main/scala/controltower/page/map/view/SolarSystemInfoView.scala b/ui/src/main/scala/controltower/page/map/view/SolarSystemInfoView.scala
@@ -3,7 +3,7 @@ package controltower.page.map.view
 import com.raquo.laminar.api.L.*
 import controltower.backend.{ESI, ThirdParty}
 import controltower.ui.ViewController
-import org.updraft0.controltower.constant.SpaceType
+import org.updraft0.controltower.constant.{SpaceType, WormholeClass}
 import org.updraft0.controltower.protocol.*
 
 case class SystemInfo(systemId: Long, name: Option[String])
@@ -95,16 +95,51 @@ private inline def solarSystemInfo(
 //            i(cls := "ti", cls := "ti-moon-filled"),
 //            s" ${solarSystem.planets.map(_.moonCount).sum}"
 //          )
-      solarSystem.wormholeStatics.map { static =>
-        val whType = wormholeTypes(static.typeId)
-        mark(
-          cls := "system-wormhole-static",
-          cls := s"system-wormhole-static-${static.name.toLowerCase}",
-          cls := s"system-class-${whType.targetClass.toString.toLowerCase}",
-          static.name,
-          i(cls := "ti", cls := "ti-arrow-narrow-right"),
-          whType.targetClass.toString
+      Option
+        .when(!solarSystem.systemClass.forall(_.isDrifter))(
+          solarSystem.wormholeStatics.flatMap(staticInfo(wormholeTypes, _)).toSeq
+        )
+        .getOrElse(nodeSeq())
+    )
+  )
+
+private inline def staticInfo(wormholeTypes: Map[Long, WormholeType], static: WormholeStatic) =
+  val whType = wormholeTypes(static.typeId)
+  nodeSeq(
+    mark(
+      idAttr                   := s"static-${static.typeId}",
+      cls                      := "system-wormhole-static",
+      dataAttr("static-name")  := static.name,
+      dataAttr("static-class") := whType.targetClass.toString,
+      styleAttr                := s"anchor-name: --static-${static.typeId}",
+      // TODO - move away from this CSS class
+      cls := s"system-class-${whType.targetClass.toString.toLowerCase}",
+      static.name,
+      i(cls := "ti", cls := "ti-arrow-narrow-right"),
+      whType.targetClass.toString
+    ),
+    div(
+      cls := "tooltip",
+      cls := "wormhole-static-tooltip",
+      // FIXME - the anchor position polyfill is not dynamic and does not support vars - aka no Firefox or Safari
+      styleAttr := s"--anchor-var: --static-${static.typeId}",
+      h3(cls := "tooltip-title", whType.name),
+      table(
+        cls := "wormhole-static-info",
+        tbody(
+          tr(
+            td("Points"),
+            td(whType.stablePoints)
+          ),
+          tr(
+            td("Lifetime"),
+            td(s"${whType.maxStableTime / 60}h")
+          ),
+          tr(
+            td("Size"),
+            td(whType.massSize.toString)
+          )
         )
-      }
+      )
     )
   )