Compare commits
4 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| b0b325fea5 | |||
| 0c14a9a7db | |||
| 1c1cb8eaba | |||
| 01a30c9645 |
7
.gitignore
vendored
7
.gitignore
vendored
@@ -1,11 +1,4 @@
|
||||
# Created by .ignore support plugin (hsz.mobi)
|
||||
build
|
||||
.gradle
|
||||
web/js/generated
|
||||
gradle.properties
|
||||
local.properties
|
||||
*.iml
|
||||
*.ipr
|
||||
*.iws
|
||||
kotlin-js-store
|
||||
.idea
|
||||
|
||||
216
build.gradle.kts
216
build.gradle.kts
@@ -1,175 +1,83 @@
|
||||
|
||||
plugins {
|
||||
kotlin("multiplatform") version "1.9.23"
|
||||
id("maven-publish")
|
||||
id("signing")
|
||||
id("org.jetbrains.dokka") version "1.5.31"
|
||||
kotlin("multiplatform") version "1.4.30"
|
||||
`maven-publish`
|
||||
}
|
||||
|
||||
group = "nl.astraeus"
|
||||
version = "1.2.3-SNAPSHOT"
|
||||
version = "0.2.5-SNAPSHOT"
|
||||
|
||||
repositories {
|
||||
mavenCentral()
|
||||
mavenCentral()
|
||||
jcenter()
|
||||
}
|
||||
|
||||
kotlin {
|
||||
js(IR) {
|
||||
browser {
|
||||
testTask {
|
||||
useKarma {
|
||||
useChromiumHeadless()
|
||||
/* Targets configuration omitted.
|
||||
* To find out how to configure the targets, please follow the link:
|
||||
* https://kotlinlang.org/docs/reference/building-mpp-with-gradle.html#setting-up-targets */
|
||||
js(BOTH) {
|
||||
browser {
|
||||
//produceKotlinLibrary()
|
||||
testTask {
|
||||
useKarma {
|
||||
useChromeHeadless()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/*
|
||||
@OptIn(ExperimentalWasmDsl::class)
|
||||
wasmJs {
|
||||
//moduleName = project.name
|
||||
browser()
|
||||
|
||||
mavenPublication {
|
||||
groupId = group as String
|
||||
pom { name = "${project.name}-wasm-js" }
|
||||
sourceSets {
|
||||
val commonMain by getting {
|
||||
dependencies {
|
||||
implementation(kotlin("stdlib-common"))
|
||||
|
||||
api("org.jetbrains.kotlinx:kotlinx-html-js:0.7.2")
|
||||
}
|
||||
}
|
||||
val jsMain by getting {
|
||||
dependencies {
|
||||
implementation(kotlin("stdlib-js"))
|
||||
}
|
||||
}
|
||||
val jsTest by getting {
|
||||
dependencies {
|
||||
implementation(kotlin("test-js"))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@OptIn(ExperimentalKotlinGradlePluginApi::class)
|
||||
applyDefaultHierarchyTemplate {
|
||||
common {
|
||||
group("jsCommon") {
|
||||
withJs()
|
||||
// TODO: switch to `withWasmJs()` after upgrade to Kotlin 2.0
|
||||
withWasm()
|
||||
}
|
||||
}
|
||||
}
|
||||
*/
|
||||
|
||||
sourceSets {
|
||||
val commonMain by getting {
|
||||
dependencies {
|
||||
api("org.jetbrains.kotlinx:kotlinx-html:0.11.0")
|
||||
}
|
||||
}
|
||||
val jsMain by getting
|
||||
val jsTest by getting {
|
||||
dependencies {
|
||||
implementation(kotlin("test-js"))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
extra["PUBLISH_GROUP_ID"] = group
|
||||
extra["PUBLISH_VERSION"] = version
|
||||
extra["PUBLISH_ARTIFACT_ID"] = name
|
||||
|
||||
// Stub secrets to let the project sync and build without the publication values set up
|
||||
val signingKeyId: String? by project
|
||||
val signingPassword: String? by project
|
||||
val signingSecretKeyRingFile: String? by project
|
||||
val ossrhUsername: String? by project
|
||||
val ossrhPassword: String? by project
|
||||
|
||||
extra["signing.keyId"] = signingKeyId
|
||||
extra["signing.password"] = signingPassword
|
||||
extra["signing.secretKeyRingFile"] = signingSecretKeyRingFile
|
||||
extra["ossrhUsername"] = ossrhUsername
|
||||
extra["ossrhPassword"] = ossrhPassword
|
||||
|
||||
val javadocJar by tasks.registering(Jar::class) {
|
||||
archiveClassifier.set("javadoc")
|
||||
}
|
||||
|
||||
publishing {
|
||||
repositories {
|
||||
mavenLocal()
|
||||
maven {
|
||||
name = "releases"
|
||||
// change to point to your repo, e.g. http://my.org/repo
|
||||
setUrl("https://reposilite.astraeus.nl/releases")
|
||||
credentials {
|
||||
val reposiliteUsername: String? by project
|
||||
val reposilitePassword: String? by project
|
||||
repositories {
|
||||
maven {
|
||||
name = "releases"
|
||||
// change to point to your repo, e.g. http://my.org/repo
|
||||
url = uri("http://nexus.astraeus.nl/nexus/content/repositories/releases")
|
||||
credentials {
|
||||
val nexusUsername: String by project
|
||||
val nexusPassword: String by project
|
||||
|
||||
username = reposiliteUsername
|
||||
password = reposilitePassword
|
||||
}
|
||||
}
|
||||
maven {
|
||||
name = "snapshots"
|
||||
// change to point to your repo, e.g. http://my.org/repo
|
||||
setUrl("https://reposilite.astraeus.nl/snapshots")
|
||||
credentials {
|
||||
val reposiliteUsername: String? by project
|
||||
val reposilitePassword: String? by project
|
||||
|
||||
username = reposiliteUsername
|
||||
password = reposilitePassword
|
||||
}
|
||||
}
|
||||
maven {
|
||||
name = "sonatype"
|
||||
setUrl("https://s01.oss.sonatype.org/service/local/staging/deploy/maven2")
|
||||
credentials {
|
||||
username = ossrhUsername
|
||||
password = ossrhPassword
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Configure all publications
|
||||
publications.withType<MavenPublication> {
|
||||
// Stub javadoc.jar artifact
|
||||
artifact(javadocJar.get())
|
||||
|
||||
// Provide artifacts information requited by Maven Central
|
||||
pom {
|
||||
name.set("kotlin-komponent")
|
||||
description.set("Kotlin komponent")
|
||||
url.set("https://github.com/rnentjes/komponent")
|
||||
|
||||
licenses {
|
||||
license {
|
||||
name.set("MIT")
|
||||
url.set("https://opensource.org/licenses/MIT")
|
||||
username = nexusUsername
|
||||
password = nexusPassword
|
||||
}
|
||||
}
|
||||
}
|
||||
developers {
|
||||
developer {
|
||||
id.set("rnentjes")
|
||||
name.set("Rien Nentjes")
|
||||
email.set("info@nentjes.com")
|
||||
maven {
|
||||
name = "snapshots"
|
||||
// change to point to your repo, e.g. http://my.org/repo
|
||||
url = uri("http://nexus.astraeus.nl/nexus/content/repositories/snapshots")
|
||||
credentials {
|
||||
val nexusUsername: String by project
|
||||
val nexusPassword: String by project
|
||||
|
||||
username = nexusUsername
|
||||
password = nexusPassword
|
||||
}
|
||||
}
|
||||
}
|
||||
publications {
|
||||
val kotlinMultiplatform by getting {
|
||||
//artifactId = "kotlin-css-generator"
|
||||
}
|
||||
}
|
||||
scm {
|
||||
url.set("https://github.com/rnentjes/komponent")
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
signing {
|
||||
sign(publishing.publications)
|
||||
}
|
||||
|
||||
tasks.named<Task>("signJsPublication") {
|
||||
dependsOn(tasks.named<Task>("publishKotlinMultiplatformPublicationToMavenLocal"))
|
||||
}
|
||||
|
||||
tasks.named<Task>("publishJsPublicationToReleasesRepository") {
|
||||
dependsOn(tasks.named<Task>("signKotlinMultiplatformPublication"))
|
||||
}
|
||||
|
||||
tasks.named<Task>("publishKotlinMultiplatformPublicationToMavenLocalRepository") {
|
||||
dependsOn(tasks.named<Task>("signJsPublication"))
|
||||
}
|
||||
|
||||
tasks.named<Task>("publishKotlinMultiplatformPublicationToReleasesRepository") {
|
||||
dependsOn(tasks.named<Task>("signJsPublication"))
|
||||
}
|
||||
|
||||
tasks.named<Task>("publishKotlinMultiplatformPublicationToSonatypeRepository") {
|
||||
dependsOn(tasks.named<Task>("signJsPublication"))
|
||||
}
|
||||
|
||||
@@ -1,147 +0,0 @@
|
||||
# Table of contents
|
||||
|
||||
* [Home](home.md)
|
||||
* [Getting started](getting-started.md)
|
||||
* [How it works](how-it-works.md)
|
||||
|
||||
# Getting started
|
||||
|
||||
To get started create a new kotlin project in intellij of the type 'Browser application'
|
||||
|
||||
|
||||
|
||||
Add the 'sourceSets' block with the kotlin-komponent dependency so your build.gradle.kts looks like this:
|
||||
|
||||
```gradle
|
||||
plugins {
|
||||
kotlin("js") version "1.6.10"
|
||||
}
|
||||
|
||||
group = "com.test"
|
||||
version = "1.0.0-SNAPSHOT"
|
||||
|
||||
repositories {
|
||||
mavenCentral()
|
||||
}
|
||||
|
||||
dependencies {
|
||||
api("nl.astraeus:kotlin-komponent-js:1.0.0")
|
||||
|
||||
testImplementation(kotlin("test"))
|
||||
}
|
||||
|
||||
kotlin {
|
||||
js(IR) {
|
||||
binaries.executable()
|
||||
browser {
|
||||
commonWebpackConfig {
|
||||
cssSupport.enabled = true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Refresh the gradle project to import the dependency.
|
||||
|
||||
There is now only one kotlin source file in the project called Simple.kt, it should look something like this:
|
||||
|
||||
```kotin
|
||||
fun main() {
|
||||
console.log("Hello, ${greet()}")
|
||||
}
|
||||
|
||||
fun greet() = "world"
|
||||
```
|
||||
|
||||
Replace the code in the file with the following for a simple click app:
|
||||
|
||||
```kotlin
|
||||
import kotlinx.browser.document
|
||||
import kotlinx.html.button
|
||||
import kotlinx.html.div
|
||||
import kotlinx.html.hr
|
||||
import kotlinx.html.js.onClickFunction
|
||||
import nl.astraeus.komp.HtmlBuilder
|
||||
import nl.astraeus.komp.Komponent
|
||||
import nl.astraeus.komp.mutableCollectionState
|
||||
import nl.astraeus.komp.state
|
||||
import kotlin.js.Date
|
||||
|
||||
fun main() {
|
||||
console.log("Hello, ${greet()}")
|
||||
|
||||
Komponent.create(document.body!!, TestKomponent())
|
||||
}
|
||||
|
||||
fun greet() = "world"
|
||||
|
||||
class TestKomponent : Komponent() {
|
||||
var clicks: Int = 0
|
||||
val lines: MutableCollection<String> = mutableListOf()
|
||||
|
||||
override fun HtmlBuilder.render() {
|
||||
div {
|
||||
div {
|
||||
+"Hello Komponent!"
|
||||
}
|
||||
|
||||
div {
|
||||
+"Clicks $clicks"
|
||||
}
|
||||
|
||||
div {
|
||||
button {
|
||||
+"Click"
|
||||
onClickFunction = {
|
||||
clicks++
|
||||
lines.add("click $clicks at ${Date()}")
|
||||
requestUpdate()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
hr()
|
||||
|
||||
for (line in lines) {
|
||||
div {
|
||||
+ line
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
First in the main we add our TestKomponent to the document body with the following line:
|
||||
|
||||
```kotlin
|
||||
Komponent.create(document.body!!, TestKomponent())
|
||||
```
|
||||
|
||||
The TestKomponent.render method will be called to render our Komponent.
|
||||
As you can see events can be attached inline with the on<event>Function methods.
|
||||
The requestUpdate method will call the render method again and update the page accordingly.
|
||||
|
||||
After building the application you will find it in /build/distributions.
|
||||
|
||||
In the index.html page you will find the following line:
|
||||
|
||||
```html
|
||||
<div id="root"></div>
|
||||
```
|
||||
|
||||
This line is not needed for kotlin-komponent.
|
||||
|
||||
If you like you can use some helpers that will automatically call the requestUpdate method if
|
||||
the data changes, that would look like this:
|
||||
|
||||
```kotlin
|
||||
var clicks: Int by state(0)
|
||||
val lines: MutableCollection<String> = mutableCollectionState(mutableListOf())
|
||||
```
|
||||
|
||||
In that case you can remove the requestUpdate call from the onClickFunction.
|
||||
|
||||
You can find a working repository of this example here: [kotlin-komponent-start](https://github.com/rnentjes/kotlin-komponent-start)
|
||||
@@ -1,6 +0,0 @@
|
||||
# Table of contents
|
||||
|
||||
* [Home](home.md)
|
||||
* [Getting started](getting-started.md)
|
||||
* [How it works](how-it-works.md)
|
||||
|
||||
@@ -1,23 +0,0 @@
|
||||
# Table of contents
|
||||
|
||||
* [Home](home.md)
|
||||
* [Getting started](getting-started.md)
|
||||
* [How it works](how-it-works.md)
|
||||
|
||||
# How it works
|
||||
|
||||
When the requestUpdate call is made to the [Komponent](src/jsMain/kotlin/nl/astraeus/komp/Komponent.kt)
|
||||
the update is queued in a callback. The callback will be called after the current event is handled.
|
||||
|
||||
If there are multiple updates requested, these are sorted so that the top Komponents get executed first.
|
||||
This way there will not be double updates of the same komponent.
|
||||
|
||||
The render call will be invoked and every html builder function (div, span etc.) will call the
|
||||
different HtmlBuilder functions like onTagStart, onTagAttributeChange etc.
|
||||
|
||||
In these functions the HtmlBuilder will compare the dom against the call being made, and it will update the DOM
|
||||
as needed.
|
||||
|
||||
|
||||
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 184 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 96 KiB |
2
gradle/wrapper/gradle-wrapper.properties
vendored
2
gradle/wrapper/gradle-wrapper.properties
vendored
@@ -1,5 +1,5 @@
|
||||
#Wed Mar 04 13:29:12 CET 2020
|
||||
distributionUrl=https\://services.gradle.org/distributions/gradle-8.4-all.zip
|
||||
distributionUrl=https\://services.gradle.org/distributions/gradle-6.2-all.zip
|
||||
distributionBase=GRADLE_USER_HOME
|
||||
distributionPath=wrapper/dists
|
||||
zipStorePath=wrapper/dists
|
||||
|
||||
38
komp.commonMain.iml
Normal file
38
komp.commonMain.iml
Normal file
@@ -0,0 +1,38 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module external.linked.project.id="komp:commonMain" external.linked.project.path="$MODULE_DIR$" external.root.project.path="$MODULE_DIR$" external.system.id="GRADLE" external.system.module.group="nl.astraeus" external.system.module.type="sourceSet" external.system.module.version="0.2.4-SNAPSHOT" type="JAVA_MODULE" version="4">
|
||||
<component name="FacetManager">
|
||||
<facet type="kotlin-language" name="Kotlin">
|
||||
<configuration version="3" platform="Common (experimental) " allPlatforms="JS []/JVM [1.6]/Native []/Native [general]" useProjectSettings="false" isTestModule="false" externalProjectId="komp" pureKotlinSourceFolders="$MODULE_DIR$/src/jsMain/kotlin;/home/rnentjes/Development/komp/komp/build/externals/komp-jsLegacy/src;/home/rnentjes/Development/komp/komp/build/externals/komp-jsIr/src;/home/rnentjes/Development/komp/komp/src/jsTest/kotlin;/home/rnentjes/Development/komp/komp/src/commonMain/kotlin">
|
||||
<newMppModelJpsModuleKind>SOURCE_SET_HOLDER</newMppModelJpsModuleKind>
|
||||
<compilerSettings />
|
||||
<compilerArguments>
|
||||
<option name="languageVersion" value="1.4" />
|
||||
<option name="apiVersion" value="1.4" />
|
||||
<option name="pluginOptions">
|
||||
<array />
|
||||
</option>
|
||||
<option name="pluginClasspaths">
|
||||
<array>
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-scripting-jvm/1.4.30/7d0085e5781847da84580d16239c1c4e0980bdb0/kotlin-scripting-jvm-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-scripting-common/1.4.30/c7896c5c6b504f44e7cf9f5719d4393e20680666/kotlin-scripting-common-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlinx/kotlinx-coroutines-core/1.3.8/f62be6d4cbf27781c2969867b4ed952f38378492/kotlinx-coroutines-core-1.3.8.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib/1.4.30/d10d1e10f47006ee08162dde039e38ac487de4ac/kotlin-stdlib-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-common/1.4.30/bb9a3173350f55732416ee27956ea8f9b81f4dbb/kotlin-stdlib-common-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains/annotations/13.0/919f0dfe192fb4e063e7dacadee7f8bb9a2672a9/annotations-13.0.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-script-runtime/1.4.30/b9c2a1fab9217623fc0fbadf6190e77eed6f054d/kotlin-script-runtime-1.4.30.jar" />
|
||||
</array>
|
||||
</option>
|
||||
<option name="multiPlatform" value="true" />
|
||||
</compilerArguments>
|
||||
</configuration>
|
||||
</facet>
|
||||
</component>
|
||||
<component name="NewModuleRootManager" inherit-compiler-output="true">
|
||||
<exclude-output />
|
||||
<content url="file://$MODULE_DIR$/src/commonMain" />
|
||||
<orderEntry type="jdk" jdkName="Kotlin SDK" jdkType="KotlinSDK" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
<orderEntry type="library" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-common:1.4.30" level="project" />
|
||||
<orderEntry type="library" name="Gradle: org.jetbrains.kotlinx:kotlinx-html-common:0.7.2" level="project" />
|
||||
</component>
|
||||
</module>
|
||||
44
komp.commonTest.iml
Normal file
44
komp.commonTest.iml
Normal file
@@ -0,0 +1,44 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module external.linked.project.id="komp:commonTest" external.linked.project.path="$MODULE_DIR$" external.root.project.path="$MODULE_DIR$" external.system.id="GRADLE" external.system.module.group="nl.astraeus" external.system.module.type="sourceSet" external.system.module.version="0.2.4-SNAPSHOT" type="JAVA_MODULE" version="4">
|
||||
<component name="FacetManager">
|
||||
<facet type="kotlin-language" name="Kotlin">
|
||||
<configuration version="3" platform="Common (experimental) " allPlatforms="JS []/JVM [1.6]/Native []/Native [general]" useProjectSettings="false" isTestModule="true" externalProjectId="komp" pureKotlinSourceFolders="$MODULE_DIR$/src/jsMain/kotlin;/home/rnentjes/Development/komp/komp/build/externals/komp-jsLegacy/src;/home/rnentjes/Development/komp/komp/build/externals/komp-jsIr/src;/home/rnentjes/Development/komp/komp/src/jsTest/kotlin;/home/rnentjes/Development/komp/komp/src/commonMain/kotlin">
|
||||
<newMppModelJpsModuleKind>SOURCE_SET_HOLDER</newMppModelJpsModuleKind>
|
||||
<externalSystemTestTasks>
|
||||
<externalSystemTestTask>jsLegacyBrowserTest|komp:jsTest|jsLegacy</externalSystemTestTask>
|
||||
</externalSystemTestTasks>
|
||||
<compilerSettings />
|
||||
<compilerArguments>
|
||||
<option name="languageVersion" value="1.4" />
|
||||
<option name="apiVersion" value="1.4" />
|
||||
<option name="pluginOptions">
|
||||
<array />
|
||||
</option>
|
||||
<option name="pluginClasspaths">
|
||||
<array>
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-scripting-jvm/1.4.30/7d0085e5781847da84580d16239c1c4e0980bdb0/kotlin-scripting-jvm-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-scripting-common/1.4.30/c7896c5c6b504f44e7cf9f5719d4393e20680666/kotlin-scripting-common-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlinx/kotlinx-coroutines-core/1.3.8/f62be6d4cbf27781c2969867b4ed952f38378492/kotlinx-coroutines-core-1.3.8.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib/1.4.30/d10d1e10f47006ee08162dde039e38ac487de4ac/kotlin-stdlib-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-common/1.4.30/bb9a3173350f55732416ee27956ea8f9b81f4dbb/kotlin-stdlib-common-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains/annotations/13.0/919f0dfe192fb4e063e7dacadee7f8bb9a2672a9/annotations-13.0.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-script-runtime/1.4.30/b9c2a1fab9217623fc0fbadf6190e77eed6f054d/kotlin-script-runtime-1.4.30.jar" />
|
||||
</array>
|
||||
</option>
|
||||
<option name="multiPlatform" value="true" />
|
||||
</compilerArguments>
|
||||
</configuration>
|
||||
</facet>
|
||||
</component>
|
||||
<component name="NewModuleRootManager" inherit-compiler-output="true">
|
||||
<exclude-output />
|
||||
<content url="file://$MODULE_DIR$/src/commonTest" />
|
||||
<orderEntry type="jdk" jdkName="Kotlin SDK" jdkType="KotlinSDK" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
<orderEntry type="module" module-name="komp.commonMain" scope="TEST" />
|
||||
<orderEntry type="library" scope="TEST" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.4.30" level="project" />
|
||||
<orderEntry type="library" scope="TEST" name="Gradle: org.jetbrains.kotlinx:kotlinx-html-common:0.7.2" level="project" />
|
||||
<orderEntry type="library" scope="TEST" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-common:1.4.30" level="project" />
|
||||
</component>
|
||||
<component name="TestModuleProperties" production-module="komp.commonMain" />
|
||||
</module>
|
||||
12
komp.iml
Normal file
12
komp.iml
Normal file
@@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module external.linked.project.id="komp" external.linked.project.path="$MODULE_DIR$" external.root.project.path="$MODULE_DIR$" external.system.id="GRADLE" external.system.module.group="nl.astraeus" external.system.module.version="0.2.4-SNAPSHOT" type="JAVA_MODULE" version="4">
|
||||
<component name="NewModuleRootManager" inherit-compiler-output="true">
|
||||
<exclude-output />
|
||||
<content url="file://$MODULE_DIR$">
|
||||
<excludeFolder url="file://$MODULE_DIR$/.gradle" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/build" />
|
||||
</content>
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
450
komp.ipr
Normal file
450
komp.ipr
Normal file
@@ -0,0 +1,450 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ArtifactManager">
|
||||
<artifact type="jar" name="komp-0.1.16-SNAPSHOT">
|
||||
<output-path>$PROJECT_DIR$/build/libs</output-path>
|
||||
<root id="archive" name="komp-0.1.16-SNAPSHOT.jar">
|
||||
<element id="module-output" name="komp_main" />
|
||||
</root>
|
||||
</artifact>
|
||||
<artifact type="jar" name="komp-0.1.17-SNAPSHOT">
|
||||
<output-path>$PROJECT_DIR$/build/libs</output-path>
|
||||
<root id="archive" name="komp-0.1.17-SNAPSHOT.jar">
|
||||
<element id="module-output" name="komp_main" />
|
||||
</root>
|
||||
</artifact>
|
||||
<artifact type="jar" name="komp-js-0.1.21-SNAPSHOT">
|
||||
<output-path>$PROJECT_DIR$/build/libs</output-path>
|
||||
<root id="archive" name="komp-js-0.1.21-SNAPSHOT.jar">
|
||||
<element id="module-output" name="komp.jsMain" />
|
||||
</root>
|
||||
</artifact>
|
||||
<artifact type="jar" name="komp-js-0.2.1-SNAPSHOT">
|
||||
<output-path>$PROJECT_DIR$/build/libs</output-path>
|
||||
<root id="archive" name="komp-js-0.2.1-SNAPSHOT.jar">
|
||||
<element id="module-output" name="komp.jsMain" />
|
||||
</root>
|
||||
</artifact>
|
||||
<artifact type="jar" name="komp-js-0.2.2-SNAPSHOT">
|
||||
<output-path>$PROJECT_DIR$/build/libs</output-path>
|
||||
<root id="archive" name="komp-js-0.2.2-SNAPSHOT.jar">
|
||||
<element id="module-output" name="komp.jsMain" />
|
||||
</root>
|
||||
</artifact>
|
||||
<artifact type="jar" name="komp-jslegacy-0.2.2-SNAPSHOT">
|
||||
<output-path>$PROJECT_DIR$/build/libs</output-path>
|
||||
<root id="archive" name="komp-jslegacy-0.2.2-SNAPSHOT.jar">
|
||||
<element id="module-output" name="komp.jsMain" />
|
||||
</root>
|
||||
</artifact>
|
||||
<artifact type="jar" name="komp-jslegacy-0.2.3-SNAPSHOT">
|
||||
<output-path>$PROJECT_DIR$/build/libs</output-path>
|
||||
<root id="archive" name="komp-jslegacy-0.2.3-SNAPSHOT.jar">
|
||||
<element id="module-output" name="komp.jsMain" />
|
||||
</root>
|
||||
</artifact>
|
||||
<artifact type="jar" name="komp-jslegacy-0.2.4-SNAPSHOT">
|
||||
<output-path>$PROJECT_DIR$/build/libs</output-path>
|
||||
<root id="archive" name="komp-jslegacy-0.2.4-SNAPSHOT.jar">
|
||||
<element id="module-output" name="komp.jsMain" />
|
||||
</root>
|
||||
</artifact>
|
||||
</component>
|
||||
<component name="CheckStyle-IDEA">
|
||||
<option name="configuration">
|
||||
<map>
|
||||
<entry key="checkstyle-version" value="8.5" />
|
||||
<entry key="copy-libs" value="false" />
|
||||
<entry key="location-0" value="BUNDLED:(bundled):Sun Checks" />
|
||||
<entry key="location-1" value="BUNDLED:(bundled):Google Checks" />
|
||||
<entry key="scan-before-checkin" value="false" />
|
||||
<entry key="scanscope" value="JavaOnly" />
|
||||
<entry key="suppress-errors" value="false" />
|
||||
</map>
|
||||
</option>
|
||||
</component>
|
||||
<component name="CompilerConfiguration">
|
||||
<bytecodeTargetLevel target="1.8" />
|
||||
</component>
|
||||
<component name="Encoding">
|
||||
<file url="PROJECT" charset="UTF-8" />
|
||||
</component>
|
||||
<component name="FrameworkDetectionExcludesConfiguration">
|
||||
<file type="web" url="file://$PROJECT_DIR$" />
|
||||
</component>
|
||||
<component name="GradleLocalSettings">
|
||||
<option name="modificationStamps">
|
||||
<map>
|
||||
<entry key="$PROJECT_DIR$/../../DestinationSol" value="5718836739744" />
|
||||
<entry key="$PROJECT_DIR$/../../kotlin/kotlin-webgl-test" value="2938763414342" />
|
||||
<entry key="$PROJECT_DIR$/../../music/dawjs" value="2921352917165" />
|
||||
<entry key="$PROJECT_DIR$/../../music/mto" value="7363595652795" />
|
||||
<entry key="$PROJECT_DIR$/../../music/synthesis" value="2936164705438" />
|
||||
<entry key="$PROJECT_DIR$/../../simple/Simple-persistence" value="2890201693583" />
|
||||
<entry key="$PROJECT_DIR$/../../simple/Simple-web" value="2890212261770" />
|
||||
<entry key="$PROJECT_DIR$/../../simple/SimpleDatabase" value="2890191706466" />
|
||||
<entry key="$PROJECT_DIR$/../../simple/Very-simple-templates" value="2890190703434" />
|
||||
<entry key="$PROJECT_DIR$/../../simple/simple-password-manager" value="8877848261147" />
|
||||
<entry key="$PROJECT_DIR$/../../simple/simple-password-manager/client" value="2959282312702" />
|
||||
<entry key="$PROJECT_DIR$/../../simple/simple-password-manager/server" value="2952285414000" />
|
||||
<entry key="$PROJECT_DIR$/../../simple/simple-social-media" value="2954146711424" />
|
||||
<entry key="$PROJECT_DIR$/../../simple/stats/simple-stats-client" value="2941044635281" />
|
||||
<entry key="$PROJECT_DIR$/../../simple/stats/simple-stats-server" value="2909544379158" />
|
||||
<entry key="$PROJECT_DIR$/../../work/Kos/KosConvertBranchcode" value="2904315467504" />
|
||||
</map>
|
||||
</option>
|
||||
<option name="externalProjectsViewState">
|
||||
<projects_view />
|
||||
</option>
|
||||
</component>
|
||||
<component name="GradleMigrationSettings" migrationVersion="1" />
|
||||
<component name="GradleSettings">
|
||||
<option name="linkedExternalProjectsSettings">
|
||||
<GradleProjectSettings>
|
||||
<option name="delegatedBuild" value="false" />
|
||||
<option name="testRunner" value="PLATFORM" />
|
||||
<option name="distributionType" value="DEFAULT_WRAPPED" />
|
||||
<option name="externalProjectPath" value="$PROJECT_DIR$" />
|
||||
<option name="gradleJvm" value="1.8" />
|
||||
<option name="modules">
|
||||
<set>
|
||||
<option value="$PROJECT_DIR$" />
|
||||
</set>
|
||||
</option>
|
||||
</GradleProjectSettings>
|
||||
</option>
|
||||
</component>
|
||||
<component name="HotSwapAgentPluginSettingsProvider">
|
||||
<option name="agentPath" value="$APPLICATION_PLUGINS_DIR$/hotswap-agent-intellij-plugin/lib/agent/hotswap-agent-1.3.0.jar" />
|
||||
</component>
|
||||
<component name="InspectionProjectProfileManager">
|
||||
<profile version="1.0">
|
||||
<option name="myName" value="Project Default" />
|
||||
</profile>
|
||||
<version value="1.0" />
|
||||
</component>
|
||||
<component name="MacroExpansionManager">
|
||||
<option name="directoryName" value="qFcQOWli" />
|
||||
</component>
|
||||
<component name="Palette2">
|
||||
<group name="Swing">
|
||||
<item class="com.intellij.uiDesigner.HSpacer" tooltip-text="Horizontal Spacer" icon="/com/intellij/uiDesigner/icons/hspacer.png" removable="false" auto-create-binding="false" can-attach-label="false">
|
||||
<default-constraints vsize-policy="1" hsize-policy="6" anchor="0" fill="1" />
|
||||
</item>
|
||||
<item class="com.intellij.uiDesigner.VSpacer" tooltip-text="Vertical Spacer" icon="/com/intellij/uiDesigner/icons/vspacer.png" removable="false" auto-create-binding="false" can-attach-label="false">
|
||||
<default-constraints vsize-policy="6" hsize-policy="1" anchor="0" fill="2" />
|
||||
</item>
|
||||
<item class="javax.swing.JPanel" icon="/com/intellij/uiDesigner/icons/panel.png" removable="false" auto-create-binding="false" can-attach-label="false">
|
||||
<default-constraints vsize-policy="3" hsize-policy="3" anchor="0" fill="3" />
|
||||
</item>
|
||||
<item class="javax.swing.JScrollPane" icon="/com/intellij/uiDesigner/icons/scrollPane.png" removable="false" auto-create-binding="false" can-attach-label="true">
|
||||
<default-constraints vsize-policy="7" hsize-policy="7" anchor="0" fill="3" />
|
||||
</item>
|
||||
<item class="javax.swing.JButton" icon="/com/intellij/uiDesigner/icons/button.png" removable="false" auto-create-binding="true" can-attach-label="false">
|
||||
<default-constraints vsize-policy="0" hsize-policy="3" anchor="0" fill="1" />
|
||||
<initial-values>
|
||||
<property name="text" value="Button" />
|
||||
</initial-values>
|
||||
</item>
|
||||
<item class="javax.swing.JRadioButton" icon="/com/intellij/uiDesigner/icons/radioButton.png" removable="false" auto-create-binding="true" can-attach-label="false">
|
||||
<default-constraints vsize-policy="0" hsize-policy="3" anchor="8" fill="0" />
|
||||
<initial-values>
|
||||
<property name="text" value="RadioButton" />
|
||||
</initial-values>
|
||||
</item>
|
||||
<item class="javax.swing.JCheckBox" icon="/com/intellij/uiDesigner/icons/checkBox.png" removable="false" auto-create-binding="true" can-attach-label="false">
|
||||
<default-constraints vsize-policy="0" hsize-policy="3" anchor="8" fill="0" />
|
||||
<initial-values>
|
||||
<property name="text" value="CheckBox" />
|
||||
</initial-values>
|
||||
</item>
|
||||
<item class="javax.swing.JLabel" icon="/com/intellij/uiDesigner/icons/label.png" removable="false" auto-create-binding="false" can-attach-label="false">
|
||||
<default-constraints vsize-policy="0" hsize-policy="0" anchor="8" fill="0" />
|
||||
<initial-values>
|
||||
<property name="text" value="Label" />
|
||||
</initial-values>
|
||||
</item>
|
||||
<item class="javax.swing.JTextField" icon="/com/intellij/uiDesigner/icons/textField.png" removable="false" auto-create-binding="true" can-attach-label="true">
|
||||
<default-constraints vsize-policy="0" hsize-policy="6" anchor="8" fill="1">
|
||||
<preferred-size width="150" height="-1" />
|
||||
</default-constraints>
|
||||
</item>
|
||||
<item class="javax.swing.JPasswordField" icon="/com/intellij/uiDesigner/icons/passwordField.png" removable="false" auto-create-binding="true" can-attach-label="true">
|
||||
<default-constraints vsize-policy="0" hsize-policy="6" anchor="8" fill="1">
|
||||
<preferred-size width="150" height="-1" />
|
||||
</default-constraints>
|
||||
</item>
|
||||
<item class="javax.swing.JFormattedTextField" icon="/com/intellij/uiDesigner/icons/formattedTextField.png" removable="false" auto-create-binding="true" can-attach-label="true">
|
||||
<default-constraints vsize-policy="0" hsize-policy="6" anchor="8" fill="1">
|
||||
<preferred-size width="150" height="-1" />
|
||||
</default-constraints>
|
||||
</item>
|
||||
<item class="javax.swing.JTextArea" icon="/com/intellij/uiDesigner/icons/textArea.png" removable="false" auto-create-binding="true" can-attach-label="true">
|
||||
<default-constraints vsize-policy="6" hsize-policy="6" anchor="0" fill="3">
|
||||
<preferred-size width="150" height="50" />
|
||||
</default-constraints>
|
||||
</item>
|
||||
<item class="javax.swing.JTextPane" icon="/com/intellij/uiDesigner/icons/textPane.png" removable="false" auto-create-binding="true" can-attach-label="true">
|
||||
<default-constraints vsize-policy="6" hsize-policy="6" anchor="0" fill="3">
|
||||
<preferred-size width="150" height="50" />
|
||||
</default-constraints>
|
||||
</item>
|
||||
<item class="javax.swing.JEditorPane" icon="/com/intellij/uiDesigner/icons/editorPane.png" removable="false" auto-create-binding="true" can-attach-label="true">
|
||||
<default-constraints vsize-policy="6" hsize-policy="6" anchor="0" fill="3">
|
||||
<preferred-size width="150" height="50" />
|
||||
</default-constraints>
|
||||
</item>
|
||||
<item class="javax.swing.JComboBox" icon="/com/intellij/uiDesigner/icons/comboBox.png" removable="false" auto-create-binding="true" can-attach-label="true">
|
||||
<default-constraints vsize-policy="0" hsize-policy="2" anchor="8" fill="1" />
|
||||
</item>
|
||||
<item class="javax.swing.JTable" icon="/com/intellij/uiDesigner/icons/table.png" removable="false" auto-create-binding="true" can-attach-label="false">
|
||||
<default-constraints vsize-policy="6" hsize-policy="6" anchor="0" fill="3">
|
||||
<preferred-size width="150" height="50" />
|
||||
</default-constraints>
|
||||
</item>
|
||||
<item class="javax.swing.JList" icon="/com/intellij/uiDesigner/icons/list.png" removable="false" auto-create-binding="true" can-attach-label="false">
|
||||
<default-constraints vsize-policy="6" hsize-policy="2" anchor="0" fill="3">
|
||||
<preferred-size width="150" height="50" />
|
||||
</default-constraints>
|
||||
</item>
|
||||
<item class="javax.swing.JTree" icon="/com/intellij/uiDesigner/icons/tree.png" removable="false" auto-create-binding="true" can-attach-label="false">
|
||||
<default-constraints vsize-policy="6" hsize-policy="6" anchor="0" fill="3">
|
||||
<preferred-size width="150" height="50" />
|
||||
</default-constraints>
|
||||
</item>
|
||||
<item class="javax.swing.JTabbedPane" icon="/com/intellij/uiDesigner/icons/tabbedPane.png" removable="false" auto-create-binding="true" can-attach-label="false">
|
||||
<default-constraints vsize-policy="3" hsize-policy="3" anchor="0" fill="3">
|
||||
<preferred-size width="200" height="200" />
|
||||
</default-constraints>
|
||||
</item>
|
||||
<item class="javax.swing.JSplitPane" icon="/com/intellij/uiDesigner/icons/splitPane.png" removable="false" auto-create-binding="false" can-attach-label="false">
|
||||
<default-constraints vsize-policy="3" hsize-policy="3" anchor="0" fill="3">
|
||||
<preferred-size width="200" height="200" />
|
||||
</default-constraints>
|
||||
</item>
|
||||
<item class="javax.swing.JSpinner" icon="/com/intellij/uiDesigner/icons/spinner.png" removable="false" auto-create-binding="true" can-attach-label="true">
|
||||
<default-constraints vsize-policy="0" hsize-policy="6" anchor="8" fill="1" />
|
||||
</item>
|
||||
<item class="javax.swing.JSlider" icon="/com/intellij/uiDesigner/icons/slider.png" removable="false" auto-create-binding="true" can-attach-label="false">
|
||||
<default-constraints vsize-policy="0" hsize-policy="6" anchor="8" fill="1" />
|
||||
</item>
|
||||
<item class="javax.swing.JSeparator" icon="/com/intellij/uiDesigner/icons/separator.png" removable="false" auto-create-binding="false" can-attach-label="false">
|
||||
<default-constraints vsize-policy="6" hsize-policy="6" anchor="0" fill="3" />
|
||||
</item>
|
||||
<item class="javax.swing.JProgressBar" icon="/com/intellij/uiDesigner/icons/progressbar.png" removable="false" auto-create-binding="true" can-attach-label="false">
|
||||
<default-constraints vsize-policy="0" hsize-policy="6" anchor="0" fill="1" />
|
||||
</item>
|
||||
<item class="javax.swing.JToolBar" icon="/com/intellij/uiDesigner/icons/toolbar.png" removable="false" auto-create-binding="false" can-attach-label="false">
|
||||
<default-constraints vsize-policy="0" hsize-policy="6" anchor="0" fill="1">
|
||||
<preferred-size width="-1" height="20" />
|
||||
</default-constraints>
|
||||
</item>
|
||||
<item class="javax.swing.JToolBar$Separator" icon="/com/intellij/uiDesigner/icons/toolbarSeparator.png" removable="false" auto-create-binding="false" can-attach-label="false">
|
||||
<default-constraints vsize-policy="0" hsize-policy="0" anchor="0" fill="1" />
|
||||
</item>
|
||||
<item class="javax.swing.JScrollBar" icon="/com/intellij/uiDesigner/icons/scrollbar.png" removable="false" auto-create-binding="true" can-attach-label="false">
|
||||
<default-constraints vsize-policy="6" hsize-policy="0" anchor="0" fill="2" />
|
||||
</item>
|
||||
</group>
|
||||
</component>
|
||||
<component name="PhpWorkspaceProjectConfiguration" backward_compatibility_performed="true" />
|
||||
<component name="ProjectModuleManager">
|
||||
<modules>
|
||||
<module fileurl="file://$PROJECT_DIR$/komp.iml" filepath="$PROJECT_DIR$/komp.iml" />
|
||||
<module fileurl="file://$PROJECT_DIR$/komp.commonMain.iml" filepath="$PROJECT_DIR$/komp.commonMain.iml" />
|
||||
<module fileurl="file://$PROJECT_DIR$/komp.commonTest.iml" filepath="$PROJECT_DIR$/komp.commonTest.iml" />
|
||||
<module fileurl="file://$PROJECT_DIR$/komp.jsMain.iml" filepath="$PROJECT_DIR$/komp.jsMain.iml" />
|
||||
<module fileurl="file://$PROJECT_DIR$/komp.jsTest.iml" filepath="$PROJECT_DIR$/komp.jsTest.iml" />
|
||||
</modules>
|
||||
</component>
|
||||
<component name="ProjectRootManager" version="2" languageLevel="JDK_1_8" default="true" project-jdk-name="1.8" project-jdk-type="JavaSDK">
|
||||
<output url="file://$PROJECT_DIR$/classes" />
|
||||
</component>
|
||||
<component name="PropertiesComponent">
|
||||
<property name="GoToClass.includeLibraries" value="false" />
|
||||
<property name="GoToClass.toSaveIncludeLibraries" value="false" />
|
||||
<property name="GoToFile.includeJavaFiles" value="false" />
|
||||
<property name="MemberChooser.sorted" value="false" />
|
||||
<property name="MemberChooser.showClasses" value="true" />
|
||||
<property name="MemberChooser.copyJavadoc" value="false" />
|
||||
<property name="nodejs_interpreter_path" value="/usr/bin/node" />
|
||||
</component>
|
||||
<component name="RemoteRepositoriesConfiguration">
|
||||
<remote-repository>
|
||||
<option name="id" value="central" />
|
||||
<option name="name" value="Maven Central repository" />
|
||||
<option name="url" value="https://repo1.maven.org/maven2" />
|
||||
</remote-repository>
|
||||
<remote-repository>
|
||||
<option name="id" value="jboss.community" />
|
||||
<option name="name" value="JBoss Community repository" />
|
||||
<option name="url" value="https://repository.jboss.org/nexus/content/repositories/public/" />
|
||||
</remote-repository>
|
||||
<remote-repository>
|
||||
<option name="id" value="MavenRepo" />
|
||||
<option name="name" value="MavenRepo" />
|
||||
<option name="url" value="https://repo.maven.apache.org/maven2/" />
|
||||
</remote-repository>
|
||||
<remote-repository>
|
||||
<option name="id" value="maven" />
|
||||
<option name="name" value="maven" />
|
||||
<option name="url" value="http://nexus.astraeus.nl/nexus/content/groups/public" />
|
||||
</remote-repository>
|
||||
<remote-repository>
|
||||
<option name="id" value="BintrayJCenter" />
|
||||
<option name="name" value="BintrayJCenter" />
|
||||
<option name="url" value="https://jcenter.bintray.com/" />
|
||||
</remote-repository>
|
||||
</component>
|
||||
<component name="RunManager">
|
||||
<configuration default="true" type="Applet" factoryName="Applet">
|
||||
<option name="WIDTH" value="400" />
|
||||
<option name="HEIGHT" value="300" />
|
||||
<option name="POLICY_FILE" value="$APPLICATION_HOME_DIR$/bin/appletviewer.policy" />
|
||||
<module />
|
||||
</configuration>
|
||||
<configuration default="true" type="Application" factoryName="Application">
|
||||
<option name="MAIN_CLASS_NAME" />
|
||||
<option name="VM_PARAMETERS" />
|
||||
<option name="PROGRAM_PARAMETERS" />
|
||||
<option name="WORKING_DIRECTORY" value="$PROJECT_DIR$" />
|
||||
<option name="ALTERNATIVE_JRE_PATH_ENABLED" value="false" />
|
||||
<option name="ALTERNATIVE_JRE_PATH" />
|
||||
<option name="ENABLE_SWING_INSPECTOR" value="false" />
|
||||
<option name="ENV_VARIABLES" />
|
||||
<option name="PASS_PARENT_ENVS" value="true" />
|
||||
<module name="" />
|
||||
<envs />
|
||||
</configuration>
|
||||
<configuration default="true" type="JUnit" factoryName="JUnit">
|
||||
<module name="" />
|
||||
<option name="ALTERNATIVE_JRE_PATH_ENABLED" value="false" />
|
||||
<option name="ALTERNATIVE_JRE_PATH" />
|
||||
<option name="PACKAGE_NAME" />
|
||||
<option name="MAIN_CLASS_NAME" />
|
||||
<option name="METHOD_NAME" />
|
||||
<option name="TEST_OBJECT" value="class" />
|
||||
<option name="VM_PARAMETERS" value="-ea" />
|
||||
<option name="PARAMETERS" />
|
||||
<option name="WORKING_DIRECTORY" value="$MODULE_DIR$" />
|
||||
<option name="ENV_VARIABLES" />
|
||||
<option name="PASS_PARENT_ENVS" value="true" />
|
||||
<option name="TEST_SEARCH_SCOPE">
|
||||
<value defaultName="singleModule" />
|
||||
</option>
|
||||
<envs />
|
||||
<patterns />
|
||||
</configuration>
|
||||
<configuration default="true" type="#org.jetbrains.idea.devkit.run.PluginConfigurationType" factoryName="Plugin">
|
||||
<module name="" />
|
||||
<option name="VM_PARAMETERS" value="-Xmx512m -Xms256m -XX:MaxPermSize=250m -ea" />
|
||||
<option name="PROGRAM_PARAMETERS" />
|
||||
<predefined_log_file id="idea.log" enabled="true" />
|
||||
</configuration>
|
||||
<configuration default="true" type="Remote" factoryName="Remote">
|
||||
<option name="USE_SOCKET_TRANSPORT" value="true" />
|
||||
<option name="SERVER_MODE" value="false" />
|
||||
<option name="SHMEM_ADDRESS" value="javadebug" />
|
||||
<option name="HOST" value="localhost" />
|
||||
<option name="PORT" value="5005" />
|
||||
</configuration>
|
||||
<configuration name="<template>" type="TestNG" default="true" selected="false">
|
||||
<option name="MAIN_CLASS_NAME" />
|
||||
<option name="VM_PARAMETERS" value="-ea" />
|
||||
<option name="PARAMETERS" />
|
||||
<option name="WORKING_DIRECTORY" value="$PROJECT_DIR$" />
|
||||
</configuration>
|
||||
</component>
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="" vcs="Git" />
|
||||
</component>
|
||||
<component name="accountSettings">
|
||||
<option name="activeRegion" value="us-east-1" />
|
||||
<option name="recentlyUsedRegions">
|
||||
<list>
|
||||
<option value="us-east-1" />
|
||||
</list>
|
||||
</option>
|
||||
</component>
|
||||
<component name="libraryTable">
|
||||
<library name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-common:1.4.30" type="kotlin.common">
|
||||
<CLASSES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-common/1.4.30/bb9a3173350f55732416ee27956ea8f9b81f4dbb/kotlin-stdlib-common-1.4.30.jar!/" />
|
||||
</CLASSES>
|
||||
<JAVADOC />
|
||||
<SOURCES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-common/1.4.30/9427471650876e86fdb0dd878f147ff15c57eac0/kotlin-stdlib-common-1.4.30-sources.jar!/" />
|
||||
</SOURCES>
|
||||
</library>
|
||||
<library name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.4.30" type="kotlin.js">
|
||||
<CLASSES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-js/1.4.30/6c66d1db9c724b087c3a6f37aecffd24d0b14f26/kotlin-stdlib-js-1.4.30.jar!/" />
|
||||
</CLASSES>
|
||||
<JAVADOC />
|
||||
<SOURCES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-js/1.4.30/5729944dc91bf28689461fe44b9e401fd41a84a7/kotlin-stdlib-js-1.4.30-sources.jar!/" />
|
||||
</SOURCES>
|
||||
</library>
|
||||
<library name="Gradle: org.jetbrains.kotlin:kotlin-test-annotations-common:1.4.30" type="kotlin.common">
|
||||
<CLASSES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-test-annotations-common/1.4.30/e77a76b23fc3007baf57a9d3354fdd318fe1fa88/kotlin-test-annotations-common-1.4.30.jar!/" />
|
||||
</CLASSES>
|
||||
<JAVADOC />
|
||||
<SOURCES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-test-annotations-common/1.4.30/57512e29ee20defe37d54ce19507d599b0f2113/kotlin-test-annotations-common-1.4.30-sources.jar!/" />
|
||||
</SOURCES>
|
||||
</library>
|
||||
<library name="Gradle: org.jetbrains.kotlin:kotlin-test-common:1.4.30" type="kotlin.common">
|
||||
<CLASSES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-test-common/1.4.30/823ed87441680d1334a1f0d23781c0089e16c0a6/kotlin-test-common-1.4.30.jar!/" />
|
||||
</CLASSES>
|
||||
<JAVADOC />
|
||||
<SOURCES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-test-common/1.4.30/d1818d1bdc457b51289f006884a260b56a55cb77/kotlin-test-common-1.4.30-sources.jar!/" />
|
||||
</SOURCES>
|
||||
</library>
|
||||
<library name="Gradle: org.jetbrains.kotlin:kotlin-test-js:1.4.30" type="kotlin.js">
|
||||
<CLASSES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-test-js/1.4.30/5b1cb1ec31a344f6aa1047d6cae3a268825cb724/kotlin-test-js-1.4.30.jar!/" />
|
||||
</CLASSES>
|
||||
<JAVADOC />
|
||||
<SOURCES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-test-js/1.4.30/8e70170db077d3f421c3fb6d24468b3938990f4a/kotlin-test-js-1.4.30-sources.jar!/" />
|
||||
</SOURCES>
|
||||
</library>
|
||||
<library name="Gradle: org.jetbrains.kotlinx:kotlinx-html-common:0.7.2" type="kotlin.common">
|
||||
<CLASSES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlinx/kotlinx-html-common/0.7.2/7da838083337896b558cab2884c4118709a58769/kotlinx-html-metadata-0.7.2.jar!/" />
|
||||
</CLASSES>
|
||||
<JAVADOC />
|
||||
<SOURCES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlinx/kotlinx-html-common/0.7.2/866bbbfe0a81d49cdf19fd149adafbb938b35be4/kotlinx-html-common-0.7.2-sources.jar!/" />
|
||||
</SOURCES>
|
||||
</library>
|
||||
<library name="Gradle: org.jetbrains.kotlinx:kotlinx-html-js:0.7.2" type="kotlin.js">
|
||||
<CLASSES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlinx/kotlinx-html-js/0.7.2/baf7e494e549776d0ae3e0ee225804a513f5dc26/kotlinx-html-jslegacy-0.7.2.jar!/" />
|
||||
</CLASSES>
|
||||
<JAVADOC />
|
||||
<SOURCES>
|
||||
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlinx/kotlinx-html-js/0.7.2/b09bfd3565058174afa3fd0888743f8b8dca5406/kotlinx-html-js-0.7.2-sources.jar!/" />
|
||||
</SOURCES>
|
||||
</library>
|
||||
</component>
|
||||
<component name="masterDetails">
|
||||
<states>
|
||||
<state key="ProjectJDKs.UI">
|
||||
<settings>
|
||||
<last-edited>1.7</last-edited>
|
||||
<splitter-proportions>
|
||||
<option name="proportions">
|
||||
<list>
|
||||
<option value="0.2" />
|
||||
</list>
|
||||
</option>
|
||||
</splitter-proportions>
|
||||
</settings>
|
||||
</state>
|
||||
</states>
|
||||
</component>
|
||||
</project>
|
||||
59
komp.jsMain.iml
Normal file
59
komp.jsMain.iml
Normal file
@@ -0,0 +1,59 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module external.linked.project.id="komp:jsMain" external.linked.project.path="$MODULE_DIR$" external.root.project.path="$MODULE_DIR$" external.system.id="GRADLE" external.system.module.group="nl.astraeus" external.system.module.type="sourceSet" external.system.module.version="0.2.4-SNAPSHOT" type="JAVA_MODULE" version="4">
|
||||
<component name="FacetManager">
|
||||
<facet type="kotlin-language" name="Kotlin">
|
||||
<configuration version="3" platform="JavaScript " allPlatforms="JS []" useProjectSettings="false" isTestModule="false" externalProjectId="komp" pureKotlinSourceFolders="$MODULE_DIR$/src/jsMain/kotlin;/home/rnentjes/Development/komp/komp/build/externals/komp-jsLegacy/src;/home/rnentjes/Development/komp/komp/build/externals/komp-jsIr/src;/home/rnentjes/Development/komp/komp/src/jsTest/kotlin;/home/rnentjes/Development/komp/komp/src/commonMain/kotlin">
|
||||
<dependsOnModuleNames>komp:commonMain</dependsOnModuleNames>
|
||||
<sourceSets>
|
||||
<sourceSet>komp.commonMain</sourceSet>
|
||||
</sourceSets>
|
||||
<newMppModelJpsModuleKind>COMPILATION_AND_SOURCE_SET_HOLDER</newMppModelJpsModuleKind>
|
||||
<compilerSettings />
|
||||
<compilerArguments>
|
||||
<option name="outputFile" value="$MODULE_DIR$/build/js/packages/komp-jsLegacy/kotlin/komp-jsLegacy.js" />
|
||||
<option name="noStdlib" value="true" />
|
||||
<option name="sourceMap" value="true" />
|
||||
<option name="metaInfo" value="true" />
|
||||
<option name="target" value="v5" />
|
||||
<option name="moduleKind" value="umd" />
|
||||
<option name="main" value="call" />
|
||||
<option name="languageVersion" value="1.4" />
|
||||
<option name="apiVersion" value="1.4" />
|
||||
<option name="pluginOptions">
|
||||
<array />
|
||||
</option>
|
||||
<option name="pluginClasspaths">
|
||||
<array>
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-script-runtime/1.4.30/b9c2a1fab9217623fc0fbadf6190e77eed6f054d/kotlin-script-runtime-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-scripting-common/1.4.30/c7896c5c6b504f44e7cf9f5719d4393e20680666/kotlin-scripting-common-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-scripting-jvm/1.4.30/7d0085e5781847da84580d16239c1c4e0980bdb0/kotlin-scripting-jvm-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-common/1.4.30/bb9a3173350f55732416ee27956ea8f9b81f4dbb/kotlin-stdlib-common-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib/1.4.30/d10d1e10f47006ee08162dde039e38ac487de4ac/kotlin-stdlib-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlinx/kotlinx-coroutines-core/1.3.8/f62be6d4cbf27781c2969867b4ed952f38378492/kotlinx-coroutines-core-1.3.8.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains/annotations/13.0/919f0dfe192fb4e063e7dacadee7f8bb9a2672a9/annotations-13.0.jar" />
|
||||
</array>
|
||||
</option>
|
||||
<option name="multiPlatform" value="true" />
|
||||
<option name="errors">
|
||||
<ArgumentParseErrors />
|
||||
</option>
|
||||
</compilerArguments>
|
||||
</configuration>
|
||||
</facet>
|
||||
</component>
|
||||
<component name="NewModuleRootManager">
|
||||
<output url="file://$MODULE_DIR$/build/js/packages/komp-jsLegacy/kotlin" />
|
||||
<exclude-output />
|
||||
<content url="file://$MODULE_DIR$/build/externals/komp-jsIr/src" />
|
||||
<content url="file://$MODULE_DIR$/build/externals/komp-jsLegacy/src" />
|
||||
<content url="file://$MODULE_DIR$/src/jsMain">
|
||||
<sourceFolder url="file://$MODULE_DIR$/src/jsMain/kotlin" type="kotlin-source" />
|
||||
</content>
|
||||
<orderEntry type="jdk" jdkName="Kotlin SDK" jdkType="KotlinSDK" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
<orderEntry type="module" module-name="komp.commonMain" />
|
||||
<orderEntry type="library" name="Gradle: org.jetbrains.kotlinx:kotlinx-html-js:0.7.2" level="project" />
|
||||
<orderEntry type="library" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.4.30" level="project" />
|
||||
<orderEntry type="library" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-common:1.4.30" level="project" />
|
||||
</component>
|
||||
</module>
|
||||
70
komp.jsTest.iml
Normal file
70
komp.jsTest.iml
Normal file
@@ -0,0 +1,70 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module external.linked.project.id="komp:jsTest" external.linked.project.path="$MODULE_DIR$" external.root.project.path="$MODULE_DIR$" external.system.id="GRADLE" external.system.module.group="nl.astraeus" external.system.module.type="sourceSet" external.system.module.version="0.2.4-SNAPSHOT" type="JAVA_MODULE" version="4">
|
||||
<component name="FacetManager">
|
||||
<facet type="kotlin-language" name="Kotlin">
|
||||
<configuration version="3" platform="JavaScript " allPlatforms="JS []" useProjectSettings="false" isTestModule="true" externalProjectId="komp" pureKotlinSourceFolders="$MODULE_DIR$/src/jsMain/kotlin;/home/rnentjes/Development/komp/komp/build/externals/komp-jsLegacy/src;/home/rnentjes/Development/komp/komp/build/externals/komp-jsIr/src;/home/rnentjes/Development/komp/komp/src/jsTest/kotlin;/home/rnentjes/Development/komp/komp/src/commonMain/kotlin">
|
||||
<dependsOnModuleNames>komp:commonTest</dependsOnModuleNames>
|
||||
<sourceSets>
|
||||
<sourceSet>komp.jsMain</sourceSet>
|
||||
<sourceSet>komp.commonTest</sourceSet>
|
||||
<sourceSet>komp.commonMain</sourceSet>
|
||||
</sourceSets>
|
||||
<newMppModelJpsModuleKind>COMPILATION_AND_SOURCE_SET_HOLDER</newMppModelJpsModuleKind>
|
||||
<externalSystemTestTasks>
|
||||
<externalSystemTestTask>jsLegacyBrowserTest|komp:jsTest|jsLegacy</externalSystemTestTask>
|
||||
</externalSystemTestTasks>
|
||||
<compilerSettings />
|
||||
<compilerArguments>
|
||||
<option name="outputFile" value="$MODULE_DIR$/build/js/packages/komp-jsLegacy-test/kotlin/komp-jsLegacy-test.js" />
|
||||
<option name="noStdlib" value="true" />
|
||||
<option name="sourceMap" value="true" />
|
||||
<option name="metaInfo" value="true" />
|
||||
<option name="target" value="v5" />
|
||||
<option name="moduleKind" value="umd" />
|
||||
<option name="main" value="call" />
|
||||
<option name="languageVersion" value="1.4" />
|
||||
<option name="apiVersion" value="1.4" />
|
||||
<option name="pluginOptions">
|
||||
<array />
|
||||
</option>
|
||||
<option name="pluginClasspaths">
|
||||
<array>
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-script-runtime/1.4.30/b9c2a1fab9217623fc0fbadf6190e77eed6f054d/kotlin-script-runtime-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-scripting-common/1.4.30/c7896c5c6b504f44e7cf9f5719d4393e20680666/kotlin-scripting-common-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-scripting-jvm/1.4.30/7d0085e5781847da84580d16239c1c4e0980bdb0/kotlin-scripting-jvm-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-common/1.4.30/bb9a3173350f55732416ee27956ea8f9b81f4dbb/kotlin-stdlib-common-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib/1.4.30/d10d1e10f47006ee08162dde039e38ac487de4ac/kotlin-stdlib-1.4.30.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlinx/kotlinx-coroutines-core/1.3.8/f62be6d4cbf27781c2969867b4ed952f38378492/kotlinx-coroutines-core-1.3.8.jar" />
|
||||
<option value="$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains/annotations/13.0/919f0dfe192fb4e063e7dacadee7f8bb9a2672a9/annotations-13.0.jar" />
|
||||
</array>
|
||||
</option>
|
||||
<option name="multiPlatform" value="true" />
|
||||
<option name="errors">
|
||||
<ArgumentParseErrors />
|
||||
</option>
|
||||
</compilerArguments>
|
||||
</configuration>
|
||||
</facet>
|
||||
</component>
|
||||
<component name="NewModuleRootManager">
|
||||
<output-test url="file://$MODULE_DIR$/build/js/packages/komp-jsLegacy-test/kotlin" />
|
||||
<exclude-output />
|
||||
<content url="file://$MODULE_DIR$/src/jsTest">
|
||||
<sourceFolder url="file://$MODULE_DIR$/src/jsTest/kotlin" type="kotlin-test" />
|
||||
</content>
|
||||
<orderEntry type="jdk" jdkName="Kotlin SDK" jdkType="KotlinSDK" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
<orderEntry type="module" module-name="komp.commonMain" scope="TEST" />
|
||||
<orderEntry type="module" module-name="komp.commonTest" scope="TEST" production-on-test="" />
|
||||
<orderEntry type="module" module-name="komp.jsMain" scope="TEST" />
|
||||
<orderEntry type="module" module-name="komp.jsMain" scope="RUNTIME" />
|
||||
<orderEntry type="library" scope="TEST" name="Gradle: org.jetbrains.kotlinx:kotlinx-html-js:0.7.2" level="project" />
|
||||
<orderEntry type="library" scope="TEST" name="Gradle: org.jetbrains.kotlin:kotlin-test-js:1.4.30" level="project" />
|
||||
<orderEntry type="library" scope="TEST" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.4.30" level="project" />
|
||||
<orderEntry type="library" scope="TEST" name="Gradle: org.jetbrains.kotlinx:kotlinx-html-common:0.7.2" level="project" />
|
||||
<orderEntry type="library" scope="TEST" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-common:1.4.30" level="project" />
|
||||
<orderEntry type="library" scope="TEST" name="Gradle: org.jetbrains.kotlin:kotlin-test-common:1.4.30" level="project" />
|
||||
<orderEntry type="library" scope="TEST" name="Gradle: org.jetbrains.kotlin:kotlin-test-annotations-common:1.4.30" level="project" />
|
||||
</component>
|
||||
<component name="TestModuleProperties" production-module="komp.jsMain" />
|
||||
</module>
|
||||
@@ -1,13 +1,7 @@
|
||||
# Komponent
|
||||
|
||||
|
||||
|
||||
Very simple helper to build single page apps with the Kotlin javascript target using static html builders.
|
||||
|
||||
See the komp-todo repository for a basic example here: [komp-todo](https://github.com/rnentjes/komp-todo)
|
||||
|
||||
For a more complete example take a look at the simple-password-manager repository: [simple-password-manager](https://github.com/rnentjes/simple-password-manager)
|
||||
|
||||
Available on maven central: "nl.astraeus:kotlin-komponent-js:1.0.0"
|
||||
|
||||
Some getting started documentation can be found [here](docs/getting-started.md)
|
||||
@@ -1,2 +1,16 @@
|
||||
pluginManagement {
|
||||
repositories {
|
||||
|
||||
rootProject.name = "kotlin-komponent"
|
||||
maven { setUrl("https://dl.bintray.com/kotlin/kotlin-dev") }
|
||||
|
||||
maven { setUrl("https://dl.bintray.com/kotlin/kotlin-eap") }
|
||||
|
||||
mavenCentral()
|
||||
|
||||
maven { setUrl("https://plugins.gradle.org/m2/") }
|
||||
}
|
||||
}
|
||||
|
||||
rootProject.name = "komp"
|
||||
|
||||
enableFeaturePreview("GRADLE_METADATA")
|
||||
|
||||
368
src/jsMain/kotlin/nl/astraeus/komp/DiffPatch.kt
Normal file
368
src/jsMain/kotlin/nl/astraeus/komp/DiffPatch.kt
Normal file
@@ -0,0 +1,368 @@
|
||||
package nl.astraeus.komp
|
||||
|
||||
import org.w3c.dom.HTMLElement
|
||||
import org.w3c.dom.HTMLInputElement
|
||||
import org.w3c.dom.Node
|
||||
import org.w3c.dom.NodeList
|
||||
import org.w3c.dom.events.Event
|
||||
import org.w3c.dom.get
|
||||
|
||||
const val HASH_VALUE = "komp-hash-value"
|
||||
|
||||
//const val HASH_ATTRIBUTE = "data-komp-hash"
|
||||
const val EVENT_ATTRIBUTE = "data-komp-events"
|
||||
|
||||
fun Node.getKompHash(): Int = this.asDynamic()[HASH_VALUE] as? Int? ?: -1
|
||||
|
||||
fun Node.setKompHash(hash: Int) {
|
||||
this.asDynamic()[HASH_VALUE] = hash
|
||||
}
|
||||
|
||||
private fun NodeList.findNodeHashIndex(hash: Int): Int {
|
||||
for (index in 0..this.length) {
|
||||
val node = this[index]
|
||||
if (node is HTMLElement && node.getKompHash() == hash) {
|
||||
return index
|
||||
}
|
||||
}
|
||||
|
||||
return -1
|
||||
}
|
||||
|
||||
object DiffPatch {
|
||||
|
||||
fun hashesMatch(oldNode: Node, newNode: Node): Boolean {
|
||||
return (
|
||||
oldNode is HTMLElement &&
|
||||
newNode is HTMLElement &&
|
||||
oldNode.nodeName == newNode.nodeName &&
|
||||
oldNode.getKompHash() == newNode.getKompHash()
|
||||
)
|
||||
}
|
||||
|
||||
private fun updateKomponentOnNode(oldNode: Node, newNode: Node) {
|
||||
val komponent = newNode.asDynamic()[KOMP_KOMPONENT] as? Komponent
|
||||
if (komponent != null) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Keeping oldNode, set oldNode element on Komponent", oldNode, komponent)
|
||||
}
|
||||
komponent.element = oldNode
|
||||
}
|
||||
}
|
||||
|
||||
fun updateNode(oldNode: Node, newNode: Node): Node {
|
||||
if (hashesMatch(oldNode, newNode)) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Hashes match", oldNode, newNode, oldNode.getKompHash(), newNode.getKompHash())
|
||||
}
|
||||
|
||||
updateKomponentOnNode(oldNode, newNode)
|
||||
return oldNode
|
||||
}
|
||||
|
||||
if (oldNode.nodeType == newNode.nodeType && oldNode.nodeType == 3.toShort()) {
|
||||
if (oldNode.textContent != newNode.textContent) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Updating text content", oldNode, newNode)
|
||||
}
|
||||
oldNode.textContent = newNode.textContent
|
||||
}
|
||||
|
||||
updateKomponentOnNode(oldNode, newNode)
|
||||
return oldNode
|
||||
}
|
||||
|
||||
if (oldNode is HTMLElement && newNode is HTMLElement) {
|
||||
if (oldNode.nodeName == newNode.nodeName) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Update attributes", oldNode.nodeName, newNode.nodeName)
|
||||
}
|
||||
updateAttributes(oldNode, newNode);
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Update events", oldNode.nodeName, newNode.nodeName)
|
||||
}
|
||||
updateEvents(oldNode, newNode)
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Update children", oldNode.nodeName, newNode.nodeName)
|
||||
}
|
||||
updateChildren(oldNode, newNode)
|
||||
oldNode.setKompHash(newNode.getKompHash())
|
||||
|
||||
updateKomponentOnNode(oldNode, newNode)
|
||||
return oldNode
|
||||
}
|
||||
}
|
||||
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Replace node (type)", oldNode.nodeType, oldNode, newNode)
|
||||
}
|
||||
|
||||
oldNode.parentNode?.replaceChild(newNode, oldNode)
|
||||
//replaceNode(oldNode, newNode)
|
||||
return newNode
|
||||
}
|
||||
|
||||
private fun updateAttributes(oldNode: HTMLElement, newNode: HTMLElement) {
|
||||
// removed attributes
|
||||
for (name in oldNode.getAttributeNames()) {
|
||||
val attr = oldNode.attributes[name]
|
||||
|
||||
if (attr != null && newNode.getAttribute(name) == null) {
|
||||
oldNode.removeAttribute(name)
|
||||
}
|
||||
}
|
||||
|
||||
for (name in newNode.getAttributeNames()) {
|
||||
val value = newNode.getAttribute(name)
|
||||
val oldValue = oldNode.getAttribute(name)
|
||||
|
||||
if (value != oldValue) {
|
||||
if (value != null) {
|
||||
oldNode.setAttribute(name, value)
|
||||
}else {
|
||||
oldNode.removeAttribute(name)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (newNode is HTMLInputElement && oldNode is HTMLInputElement) {
|
||||
oldNode.value = newNode.value
|
||||
}
|
||||
|
||||
/*
|
||||
for (index in 0 until newNode.attributes.length) {
|
||||
val attr = newNode.attributes[index]
|
||||
|
||||
if (attr != null) {
|
||||
val oldAttr = oldNode.attributes[attr.name]
|
||||
|
||||
if (oldAttr == null || oldAttr.value != attr.value) {
|
||||
oldNode.setAttribute(attr.name, attr.value)
|
||||
}
|
||||
}
|
||||
}
|
||||
*/
|
||||
}
|
||||
|
||||
private fun updateChildren(oldNode: HTMLElement, newNode: HTMLElement) {
|
||||
var oldIndex = 0
|
||||
var newIndex = 0
|
||||
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log(
|
||||
"updateChildren HTML old(${oldNode.childNodes.length})",
|
||||
oldNode.innerHTML
|
||||
)
|
||||
console.log(
|
||||
"updateChildren HTML new(${newNode.childNodes.length})",
|
||||
newNode.innerHTML
|
||||
)
|
||||
}
|
||||
|
||||
while (newIndex < newNode.childNodes.length) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Update Old/new", oldIndex, newIndex)
|
||||
}
|
||||
val newChildNode = newNode.childNodes[newIndex]
|
||||
|
||||
if (oldIndex < oldNode.childNodes.length) {
|
||||
val oldChildNode = oldNode.childNodes[oldIndex]
|
||||
|
||||
if (oldChildNode != null && newChildNode != null) {
|
||||
/*
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log(">>> updateChildren old/new", oldChildNode, newChildNode)
|
||||
}
|
||||
*/
|
||||
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Update node Old/new", oldChildNode, newChildNode)
|
||||
}
|
||||
|
||||
if (!hashesMatch(oldChildNode, newChildNode) && newChildNode is HTMLElement && oldChildNode is HTMLElement) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Hashes don't match")
|
||||
}
|
||||
|
||||
val oldHash = oldChildNode.getKompHash()
|
||||
val newHash = newChildNode.getKompHash()
|
||||
|
||||
if (newHash >= 0) {
|
||||
val oldNodeWithNewHashIndex = oldNode.childNodes.findNodeHashIndex(newHash)
|
||||
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("oldNodeWithNewHashIndex", newHash, oldNodeWithNewHashIndex)
|
||||
}
|
||||
|
||||
if (oldNodeWithNewHashIndex > oldIndex) {
|
||||
if (oldHash >= 0) {
|
||||
val newNodeWithOldHashIndex = newNode.childNodes.findNodeHashIndex(oldHash)
|
||||
|
||||
// remove i.o. swap
|
||||
if (newNodeWithOldHashIndex == -1) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Old node missing in new tree, remove node", oldChildNode)
|
||||
}
|
||||
oldNode.removeChild(oldChildNode)
|
||||
continue
|
||||
}
|
||||
}
|
||||
val nodeWithHash = oldNode.childNodes[oldNodeWithNewHashIndex]
|
||||
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("nodeWithHash", nodeWithHash)
|
||||
}
|
||||
if (nodeWithHash != null) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log(">-> swap nodes", oldNode)
|
||||
}
|
||||
|
||||
oldNode.insertBefore(nodeWithHash, oldNode.childNodes[oldIndex])
|
||||
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log(">-> swapped nodes", oldNode)
|
||||
}
|
||||
newIndex++
|
||||
oldIndex++
|
||||
continue
|
||||
}
|
||||
} else if (oldHash >= 0 && newNode.childNodes.findNodeHashIndex(oldHash) > newIndex) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("newNodeWithOldHashIndex", oldHash, newNode.childNodes.findNodeHashIndex(oldHash))
|
||||
}
|
||||
|
||||
oldNode.insertBefore(newChildNode, oldChildNode)
|
||||
oldIndex++
|
||||
continue
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
val updatedNode = updateNode(oldChildNode, newChildNode)
|
||||
if (updatedNode == newChildNode) {
|
||||
if (oldChildNode is HTMLElement && newChildNode is HTMLElement) {
|
||||
updateEvents(oldChildNode, newChildNode)
|
||||
}
|
||||
oldIndex++
|
||||
continue
|
||||
}
|
||||
} else {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Null node", oldChildNode, newChildNode)
|
||||
}
|
||||
}
|
||||
|
||||
oldIndex++
|
||||
newIndex++
|
||||
} else {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Append Old/new/node", oldIndex, newIndex, newChildNode)
|
||||
}
|
||||
oldNode.append(newChildNode)
|
||||
|
||||
oldIndex++
|
||||
}
|
||||
|
||||
/*
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("<<< Updated Old/new", oldNode.innerHTML, newNode.innerHTML)
|
||||
}
|
||||
*/
|
||||
}
|
||||
|
||||
while (oldIndex < oldNode.childNodes.length) {
|
||||
oldNode.childNodes[oldIndex]?.also {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Remove old node", it)
|
||||
}
|
||||
|
||||
oldNode.removeChild(it)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private fun updateEvents(oldNode: HTMLElement, newNode: HTMLElement) {
|
||||
val oldEvents = mutableListOf<String>()
|
||||
oldEvents.addAll((oldNode.getAttribute(EVENT_ATTRIBUTE) ?: "").split(","))
|
||||
|
||||
val newEvents = (newNode.getAttribute(EVENT_ATTRIBUTE) ?: "").split(",")
|
||||
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Update events", oldNode.getAttribute(EVENT_ATTRIBUTE), newNode.getAttribute(EVENT_ATTRIBUTE))
|
||||
}
|
||||
|
||||
for (event in newEvents) {
|
||||
if (event.isNotBlank()) {
|
||||
val oldNodeEvent = oldNode.asDynamic()["event-$event"]
|
||||
val newNodeEvent = newNode.asDynamic()["event-$event"]
|
||||
if (oldNodeEvent != null) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Remove old event $event")
|
||||
}
|
||||
oldNode.removeEventListener(event, oldNodeEvent as ((Event) -> Unit), null)
|
||||
}
|
||||
if (newNodeEvent != null) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Set event $event on", oldNode)
|
||||
}
|
||||
oldNode.setEvent(event, newNodeEvent as ((Event) -> Unit))
|
||||
}
|
||||
oldEvents.remove(event)
|
||||
}
|
||||
}
|
||||
|
||||
for (event in oldEvents) {
|
||||
if (event.isNotBlank()) {
|
||||
val oldNodeEvent = oldNode.asDynamic()["event-$event"]
|
||||
if (oldNodeEvent != null) {
|
||||
oldNode.removeEventListener(event, oldNodeEvent as ((Event) -> Unit), null)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
newNode.getAttribute(EVENT_ATTRIBUTE)?.also {
|
||||
oldNode.setAttribute(EVENT_ATTRIBUTE, it)
|
||||
}
|
||||
}
|
||||
|
||||
private fun replaceNode(oldNode: Node, newNode: Node) {
|
||||
oldNode.parentNode?.also { parent ->
|
||||
val clone = newNode.cloneNode(true)
|
||||
cloneEvents(clone, newNode)
|
||||
parent.replaceChild(clone, oldNode)
|
||||
}
|
||||
}
|
||||
|
||||
private fun cloneEvents(destination: Node, source: Node) {
|
||||
if (source is HTMLElement && destination is HTMLElement) {
|
||||
val events = (source.getAttribute(EVENT_ATTRIBUTE) ?: "").split(",")
|
||||
for (event in events) {
|
||||
if (event.isNotBlank()) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Clone event $event on", source)
|
||||
}
|
||||
|
||||
val foundEvent = source.asDynamic()["event-$event"]
|
||||
if (foundEvent != null) {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Clone add eventlistener", foundEvent)
|
||||
}
|
||||
destination.setEvent(event, foundEvent as ((Event) -> Unit))
|
||||
} else {
|
||||
if (Komponent.logReplaceEvent) {
|
||||
console.log("Event not found $event", source)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
for (index in 0 until source.childNodes.length) {
|
||||
destination.childNodes[index]?.also { destinationChild ->
|
||||
source.childNodes[index]?.also { sourceChild ->
|
||||
cloneEvents(destinationChild, sourceChild)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -1,158 +0,0 @@
|
||||
package nl.astraeus.komp
|
||||
|
||||
import org.w3c.dom.events.Event
|
||||
import org.w3c.dom.Element
|
||||
import org.w3c.dom.HTMLInputElement
|
||||
import org.w3c.dom.events.EventListener
|
||||
import org.w3c.dom.get
|
||||
|
||||
private fun Int.asSpaces(): String {
|
||||
val result = StringBuilder()
|
||||
|
||||
repeat(this) {
|
||||
result.append(" ")
|
||||
}
|
||||
return result.toString()
|
||||
}
|
||||
|
||||
fun Element.printTree(indent: Int = 0): String {
|
||||
val result = StringBuilder()
|
||||
|
||||
result.append(indent.asSpaces())
|
||||
result.append(tagName)
|
||||
if (this.namespaceURI != "http://www.w3.org/1999/xhtml") {
|
||||
result.append(" [")
|
||||
result.append(namespaceURI)
|
||||
result.append("]")
|
||||
}
|
||||
result.append(" (")
|
||||
var first = true
|
||||
if (hasAttributes()) {
|
||||
for (index in 0 until attributes.length) {
|
||||
if (!first) {
|
||||
result.append(", ")
|
||||
} else {
|
||||
first = false
|
||||
}
|
||||
result.append(attributes[index]?.localName)
|
||||
result.append("=")
|
||||
result.append(attributes[index]?.value)
|
||||
}
|
||||
}
|
||||
result.append(") {")
|
||||
result.append("\n")
|
||||
for ((name, event) in getKompEvents()) {
|
||||
result.append(indent.asSpaces())
|
||||
result.append("on")
|
||||
result.append(name)
|
||||
result.append(" -> ")
|
||||
result.append(event)
|
||||
result.append("\n")
|
||||
}
|
||||
for (index in 0 until childNodes.length) {
|
||||
childNodes[index]?.let {
|
||||
if (it is Element) {
|
||||
result.append(it.printTree(indent + 2))
|
||||
} else {
|
||||
result.append((indent + 2).asSpaces())
|
||||
result.append(it.textContent)
|
||||
result.append("\n")
|
||||
}
|
||||
}
|
||||
}
|
||||
result.append(indent.asSpaces())
|
||||
result.append("}\n")
|
||||
|
||||
return result.toString()
|
||||
}
|
||||
|
||||
internal fun Element.setKompAttribute(attributeName: String, value: String?) {
|
||||
//val attributeName = name.lowercase()
|
||||
if (value == null || value.isBlank()) {
|
||||
if (this is HTMLInputElement) {
|
||||
when (attributeName) {
|
||||
"checked" -> {
|
||||
checked = false
|
||||
}
|
||||
/*
|
||||
"class" -> {
|
||||
className = ""
|
||||
}
|
||||
*/
|
||||
"value" -> {
|
||||
this.value = ""
|
||||
}
|
||||
else -> {
|
||||
removeAttribute(attributeName)
|
||||
}
|
||||
}
|
||||
} else {
|
||||
removeAttribute(attributeName)
|
||||
}
|
||||
} else {
|
||||
if (this is HTMLInputElement) {
|
||||
when (attributeName) {
|
||||
"checked" -> {
|
||||
checked = "checked" == value
|
||||
}
|
||||
/*
|
||||
"class" -> {
|
||||
className = value
|
||||
}
|
||||
*/
|
||||
"value" -> {
|
||||
this.value = value
|
||||
}
|
||||
else -> {
|
||||
setAttribute(attributeName, value)
|
||||
}
|
||||
}
|
||||
} else if (this.getAttribute(attributeName) != value) {
|
||||
setAttribute(attributeName, value)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
internal fun Element.clearKompEvents() {
|
||||
val events = getKompEvents()
|
||||
for ((name, event) in getKompEvents()) {
|
||||
removeEventListener(name, event)
|
||||
}
|
||||
events.clear()
|
||||
}
|
||||
|
||||
internal fun Element.setKompEvent(name: String, event: (Event) -> Unit) {
|
||||
val eventName: String = if (name.startsWith("on")) {
|
||||
name.substring(2)
|
||||
} else {
|
||||
name
|
||||
}
|
||||
|
||||
getKompEvents()[eventName] = event
|
||||
|
||||
this.addEventListener(eventName, event)
|
||||
}
|
||||
|
||||
internal fun Element.getKompEvents(): MutableMap<String, (Event) -> Unit> {
|
||||
var result: MutableMap<String, (Event) -> Unit>? = this.asDynamic()["komp-events"] as MutableMap<String, (Event) -> Unit>?
|
||||
|
||||
if (result == null) {
|
||||
result = mutableMapOf()
|
||||
this.asDynamic()["komp-events"] = result
|
||||
}
|
||||
|
||||
return result
|
||||
}
|
||||
|
||||
internal fun Element.findElementIndex(): Int {
|
||||
val childNodes = parentElement?.children
|
||||
if (childNodes != null) {
|
||||
for (index in 0 until childNodes.length) {
|
||||
if (childNodes[index] == this) {
|
||||
return index
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return 0
|
||||
}
|
||||
@@ -1,64 +0,0 @@
|
||||
package nl.astraeus.komp
|
||||
|
||||
import org.w3c.dom.Node
|
||||
import org.w3c.dom.get
|
||||
|
||||
data class ElementIndex(
|
||||
val parent: Node,
|
||||
var childIndex: Int,
|
||||
var setAttr: MutableSet<String> = mutableSetOf()
|
||||
) {
|
||||
override fun toString(): String {
|
||||
return "${parent.nodeName}[$childIndex]"
|
||||
}
|
||||
}
|
||||
|
||||
fun ArrayList<ElementIndex>.currentParent(): Node {
|
||||
this.lastOrNull()?.let {
|
||||
return it.parent
|
||||
}
|
||||
|
||||
throw IllegalStateException("currentParent should never be null!")
|
||||
}
|
||||
|
||||
fun ArrayList<ElementIndex>.currentElement(): Node? {
|
||||
this.lastOrNull()?.let {
|
||||
return it.parent.childNodes[it.childIndex]
|
||||
}
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
fun ArrayList<ElementIndex>.currentPosition(): ElementIndex? {
|
||||
return if (this.size < 2) {
|
||||
null
|
||||
} else {
|
||||
this[this.size - 2]
|
||||
}
|
||||
}
|
||||
|
||||
fun ArrayList<ElementIndex>.nextElement() {
|
||||
this.lastOrNull()?.let {
|
||||
it.setAttr.clear()
|
||||
it.childIndex++
|
||||
}
|
||||
}
|
||||
|
||||
fun ArrayList<ElementIndex>.pop() {
|
||||
this.removeLast()
|
||||
}
|
||||
|
||||
fun ArrayList<ElementIndex>.push(element: Node) {
|
||||
this.add(ElementIndex(element, 0))
|
||||
}
|
||||
|
||||
fun ArrayList<ElementIndex>.replace(new: Node) {
|
||||
if (this.currentElement() != null) {
|
||||
this.currentElement()?.parentElement?.replaceChild(
|
||||
new,
|
||||
this.currentElement()!!
|
||||
)
|
||||
} else {
|
||||
this.last().parent.appendChild(new)
|
||||
}
|
||||
}
|
||||
@@ -1,407 +1,229 @@
|
||||
package nl.astraeus.komp
|
||||
|
||||
import org.w3c.dom.*
|
||||
import org.w3c.dom.css.CSSStyleDeclaration
|
||||
import org.w3c.dom.events.Event
|
||||
import kotlinx.browser.document
|
||||
import kotlinx.html.DefaultUnsafe
|
||||
import kotlinx.html.Entities
|
||||
import kotlinx.html.FlowOrMetaDataOrPhrasingContent
|
||||
import kotlinx.html.Tag
|
||||
import kotlinx.html.TagConsumer
|
||||
import kotlinx.html.Unsafe
|
||||
import org.w3c.dom.Element
|
||||
import org.w3c.dom.HTMLElement
|
||||
import org.w3c.dom.HTMLInputElement
|
||||
import org.w3c.dom.HTMLSpanElement
|
||||
import org.w3c.dom.Node
|
||||
import org.w3c.dom.asList
|
||||
import org.w3c.dom.get
|
||||
import kotlinx.html.*
|
||||
|
||||
private var currentElement: Element? = null
|
||||
@Suppress("NOTHING_TO_INLINE")
|
||||
inline fun HTMLElement.setEvent(name: String, noinline callback: (Event) -> Unit) {
|
||||
val eventName = if (name.startsWith("on")) {
|
||||
name.substring(2)
|
||||
} else {
|
||||
name
|
||||
}
|
||||
addEventListener(eventName, callback, null)
|
||||
if (Komponent.updateStrategy == UpdateStrategy.DOM_DIFF) {
|
||||
//asDynamic()[name] = callback
|
||||
val events = getAttribute(EVENT_ATTRIBUTE) ?: ""
|
||||
|
||||
interface HtmlConsumer : TagConsumer<Element> {
|
||||
fun append(node: Element)
|
||||
fun include(komponent: Komponent)
|
||||
fun debug(block: HtmlConsumer.() -> Unit)
|
||||
setAttribute(
|
||||
EVENT_ATTRIBUTE,
|
||||
if (events.isBlank()) {
|
||||
eventName
|
||||
} else {
|
||||
"$events,$eventName"
|
||||
}
|
||||
)
|
||||
asDynamic()["event-$eventName"] = callback
|
||||
}
|
||||
}
|
||||
|
||||
fun FlowOrMetaDataOrPhrasingContent.currentElement(): Element =
|
||||
currentElement ?: error("No current element defined!")
|
||||
interface HtmlConsumer : TagConsumer<HTMLElement> {
|
||||
fun append(node: Node)
|
||||
}
|
||||
|
||||
private fun Node.asElement() = this as? HTMLElement
|
||||
fun HTMLElement.setStyles(cssStyle: CSSStyleDeclaration) {
|
||||
for (index in 0 until cssStyle.length) {
|
||||
val propertyName = cssStyle.item(index)
|
||||
|
||||
style.setProperty(propertyName, cssStyle.getPropertyValue(propertyName))
|
||||
}
|
||||
}
|
||||
|
||||
class HtmlBuilder(
|
||||
private val komponent: Komponent?,
|
||||
parent: Element,
|
||||
childIndex: Int = 0
|
||||
val komponent: Komponent,
|
||||
val document: Document
|
||||
) : HtmlConsumer {
|
||||
private var currentPosition = arrayListOf<ElementIndex>()
|
||||
private var inDebug = false
|
||||
private var exceptionThrown = false
|
||||
private var currentNode: Node? = null
|
||||
private var firstTag: Boolean = true
|
||||
var root: Element? = null
|
||||
|
||||
init {
|
||||
currentPosition.add(ElementIndex(parent, childIndex))
|
||||
}
|
||||
|
||||
override fun include(komponent: Komponent) {
|
||||
if (
|
||||
komponent.element != null &&
|
||||
!komponent.memoizeChanged()
|
||||
) {
|
||||
currentPosition.replace(komponent.element!!)
|
||||
if (Komponent.logRenderEvent) {
|
||||
console.log(
|
||||
"Skipped include $komponent, memoize hasn't changed"
|
||||
)
|
||||
}
|
||||
} else {
|
||||
// current element should become parent
|
||||
/*
|
||||
val ce = komponent.element
|
||||
if (ce != null) {
|
||||
append(ce as Element)
|
||||
}
|
||||
*/
|
||||
komponent.create(
|
||||
currentPosition.last().parent as Element,
|
||||
currentPosition.last().childIndex
|
||||
)
|
||||
}
|
||||
currentPosition.nextElement()
|
||||
}
|
||||
|
||||
override fun append(node: Element) {
|
||||
currentPosition.replace(node)
|
||||
currentPosition.nextElement()
|
||||
}
|
||||
|
||||
override fun debug(block: HtmlConsumer.() -> Unit) {
|
||||
val enableAssertions = Komponent.enableAssertions
|
||||
Komponent.enableAssertions = true
|
||||
inDebug = true
|
||||
|
||||
try {
|
||||
block.invoke(this)
|
||||
} finally {
|
||||
inDebug = false
|
||||
Komponent.enableAssertions = enableAssertions
|
||||
}
|
||||
}
|
||||
|
||||
private fun logReplace(msg: () -> String) {
|
||||
if (Komponent.logReplaceEvent && inDebug) {
|
||||
console.log(msg.invoke())
|
||||
}
|
||||
}
|
||||
private val path = arrayListOf<HTMLElement>()
|
||||
private var lastLeaved: HTMLElement? = null
|
||||
|
||||
override fun onTagStart(tag: Tag) {
|
||||
logReplace {
|
||||
"onTagStart, [${tag.tagName}, ${tag.namespace ?: ""}], currentPosition: $currentPosition"
|
||||
val element: HTMLElement = when {
|
||||
tag.namespace != null -> document.createElementNS(tag.namespace!!, tag.tagName).asDynamic()
|
||||
else -> document.createElement(tag.tagName) as HTMLElement
|
||||
}
|
||||
|
||||
currentNode = currentPosition.currentElement()
|
||||
|
||||
if (currentNode == null) {
|
||||
logReplace { "onTagStart, currentNode1: $currentNode" }
|
||||
currentNode = if (tag.namespace != null) {
|
||||
document.createElementNS(tag.namespace, tag.tagName)
|
||||
} else {
|
||||
document.createElement(tag.tagName)
|
||||
}
|
||||
|
||||
logReplace { "onTagStart, currentElement1.1: $currentNode" }
|
||||
currentPosition.currentParent().appendChild(currentNode!!)
|
||||
} else if (
|
||||
!currentNode?.asElement()?.tagName.equals(tag.tagName, true) ||
|
||||
(
|
||||
tag.namespace != null &&
|
||||
!currentNode?.asElement()?.namespaceURI.equals(tag.namespace, true)
|
||||
)
|
||||
) {
|
||||
logReplace {
|
||||
"onTagStart, currentElement, namespace: ${currentNode?.asElement()?.namespaceURI} -> ${tag.namespace}"
|
||||
}
|
||||
logReplace {
|
||||
"onTagStart, currentElement, replace: ${currentNode?.asElement()?.tagName} -> ${tag.tagName}"
|
||||
}
|
||||
|
||||
currentNode = if (tag.namespace != null) {
|
||||
document.createElementNS(tag.namespace, tag.tagName)
|
||||
} else {
|
||||
document.createElement(tag.tagName)
|
||||
}
|
||||
|
||||
currentPosition.replace(currentNode!!)
|
||||
if (path.isNotEmpty()) {
|
||||
path.last().appendChild(element)
|
||||
}
|
||||
|
||||
currentElement = currentNode as? Element ?: currentElement
|
||||
|
||||
if (currentNode is Element) {
|
||||
if (firstTag) {
|
||||
logReplace { "Setting root: $currentNode" }
|
||||
root = currentNode as Element
|
||||
firstTag = false
|
||||
}
|
||||
|
||||
currentElement?.clearKompEvents()
|
||||
|
||||
// if currentElement = checkbox make sure it's cleared
|
||||
(currentElement as? HTMLInputElement)?.checked = false
|
||||
|
||||
currentPosition.lastOrNull()?.setAttr?.clear()
|
||||
for (entry in tag.attributesEntries) {
|
||||
currentElement!!.setKompAttribute(entry.key, entry.value)
|
||||
currentPosition.lastOrNull()?.setAttr?.add(entry.key)
|
||||
}
|
||||
}
|
||||
|
||||
currentPosition.push(currentNode!!)
|
||||
path.add(element)
|
||||
}
|
||||
|
||||
private fun checkTag(source: String, tag: Tag) {
|
||||
check(currentElement != null) {
|
||||
js("debugger;")
|
||||
"No current tag ($source)"
|
||||
}
|
||||
check(currentElement?.tagName.equals(tag.tagName, ignoreCase = true)) {
|
||||
js("debugger;")
|
||||
"Wrong current tag ($source), got: ${tag.tagName} expected ${currentElement?.tagName}"
|
||||
override fun onTagAttributeChange(tag: Tag, attribute: String, value: String?) {
|
||||
when {
|
||||
path.isEmpty() -> throw IllegalStateException("No current tag")
|
||||
path.last().tagName.toLowerCase() != tag.tagName.toLowerCase() -> throw IllegalStateException("Wrong current tag")
|
||||
else -> path.last().let { node ->
|
||||
if (value == null) {
|
||||
node.removeAttribute(attribute)
|
||||
} else {
|
||||
node.setAttribute(attribute, value)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
override fun onTagAttributeChange(
|
||||
tag: Tag,
|
||||
attribute: String,
|
||||
value: String?
|
||||
) {
|
||||
logReplace { "onTagAttributeChange, ${tag.tagName} [$attribute, $value]" }
|
||||
|
||||
if (Komponent.enableAssertions) {
|
||||
checkTag("onTagAttributeChange", tag)
|
||||
override fun onTagEvent(tag: Tag, event: String, value: (Event) -> Unit) {
|
||||
when {
|
||||
path.isEmpty() -> throw IllegalStateException("No current tag")
|
||||
path.last().tagName.toLowerCase() != tag.tagName.toLowerCase() -> throw IllegalStateException("Wrong current tag")
|
||||
else -> path.last().setEvent(event, value)
|
||||
}
|
||||
|
||||
currentElement?.setKompAttribute(attribute, value)
|
||||
if (value == null || value.isEmpty()) {
|
||||
currentPosition.currentPosition()?.setAttr?.remove(attribute)
|
||||
} else {
|
||||
currentPosition.currentPosition()?.setAttr?.add(attribute)
|
||||
}
|
||||
}
|
||||
|
||||
override fun onTagEvent(
|
||||
tag: Tag,
|
||||
event: String,
|
||||
value: (kotlinx.html.org.w3c.dom.events.Event) -> Unit
|
||||
) {
|
||||
logReplace { "onTagEvent, ${tag.tagName} [$event, $value]" }
|
||||
|
||||
if (Komponent.enableAssertions) {
|
||||
checkTag("onTagEvent", tag)
|
||||
}
|
||||
|
||||
currentElement?.setKompEvent(event.lowercase(), value.asDynamic())
|
||||
}
|
||||
|
||||
override fun onTagEnd(tag: Tag) {
|
||||
logReplace {
|
||||
"onTagEnd, [${tag.tagName}, ${tag.namespace}], currentPosition: $currentPosition"
|
||||
var hash = 0
|
||||
if (path.isEmpty() || path.last().tagName.toLowerCase() != tag.tagName.toLowerCase()) {
|
||||
throw IllegalStateException("We haven't entered tag ${tag.tagName} but trying to leave")
|
||||
}
|
||||
|
||||
if (exceptionThrown) {
|
||||
return
|
||||
}
|
||||
val element = path.last()
|
||||
|
||||
while (currentPosition.currentElement() != null) {
|
||||
currentPosition.currentElement()?.let {
|
||||
it.parentElement?.removeChild(it)
|
||||
}
|
||||
}
|
||||
|
||||
if (Komponent.enableAssertions) {
|
||||
checkTag("onTagEnd", tag)
|
||||
}
|
||||
|
||||
if (currentElement != null) {
|
||||
val setAttrs: Set<String> = currentPosition.currentPosition()?.setAttr ?: setOf()
|
||||
|
||||
// remove attributes that where not set
|
||||
val element = currentElement
|
||||
if (element?.hasAttributes() == true) {
|
||||
for (index in 0 until element.attributes.length) {
|
||||
val attribute = element.attributes[index]
|
||||
if (attribute?.name != null) {
|
||||
val attr = attribute.name
|
||||
|
||||
if (
|
||||
!setAttrs.contains(attr) &&
|
||||
attr != "style"
|
||||
) {
|
||||
element.setKompAttribute(attr, null)
|
||||
}
|
||||
}
|
||||
if (Komponent.updateStrategy == UpdateStrategy.DOM_DIFF) {
|
||||
for (index in 0 until element.childNodes.length) {
|
||||
val child = element.childNodes[index]
|
||||
if (child is HTMLElement) {
|
||||
hash = hash * 37 + child.getKompHash()
|
||||
} else {
|
||||
hash = hash * 37 + (child?.textContent?.hashCode() ?: 0)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
currentPosition.pop()
|
||||
for ((key, value) in tag.attributesEntries) {
|
||||
if (key == "class") {
|
||||
val classes = value.split(Regex("\\s+"))
|
||||
val classNames = StringBuilder()
|
||||
|
||||
currentNode = currentPosition.currentElement()
|
||||
currentElement = currentNode as? Element ?: currentElement
|
||||
for (cls in classes) {
|
||||
val cssStyle = komponent.declaredStyles[cls]
|
||||
|
||||
currentPosition.nextElement()
|
||||
if (cssStyle != null) {
|
||||
if (Komponent.updateStrategy == UpdateStrategy.DOM_DIFF) {
|
||||
hash = hash * 37 + cssStyle.hashCode()
|
||||
}
|
||||
|
||||
currentElement = currentElement?.parentElement as? HTMLElement
|
||||
if (cls.endsWith(":hover")) {
|
||||
val oldOnMouseOver = element.onmouseover
|
||||
val oldOnMouseOut = element.onmouseout
|
||||
|
||||
//logReplace"onTagEnd, popped: $currentElement")
|
||||
element.onmouseover = {
|
||||
element.setStyles(cssStyle)
|
||||
|
||||
oldOnMouseOver?.invoke(it)
|
||||
}
|
||||
element.onmouseout = {
|
||||
cls.split(':').firstOrNull()?.let {
|
||||
komponent.declaredStyles[it]?.let { cssStyle ->
|
||||
element.setStyles(cssStyle)
|
||||
}
|
||||
}
|
||||
|
||||
oldOnMouseOut?.invoke(it)
|
||||
}
|
||||
} else {
|
||||
element.setStyles(cssStyle)
|
||||
}
|
||||
} else {
|
||||
if (Komponent.updateStrategy == UpdateStrategy.DOM_DIFF) {
|
||||
hash = hash * 37 + cls.hashCode()
|
||||
}
|
||||
|
||||
classNames.append(cls)
|
||||
classNames.append(" ")
|
||||
}
|
||||
}
|
||||
|
||||
element.className = classNames.toString()
|
||||
|
||||
if (Komponent.updateStrategy == UpdateStrategy.DOM_DIFF) {
|
||||
val key_value = "${key}-${classNames}"
|
||||
hash = hash * 37 + key_value.hashCode()
|
||||
}
|
||||
} else {
|
||||
element.setAttribute(key, value)
|
||||
|
||||
if (Komponent.updateStrategy == UpdateStrategy.DOM_DIFF) {
|
||||
val key_value = "${key}-${value}"
|
||||
hash = hash * 37 + key_value.hashCode()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
if (Komponent.updateStrategy == UpdateStrategy.DOM_DIFF) {
|
||||
element.setKompHash(hash)
|
||||
//element.setAttribute(DiffPatch.HASH_ATTRIBUTE, hash.toString(16))
|
||||
}
|
||||
lastLeaved = path.removeAt(path.lastIndex)
|
||||
}
|
||||
|
||||
override fun onTagContent(content: CharSequence) {
|
||||
//logReplace"onTagContent, [$content]")
|
||||
|
||||
check(currentElement != null) {
|
||||
"No current DOM node"
|
||||
if (path.isEmpty()) {
|
||||
throw IllegalStateException("No current DOM node")
|
||||
}
|
||||
|
||||
//logReplace"Tag content: $content")
|
||||
if (
|
||||
currentElement?.nodeType != Node.TEXT_NODE ||
|
||||
currentElement?.textContent != content.toString()
|
||||
) {
|
||||
currentElement?.textContent = content.toString()
|
||||
}
|
||||
|
||||
currentPosition.nextElement()
|
||||
path.last().appendChild(document.createTextNode(content.toString()))
|
||||
}
|
||||
|
||||
override fun onTagContentEntity(entity: Entities) {
|
||||
//logReplace"onTagContentEntity, [${entity.text}]")
|
||||
|
||||
check(currentElement != null) {
|
||||
"No current DOM node"
|
||||
if (path.isEmpty()) {
|
||||
throw IllegalStateException("No current DOM node")
|
||||
}
|
||||
|
||||
val s = document.createElement("span") as HTMLSpanElement
|
||||
// stupid hack as browsers don't support createEntityReference
|
||||
val s = document.createElement("span") as HTMLElement
|
||||
s.innerHTML = entity.text
|
||||
currentPosition.replace(
|
||||
s.childNodes.asList().firstOrNull() ?: document.createTextNode(entity.text)
|
||||
)
|
||||
currentPosition.nextElement()
|
||||
path.last().appendChild(s.childNodes.asList().first { it.nodeType == Node.TEXT_NODE })
|
||||
|
||||
// other solution would be
|
||||
// pathLast().innerHTML += entity.text
|
||||
}
|
||||
|
||||
override fun append(node: Node) {
|
||||
path.last().appendChild(node)
|
||||
}
|
||||
|
||||
override fun onTagContentUnsafe(block: Unsafe.() -> Unit) {
|
||||
with(DefaultUnsafe()) {
|
||||
block()
|
||||
|
||||
val textContent = toString()
|
||||
|
||||
//logReplace"onTagContentUnsafe, [$textContent]")
|
||||
|
||||
var namespace: String? = null
|
||||
|
||||
if (currentPosition.currentParent().nodeType == 1.toShort()) {
|
||||
val element = currentPosition.currentParent() as Element
|
||||
|
||||
namespace = when (Komponent.unsafeMode) {
|
||||
UnsafeMode.UNSAFE_ALLOWED -> {
|
||||
element.namespaceURI
|
||||
}
|
||||
UnsafeMode.UNSAFE_SVG_ONLY -> {
|
||||
if (element.namespaceURI == "http://www.w3.org/2000/svg") {
|
||||
element.namespaceURI
|
||||
} else {
|
||||
null
|
||||
}
|
||||
}
|
||||
else -> {
|
||||
null
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//logReplace"onTagContentUnsafe, namespace: [$namespace]")
|
||||
|
||||
if (Komponent.unsafeMode == UnsafeMode.UNSAFE_ALLOWED ||
|
||||
(
|
||||
Komponent.unsafeMode == UnsafeMode.UNSAFE_SVG_ONLY &&
|
||||
namespace == "http://www.w3.org/2000/svg"
|
||||
)
|
||||
) {
|
||||
if (currentElement?.innerHTML != textContent) {
|
||||
currentElement?.innerHTML += textContent
|
||||
}
|
||||
} else if (currentElement?.textContent != textContent) {
|
||||
currentElement?.textContent = textContent
|
||||
}
|
||||
|
||||
currentPosition.nextElement()
|
||||
path.last().innerHTML += toString()
|
||||
}
|
||||
}
|
||||
|
||||
override fun onTagComment(content: CharSequence) {
|
||||
//logReplace"onTagComment, [$content]")
|
||||
|
||||
check(currentElement != null) {
|
||||
"No current DOM node"
|
||||
if (path.isEmpty()) {
|
||||
throw IllegalStateException("No current DOM node")
|
||||
}
|
||||
currentElement?.appendChild(
|
||||
document.createComment(content.toString())
|
||||
)
|
||||
|
||||
currentPosition.nextElement()
|
||||
path.last().appendChild(document.createComment(content.toString()))
|
||||
}
|
||||
|
||||
fun onTagError(tag: Tag, exception: Throwable) {
|
||||
exceptionThrown = true
|
||||
override fun finalize(): HTMLElement = lastLeaved?.asR() ?: throw IllegalStateException("We can't finalize as there was no tags")
|
||||
|
||||
if (exception !is KomponentException) {
|
||||
val position = mutableListOf<Element>()
|
||||
var ce = currentElement
|
||||
while (ce != null) {
|
||||
position.add(ce)
|
||||
ce = ce.parentElement
|
||||
}
|
||||
val builder = StringBuilder()
|
||||
for (element in position.reversed()) {
|
||||
builder.append("> ")
|
||||
builder.append(element.tagName)
|
||||
builder.append("[")
|
||||
builder.append(element.findElementIndex())
|
||||
builder.append("]")
|
||||
if (element.hasAttribute("class")) {
|
||||
builder.append("(")
|
||||
builder.append(element.getAttribute("class"))
|
||||
builder.append(")")
|
||||
}
|
||||
builder.append(" ")
|
||||
}
|
||||
|
||||
throw KomponentException(
|
||||
komponent,
|
||||
currentElement,
|
||||
tag,
|
||||
builder.toString(),
|
||||
exception.message ?: "error",
|
||||
exception
|
||||
)
|
||||
} else {
|
||||
throw exception
|
||||
}
|
||||
}
|
||||
|
||||
override fun finalize(): Element {
|
||||
//logReplace"finalize, currentPosition: $currentPosition")
|
||||
return root ?: throw IllegalStateException(
|
||||
"We can't finalize as there was no tags"
|
||||
)
|
||||
}
|
||||
@Suppress("UNCHECKED_CAST")
|
||||
private fun HTMLElement.asR(): HTMLElement = this.asDynamic()
|
||||
|
||||
companion object {
|
||||
fun create(content: HtmlBuilder.() -> Unit): Element {
|
||||
val container = document.createElement("div") as HTMLElement
|
||||
val consumer = HtmlBuilder(null, container)
|
||||
fun create(content: HtmlBuilder.() -> Unit): HTMLElement {
|
||||
val consumer = HtmlBuilder(DummyKomponent(), document)
|
||||
content.invoke(consumer)
|
||||
return consumer.root ?: error("No root element found after render!")
|
||||
return consumer.finalize()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,211 +1,170 @@
|
||||
package nl.astraeus.komp
|
||||
|
||||
import kotlinx.browser.window
|
||||
import kotlinx.html.FlowOrMetaDataOrPhrasingContent
|
||||
import org.w3c.dom.Element
|
||||
import org.w3c.dom.HTMLDivElement
|
||||
import org.w3c.dom.HTMLElement
|
||||
import org.w3c.dom.get
|
||||
import org.w3c.dom.Node
|
||||
import org.w3c.dom.css.CSSStyleDeclaration
|
||||
import kotlinx.browser.document
|
||||
import kotlinx.browser.window
|
||||
import kotlinx.html.div
|
||||
import kotlin.reflect.KProperty
|
||||
|
||||
private var currentKomponent: Komponent? = null
|
||||
const val KOMP_KOMPONENT = "komp-komponent"
|
||||
|
||||
fun FlowOrMetaDataOrPhrasingContent.currentKomponent(): Komponent =
|
||||
currentKomponent ?: error("No current komponent defined! Only call from render code!")
|
||||
typealias CssStyle = CSSStyleDeclaration.() -> Unit
|
||||
|
||||
enum class UnsafeMode {
|
||||
UNSAFE_ALLOWED,
|
||||
UNSAFE_DISABLED,
|
||||
UNSAFE_SVG_ONLY
|
||||
class StateDelegate<T>(
|
||||
val komponent: Komponent,
|
||||
initialValue: T
|
||||
) {
|
||||
var value: T = initialValue
|
||||
|
||||
operator fun getValue(thisRef: Any?, property: KProperty<*>): T {
|
||||
return value
|
||||
}
|
||||
|
||||
operator fun setValue(thisRef: Any?, property: KProperty<*>, value: T) {
|
||||
if (this.value?.equals(value) != true) {
|
||||
this.value = value
|
||||
komponent.requestUpdate()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var Element.memoizeHash: String?
|
||||
get() {
|
||||
return getAttribute("memoize-hash")
|
||||
}
|
||||
set(value) {
|
||||
if (value != null) {
|
||||
setAttribute("memoize-hash", value.toString())
|
||||
inline fun <reified T> Komponent.state(initialValue: T): StateDelegate<T> = StateDelegate(this, initialValue)
|
||||
|
||||
fun HtmlConsumer.include(component: Komponent) {
|
||||
if (Komponent.updateStrategy == UpdateStrategy.REPLACE) {
|
||||
if (component.element != null) {
|
||||
component.update()
|
||||
} else {
|
||||
removeAttribute("memoize-hash")
|
||||
component.refresh()
|
||||
}
|
||||
|
||||
component.element?.also {
|
||||
append(it)
|
||||
}
|
||||
} else {
|
||||
append(component.create())
|
||||
}
|
||||
}
|
||||
|
||||
class DummyKomponent: Komponent() {
|
||||
override fun HtmlBuilder.render() {
|
||||
div {
|
||||
+ "dummy"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
enum class UpdateStrategy {
|
||||
REPLACE,
|
||||
DOM_DIFF
|
||||
}
|
||||
|
||||
abstract class Komponent {
|
||||
val createIndex = getNextCreateIndex()
|
||||
private var createIndex = getNextCreateIndex()
|
||||
private var dirty: Boolean = true
|
||||
|
||||
var element: Element? = null
|
||||
var element: Node? = null
|
||||
val declaredStyles: MutableMap<String, CSSStyleDeclaration> = HashMap()
|
||||
|
||||
open fun create(parent: Element, childIndex: Int? = null) {
|
||||
onBeforeUpdate()
|
||||
val builder = HtmlBuilder(
|
||||
this,
|
||||
parent,
|
||||
childIndex ?: parent.childNodes.length
|
||||
)
|
||||
open fun create(): HTMLElement {
|
||||
val consumer = HtmlBuilder(this, document)
|
||||
consumer.render()
|
||||
val result = consumer.finalize()
|
||||
|
||||
try {
|
||||
currentKomponent = this
|
||||
builder.render()
|
||||
} catch(e: KomponentException) {
|
||||
errorHandler(e)
|
||||
} finally {
|
||||
currentKomponent = null
|
||||
if (result.id.isBlank()) {
|
||||
result.id = "komp_${createIndex}"
|
||||
}
|
||||
|
||||
element = builder.root
|
||||
updateMemoizeHash()
|
||||
onAfterUpdate()
|
||||
}
|
||||
element = result
|
||||
element.asDynamic()[KOMP_KOMPONENT] = this
|
||||
|
||||
fun memoizeChanged() = element?.memoizeHash == null || element?.memoizeHash != fullMemoizeHash()
|
||||
dirty = false
|
||||
|
||||
fun updateMemoizeHash() {
|
||||
element?.memoizeHash = fullMemoizeHash()
|
||||
}
|
||||
|
||||
private fun fullMemoizeHash(): String? {
|
||||
val generated = generateMemoizeHash()
|
||||
|
||||
return if (generated != null) {
|
||||
"${this::class.simpleName}:${generateMemoizeHash()}"
|
||||
} else {
|
||||
null
|
||||
}
|
||||
return result
|
||||
}
|
||||
|
||||
abstract fun HtmlBuilder.render()
|
||||
|
||||
/**
|
||||
* This method is called after the Komponent is updated
|
||||
*
|
||||
* note: it's also called at first render
|
||||
*/
|
||||
open fun onAfterUpdate() {}
|
||||
|
||||
/**
|
||||
* This method is called before the Komponent is updated
|
||||
* and before memoizeHash is checked
|
||||
*
|
||||
* note: it's also called at first render
|
||||
*/
|
||||
open fun onBeforeUpdate() {}
|
||||
|
||||
fun requestUpdate() {
|
||||
dirty = true
|
||||
scheduleForUpdate(this)
|
||||
}
|
||||
|
||||
/**
|
||||
* Request an immediate update of this Komponent
|
||||
*
|
||||
* This will run immediately, make sure Komponents are not rendered multiple times
|
||||
* Any scheduled updates will be run as well
|
||||
*/
|
||||
fun requestImmediateUpdate() {
|
||||
dirty = true
|
||||
runUpdateImmediately(this)
|
||||
}
|
||||
|
||||
/**
|
||||
* This function can be overwritten if you know how to update the Komponent yourself
|
||||
*
|
||||
* HTMLBuilder.render() is called 1st time the component is rendered, after that this
|
||||
* method will be called
|
||||
*
|
||||
* @deprecated
|
||||
*/
|
||||
@Deprecated(
|
||||
"Deprecated to avoid confusing with requestUpdate, use renderUpdate instead",
|
||||
ReplaceWith("renderUpdate"),
|
||||
level = DeprecationLevel.WARNING
|
||||
)
|
||||
protected fun update() {
|
||||
refresh()
|
||||
}
|
||||
|
||||
/**
|
||||
* This function can be overwritten if you know how to update the Komponent yourself
|
||||
*
|
||||
* HTMLBuilder.render() is called 1st time the component is rendered, after that this
|
||||
* method will be called
|
||||
*/
|
||||
open fun renderUpdate() {
|
||||
refresh()
|
||||
}
|
||||
|
||||
/**
|
||||
* If this function returns a value it will be stored and on the next render it will be compared.
|
||||
*
|
||||
* The render will only happen if the hash is not null and has changed
|
||||
*/
|
||||
open fun generateMemoizeHash(): Int? = null
|
||||
|
||||
private fun refresh() {
|
||||
val currentElement = element
|
||||
|
||||
check(currentElement != null) {
|
||||
error("element is null")
|
||||
open fun style(className: String, vararg imports: CssStyle, block: CssStyle = {}) {
|
||||
val style = (document.createElement("div") as HTMLDivElement).style
|
||||
for (imp in imports) {
|
||||
imp(style)
|
||||
}
|
||||
block(style)
|
||||
declaredStyles[className] = style
|
||||
}
|
||||
|
||||
val parent = currentElement.parentElement as? HTMLElement ?: error("parent is null!?")
|
||||
var childIndex = 0
|
||||
for (index in 0 until parent.childNodes.length) {
|
||||
if (parent.childNodes[index] == currentElement) {
|
||||
childIndex = index
|
||||
open fun update() {
|
||||
refresh()
|
||||
}
|
||||
|
||||
internal fun refresh() {
|
||||
val oldElement = element
|
||||
|
||||
if (logRenderEvent) {
|
||||
console.log("Rendering", this)
|
||||
}
|
||||
val newElement = create()
|
||||
|
||||
if (oldElement != null) {
|
||||
element = if (updateStrategy == UpdateStrategy.REPLACE) {
|
||||
if (logReplaceEvent) {
|
||||
console.log("Replacing", oldElement, newElement)
|
||||
}
|
||||
oldElement.parentNode?.replaceChild(newElement, oldElement)
|
||||
newElement
|
||||
} else {
|
||||
if (logReplaceEvent) {
|
||||
console.log("DomDiffing", oldElement, newElement)
|
||||
}
|
||||
DiffPatch.updateNode(oldElement, newElement)
|
||||
}
|
||||
}
|
||||
val builder = HtmlBuilder(this, parent, childIndex)
|
||||
|
||||
try {
|
||||
currentKomponent = this
|
||||
builder.render()
|
||||
} catch(e: KomponentException) {
|
||||
errorHandler(e)
|
||||
} finally {
|
||||
currentKomponent = null
|
||||
}
|
||||
|
||||
element = builder.root
|
||||
dirty = false
|
||||
}
|
||||
|
||||
override fun toString(): String {
|
||||
return "${this::class.simpleName}"
|
||||
@JsName("remove")
|
||||
fun remove() {
|
||||
check(updateStrategy == UpdateStrategy.REPLACE) {
|
||||
"remote only works with UpdateStrategy.REPLACE"
|
||||
}
|
||||
element?.let {
|
||||
val parent = it.parentElement ?: throw IllegalArgumentException("Element has no parent!?")
|
||||
|
||||
if (logReplaceEvent) {
|
||||
console.log("Remove", it)
|
||||
}
|
||||
|
||||
parent.removeChild(it)
|
||||
}
|
||||
}
|
||||
|
||||
companion object {
|
||||
private var nextCreateIndex: Int = 1
|
||||
private var updateCallback: Int? = null
|
||||
private var errorHandler: (KomponentException) -> Unit = { ke ->
|
||||
console.error("Render error in Komponent", ke)
|
||||
|
||||
ke.element?.innerHTML = """<div class="komponent-error">Render error!</div>"""
|
||||
|
||||
window.alert("""
|
||||
Error in Komponent '${ke.komponent}', ${ke.message}
|
||||
Tag: ${ke.tag.tagName}
|
||||
See console log for details
|
||||
Position: ${ke.position}""".trimIndent()
|
||||
)
|
||||
}
|
||||
private var scheduledForUpdate = mutableSetOf<Komponent>()
|
||||
private var interceptor: (Komponent, () -> Unit) -> Unit = { _, block -> block() }
|
||||
|
||||
var logRenderEvent = false
|
||||
var logReplaceEvent = false
|
||||
var enableAssertions = false
|
||||
var unsafeMode = UnsafeMode.UNSAFE_DISABLED
|
||||
var updateStrategy = UpdateStrategy.DOM_DIFF
|
||||
|
||||
fun create(parent: HTMLElement, component: Komponent) {
|
||||
component.create(parent)
|
||||
}
|
||||
fun create(parent: HTMLElement, component: Komponent, insertAsFirst: Boolean = false) {
|
||||
val element = component.create()
|
||||
|
||||
fun setErrorHandler(handler: (KomponentException) -> Unit) {
|
||||
errorHandler = handler
|
||||
}
|
||||
|
||||
fun setUpdateInterceptor(block: (Komponent, () -> Unit) -> Unit) {
|
||||
interceptor = block
|
||||
if (insertAsFirst && parent.childElementCount > 0) {
|
||||
parent.insertBefore(element, parent.firstChild)
|
||||
} else {
|
||||
parent.appendChild(element)
|
||||
}
|
||||
}
|
||||
|
||||
private fun getNextCreateIndex() = nextCreateIndex++
|
||||
@@ -220,11 +179,6 @@ abstract class Komponent {
|
||||
}
|
||||
}
|
||||
|
||||
private fun runUpdateImmediately(komponent: Komponent) {
|
||||
scheduledForUpdate.add(komponent)
|
||||
runUpdate()
|
||||
}
|
||||
|
||||
private fun runUpdate() {
|
||||
val todo = scheduledForUpdate.sortedBy { komponent -> komponent.createIndex }
|
||||
|
||||
@@ -233,31 +187,21 @@ abstract class Komponent {
|
||||
}
|
||||
|
||||
todo.forEach { next ->
|
||||
interceptor(next) {
|
||||
val element = next.element
|
||||
|
||||
if (element is HTMLElement) {
|
||||
val element = next.element
|
||||
console.log("update element", element)
|
||||
if (element is HTMLElement) {
|
||||
console.log("by id", document.getElementById(element.id))
|
||||
if (document.getElementById(element.id) != null) {
|
||||
if (next.dirty) {
|
||||
if (logRenderEvent) {
|
||||
console.log("Update dirty ${next.createIndex}")
|
||||
}
|
||||
val memoizeHash = next.generateMemoizeHash()
|
||||
|
||||
if (next.memoizeChanged()) {
|
||||
next.onBeforeUpdate()
|
||||
next.renderUpdate()
|
||||
next.updateMemoizeHash()
|
||||
next.onAfterUpdate()
|
||||
} else if (logRenderEvent) {
|
||||
console.log("Skipped render, memoizeHash is equal $next-[$memoizeHash]")
|
||||
}
|
||||
next.update()
|
||||
} else {
|
||||
if (logRenderEvent) {
|
||||
console.log("Skip ${next.createIndex}")
|
||||
}
|
||||
}
|
||||
} else {
|
||||
console.log("Komponent element is null", next, element)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,18 +0,0 @@
|
||||
package nl.astraeus.komp
|
||||
|
||||
import kotlinx.html.Tag
|
||||
import org.w3c.dom.Element
|
||||
|
||||
class KomponentException(
|
||||
val komponent: Komponent?,
|
||||
val element: Element?,
|
||||
val tag: Tag,
|
||||
val position: String,
|
||||
message: String,
|
||||
cause: Throwable
|
||||
) : RuntimeException(message, cause) {
|
||||
|
||||
override fun toString(): String {
|
||||
return "KompException(message='$message', tag='$tag', position='$position')"
|
||||
}
|
||||
}
|
||||
@@ -1,54 +0,0 @@
|
||||
package nl.astraeus.komp
|
||||
|
||||
inline fun <reified T> Komponent.mutableCollectionState(
|
||||
initialValue: MutableCollection<T>
|
||||
): MutableCollection<T> = MutableCollectionStateDelegate(
|
||||
this,
|
||||
initialValue
|
||||
)
|
||||
|
||||
class MutableCollectionStateDelegate<T>(
|
||||
val komponent: Komponent,
|
||||
val collection: MutableCollection<T>
|
||||
): MutableCollection<T> by collection {
|
||||
|
||||
override fun add(element: T): Boolean {
|
||||
komponent.requestUpdate()
|
||||
|
||||
return collection.add(element)
|
||||
}
|
||||
|
||||
override fun addAll(elements: Collection<T>): Boolean {
|
||||
komponent.requestUpdate()
|
||||
|
||||
return collection.addAll(elements)
|
||||
}
|
||||
|
||||
override fun clear() {
|
||||
komponent.requestUpdate()
|
||||
|
||||
collection.clear()
|
||||
}
|
||||
|
||||
// todo: return iterator wrapper to update at changes?
|
||||
//override fun iterator(): MutableIterator<T> = collection.iterator()
|
||||
|
||||
override fun remove(element: T): Boolean {
|
||||
komponent.requestUpdate()
|
||||
|
||||
return collection.remove(element)
|
||||
}
|
||||
|
||||
override fun removeAll(elements: Collection<T>): Boolean {
|
||||
komponent.requestUpdate()
|
||||
|
||||
return collection.removeAll(elements)
|
||||
}
|
||||
|
||||
override fun retainAll(elements: Collection<T>): Boolean {
|
||||
komponent.requestUpdate()
|
||||
|
||||
return collection.retainAll(elements)
|
||||
}
|
||||
|
||||
}
|
||||
@@ -1,56 +0,0 @@
|
||||
package nl.astraeus.komp
|
||||
|
||||
import kotlin.reflect.KProperty
|
||||
|
||||
interface Delegate<T> {
|
||||
|
||||
operator fun getValue(
|
||||
thisRef: Any?,
|
||||
property: KProperty<*>
|
||||
): T
|
||||
|
||||
operator fun setValue(
|
||||
thisRef: Any?,
|
||||
property: KProperty<*>,
|
||||
value: T
|
||||
)
|
||||
|
||||
}
|
||||
|
||||
open class StateDelegate<T>(
|
||||
val komponent: Komponent,
|
||||
initialValue: T
|
||||
) : Delegate<T> {
|
||||
private var value: T = initialValue
|
||||
|
||||
init {
|
||||
if (value is MutableCollection<*>) {
|
||||
error("Use mutableList to create a collection!")
|
||||
}
|
||||
}
|
||||
|
||||
override operator fun getValue(
|
||||
thisRef: Any?,
|
||||
property: KProperty<*>
|
||||
): T {
|
||||
return value
|
||||
}
|
||||
|
||||
override operator fun setValue(
|
||||
thisRef: Any?,
|
||||
property: KProperty<*>,
|
||||
value: T
|
||||
) {
|
||||
if (this.value?.equals(value) != true) {
|
||||
this.value = value
|
||||
komponent.requestUpdate()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
inline fun <reified T> Komponent.state(
|
||||
initialValue: T
|
||||
): Delegate<T> = StateDelegate(
|
||||
this,
|
||||
initialValue
|
||||
)
|
||||
@@ -1,244 +1,132 @@
|
||||
package nl.astraeus.komp
|
||||
|
||||
import kotlinx.browser.document
|
||||
import kotlinx.html.DIV
|
||||
import kotlinx.html.InputType
|
||||
import kotlinx.html.classes
|
||||
import kotlinx.html.div
|
||||
import kotlinx.html.i
|
||||
import kotlinx.html.id
|
||||
import kotlinx.html.input
|
||||
import kotlinx.html.*
|
||||
import kotlinx.html.js.onClickFunction
|
||||
import kotlinx.html.p
|
||||
import kotlinx.html.span
|
||||
import kotlinx.html.svg
|
||||
import kotlinx.html.table
|
||||
import kotlinx.html.td
|
||||
import kotlinx.html.tr
|
||||
import kotlinx.html.unsafe
|
||||
import org.w3c.dom.Element
|
||||
import org.w3c.dom.HTMLDivElement
|
||||
import org.w3c.dom.HTMLElement
|
||||
import org.w3c.dom.Node
|
||||
import org.w3c.dom.get
|
||||
import kotlin.test.Test
|
||||
import kotlin.test.assertTrue
|
||||
|
||||
class TestKomponent : Komponent() {
|
||||
override fun HtmlBuilder.render() {
|
||||
div {
|
||||
+"Test"
|
||||
}
|
||||
fun nodesEqual(node1: Node, node2: Node): Boolean {
|
||||
if (node1.childNodes.length != node1.childNodes.length) {
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
class Child1 : Komponent() {
|
||||
override fun HtmlBuilder.render() {
|
||||
div {
|
||||
+"Child 1"
|
||||
if (node1 is HTMLElement && node2 is HTMLElement) {
|
||||
if (node1.attributes.length != node2.attributes.length) {
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
for (index in 0 until node1.attributes.length) {
|
||||
node1.attributes[index]?.also { attr1 ->
|
||||
val attr2 = node2.getAttribute(attr1.name)
|
||||
|
||||
class Child2 : Komponent() {
|
||||
override fun HtmlBuilder.render() {
|
||||
div {
|
||||
id ="1234"
|
||||
+"Child 2"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
class SimpleKomponent : Komponent() {
|
||||
var hello = true
|
||||
var append = HtmlBuilder.create {
|
||||
p {
|
||||
+"Appended"
|
||||
}
|
||||
}
|
||||
|
||||
override fun HtmlBuilder.render() {
|
||||
div("div_class") {
|
||||
input(InputType.checkBox) {
|
||||
name = "helloInput"
|
||||
checked = hello
|
||||
}
|
||||
span {
|
||||
svg {
|
||||
unsafe {
|
||||
+"""
|
||||
<p bla>
|
||||
""".trimIndent()
|
||||
}
|
||||
if (attr1.value != attr2) {
|
||||
return false
|
||||
}
|
||||
if (hello) {
|
||||
div {
|
||||
+"Hello"
|
||||
}
|
||||
} else {
|
||||
span {
|
||||
+"Good bye"
|
||||
}
|
||||
}
|
||||
for (index in 0 until node1.childNodes.length) {
|
||||
node1.childNodes[index]?.also { child1 ->
|
||||
node2.childNodes[index]?.also { child2 ->
|
||||
if (!nodesEqual(child1, child2)) {
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
div {
|
||||
if (hello) {
|
||||
id = "123"
|
||||
+"div text"
|
||||
} else {
|
||||
+"div text goodbye"
|
||||
}
|
||||
|
||||
onClickFunction = if (hello) {
|
||||
{
|
||||
println("onClick")
|
||||
}
|
||||
} else {
|
||||
{
|
||||
println("onClick 2")
|
||||
}
|
||||
}
|
||||
}
|
||||
if (hello) {
|
||||
span {
|
||||
+"2nd span"
|
||||
}
|
||||
}
|
||||
//append(append)
|
||||
if (hello) {
|
||||
include(Child1())
|
||||
} else {
|
||||
include(Child2())
|
||||
}
|
||||
//append(append)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
class IncludeKomponent(
|
||||
var text: String = "My Text"
|
||||
) : Komponent() {
|
||||
|
||||
override fun generateMemoizeHash(): Int = text.hashCode()
|
||||
|
||||
override fun HtmlBuilder.render() {
|
||||
span {
|
||||
+text
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
class ReplaceKomponent : Komponent() {
|
||||
val includeKomponent = IncludeKomponent("Other text")
|
||||
var includeSpan = true
|
||||
|
||||
override fun generateMemoizeHash(): Int = includeSpan.hashCode() * 7 + includeKomponent.generateMemoizeHash()
|
||||
|
||||
override fun HtmlBuilder.render() {
|
||||
div {
|
||||
+"Child 2"
|
||||
|
||||
div {
|
||||
if (includeSpan) {
|
||||
for (index in 0 ..< 3) {
|
||||
extracted(index)
|
||||
}
|
||||
}
|
||||
|
||||
include(includeKomponent)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private fun HtmlBuilder.extracted(index: Int) {
|
||||
span {
|
||||
i("fas fa-eye") {
|
||||
+ ("span" + (index+1))
|
||||
}
|
||||
}
|
||||
}
|
||||
return true
|
||||
}
|
||||
|
||||
class TestUpdate {
|
||||
|
||||
@Test
|
||||
fun testUpdateWithEmpty() {
|
||||
val div = document.createElement("div") as HTMLDivElement
|
||||
val rk = ReplaceKomponent()
|
||||
|
||||
Komponent.logRenderEvent = true
|
||||
|
||||
Komponent.create(div, rk)
|
||||
|
||||
println("ReplaceKomponent: ${div.printTree()}")
|
||||
|
||||
rk.requestImmediateUpdate()
|
||||
|
||||
println("ReplaceKomponent: ${div.printTree()}")
|
||||
|
||||
rk.requestImmediateUpdate()
|
||||
|
||||
println("ReplaceKomponent: ${div.printTree()}")
|
||||
|
||||
rk.includeSpan = false
|
||||
rk.requestImmediateUpdate()
|
||||
|
||||
println("ReplaceKomponent: ${div.printTree()}")
|
||||
|
||||
rk.includeSpan = true
|
||||
rk.includeKomponent.text = "New Text"
|
||||
rk.requestImmediateUpdate()
|
||||
|
||||
println("ReplaceKomponent: ${div.printTree()}")
|
||||
}
|
||||
|
||||
@Test
|
||||
fun testSimpleKomponent() {
|
||||
val sk = SimpleKomponent()
|
||||
val div = document.createElement("div") as HTMLDivElement
|
||||
|
||||
Komponent.create(div, sk)
|
||||
|
||||
println("SimpleKomponent: ${div.printTree()}")
|
||||
|
||||
sk.hello = false
|
||||
sk.requestImmediateUpdate()
|
||||
|
||||
println("SimpleKomponent updated: ${div.printTree()}")
|
||||
}
|
||||
|
||||
@Test
|
||||
fun testCreate() {
|
||||
var elemTest: Element? = null
|
||||
val element = HtmlBuilder.create {
|
||||
div(classes = "div_class") {
|
||||
classes = classes + "bla'"
|
||||
id = "123"
|
||||
+"Test"
|
||||
|
||||
span("span_class") {
|
||||
+"Span"
|
||||
|
||||
elemTest = currentElement()
|
||||
}
|
||||
|
||||
table {
|
||||
tr {
|
||||
td {
|
||||
+"column 1"
|
||||
}
|
||||
td {
|
||||
+"column 2"
|
||||
fun testCompare1() {
|
||||
val dom1 = HtmlBuilder.create {
|
||||
div {
|
||||
div(classes = "bla") {
|
||||
span {
|
||||
+" Some Text "
|
||||
}
|
||||
table {
|
||||
tr {
|
||||
td {
|
||||
+"Table column"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
println("Element: ${element.printTree()}")
|
||||
println("divTst: ${elemTest?.printTree()}")
|
||||
println("span class: ${
|
||||
elemTest?.getAttributeNames()?.joinToString
|
||||
{ "," }
|
||||
}"
|
||||
)
|
||||
val dom2 = HtmlBuilder.create {
|
||||
div {
|
||||
span {
|
||||
id = "123"
|
||||
|
||||
+"New dom!"
|
||||
}
|
||||
input {
|
||||
value = "bla"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
DiffPatch.updateNode(dom1, dom2)
|
||||
|
||||
assertTrue(nodesEqual(dom1, dom2), "Updated dom not equal to original")
|
||||
}
|
||||
|
||||
@Test
|
||||
fun testCompare2() {
|
||||
val dom1 = HtmlBuilder.create {
|
||||
div {
|
||||
div(classes = "bla") {
|
||||
span {
|
||||
+" Some Text "
|
||||
}
|
||||
table {
|
||||
tr {
|
||||
th {
|
||||
+ "Header"
|
||||
}
|
||||
}
|
||||
tr {
|
||||
td {
|
||||
+"Table column"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
val dom2 = HtmlBuilder.create {
|
||||
div {
|
||||
div {
|
||||
span {
|
||||
+ "Other text"
|
||||
}
|
||||
}
|
||||
span {
|
||||
id = "123"
|
||||
|
||||
+"New dom!"
|
||||
}
|
||||
input {
|
||||
value = "bla"
|
||||
|
||||
onClickFunction = {
|
||||
println("Clickerdyclick!")
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Komponent.logReplaceEvent = true
|
||||
DiffPatch.updateNode(dom1, dom2)
|
||||
|
||||
assertTrue(nodesEqual(dom1, dom2), "Updated dom not equal to original")
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user