rnentjes/komp-todo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add readme, update dependencies

Browse Source
This commit is contained in:
rnentjes
2017-09-03 13:25:47 +02:00
parent 584874a7ac
commit 573c22c2bc
11 changed files with 256 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
.idea/libraries/Gradle__nl_astraeus_komp_0_0_4_SNAPSHOT.xml generated
View File

@@ -1,9 +0,0 @@
<component name="libraryTable">
<library name="Gradle: nl.astraeus:komp:0.0.4-SNAPSHOT">
<CLASSES>
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/nl.astraeus/komp/0.0.4-SNAPSHOT/b88123c896040e776bd78687c4f6f9b531c65535/komp-0.0.4-SNAPSHOT.jar!/" />
</CLASSES>
<JAVADOC />
<SOURCES />
</library>
</component>

9
.idea/libraries/Gradle__nl_astraeus_komp_0_0_5_SNAPSHOT.xml generated Normal file
View File

@@ -0,0 +1,9 @@
<component name="libraryTable">
<library name="Gradle: nl.astraeus:komp:0.0.5-SNAPSHOT" type="kotlin.js">
<CLASSES>
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/nl.astraeus/komp/0.0.5-SNAPSHOT/f8a9999971b427dd21fb9bf55333d9b39a905b6d/komp-0.0.5-SNAPSHOT.jar!/" />
</CLASSES>
<JAVADOC />
<SOURCES />
</library>
</component>

2
.idea/libraries/Gradle__org_jetbrains_kotlin_kotlin_stdlib_common_1_1_0.xml generated
View File

@@ -1,5 +1,5 @@
<component name="libraryTable">
<library name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-common:1.1.0">
<library name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-common:1.1.0" type="kotlin.common">
<CLASSES>
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-common/1.1.0/3acbcd23b3d8e85d4429146690ac072bb526c1ac/kotlin-stdlib-common-1.1.0.jar!/" />
</CLASSES>

6
.idea/libraries/Gradle__org_jetbrains_kotlin_kotlin_stdlib_js_1_1_4_eap_11.xml → .idea/libraries/Gradle__org_jetbrains_kotlin_kotlin_stdlib_js_1_1_4.xml generated
View File

@@ -1,11 +1,11 @@
<component name="libraryTable">
<library name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.1.4-eap-11">
<library name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.1.4" type="kotlin.js">
<CLASSES>
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-js/1.1.4-eap-11/fce562fb9acf253e2a7f6118f9545919e450d03e/kotlin-stdlib-js-1.1.4-eap-11.jar!/" />
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-js/1.1.4/55f39a77bc0893576d48e1cc4065e41d6feb9233/kotlin-stdlib-js-1.1.4.jar!/" />
</CLASSES>
<JAVADOC />
<SOURCES>
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-js/1.1.4-eap-11/fbbb8562bff1e98fc3c5e52185e0bc98c3fd5648/kotlin-stdlib-js-1.1.4-eap-11-sources.jar!/" />
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-js/1.1.4/cac83db2042ebed585ce6cf418079aea2a14ade0/kotlin-stdlib-js-1.1.4-sources.jar!/" />
</SOURCES>
</library>
</component>

2
.idea/libraries/Gradle__org_jetbrains_kotlinx_kotlinx_html_common_0_6_2.xml generated
View File

@@ -1,5 +1,5 @@
<component name="libraryTable">
<library name="Gradle: org.jetbrains.kotlinx:kotlinx-html-common:0.6.2">
<library name="Gradle: org.jetbrains.kotlinx:kotlinx-html-common:0.6.2" type="kotlin.common">
<CLASSES>
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlinx/kotlinx-html-common/0.6.2/3329a310cedec85a9bf175c9da8bb0dadedaba21/kotlinx-html-common-0.6.2.jar!/" />
</CLASSES>

2
.idea/libraries/Gradle__org_jetbrains_kotlinx_kotlinx_html_js_0_6_2.xml generated
View File

@@ -1,5 +1,5 @@
<component name="libraryTable">
<library name="Gradle: org.jetbrains.kotlinx:kotlinx-html-js:0.6.2">
<library name="Gradle: org.jetbrains.kotlinx:kotlinx-html-js:0.6.2" type="kotlin.js">
<CLASSES>
<root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlinx/kotlinx-html-js/0.6.2/eba3a3fb7eb7ec26f4c4aece64b210d9e202d0df/kotlinx-html-js-0.6.2.jar!/" />
</CLASSES>

11
.idea/modules/komp-todo_main.iml generated
View File

@@ -10,6 +10,7 @@
<option name="outputFile" value="$MODULE_DIR$/../../web/js/kotlin/komp-todo.js" />
<option name="noStdlib" value="true" />
<option name="sourceMap" value="true" />
<option name="sourceMapEmbedSources" value="inlining" />
<option name="metaInfo" value="true" />
<option name="target" value="v5" />
<option name="main" value="call" />
@@ -21,11 +22,7 @@
<option name="pluginClasspaths">
<array />
</option>
<option name="freeArgs">
<list>
<option value="inlining" />
</list>
</option>
<option name="verbose" value="true" />
<option name="suppressWarnings" value="true" />
<option name="coroutinesWarn" value="true" />
</compilerArguments>
@@ -42,8 +39,8 @@
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
<orderEntry type="library" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.1.4-eap-11" level="project" />
<orderEntry type="library" name="Gradle: nl.astraeus:komp:0.0.4-SNAPSHOT" level="project" />
<orderEntry type="library" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.1.4" level="project" />
<orderEntry type="library" name="Gradle: nl.astraeus:komp:0.0.5-SNAPSHOT" level="project" />
<orderEntry type="library" name="Gradle: org.jetbrains.kotlinx:kotlinx-html-js:0.6.2" level="project" />
<orderEntry type="library" name="Gradle: org.jetbrains.kotlinx:kotlinx-html-common:0.6.2" level="project" />
<orderEntry type="library" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-common:1.1.0" level="project" />

10
.idea/modules/komp-todo_test.iml generated
View File

@@ -7,6 +7,7 @@
<compilerArguments>
<option name="outputFile" value="$MODULE_DIR$/../../build/classes/test/komp-todo_test.js" />
<option name="noStdlib" value="true" />
<option name="sourceMapEmbedSources" value="inlining" />
<option name="metaInfo" value="true" />
<option name="target" value="v5" />
<option name="main" value="call" />
@@ -18,11 +19,6 @@
<option name="pluginClasspaths">
<array />
</option>
<option name="freeArgs">
<list>
<option value="inlining" />
</list>
</option>
<option name="coroutinesWarn" value="true" />
</compilerArguments>
</configuration>
@@ -39,8 +35,8 @@
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
<orderEntry type="module" module-name="komp-todo_main" />
<orderEntry type="library" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.1.4-eap-11" level="project" />
<orderEntry type="library" name="Gradle: nl.astraeus:komp:0.0.4-SNAPSHOT" level="project" />
<orderEntry type="library" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.1.4" level="project" />
<orderEntry type="library" name="Gradle: nl.astraeus:komp:0.0.5-SNAPSHOT" level="project" />
<orderEntry type="library" name="Gradle: org.jetbrains.kotlinx:kotlinx-html-js:0.6.2" level="project" />
<orderEntry type="library" name="Gradle: org.jetbrains.kotlinx:kotlinx-html-common:0.6.2" level="project" />
<orderEntry type="library" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-common:1.1.0" level="project" />

6
build.gradle
View File

@@ -2,7 +2,7 @@ group 'nl.astraeus'
version '0.0.1-SNAPSHOT'
buildscript {
ext.kotlin_version = '1.1.4-eap-11'
ext.kotlin_version = '1.1.4'
repositories {
maven {
@@ -21,7 +21,7 @@ buildscript {
allprojects {
ext {
kotlin_version = '1.1.4-eap-11'
kotlin_version = '1.1.4'
}
}
@@ -37,7 +37,7 @@ repositories {
dependencies {
compile "org.jetbrains.kotlin:kotlin-stdlib-js:$kotlin_version"
compile "nl.astraeus:komp:0.0.4-SNAPSHOT"
compile "nl.astraeus:komp:0.0.5-SNAPSHOT"
}
compileKotlin2Js {

231
readme.md
View File

@@ -1 +1,230 @@
https://github.com/tastejs/todomvc/
An example on how to build a single page app with Kotlin (javascript) using static html builders.
Runing example: [komp-todo](http://todo.astraeus.nl/)
Compare it with other js frameworks: [https://github.com/tastejs/todomvc/](https://github.com/tastejs/todomvc/)
Dependencies:
* [kotlinx-html-js](https://github.com/Kotlin/kotlinx.html)
* [komponent](https://github.com/rnentjes/komponent)
Complete source:
```kotlin
package nl.astraeus.komp.todo
import kotlinx.html.*
import kotlinx.html.js.*
import nl.astraeus.komp.Komponent
import org.w3c.dom.HTMLElement
import org.w3c.dom.HTMLInputElement
import org.w3c.dom.events.Event
import org.w3c.dom.events.KeyboardEvent
import kotlin.browser.document
import kotlin.js.Date
/**
* https://github.com/tastejs/todomvc/
*/
class Todo(
val dataId: String,
var title: String,
var completed: Boolean = false,
var editing: Boolean = false
)
enum class Selection(val title: String) {
ALL("All"),
ACTIVE("Active"),
COMPLETED("Completed")
}
class TodoApp: Komponent() {
val todoList: MutableList<Todo> = ArrayList()
var selected: Selection = Selection.ALL
fun addTodo(e: Event) {
val target = e.target
if (target is HTMLInputElement) {
todoList.add(Todo("${Date().getTime()}", target.value))
refresh()
}
}
fun editTodo(e: Event, todo: Todo) {
val target = e.target
if (target is HTMLInputElement) {
todo.title = target.value
todo.editing = false
refresh()
}
}
fun destroyTodo(todo: Todo) {
todoList.remove(todo)
refresh()
}
fun selectSelection(selection: Selection) {
selected = selection
refresh()
}
fun clearCompleted() {
for (todo in ArrayList(todoList)) {
if (todo.completed) {
todoList.remove(todo)
}
}
refresh()
}
fun todoClicked(todo: Todo) {
todo.completed = !todo.completed
refresh()
}
fun getItemsLeft(): Int {
var result = 0
for (todo in todoList) {
if (!todo.completed) {
result++
}
}
return result
}
fun setEditing(editTodo: Todo) {
for (todo in todoList) {
todo.editing = todo == editTodo
}
refresh()
}
override fun refresh() {
super.refresh()
val inputBox = document.getElementById("todo_input")
if (inputBox is HTMLInputElement) {
inputBox.focus()
}
}
override fun render(consumer: TagConsumer<HTMLElement>) = consumer.section(classes = "todoapp") {
header(classes = "header") {
h1 { + "todos" }
input(classes = "new-todo") {
id = "todo_input"
placeholder = "What needs to be done?"
autoFocus = true
onKeyPressFunction = { e ->
if (e is KeyboardEvent && e.keyCode == 13) {
addTodo(e)
}
}
}
}
section(classes = "main") {
input(classes = "toggle-all") {
type = InputType.checkBox
}
label {
for_ = "toggle-all"
+ "Mark all as complete"
}
ul(classes = "todo-list") {
for (todo in todoList) {
if (selected == Selection.ALL ||
(todo.completed && selected == Selection.COMPLETED) ||
(!todo.completed && selected == Selection.ACTIVE)) {
li {
if (todo.editing) {
classes += "editing"
input(classes = "edit") {
value = todo.title
onKeyPressFunction = { e ->
if (e is KeyboardEvent && e.keyCode == 13) {
editTodo(e, todo)
}
}
}
} else {
if (todo.completed) {
classes += "completed"
}
attributes["data-id"] = todo.dataId
div(classes = "view") {
input(classes = "toggle") {
type = InputType.checkBox
checked = todo.completed
onClickFunction = {
todoClicked(todo)
}
}
label(classes = "todo-content") {
+todo.title
onDoubleClickFunction = {
setEditing(todo)
}
}
button(classes = "destroy") {
onClickFunction = {
destroyTodo(todo)
}
}
}
}
}
}
}
}
}
footer(classes = "footer") {
span(classes = "todo-count") {
strong { + "${getItemsLeft()}" }
+ " item left"
}
ul(classes = "filters") {
for (selection in Selection.values())
li {
a {
if (selection == selected) { classes += "selected" }
href = "#"
+ selection.title
onClickFunction = {
selectSelection(selection)
}
}
}
}
button(classes = "clear-completed") {
+ "Clear completed"
onClickFunction = {
clearCompleted()
}
}
}
}
}
fun main(args: Array<String>) {
Komponent.create(document.body!!, TodoApp(), true)
}
```

2
web/index.html
View File

@@ -14,4 +14,4 @@
<script src="js/generated/todo.all.min.js" ></script>
</body>
</html>
</html>