update form builders
This commit is contained in:
parent
e36e4abb7f
commit
2e2524450d
@ -10,7 +10,7 @@ import space.kscience.dataforge.context.request
|
|||||||
import space.kscience.visionforge.VisionManager
|
import space.kscience.visionforge.VisionManager
|
||||||
import space.kscience.visionforge.html.VisionOfHtmlForm
|
import space.kscience.visionforge.html.VisionOfHtmlForm
|
||||||
import space.kscience.visionforge.html.VisionPage
|
import space.kscience.visionforge.html.VisionPage
|
||||||
import space.kscience.visionforge.html.bindForm
|
import space.kscience.visionforge.html.bindToVision
|
||||||
import space.kscience.visionforge.onPropertyChange
|
import space.kscience.visionforge.onPropertyChange
|
||||||
import space.kscience.visionforge.server.close
|
import space.kscience.visionforge.server.close
|
||||||
import space.kscience.visionforge.server.openInBrowser
|
import space.kscience.visionforge.server.openInBrowser
|
||||||
@ -36,7 +36,7 @@ fun main() {
|
|||||||
visionManager,
|
visionManager,
|
||||||
VisionPage.scriptHeader("js/visionforge-playground.js"),
|
VisionPage.scriptHeader("js/visionforge-playground.js"),
|
||||||
) {
|
) {
|
||||||
bindForm(form) {
|
form {
|
||||||
label {
|
label {
|
||||||
htmlFor = "fname"
|
htmlFor = "fname"
|
||||||
+"First name:"
|
+"First name:"
|
||||||
@ -66,9 +66,9 @@ fun main() {
|
|||||||
type = InputType.submit
|
type = InputType.submit
|
||||||
value = "Submit"
|
value = "Submit"
|
||||||
}
|
}
|
||||||
|
vision(bindToVision(form))
|
||||||
}
|
}
|
||||||
println(form.values)
|
println(form.values)
|
||||||
vision(form)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}.start(false)
|
}.start(false)
|
||||||
|
@ -39,7 +39,8 @@ public interface ControlVision : Vision {
|
|||||||
@Serializable
|
@Serializable
|
||||||
@SerialName("control.click")
|
@SerialName("control.click")
|
||||||
public class VisionClickEvent(override val meta: Meta) : VisionControlEvent() {
|
public class VisionClickEvent(override val meta: Meta) : VisionControlEvent() {
|
||||||
public val payload: Meta? by meta.node()
|
public val payload: Meta get() = meta[::payload.name] ?: Meta.EMPTY
|
||||||
|
|
||||||
public val name: Name? get() = meta["name"].string?.parseAsName()
|
public val name: Name? get() = meta["name"].string?.parseAsName()
|
||||||
|
|
||||||
override fun toString(): String = meta.toString()
|
override fun toString(): String = meta.toString()
|
||||||
|
@ -1,8 +1,8 @@
|
|||||||
package space.kscience.visionforge.html
|
package space.kscience.visionforge.html
|
||||||
|
|
||||||
|
import kotlinx.coroutines.CoroutineScope
|
||||||
|
import kotlinx.coroutines.Job
|
||||||
import kotlinx.html.FORM
|
import kotlinx.html.FORM
|
||||||
import kotlinx.html.TagConsumer
|
|
||||||
import kotlinx.html.form
|
|
||||||
import kotlinx.html.id
|
import kotlinx.html.id
|
||||||
import kotlinx.serialization.SerialName
|
import kotlinx.serialization.SerialName
|
||||||
import kotlinx.serialization.Serializable
|
import kotlinx.serialization.Serializable
|
||||||
@ -10,6 +10,7 @@ import space.kscience.dataforge.meta.Meta
|
|||||||
import space.kscience.dataforge.meta.node
|
import space.kscience.dataforge.meta.node
|
||||||
import space.kscience.dataforge.meta.string
|
import space.kscience.dataforge.meta.string
|
||||||
import space.kscience.visionforge.ClickControl
|
import space.kscience.visionforge.ClickControl
|
||||||
|
import space.kscience.visionforge.onClick
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @param formId an id of the element in rendered DOM, this form is bound to
|
* @param formId an id of the element in rendered DOM, this form is bound to
|
||||||
@ -18,18 +19,25 @@ import space.kscience.visionforge.ClickControl
|
|||||||
@SerialName("html.form")
|
@SerialName("html.form")
|
||||||
public class VisionOfHtmlForm(
|
public class VisionOfHtmlForm(
|
||||||
public val formId: String,
|
public val formId: String,
|
||||||
) : VisionOfHtmlControl() {
|
) : VisionOfHtmlControl(), ClickControl {
|
||||||
public var values: Meta? by properties.node()
|
public var values: Meta? by properties.node()
|
||||||
}
|
}
|
||||||
|
|
||||||
public fun <R> TagConsumer<R>.bindForm(
|
/**
|
||||||
visionOfForm: VisionOfHtmlForm,
|
* Create a [VisionOfHtmlForm] and bind this form to the id
|
||||||
builder: FORM.() -> Unit,
|
*/
|
||||||
): R = form {
|
public fun FORM.bindToVision(id: String): VisionOfHtmlForm {
|
||||||
this.id = visionOfForm.formId
|
this.id = id
|
||||||
builder()
|
return VisionOfHtmlForm(id)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public fun FORM.bindToVision(vision: VisionOfHtmlForm): VisionOfHtmlForm {
|
||||||
|
this.id = vision.formId
|
||||||
|
return vision
|
||||||
|
}
|
||||||
|
|
||||||
|
public fun VisionOfHtmlForm.onSubmit(scope: CoroutineScope, block: (Meta?) -> Unit): Job = onClick(scope) { block(payload) }
|
||||||
|
|
||||||
|
|
||||||
@Serializable
|
@Serializable
|
||||||
@SerialName("html.button")
|
@SerialName("html.button")
|
||||||
|
@ -15,8 +15,10 @@ import space.kscience.dataforge.names.Name
|
|||||||
import space.kscience.visionforge.html.VisionOfHtmlButton
|
import space.kscience.visionforge.html.VisionOfHtmlButton
|
||||||
import space.kscience.visionforge.html.VisionOfHtmlForm
|
import space.kscience.visionforge.html.VisionOfHtmlForm
|
||||||
|
|
||||||
|
/**
|
||||||
internal fun FormData.toMeta(): Meta {
|
* Convert form data to Meta
|
||||||
|
*/
|
||||||
|
public fun FormData.toMeta(): Meta {
|
||||||
@Suppress("UNUSED_VARIABLE") val formData = this
|
@Suppress("UNUSED_VARIABLE") val formData = this
|
||||||
//val res = js("Object.fromEntries(formData);")
|
//val res = js("Object.fromEntries(formData);")
|
||||||
val `object` = js("{}")
|
val `object` = js("{}")
|
||||||
@ -67,8 +69,10 @@ internal val formVisionRenderer: ElementVisionRenderer =
|
|||||||
form.onsubmit = { event ->
|
form.onsubmit = { event ->
|
||||||
event.preventDefault()
|
event.preventDefault()
|
||||||
val formData = FormData(form).toMeta()
|
val formData = FormData(form).toMeta()
|
||||||
client.sendMetaEvent(name, formData)
|
client.context.launch {
|
||||||
console.info("Sent: ${formData.toMap()}")
|
client.sendEvent(name, VisionClickEvent(name = name, payload = formData))
|
||||||
|
}
|
||||||
|
console.info("Sent form data: ${formData.toMap()}")
|
||||||
false
|
false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user