add tooltips and labels to knobs

src/main/kotlin/net/liquidev/dawd3/audio/device/controls.kt

@@ -15,6 +15,12 @@ class ControlName(parent: Identifier, name: String) {
 
     override fun toString() = id.toString()
 
+    fun toTranslationKey(): String {
+        val namespace = id.namespace
+        val key = id.path.replace('/', '.')
+        return "dawd3.control.${namespace}.${key}"
+    }
+
     companion object {
         private val registry = hashMapOf<Identifier, ControlName>()
 

src/main/kotlin/net/liquidev/dawd3/block/devices/math/AmplifierBlockDescriptor.kt

@@ -5,6 +5,8 @@ import net.liquidev.dawd3.audio.device.DeviceInstance
 import net.liquidev.dawd3.audio.devices.math.AmplifierDevice
 import net.liquidev.dawd3.block.device.DeviceBlockDescriptor
 import net.liquidev.dawd3.block.device.PhysicalPort
+import net.liquidev.dawd3.ui.units.AmplitudeValue
+import net.liquidev.dawd3.ui.units.PercentageValue
 import net.liquidev.dawd3.ui.widget.Knob
 import net.liquidev.dawd3.ui.widget.Widget
 import net.liquidev.dawd3.ui.widget.Window
@@ -59,6 +61,7 @@ object AmplifierBlockDescriptor : DeviceBlockDescriptor<AmplifierBlockDescriptor
                         min = 0f,
                         max = 1f,
                         color = Knob.Color.Red,
+                        unit = AmplitudeValue,
                     )
                 )
                 children.add(
@@ -69,6 +72,7 @@ object AmplifierBlockDescriptor : DeviceBlockDescriptor<AmplifierBlockDescriptor
                         min = -8f,
                         max = 8f,
                         color = Knob.Color.Blue,
+                        unit = PercentageValue,
                     )
                 )
             }

src/main/kotlin/net/liquidev/dawd3/render/Render.kt

@@ -290,6 +290,22 @@ object Render {
         )
     }
 
+    fun textWidth(text: Text): Int {
+        val textRenderer = MinecraftClient.getInstance().textRenderer
+        return textRenderer.getWidth(text)
+    }
+
+    fun text(matrices: MatrixStack, x: Int, y: Int, text: Text, color: Int) {
+        val textRenderer = MinecraftClient.getInstance().textRenderer
+        textRenderer.draw(
+            matrices,
+            text,
+            x.toFloat(),
+            y.toFloat(),
+            color
+        )
+    }
+
     fun textCentered(matrices: MatrixStack, centerX: Int, y: Int, text: Text, color: Int) {
         val textRenderer = MinecraftClient.getInstance().textRenderer
         val textWidth = textRenderer.getWidth(text)
@@ -302,4 +318,32 @@ object Render {
             color
         )
     }
+
+    fun tooltipWidth(text: Text): Int = textWidth(text) + 5
+
+    fun tooltip(
+        matrices: MatrixStack,
+        x: Int,
+        y: Int,
+        text: Text,
+        atlas: Atlas,
+        tooltip: Tooltip,
+    ) {
+        val width = tooltipWidth(text)
+        ninePatch(matrices, x, y, width, height = 14, atlas, tooltip.ninePatch)
+        text(matrices, x + 3, y + 3, text, tooltip.textColor)
+    }
+
+    fun tooltipCentered(
+        matrices: MatrixStack,
+        centerX: Int,
+        y: Int,
+        text: Text,
+        atlas: Atlas,
+        tooltip: Tooltip,
+    ) {
+        val width = tooltipWidth(text)
+        val x = centerX - width / 2
+        tooltip(matrices, x, y, text, atlas, tooltip)
+    }
 }

src/main/kotlin/net/liquidev/dawd3/render/Tooltip.kt

@@ -0,0 +1,10 @@
+package net.liquidev.dawd3.render
+
+data class Tooltip(val ninePatch: NinePatch, val textColor: Int) {
+    companion object {
+        val dark = Tooltip(
+            NinePatch(u = 32, v = 0, width = 8, height = 8, border = 2),
+            textColor = 0xFFFFFF
+        )
+    }
+}

src/main/kotlin/net/liquidev/dawd3/ui/Rack.kt

@@ -9,6 +9,7 @@ import net.liquidev.dawd3.ui.widget.Widget
 import net.minecraft.client.gui.screen.Screen
 import net.minecraft.client.util.math.MatrixStack
 import net.minecraft.client.world.ClientWorld
+import net.minecraft.text.Style
 import net.minecraft.text.Text
 import net.minecraft.util.Identifier
 import net.minecraft.util.math.BlockPos
@@ -97,6 +98,9 @@ class Rack(
         val atlas = Atlas(asset = Identifier(Mod.id, "textures/ui/rack.png"), size = 64)
         val badge = Icon(u = 0, v = 16, width = 6, height = 3)
 
+        val smallFont = Identifier(Mod.id, "altopixel")
+        val smallText = Style.EMPTY.withFont(smallFont)!!
+
         // TODO: This "adjacent device" system is kind of janky but it allows for pretty nice
         //  organization of your devices into multiple racks of sorts. Maybe in the future we can
         //  think of collecting non-adjacent devices as well.

src/main/kotlin/net/liquidev/dawd3/ui/units/float.kt

@@ -0,0 +1,28 @@
+package net.liquidev.dawd3.ui.units
+
+import net.liquidev.dawd3.audio.unit.Amplitude
+import kotlin.math.roundToInt
+
+interface FloatUnit {
+    fun display(value: Float): String
+}
+
+object RawValue : FloatUnit {
+    override fun display(value: Float) = String.format("%.02f", value)
+}
+
+object AmplitudeValue : FloatUnit {
+    override fun display(value: Float): String {
+        val decibels = Amplitude(value).toDecibels().value
+        return if (decibels == Float.NEGATIVE_INFINITY) {
+            "-∞ dB"
+        } else {
+            String.format("%.01f dB", decibels)
+        }
+    }
+}
+
+object PercentageValue : FloatUnit {
+    override fun display(value: Float) =
+        String.format("%d%%", (value * 100f).roundToInt())
+}

src/main/kotlin/net/liquidev/dawd3/ui/widget/Knob.kt

@@ -10,15 +10,16 @@ import net.liquidev.dawd3.net.ControlTweaked
 import net.liquidev.dawd3.net.TweakControl
 import net.liquidev.dawd3.render.Render
 import net.liquidev.dawd3.render.TextureStrip
+import net.liquidev.dawd3.render.Tooltip
 import net.liquidev.dawd3.ui.*
+import net.liquidev.dawd3.ui.units.FloatUnit
+import net.liquidev.dawd3.ui.units.RawValue
 import net.minecraft.client.MinecraftClient
 import net.minecraft.client.util.InputUtil
 import net.minecraft.client.util.math.MatrixStack
+import net.minecraft.text.Text
 import org.lwjgl.glfw.GLFW
-import kotlin.math.cos
-import kotlin.math.max
-import kotlin.math.min
-import kotlin.math.sin
+import kotlin.math.*
 
 class Knob(
     x: Int,
@@ -27,16 +28,20 @@ class Knob(
     val min: Float,
     val max: Float,
     val color: Color,
+    val unit: FloatUnit = RawValue,
     // Pick a default sensitivity such that for pitch ranges we move by steps of 0.25.
     val sensitivity: Float = (max - min) * 0.25f / 96f,
 ) : Widget(x, y) {
     override val width = 20
-    override val height = 20
+    override val height = 24
 
     private data class DraggingInfo(var previousMouseY: Double)
 
     private var draggingInfo: DraggingInfo? = null
 
+    private val controlLabel =
+        Text.translatable(control.descriptor.name.toTranslationKey()).setStyle(Rack.smallText)
+
     override fun drawContent(matrices: MatrixStack, mouseX: Int, mouseY: Int, deltaTime: Float) {
         val centerX = width.toFloat() / 2
         val centerY = height.toFloat() / 2
@@ -83,6 +88,25 @@ class Knob(
             Rack.atlas,
             blackStrip
         )
+
+        Render.textCentered(
+            matrices,
+            centerX.roundToInt() + 1,
+            height - 5,
+            controlLabel,
+            0x111111
+        )
+
+        if (draggingInfo != null) {
+            Render.tooltipCentered(
+                matrices,
+                centerX.toInt(),
+                height - 4,
+                Text.literal(unit.display(control.value)),
+                Rack.atlas,
+                Tooltip.dark
+            )
+        }
     }
 
     override fun event(context: EventContext, event: Event): Event? {

src/main/kotlin/net/liquidev/dawd3/ui/widget/Widget.kt

@@ -21,7 +21,7 @@ abstract class Widget(var x: Int, var y: Int) {
     fun draw(matrices: MatrixStack, mouseX: Int, mouseY: Int, deltaTime: Float) {
         matrices.push()
         matrices.translate(x.toDouble(), y.toDouble(), 0.0)
-        drawContent(matrices, mouseX, mouseY, deltaTime)
+        drawContent(matrices, mouseX - x, mouseY - y, deltaTime)
         matrices.pop()
     }
 

src/main/resources/assets/dawd3/font/altopixel.json

@@ -0,0 +1,27 @@
+{
+  "providers": [
+    {
+      "type": "bitmap",
+      "file": "dawd3:font/altopixel.png",
+      "ascent": 5,
+      "chars": [
+        "\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000",
+        "\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000",
+        "\u0020\u0021\u0022\u0023\u0024\u0025\u0026\u0027\u0028\u0029\u002a\u002b\u002c\u002d\u002e\u002f",
+        "\u0030\u0031\u0032\u0033\u0034\u0035\u0036\u0037\u0038\u0039\u003a\u003b\u003c\u003d\u003e\u003f",
+        "\u0040\u0041\u0042\u0043\u0044\u0045\u0046\u0047\u0048\u0049\u004a\u004b\u004c\u004d\u004e\u004f",
+        "\u0050\u0051\u0052\u0053\u0054\u0055\u0056\u0057\u0058\u0059\u005a\u005b\u005c\u005d\u005e\u005f",
+        "\u0060\u0061\u0062\u0063\u0064\u0065\u0066\u0067\u0068\u0069\u006a\u006b\u006c\u006d\u006e\u006f",
+        "\u0070\u0071\u0072\u0073\u0074\u0075\u0076\u0077\u0078\u0079\u007a\u007b\u007c\u007d\u007e\u0000",
+        "\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000",
+        "\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u00a3\u0000\u0000\u0192",
+        "\u0000\u0000\u0000\u0000\u0000\u0000\u00aa\u00ba\u0000\u0000\u00ac\u0000\u0000\u0000\u00ab\u00bb",
+        "\u2591\u2592\u2593\u2502\u2524\u2561\u2562\u2556\u2555\u2563\u2551\u2557\u255d\u255c\u255b\u2510",
+        "\u2514\u2534\u252c\u251c\u2500\u253c\u255e\u255f\u255a\u2554\u2569\u2566\u2560\u2550\u256c\u2567",
+        "\u2568\u2564\u2565\u2559\u2558\u2552\u2553\u256b\u256a\u2518\u250c\u2588\u2584\u258c\u2590\u2580",
+        "\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u0000\u2205\u2208\u0000",
+        "\u2261\u00b1\u2265\u2264\u2320\u2321\u00f7\u2248\u00b0\u2219\u00b7\u221a\u207f\u00b2\u25a0\u0000"
+      ]
+    }
+  ]
+}

src/main/resources/assets/dawd3/lang/en_us.json

@@ -25,5 +25,10 @@
   "block.dawd3.saw_oscillator": "Saw Oscillator",
   "block.dawd3.sine_oscillator": "Sine Oscillator",
   "block.dawd3.triangle_oscillator": "Triangle Oscillator",
-  "screen.dawd3.rack.title": "Rack"
+  "screen.dawd3.rack.title": "Rack",
+  "dawd3.control.dawd3.amplifier.amplitude": "AMP",
+  "dawd3.control.dawd3.amplifier.amplitude_cv": "CV",
+  "dawd3.control.dawd3.constant.value": "",
+  "dawd3.control.dawd3.fma.add": "ADD",
+  "dawd3.control.dawd3.fma.multiply": "MUL"
 }