From 5f7f2d681a44483ea0c48fd953504d21f1c02e24 Mon Sep 17 00:00:00 2001 From: rnentjes Date: Sun, 2 Apr 2017 17:01:29 +0200 Subject: [PATCH] Todos --- .gitignore | 2 + .idea/compiler.xml | 9 + .idea/gradle.xml | 18 + ...radle__nl_astraeus_komp_0_0_1_SNAPSHOT.xml | 9 + ...ains_kotlin_kotlin_stdlib_common_1_1_0.xml | 11 + ...etbrains_kotlin_kotlin_stdlib_js_1_1_1.xml | 11 + ...ains_kotlinx_kotlinx_html_common_0_6_2.xml | 11 + ...etbrains_kotlinx_kotlinx_html_js_0_6_2.xml | 11 + .idea/misc.xml | 4 + .idea/modules.xml | 10 + .idea/vcs.xml | 6 + build.gradle | 4 + gradle/wrapper/gradle-wrapper.jar | Bin 54208 -> 54208 bytes gradle/wrapper/gradle-wrapper.properties | 4 +- readme.md | 1 + src/main/kotlin/nl/astraeus/komp/todo/Todo.kt | 89 +++++ web/css/base.css | 141 +++++++ web/css/index.css | 378 ++++++++++++++++++ web/index.html | 16 +- web/js/kotlin/komp-todo.js | 185 ++++++++- web/js/kotlin/komp-todo.js.map | 2 +- web/js/kotlin/komp-todo.meta.js | 2 +- web/js/kotlin/komp.js | 11 +- web/js/kotlin/komp.meta.js | 2 +- 24 files changed, 924 insertions(+), 13 deletions(-) create mode 100644 .gitignore create mode 100644 .idea/compiler.xml create mode 100644 .idea/gradle.xml create mode 100644 .idea/libraries/Gradle__nl_astraeus_komp_0_0_1_SNAPSHOT.xml create mode 100644 .idea/libraries/Gradle__org_jetbrains_kotlin_kotlin_stdlib_common_1_1_0.xml create mode 100644 .idea/libraries/Gradle__org_jetbrains_kotlin_kotlin_stdlib_js_1_1_1.xml create mode 100644 .idea/libraries/Gradle__org_jetbrains_kotlinx_kotlinx_html_common_0_6_2.xml create mode 100644 .idea/libraries/Gradle__org_jetbrains_kotlinx_kotlinx_html_js_0_6_2.xml create mode 100644 .idea/misc.xml create mode 100644 .idea/modules.xml create mode 100644 .idea/vcs.xml create mode 100644 readme.md create mode 100644 web/css/base.css create mode 100644 web/css/index.css diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..6ac6440 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +# Created by .ignore support plugin (hsz.mobi) +gradle.properties diff --git a/.idea/compiler.xml b/.idea/compiler.xml new file mode 100644 index 0000000..3f97330 --- /dev/null +++ b/.idea/compiler.xml @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/.idea/gradle.xml b/.idea/gradle.xml new file mode 100644 index 0000000..05e5219 --- /dev/null +++ b/.idea/gradle.xml @@ -0,0 +1,18 @@ + + + + + + \ No newline at end of file diff --git a/.idea/libraries/Gradle__nl_astraeus_komp_0_0_1_SNAPSHOT.xml b/.idea/libraries/Gradle__nl_astraeus_komp_0_0_1_SNAPSHOT.xml new file mode 100644 index 0000000..0655aa2 --- /dev/null +++ b/.idea/libraries/Gradle__nl_astraeus_komp_0_0_1_SNAPSHOT.xml @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/.idea/libraries/Gradle__org_jetbrains_kotlin_kotlin_stdlib_common_1_1_0.xml b/.idea/libraries/Gradle__org_jetbrains_kotlin_kotlin_stdlib_common_1_1_0.xml new file mode 100644 index 0000000..ec3824b --- /dev/null +++ b/.idea/libraries/Gradle__org_jetbrains_kotlin_kotlin_stdlib_common_1_1_0.xml @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/.idea/libraries/Gradle__org_jetbrains_kotlin_kotlin_stdlib_js_1_1_1.xml b/.idea/libraries/Gradle__org_jetbrains_kotlin_kotlin_stdlib_js_1_1_1.xml new file mode 100644 index 0000000..723f9fd --- /dev/null +++ b/.idea/libraries/Gradle__org_jetbrains_kotlin_kotlin_stdlib_js_1_1_1.xml @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/.idea/libraries/Gradle__org_jetbrains_kotlinx_kotlinx_html_common_0_6_2.xml b/.idea/libraries/Gradle__org_jetbrains_kotlinx_kotlinx_html_common_0_6_2.xml new file mode 100644 index 0000000..bf3b635 --- /dev/null +++ b/.idea/libraries/Gradle__org_jetbrains_kotlinx_kotlinx_html_common_0_6_2.xml @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/.idea/libraries/Gradle__org_jetbrains_kotlinx_kotlinx_html_js_0_6_2.xml b/.idea/libraries/Gradle__org_jetbrains_kotlinx_kotlinx_html_js_0_6_2.xml new file mode 100644 index 0000000..68648b4 --- /dev/null +++ b/.idea/libraries/Gradle__org_jetbrains_kotlinx_kotlinx_html_js_0_6_2.xml @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/.idea/misc.xml b/.idea/misc.xml new file mode 100644 index 0000000..99ae653 --- /dev/null +++ b/.idea/misc.xml @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/.idea/modules.xml b/.idea/modules.xml new file mode 100644 index 0000000..cc6c0ab --- /dev/null +++ b/.idea/modules.xml @@ -0,0 +1,10 @@ + + + + + + + + + + \ No newline at end of file diff --git a/.idea/vcs.xml b/.idea/vcs.xml new file mode 100644 index 0000000..94a25f7 --- /dev/null +++ b/.idea/vcs.xml @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/build.gradle b/build.gradle index 685245a..2e31515 100644 --- a/build.gradle +++ b/build.gradle @@ -8,11 +8,15 @@ buildscript { maven { url "http://nexus.astraeus.nl/nexus/content/groups/public" } + maven { + url "https://plugins.gradle.org/m2/" + } mavenCentral() } dependencies { classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version" } + } apply plugin: 'kotlin2js' diff --git a/gradle/wrapper/gradle-wrapper.jar b/gradle/wrapper/gradle-wrapper.jar index 9d22eda914bc868149701d6cbc2a32fcec08b6f1..a0d1c243ffb4fe3dc6b5a631220a84d7a3219d41 100644 GIT binary patch delta 26 gcmX@GocX|V<_*z@nA>8THpd+j5(F_O7hm=T0HB2njsO4v delta 26 gcmX@GocX|V<_*z@nD_KHZjL)7BnV = ArrayList() + + override fun render(consumer: TagConsumer) = consumer.section(classes = "todoapp") { + header(classes = "header") { + h1 { + "todos" } + input(classes = "new-todo") { + placeholder = "What needs to be done?" + autoFocus = true + } + } + 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 todos) { + li { + if (todo.completed) { + classes += "completed" + } + attributes["data-id"] = todo.dataId + div(classes = "view") { + input(classes = "toggle") { + type = InputType.checkBox + checked = todo.completed + } + label(classes = "todo-content") { + + todo.title + } + button(classes = "destroy") + } + input(classes = "edit") { + value = todo.title + } + } + } + } + + } + footer(classes = "footer") { + span(classes = "todo-count") { + strong { + "0" } + + " item left" + } + ul(classes = "filters") { + li { + a(classes = "selected") { + href = "#" + + "All" + } + } + li { + a { + href = "#" + + "Active" + } + } + li { + a(classes = "selected") { + href = "#" + + "Completed" + } + } + } + button(classes = "clear-completed") { + + "Clear completed" + } + } + } + +} + +fun main(args: Array) { + Komp.create(document.body!!, TodoApp(), true) +} diff --git a/web/css/base.css b/web/css/base.css new file mode 100644 index 0000000..4d25d3c --- /dev/null +++ b/web/css/base.css @@ -0,0 +1,141 @@ +hr { + margin: 20px 0; + border: 0; + border-top: 1px dashed #c5c5c5; + border-bottom: 1px dashed #f7f7f7; +} + +.learn a { + font-weight: normal; + text-decoration: none; + color: #b83f45; +} + +.learn a:hover { + text-decoration: underline; + color: #787e7e; +} + +.learn h3, +.learn h4, +.learn h5 { + margin: 10px 0; + font-weight: 500; + line-height: 1.2; + color: #000; +} + +.learn h3 { + font-size: 24px; +} + +.learn h4 { + font-size: 18px; +} + +.learn h5 { + margin-bottom: 0; + font-size: 14px; +} + +.learn ul { + padding: 0; + margin: 0 0 30px 25px; +} + +.learn li { + line-height: 20px; +} + +.learn p { + font-size: 15px; + font-weight: 300; + line-height: 1.3; + margin-top: 0; + margin-bottom: 0; +} + +#issue-count { + display: none; +} + +.quote { + border: none; + margin: 20px 0 60px 0; +} + +.quote p { + font-style: italic; +} + +.quote p:before { + content: '“'; + font-size: 50px; + opacity: .15; + position: absolute; + top: -20px; + left: 3px; +} + +.quote p:after { + content: '”'; + font-size: 50px; + opacity: .15; + position: absolute; + bottom: -42px; + right: 3px; +} + +.quote footer { + position: absolute; + bottom: -40px; + right: 0; +} + +.quote footer img { + border-radius: 3px; +} + +.quote footer a { + margin-left: 5px; + vertical-align: middle; +} + +.speech-bubble { + position: relative; + padding: 10px; + background: rgba(0, 0, 0, .04); + border-radius: 5px; +} + +.speech-bubble:after { + content: ''; + position: absolute; + top: 100%; + right: 30px; + border: 13px solid transparent; + border-top-color: rgba(0, 0, 0, .04); +} + +.learn-bar > .learn { + position: absolute; + width: 272px; + top: 8px; + left: -300px; + padding: 10px; + border-radius: 5px; + background-color: rgba(255, 255, 255, .6); + transition-property: left; + transition-duration: 500ms; +} + +@media (min-width: 899px) { + .learn-bar { + width: auto; + padding-left: 300px; + } + + .learn-bar > .learn { + left: 8px; + } +} diff --git a/web/css/index.css b/web/css/index.css new file mode 100644 index 0000000..07ef4a1 --- /dev/null +++ b/web/css/index.css @@ -0,0 +1,378 @@ +html, +body { + margin: 0; + padding: 0; +} + +button { + margin: 0; + padding: 0; + border: 0; + background: none; + font-size: 100%; + vertical-align: baseline; + font-family: inherit; + font-weight: inherit; + color: inherit; + -webkit-appearance: none; + appearance: none; + -webkit-font-smoothing: antialiased; + -moz-font-smoothing: antialiased; + font-smoothing: antialiased; +} + +body { + font: 14px 'Helvetica Neue', Helvetica, Arial, sans-serif; + line-height: 1.4em; + background: #f5f5f5; + color: #4d4d4d; + min-width: 230px; + max-width: 550px; + margin: 0 auto; + -webkit-font-smoothing: antialiased; + -moz-font-smoothing: antialiased; + font-smoothing: antialiased; + font-weight: 300; +} + +button, +input[type="checkbox"] { + outline: none; +} + +.hidden { + display: none; +} + +.todoapp { + background: #fff; + margin: 130px 0 40px 0; + position: relative; + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), + 0 25px 50px 0 rgba(0, 0, 0, 0.1); +} + +.todoapp input::-webkit-input-placeholder { + font-style: italic; + font-weight: 300; + color: #e6e6e6; +} + +.todoapp input::-moz-placeholder { + font-style: italic; + font-weight: 300; + color: #e6e6e6; +} + +.todoapp input::input-placeholder { + font-style: italic; + font-weight: 300; + color: #e6e6e6; +} + +.todoapp h1 { + position: absolute; + top: -155px; + width: 100%; + font-size: 100px; + font-weight: 100; + text-align: center; + color: rgba(175, 47, 47, 0.15); + -webkit-text-rendering: optimizeLegibility; + -moz-text-rendering: optimizeLegibility; + text-rendering: optimizeLegibility; +} + +.new-todo, +.edit { + position: relative; + margin: 0; + width: 100%; + font-size: 24px; + font-family: inherit; + font-weight: inherit; + line-height: 1.4em; + border: 0; + outline: none; + color: inherit; + padding: 6px; + border: 1px solid #999; + box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2); + box-sizing: border-box; + -webkit-font-smoothing: antialiased; + -moz-font-smoothing: antialiased; + font-smoothing: antialiased; +} + +.new-todo { + padding: 16px 16px 16px 60px; + border: none; + background: rgba(0, 0, 0, 0.003); + box-shadow: inset 0 -2px 1px rgba(0,0,0,0.03); +} + +.main { + position: relative; + z-index: 2; + border-top: 1px solid #e6e6e6; +} + +label[for='toggle-all'] { + display: none; +} + +.toggle-all { + position: absolute; + top: -55px; + left: -12px; + width: 60px; + height: 34px; + text-align: center; + border: none; /* Mobile Safari */ +} + +.toggle-all:before { + content: '❯'; + font-size: 22px; + color: #e6e6e6; + padding: 10px 27px 10px 27px; +} + +.toggle-all:checked:before { + color: #737373; +} + +.todo-list { + margin: 0; + padding: 0; + list-style: none; +} + +.todo-list li { + position: relative; + font-size: 24px; + border-bottom: 1px solid #ededed; +} + +.todo-list li:last-child { + border-bottom: none; +} + +.todo-list li.editing { + border-bottom: none; + padding: 0; +} + +.todo-list li.editing .edit { + display: block; + width: 506px; + padding: 13px 17px 12px 17px; + margin: 0 0 0 43px; +} + +.todo-list li.editing .view { + display: none; +} + +.todo-list li .toggle { + text-align: center; + width: 40px; + /* auto, since non-WebKit browsers doesn't support input styling */ + height: auto; + position: absolute; + top: 0; + bottom: 0; + margin: auto 0; + border: none; /* Mobile Safari */ + -webkit-appearance: none; + appearance: none; +} + +.todo-list li .toggle:after { + content: url('data:image/svg+xml;utf8,'); +} + +.todo-list li .toggle:checked:after { + content: url('data:image/svg+xml;utf8,'); +} + +.todo-list li label { + white-space: pre-line; + word-break: break-all; + padding: 15px 60px 15px 15px; + margin-left: 45px; + display: block; + line-height: 1.2; + transition: color 0.4s; +} + +.todo-list li.completed label { + color: #d9d9d9; + text-decoration: line-through; +} + +.todo-list li .destroy { + display: none; + position: absolute; + top: 0; + right: 10px; + bottom: 0; + width: 40px; + height: 40px; + margin: auto 0; + font-size: 30px; + color: #cc9a9a; + margin-bottom: 11px; + transition: color 0.2s ease-out; +} + +.todo-list li .destroy:hover { + color: #af5b5e; +} + +.todo-list li .destroy:after { + content: '×'; +} + +.todo-list li:hover .destroy { + display: block; +} + +.todo-list li .edit { + display: none; +} + +.todo-list li.editing:last-child { + margin-bottom: -1px; +} + +.footer { + color: #777; + padding: 10px 15px; + height: 20px; + text-align: center; + border-top: 1px solid #e6e6e6; +} + +.footer:before { + content: ''; + position: absolute; + right: 0; + bottom: 0; + left: 0; + height: 50px; + overflow: hidden; + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), + 0 8px 0 -3px #f6f6f6, + 0 9px 1px -3px rgba(0, 0, 0, 0.2), + 0 16px 0 -6px #f6f6f6, + 0 17px 2px -6px rgba(0, 0, 0, 0.2); +} + +.todo-count { + float: left; + text-align: left; +} + +.todo-count strong { + font-weight: 300; +} + +.filters { + margin: 0; + padding: 0; + list-style: none; + position: absolute; + right: 0; + left: 0; +} + +.filters li { + display: inline; +} + +.filters li a { + color: inherit; + margin: 3px; + padding: 3px 7px; + text-decoration: none; + border: 1px solid transparent; + border-radius: 3px; +} + +.filters li a.selected, +.filters li a:hover { + border-color: rgba(175, 47, 47, 0.1); +} + +.filters li a.selected { + border-color: rgba(175, 47, 47, 0.2); +} + +.clear-completed, +html .clear-completed:active { + float: right; + position: relative; + line-height: 20px; + text-decoration: none; + cursor: pointer; + position: relative; +} + +.clear-completed:hover { + text-decoration: underline; +} + +.info { + margin: 65px auto 0; + color: #bfbfbf; + font-size: 10px; + text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); + text-align: center; +} + +.info p { + line-height: 1; +} + +.info a { + color: inherit; + text-decoration: none; + font-weight: 400; +} + +.info a:hover { + text-decoration: underline; +} + +/* + Hack to remove background from Mobile Safari. + Can't use it globally since it destroys checkboxes in Firefox +*/ +@media screen and (-webkit-min-device-pixel-ratio:0) { + .toggle-all, + .todo-list li .toggle { + background: none; + } + + .todo-list li .toggle { + height: 40px; + } + + .toggle-all { + -webkit-transform: rotate(90deg); + transform: rotate(90deg); + -webkit-appearance: none; + appearance: none; + } +} + +@media (max-width: 430px) { + .footer { + height: 50px; + } + + .filters { + bottom: 10px; + } +} diff --git a/web/index.html b/web/index.html index 8ead5ee..4bfd623 100644 --- a/web/index.html +++ b/web/index.html @@ -3,11 +3,19 @@ Hello-Komp + - - - - + + + + + + + diff --git a/web/js/kotlin/komp-todo.js b/web/js/kotlin/komp-todo.js index 7757022..0f35d48 100644 --- a/web/js/kotlin/komp-todo.js +++ b/web/js/kotlin/komp-todo.js @@ -1,10 +1,191 @@ if (typeof kotlin === 'undefined') { throw new Error("Error loading module 'komp-todo'. Its dependency 'kotlin' was not found. Please, check whether 'kotlin' is loaded prior to 'komp-todo'."); } -this['komp-todo'] = function (_, Kotlin) { +if (typeof this['kotlinx-html-js'] === 'undefined') { + throw new Error("Error loading module 'komp-todo'. Its dependency 'kotlinx-html-js' was not found. Please, check whether 'kotlinx-html-js' is loaded prior to 'komp-todo'."); +} +if (typeof komp === 'undefined') { + throw new Error("Error loading module 'komp-todo'. Its dependency 'komp' was not found. Please, check whether 'komp' is loaded prior to 'komp-todo'."); +} +this['komp-todo'] = function (_, Kotlin, $module$kotlinx_html_js, $module$komp) { 'use strict'; + var h1 = $module$kotlinx_html_js.kotlinx.html.h1_vmej1w$; + var input = $module$kotlinx_html_js.kotlinx.html.input_e1g74z$; + var header = $module$kotlinx_html_js.kotlinx.html.header_8btlf7$; + var InputType = $module$kotlinx_html_js.kotlinx.html.InputType; + var label = $module$kotlinx_html_js.kotlinx.html.label_yd75js$; + var get_classes = $module$kotlinx_html_js.kotlinx.html.get_classes_fxodxh$; + var plus = Kotlin.kotlin.collections.plus_xfiyik$; + var set_classes = $module$kotlinx_html_js.kotlinx.html.set_classes_njy09m$; + var button = $module$kotlinx_html_js.kotlinx.html.button_whohl6$; + var div = $module$kotlinx_html_js.kotlinx.html.div_ri36nr$; + var li = $module$kotlinx_html_js.kotlinx.html.li_yzv5uh$; + var ul = $module$kotlinx_html_js.kotlinx.html.ul_pzlyaf$; + var section = $module$kotlinx_html_js.kotlinx.html.section_ac1jhf$; + var strong = $module$kotlinx_html_js.kotlinx.html.strong_okpg28$; + var span = $module$kotlinx_html_js.kotlinx.html.span_6djfml$; + var a = $module$kotlinx_html_js.kotlinx.html.a_gu26kr$; + var footer = $module$kotlinx_html_js.kotlinx.html.footer_780ap1$; + var section_0 = $module$kotlinx_html_js.kotlinx.html.js.section_ceckl$; + var HtmlComponent = $module$komp.nl.astraeus.komp.HtmlComponent; + var ArrayList_init = Kotlin.kotlin.collections.ArrayList_init_ww73n8$; + var komp_0 = $module$komp.nl.astraeus.komp; + TodoApp.prototype = Object.create(HtmlComponent.prototype); + TodoApp.prototype.constructor = TodoApp; + function Todo(dataId, title, completed) { + this.dataId = dataId; + this.title = title; + this.completed = completed; + } + Todo.$metadata$ = { + kind: Kotlin.Kind.CLASS, + simpleName: 'Todo', + interfaces: [] + }; + function TodoApp() { + HtmlComponent.call(this); + this.todos = ArrayList_init(); + } + function TodoApp$render$lambda$lambda$lambda($receiver) { + $receiver.unaryPlus_pdl1vz$('todos'); + } + function TodoApp$render$lambda$lambda$lambda_0($receiver) { + $receiver.placeholder = 'What needs to be done?'; + $receiver.autoFocus = true; + } + function TodoApp$render$lambda$lambda($receiver) { + h1($receiver, void 0, TodoApp$render$lambda$lambda$lambda); + input($receiver, void 0, void 0, void 0, void 0, 'new-todo', TodoApp$render$lambda$lambda$lambda_0); + } + function TodoApp$render$lambda$lambda$lambda_1($receiver) { + $receiver.type = InputType.checkBox; + } + function TodoApp$render$lambda$lambda$lambda_2($receiver) { + $receiver.for_ = 'toggle-all'; + $receiver.unaryPlus_pdl1vz$('Mark all as complete'); + } + function TodoApp$render$lambda$lambda$lambda$lambda$lambda$lambda(closure$todo) { + return function ($receiver) { + $receiver.type = InputType.checkBox; + $receiver.checked = closure$todo.completed; + }; + } + function TodoApp$render$lambda$lambda$lambda$lambda$lambda$lambda_0(closure$todo) { + return function ($receiver) { + $receiver.unaryPlus_pdl1vz$(closure$todo.title); + }; + } + function TodoApp$render$lambda$lambda$lambda$lambda$lambda(closure$todo) { + return function ($receiver) { + input($receiver, void 0, void 0, void 0, void 0, 'toggle', TodoApp$render$lambda$lambda$lambda$lambda$lambda$lambda(closure$todo)); + label($receiver, 'todo-content', TodoApp$render$lambda$lambda$lambda$lambda$lambda$lambda_0(closure$todo)); + button($receiver, void 0, void 0, void 0, 'destroy'); + }; + } + function TodoApp$render$lambda$lambda$lambda$lambda$lambda_0(closure$todo) { + return function ($receiver) { + $receiver.value = closure$todo.title; + }; + } + function TodoApp$render$lambda$lambda$lambda$lambda(closure$todo) { + return function ($receiver) { + if (closure$todo.completed) { + set_classes($receiver, plus(get_classes($receiver), 'completed')); + } + var $receiver_0 = $receiver.attributes; + var value = closure$todo.dataId; + $receiver_0.put_xwzc9p$('data-id', value); + div($receiver, 'view', TodoApp$render$lambda$lambda$lambda$lambda$lambda(closure$todo)); + input($receiver, void 0, void 0, void 0, void 0, 'edit', TodoApp$render$lambda$lambda$lambda$lambda$lambda_0(closure$todo)); + }; + } + function TodoApp$render$lambda$lambda$lambda_3(this$TodoApp) { + return function ($receiver) { + var tmp$; + tmp$ = this$TodoApp.todos.iterator(); + while (tmp$.hasNext()) { + var todo = tmp$.next(); + li($receiver, void 0, TodoApp$render$lambda$lambda$lambda$lambda(todo)); + } + }; + } + function TodoApp$render$lambda$lambda_0(this$TodoApp) { + return function ($receiver) { + input($receiver, void 0, void 0, void 0, void 0, 'toggle-all', TodoApp$render$lambda$lambda$lambda_1); + label($receiver, void 0, TodoApp$render$lambda$lambda$lambda_2); + ul($receiver, 'todo-list', TodoApp$render$lambda$lambda$lambda_3(this$TodoApp)); + }; + } + function TodoApp$render$lambda$lambda$lambda$lambda_0($receiver) { + $receiver.unaryPlus_pdl1vz$('0'); + } + function TodoApp$render$lambda$lambda$lambda_4($receiver) { + strong($receiver, void 0, TodoApp$render$lambda$lambda$lambda$lambda_0); + $receiver.unaryPlus_pdl1vz$(' item left'); + } + function TodoApp$render$lambda$lambda$lambda$lambda$lambda_1($receiver) { + $receiver.href = '#'; + $receiver.unaryPlus_pdl1vz$('All'); + } + function TodoApp$render$lambda$lambda$lambda$lambda_1($receiver) { + a($receiver, void 0, void 0, 'selected', TodoApp$render$lambda$lambda$lambda$lambda$lambda_1); + } + function TodoApp$render$lambda$lambda$lambda$lambda$lambda_2($receiver) { + $receiver.href = '#'; + $receiver.unaryPlus_pdl1vz$('Active'); + } + function TodoApp$render$lambda$lambda$lambda$lambda_2($receiver) { + a($receiver, void 0, void 0, void 0, TodoApp$render$lambda$lambda$lambda$lambda$lambda_2); + } + function TodoApp$render$lambda$lambda$lambda$lambda$lambda_3($receiver) { + $receiver.href = '#'; + $receiver.unaryPlus_pdl1vz$('Completed'); + } + function TodoApp$render$lambda$lambda$lambda$lambda_3($receiver) { + a($receiver, void 0, void 0, 'selected', TodoApp$render$lambda$lambda$lambda$lambda$lambda_3); + } + function TodoApp$render$lambda$lambda$lambda_5($receiver) { + li($receiver, void 0, TodoApp$render$lambda$lambda$lambda$lambda_1); + li($receiver, void 0, TodoApp$render$lambda$lambda$lambda$lambda_2); + li($receiver, void 0, TodoApp$render$lambda$lambda$lambda$lambda_3); + } + function TodoApp$render$lambda$lambda$lambda_6($receiver) { + $receiver.unaryPlus_pdl1vz$('Clear completed'); + } + function TodoApp$render$lambda$lambda_1($receiver) { + span($receiver, 'todo-count', TodoApp$render$lambda$lambda$lambda_4); + ul($receiver, 'filters', TodoApp$render$lambda$lambda$lambda_5); + button($receiver, void 0, void 0, void 0, 'clear-completed', TodoApp$render$lambda$lambda$lambda_6); + } + function TodoApp$render$lambda(this$TodoApp) { + return function ($receiver) { + header($receiver, 'header', TodoApp$render$lambda$lambda); + section($receiver, 'main', TodoApp$render$lambda$lambda_0(this$TodoApp)); + footer($receiver, 'footer', TodoApp$render$lambda$lambda_1); + }; + } + TodoApp.prototype.render_q0cphf$ = function (consumer) { + return section_0(consumer, 'todoapp', TodoApp$render$lambda(this)); + }; + TodoApp.$metadata$ = { + kind: Kotlin.Kind.CLASS, + simpleName: 'TodoApp', + interfaces: [HtmlComponent] + }; + function main(args) { + var tmp$; + komp_0.Komp.create_og2ns8$((tmp$ = document.body) != null ? tmp$ : Kotlin.throwNPE(), new TodoApp(), true); + } + var package$nl = _.nl || (_.nl = {}); + var package$astraeus = package$nl.astraeus || (package$nl.astraeus = {}); + var package$komp = package$astraeus.komp || (package$astraeus.komp = {}); + var package$todo = package$komp.todo || (package$komp.todo = {}); + package$todo.Todo = Todo; + package$todo.TodoApp = TodoApp; + package$todo.main_kand9s$ = main; Kotlin.defineModule('komp-todo', _); + main([]); return _; -}(typeof this['komp-todo'] === 'undefined' ? {} : this['komp-todo'], kotlin); +}(typeof this['komp-todo'] === 'undefined' ? {} : this['komp-todo'], kotlin, this['kotlinx-html-js'], komp); //@ sourceMappingURL=komp-todo.js.map diff --git a/web/js/kotlin/komp-todo.js.map b/web/js/kotlin/komp-todo.js.map index b71a114..d6d6910 100644 --- a/web/js/kotlin/komp-todo.js.map +++ b/web/js/kotlin/komp-todo.js.map @@ -1 +1 @@ -{"version":3,"file":"komp-todo.js","sources":[],"names":[],"mappings":";;;;;;;;"} \ No newline at end of file +{"version":3,"file":"komp-todo.js","sources":["file:///home/rnentjes/Development/komp/komp-todo/src/main/kotlin/nl/astraeus/komp/todo/Todo.kt"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAkB4B;;;IAIX;;;IAED;IACA,sBAsE4B;;;IAzEhC;IACA;;;IAOI;;;IAGA;IACA;;;;MAWgB;MACA,oBAAU;;;;;MAGV,4BAAE;;;;;MALN;MAIA;MAGA;;;;;MAGA,kBAAQ;;;;;MAfZ,IAAI;QACA;;;;;MAGJ;MAUA;;;;;;0BAhBK;MAAb;;QACI;;;;;;MATR;MAGA;MAIA;;;;IA2Ba;;;IAAT;IACA;;;IAKQ;IACA;;;IAFJ;;;IAOI;IACA;;;IAFJ;;;IAOI;IACA;;;IAFJ;;;IAbJ;IAMA;IAMA;;;IAQA;;;IAzBJ;IAIA;IAoBA;;;;MAjEJ;MAOA;MAiCA;;;;qBAzCsD;;;;;;;;;yGA2ElB;;;;;;;;;;;;;"} \ No newline at end of file diff --git a/web/js/kotlin/komp-todo.meta.js b/web/js/kotlin/komp-todo.meta.js index da7b601..1dc463b 100644 --- a/web/js/kotlin/komp-todo.meta.js +++ b/web/js/kotlin/komp-todo.meta.js @@ -1 +1 @@ -// Kotlin.kotlin_module_metadata(1, "komp-todo", "H4sIAAAAAAAAAI1WbW7TQBB1bedr2tJgoC0pEqKIbyiIIkQRCCFxAYQ4gOtukk3s3bC7bsI1+NWj5HYwaxon3mRt54cVyTPzZt68mbETPAAncHqHV+2/i9/WvLP8/6ftBI9gB5pjrmLKwB3JAMDtOuC3ne5Wr3nVRvvM7BRug8tiaIdSiZCkEvwxTyZBd2mOz62uq53cecfVTq9hP4+9Q2YTImhCmApjG8orRFk4QMgYV6GinNnMH8Nubu5d8MRm9wRu5Ha+IlLZDN/DAXhcDMCbnkawjQn3uUhCFpHyQjVAgR0bwAnsrQB4s6EoD/wVjpeERFzwVFFGpMFmaYiHAEtIW15v4OZKXo0+jYmsLjnzaI2HgjNuLdkgf2Yl/x50MFhmOAt8baPfOvOOk+t09Csl4je4KbUTfCdH245QoaGgkjNrdh/gbg4K/lAl2ETKRiRSvKI1Z9AzPTsRIqUJERXcfSrITCsXmuQSeymDfdMPn27X097evONp7wPwtdjWKXqOTVzU3joXfCqJsNV9hpNmpOClIq6D/wy6OUxThGxArOy+hVsrKK0pF+NKco6gvWj0eom6XcuAu7ggaJ9G2ZKoCLupYHk5qFPwuxVNtQTpx6iObFeWAhpKjLUXLVHiCwhye5SgIoLZF6Um1hBfjYT2DAbK7Q+hkdlbZnFxMyivtc2Xy8tm/gNOqncdAFIjKJM0qjUs+m4ZRFVXnknwv9N68Tj10Pj+k1G1/s5co0RFw3KowgkbXVpPmL5MRh1NvDUkrChlk+wjWYu6QvsmgmMTFLW37yMcmRlCqLBX56mqOibf4P7GCVsZhBoJP0WBFzOw5foSx2eB15EElw2eeGtlev4Lpw4aU3I+qLi7hW18XVMZgsGdT5NJBYIewyyvxijVcrQE/4KHasOnGx5jfsHr8PoZDk0NtfCuSsrqrM/eNQn/AKPbfFOOCgAA"); +// Kotlin.kotlin_module_metadata(1, "komp-todo", "H4sIAAAAAAAAAI1X227bRhClSIoiR5K1pmOZoVMEddEmvThVnKJoiraAnRZwi/Shjgv0labWMmWKqy5XvvxAPsBPeep36Kf6De0sTd1orSg/cClyZs5czszQmvsxaK7mex/s/yZ/lbEzu7+zNfdTaIB1yUQcJaD3UxdAJxqYtkYqvvXBRvlM7BU8Aj2JwQ5SwQM6SsG8ZIOhS2bieK0QXSrpY0eXSl9De2q7QW+GlEcDmoggVqHsI8pEAYIkYSIQEUtU4p9BcypudNlAJfcMNqZypqCpUAl+CztgMN4D4/pVCHV0+JzxQZCEdHWgEmAhOyqAF9CaAzBuLvhqw4ewN0tIyDgbiSihaSGbK018AjCDVPnVgc05v6rnUUzT8pAzjdrlBWcJU4ZcSP6NMvlPwEFjmeCNa0oZ+VYbO9qUp/2/R5Tfgj6K1AnenqLVQ2RowKOUJUrvvoPHU1AwL8QAixglfRoKVlKa1+AXNZ0QkUYDykty98MCzSRzwaJXWMvUbRf18KoTQ2obY8eQ2jtgSrI9TNEXWMRJ7LUzzq5TylVxv8ZOK7hgjHi8Dv7nQKYwFg+SHlVm9wC25lBq14xfliZnF+xJoR+GKMs1M9jEARGdR2E2JErMLgs4veqtE/A3c5yqcXoeIzuyWbkSsMDEWGpFK5j4JbhTeaSgoDxRD0qZ2AL51nCoVcjAankPqpm8ohcnOyNia03z2fBSib+DF+WzDgBTw6MkjcK1mkXurUKiyiPPKHiv9DB47Hqo/vFnEomH74pjlIrwYjXUwgrrXylXmNxMhTgs3DU0KAllGe3DdK3ULZRvyBkWQUTq8n0Pu0UPIRBYq7ORKFsmP8PTpR021whrOPwcCb7ogcrXr7B9JnhOSnHY4IpXRib7f2HVQfWanvVK9u7CNM5jWoVQyJ0ZDYYlCLINM7+q/ZGko8L4Pyb8W1n28YbrmHUZmKfyOiXhYXILVjcQwa9dsN7JXkMAEYmYyv2GTlFBu1A7YiymAYYmtQ+HQ2geo9tvUIAl2Kmogs/ThckH5tsoFbgzaNKlvEjL+vHp729/iansc7Anm7SYlvpp0HszeWcOAvlRIXsRzID3sDCHnAe37l1lOVvAsg1iehq+reJ9lVh4L087P+vZaZBGduqk6UkrVdLCX3VCMk0XnzTJFl43CHaI3SLb2XPcy/Ym8fCJSx7n9nbz8yNP85/6O8T39c6jgwZ54tuu6eqdWmd7bGv3FN77yTMP9I515LkWqaFgDU8nPwFP+8S5P/96v3GSi5zkImhl76XnoD4cab+1ySY+JAjUzoFIZ+u4fdIgG/lvs9NAlTtbx/8QfgSvWIwafjelWPk12s7PmeO38krty0Lt91M/I9n/uqBRFoUMAAA="); diff --git a/web/js/kotlin/komp.js b/web/js/kotlin/komp.js index ccef7f5..0c1743d 100644 --- a/web/js/kotlin/komp.js +++ b/web/js/kotlin/komp.js @@ -43,9 +43,16 @@ var komp = function (_, Kotlin, $module$kotlinx_html_js) { Komp.prototype.define_eho435$ = function (element, component) { this.elements_0.put_xwzc9p$(element, component); }; - Komp.prototype.create_eho435$ = function (parent, component) { + Komp.prototype.create_og2ns8$ = function (parent, component, insertAsFirst) { + if (insertAsFirst === void 0) + insertAsFirst = false; var element = component.create(); - parent.appendChild(element); + if (insertAsFirst && parent.childElementCount > 0) { + parent.insertBefore(element, parent.firstChild); + } + else { + parent.appendChild(element); + } this.elements_0.put_xwzc9p$(element, component); }; Komp.prototype.remove_lt8gi4$ = function (element) { diff --git a/web/js/kotlin/komp.meta.js b/web/js/kotlin/komp.meta.js index 5ee5ab6..e17f6ff 100644 --- a/web/js/kotlin/komp.meta.js +++ b/web/js/kotlin/komp.meta.js @@ -1 +1 @@ -// Kotlin.kotlin_module_metadata(1, "komp", "H4sIAAAAAAAAAI1W3XLbRBSWJVlaHf9tlCZxlZYM6RBKIcWTMgxl4KI/zIRAmKG0TG8VZW3LkSWzkpL0thd9gF7lBbjhCfwEvBacVWzZVrKWc6Hsz/nf73zHiv0pKLbitK/If9O/ytiarT8Sxf4M6mCcRUngh6AOYhtApQroRKEVx7giKJ+J/V2FDyqoYQDEjRPusjQG/SwajqBxmAyDF7iKQhYmuS3tWfgOTBawoTjVIt4D7eKJB9ppNITa4evjX3+a3BkeZ27CwOSsy1ncB/1N6OMxZ+Ep40C8KIzTIa7Ma9OXoPfRJdReu70X0zv9FxELmfiLoeZFQcC8xEcBgOM0cU8CduyOwBi5XHi1vFnIp6zrh0x4HEbnTJQBjKP4N3fIQA/F1/RDL0hPGWgvf/7Tfl+Z1Qi/FaqCQVSqtRU813Gt02q2NvHWoAS/JrXwnFDAc3HfyO4p3tToGp7UqZ3dqHS9LSzrdAN3Lbo52W3jbo3ey2TqdKetOPedDfqJo3bgkdpZPzBoG9famChXRB1b6u5zstfWDtRO9blyZNAaXlr4vy4UjjZpU+wP6rTlEFu3cd1pHO69qlHD0duVjvX2QxMt7f5TIf+q7WZmRSUq6gk7gM62Mv2JUzy/Ozk3Fs6b1/7yPZ3sydTP0Q515iUOzY+kTmybkPu2TshDB00486ZfbdA7TvM65Oyrdejb9/qYIEZ1UBDtX8NmDsE6uxwx7gtAuIEM2PtwJ1cANwyjxBWgkYnvQWMGcYSyTO5zaOZyesLiRCb4LWzNdUcNA+5GfOiGHrNpEWZCT7zu1MFCO8ocPIbWfPtd9vlyw89gd1YQL+JRmmBzxIVqLjXxAGDmUhZXB9bm4qp2/YDF5SlnGuZZn0dhJE25UPxLafHvgZWziq0LGXGrjC0lp8bBXynj70BNfXmBN3JvNcEqLvdjpB2Z/Hdwt0hlxA8HSFZRydM8BaeoaU3ZsaR2PyzALCNhg50LqrQ3b7CZLthMaGtjSxPaW6ALsN0s0SN8xGnu5gmPLmLGZXk/xU4rhKClPFjF/xdAczcGd8Mek1b3ANbnvJgXET8rLc42kOlD30xRPNfMYAMJwu/6XkYSJWZvSzg+762S8DdzmBJzUYyybDwvdVhAYj4AZbX6EuxcHiGYMB7KiVIUtgC+FQJqFSqwXL4N1Uxe0ovTnyl+tBKbz8hLJv4HPC7nOgAsDffD2PdWapYnGEOhUOWZZxC8VrqZPHY9VH8Xv4pu3hVplCVef7mrhRE2OJeOMDGZCnkYOGuYW5LKbbD34pVKt/B8Ix7hIyS+/Pm+h+1ihOAm+FYnaVI2TF7Czq0dNtcIKwT8EAG+GIEs1q+wfab+rJgh2eCIl2Ym+n9h1EH1gp30SubuAhtPclrmoVA73R+OSjyINsziqg5SAUeJ8R+hXYSAiWMx9sNV2M+Z5OC0JvHti/D2B/H/ob0eB9EMAAA="); +// Kotlin.kotlin_module_metadata(1, "komp", "H4sIAAAAAAAAAI1WS3PjRBCWJVkatR+ZKC+vkiW7oQjLQhZXlqJYCg7JLlQwhKp9QO1VUcaOHFkyIznJXjlw4LinnPgVHPwLuPKToEexZVvJWPZBHk339Nfd0/21FPshKLbiNK7Jf+NfaWhN1u+JYn8EVTDOoyTwQ1C7sQ2gUgV0otCSY1wT1E/V/i3DXyqoYQDEjRPuskEM+nnU60PtKOkFz3EVhSxMMlvaQfgOTBawntjVIt4B7fKpB9pp1IPK0Zvjn74byQyPMzdhYHLW5iw+A/2X0MdtzsJTxoF4URgPergyb0xfgX6GkFB543aej2X6j8IXMsKLoeJFQcC8xEcFgONB4p4E7Njtg9F3uUC1vMzlmh/GjCcH8fc+jxMwD6MoYG4Ixilr+yETnvSiCybSA0Yr/tntMdBD8TT90AsGpwy0Fz/8av9ZmuQOnyWqgkFUqjUU3NdxrdNyujZRalCCT5NauE8o4L6Q11I5RUmFLuNOldqpRKUrDWFZp2v4tkTXR/rOaPc+vtn0g3S3Sh82FOe+s0YfOGoTHqvN1X2DNnCtDYlyTdShpe4ckt2Gtq82y4dKy6AVFFr4XxUHWuu0Lt73q3TJIbZu47pZO9p9VaGGozdKTevtH3W0tPN3ifyjNuqpFZWorQepHUCwjfT8CHSfoPv3cLWMljdHGsa0Rqt+g5y909E7GSO2tunWtMaR+Z5UyYpNyLatE/JoC01sTZt+tUZXnfqN8+lTa9K3v+tDgtWsg4J98TmsZ8VaZVd9xn1ROm4ga4E9WM0OgBuGUeKK8pKp70Jt0gxY9DK9j6Ge6ekJixOZ4pewMdVHFXS4HfGeG3rMpvnCE+fEPY8BZhpXBvAElqYb9eqMzzd8ADuThHgRjwYJtkucy+ZcEx8CTCBlfjVhecqvctsPWFwccnrCPD/jURhJQ84l/0qa/C2wMv6xdaEjpMrQUjIS7f42YPwdqANfnuC1DK0i+MflfowEJdP/Cu7lSY/4YRdpLSq4mmfg5E9aYx4tyN03M2WW0rXBLgSp2uu3+E0X/CZOa0NLE6c3QBfFdjtFj/ESx7GbJzy6RMqVxf0MOy3ngjbgwSL4nwDNYAzuhh0mze4+rEyhmJcRPy9MziaQ8UXfDlFc18RgDQnCb/teShIFZu8KOL7oLBLwF1M1JSaoGHrpIJ8LmKvEbFTKcvUp2Jk+lmDCeCgnSpHYXPEt4NBSLgPz9RtQTvUlvTj+oPGjhdh8Ql4y9dfwpJjrADA1HL8mfG+hZnmKPuQSVRx5WoI3h24Hj10P5Zfi++m2LE+jLPHO5kPNjLDuhXSEicmUi8PAWcPcglDuKnsvXih1M9fX5xFeQuLLr+9r2Mx7CG6Cd3UySIqGyQvYvrPDphphAYcfYYHPeiDz9TNsnzGeFTMkGxzx0shE/8+MOihfspNOwdydYeNRTPMQcrnT/V6/AEG0YepXuTsQ5Sgx/i008iVg4liM/XAR9nNGMThLI//2hHt73fh/59xTEPsMAAA=");