Implement mouse coordinate-based knob value adjustment.

Added `setValueByMouseCoords` to calculate knob values derived from mouse coordinates using angles. Replaced obsolete mouse delta logic with the new approach for better precision and interaction. Upgraded dependencies and project configurations, including the Kotlin version, for enhanced compatibility and stability.
This commit is contained in:
2024-12-22 17:02:32 +01:00
parent 85eb34e09b
commit 20e06b8fb9
2 changed files with 64 additions and 21 deletions

View File

@@ -1,3 +1,7 @@
@file:OptIn(ExperimentalKotlinGradlePluginApi::class)
import org.jetbrains.kotlin.gradle.ExperimentalKotlinGradlePluginApi
plugins { plugins {
kotlin("multiplatform") version "2.1.0" kotlin("multiplatform") version "2.1.0"
`maven-publish` `maven-publish`
@@ -33,7 +37,7 @@ kotlin {
val commonMain by getting { val commonMain by getting {
dependencies { dependencies {
implementation("nl.astraeus:kotlin-css-generator:1.0.10") implementation("nl.astraeus:kotlin-css-generator:1.0.10")
implementation("org.jetbrains.kotlinx:kotlinx-datetime:0.4.0") implementation("org.jetbrains.kotlinx:kotlinx-datetime:0.6.0")
} }
} }
val jsMain by getting { val jsMain by getting {
@@ -49,7 +53,6 @@ kotlin {
val jvmMain by getting { val jvmMain by getting {
dependencies { dependencies {
//base //base
implementation("io.undertow:undertow-core:2.3.14.Final") implementation("io.undertow:undertow-core:2.3.14.Final")
implementation("io.undertow:undertow-websockets-jsr:2.3.14.Final") implementation("io.undertow:undertow-websockets-jsr:2.3.14.Final")
implementation("org.jboss.xnio:xnio-nio:3.8.16.Final") implementation("org.jboss.xnio:xnio-nio:3.8.16.Final")

View File

@@ -1,6 +1,8 @@
package nl.astraeus.vst.ui.components package nl.astraeus.vst.ui.components
import kotlinx.html.classes import kotlinx.html.classes
import kotlinx.html.js.onMouseDownFunction
import kotlinx.html.js.onMouseUpFunction
import kotlinx.html.js.onWheelFunction import kotlinx.html.js.onWheelFunction
import kotlinx.html.org.w3c.dom.events.Event import kotlinx.html.org.w3c.dom.events.Event
import kotlinx.html.span import kotlinx.html.span
@@ -26,6 +28,7 @@ import nl.astraeus.vst.ui.util.width
import org.w3c.dom.events.MouseEvent import org.w3c.dom.events.MouseEvent
import org.w3c.dom.events.WheelEvent import org.w3c.dom.events.WheelEvent
import kotlin.math.PI import kotlin.math.PI
import kotlin.math.atan2
import kotlin.math.max import kotlin.math.max
import kotlin.math.min import kotlin.math.min
@@ -153,30 +156,20 @@ open class BaseKnobComponent(
onWheelFunction = ::wheelFunction onWheelFunction = ::wheelFunction
/* onMouseDownFunction = { onMouseDownFunction = {
if (it is MouseEvent) { if (it is MouseEvent) {
activated = true activated = true
mouseX = it.clientX.toDouble() setValueByMouseCoords(it, minValue, maxValue, callback)
mouseY = it.clientY.toDouble()
startValue = actualValue
mainView.globalMouseListener = { me ->
if (activated && me.buttons == 1.toShort()) {
setValueByMouseDelta(me, actualMinimumValue, actualMaximumValue, callback)
}
}
requestUpdate()
} }
} }
onMouseUpFunction = { onMouseUpFunction = {
if (it is MouseEvent) { if (it is MouseEvent) {
activated = false activated = false
mainView.globalMouseListener = null
requestUpdate() requestUpdate()
} }
}*/ }
} }
} }
@@ -205,6 +198,53 @@ open class BaseKnobComponent(
} }
} }
private fun setValueByMouseCoords(
it: MouseEvent,
minValue: Double = 0.0,
maxValue: Double = 5.0,
callback: (value: Double) -> Unit
) {
val deltaX = it.offsetX - getMiddleX()
val deltaY = it.offsetY - getMiddleY()
var angle = atan2(deltaX, deltaY)
angle = if (angle < 0) {
-angle
} else {
PI * 2.0 - angle
}
angle += PI / 2.0
if (angle > PI * 2.0) {
angle -= PI * 2.0
}
var newValue = minValue
when {
angle > START_ANGLE -> newValue =
minValue + ((maxValue - minValue) / ANGLE_RANGE * (angle - START_ANGLE)).toFloat()
angle < END_ANGLE -> {
val calcAngle = angle + PI * 2.0
newValue =
minValue + ((maxValue - minValue) / ANGLE_RANGE * (calcAngle - START_ANGLE)).toFloat()
}
angle < PI / 2.0 -> newValue = maxValue
}
actualValue = newValue
callback(newValue.toDouble())
requestUpdate()
it.preventDefault()
}
private fun setValueByMouseDelta( private fun setValueByMouseDelta(
it: MouseEvent, it: MouseEvent,
minValue: Double = 0.0, minValue: Double = 0.0,