diff options
Diffstat (limited to 'kvision-modules/kvision-bootstrap-datetime')
55 files changed, 1692 insertions, 0 deletions
diff --git a/kvision-modules/kvision-bootstrap-datetime/build.gradle b/kvision-modules/kvision-bootstrap-datetime/build.gradle new file mode 100644 index 00000000..fb440934 --- /dev/null +++ b/kvision-modules/kvision-bootstrap-datetime/build.gradle @@ -0,0 +1,13 @@ +apply from: "../shared.gradle" + +dependencies { + compile project(":kvision-modules:kvision-bootstrap") +} + +kotlinFrontend { + + npm { + dependency("bootstrap-datetime-picker", "2.4.4") + } + +} diff --git a/kvision-modules/kvision-bootstrap-datetime/package.json.d/project.info b/kvision-modules/kvision-bootstrap-datetime/package.json.d/project.info new file mode 100644 index 00000000..3d332806 --- /dev/null +++ b/kvision-modules/kvision-bootstrap-datetime/package.json.d/project.info @@ -0,0 +1,3 @@ +{ + "description": "KVision Datetime module" +} diff --git a/kvision-modules/kvision-bootstrap-datetime/src/main/kotlin/pl/treksoft/kvision/KVManagerDatetime.kt b/kvision-modules/kvision-bootstrap-datetime/src/main/kotlin/pl/treksoft/kvision/KVManagerDatetime.kt new file mode 100644 index 00000000..41f8620f --- /dev/null +++ b/kvision-modules/kvision-bootstrap-datetime/src/main/kotlin/pl/treksoft/kvision/KVManagerDatetime.kt @@ -0,0 +1,75 @@ +/* + * Copyright (c) 2017-present Robert Jaros + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + */ +package pl.treksoft.kvision + +internal val kVManagerDatetimeInit = KVManagerDatetime.init() + +/** + * Internal singleton object which initializes and configures KVision datetime module. + */ +internal object KVManagerDatetime { + init { + require("bootstrap-datetime-picker/css/bootstrap-datetimepicker.min.css") + require("bootstrap-datetime-picker/js/bootstrap-datetimepicker.min.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.ar.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.az.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.bg.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.bn.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.ca.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.cs.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.da.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.de.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.ee.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.el.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.es.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.fi.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.fr.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.he.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.hr.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.hu.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.hy.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.id.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.is.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.it.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.ja.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.ko.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.lt.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.lv.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.nl.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.no.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.pl.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.pt.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.ro.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.rs.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.ru.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.sk.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.sl.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.sv.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.th.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.tr.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.ua.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.uk.js") + require("./js/locales/bootstrap-datetime-picker/bootstrap-datetimepicker.zh.js") + } + + internal fun init() {} +} diff --git a/kvision-modules/kvision-bootstrap-datetime/src/main/kotlin/pl/treksoft/kvision/form/time/DateTime.kt b/kvision-modules/kvision-bootstrap-datetime/src/main/kotlin/pl/treksoft/kvision/form/time/DateTime.kt new file mode 100644 index 00000000..7fb35057 --- /dev/null +++ b/kvision-modules/kvision-bootstrap-datetime/src/main/kotlin/pl/treksoft/kvision/form/time/DateTime.kt @@ -0,0 +1,246 @@ +/* + * Copyright (c) 2017-present Robert Jaros + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + */ +package pl.treksoft.kvision.form.time + +import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.core.StringBoolPair +import pl.treksoft.kvision.core.Widget +import pl.treksoft.kvision.form.DateFormControl +import pl.treksoft.kvision.form.FieldLabel +import pl.treksoft.kvision.form.InvalidFeedback +import pl.treksoft.kvision.panel.SimplePanel +import pl.treksoft.kvision.utils.SnOn +import kotlin.js.Date + +/** + * Form field date/time chooser component. + * + * @constructor + * @param value date/time input value + * @param name the name attribute of the generated HTML input element + * @param format date/time format (default YYYY-MM-DD HH:mm) + * @param label label text bound to the input element + * @param rich determines if [label] can contain HTML code + */ +open class DateTime( + value: Date? = null, name: String? = null, format: String = "YYYY-MM-DD HH:mm", label: String? = null, + rich: Boolean = false +) : SimplePanel(setOf("form-group")), DateFormControl { + + /** + * Date/time input value. + */ + override var value + get() = input.value + set(value) { + input.value = value + } + /** + * Date/time format. + */ + var format + get() = input.format + set(value) { + input.format = value + } + /** + * The placeholder for the date/time input. + */ + var placeholder + get() = input.placeholder + set(value) { + input.placeholder = value + } + /** + * Determines if the date/time input is automatically focused. + */ + var autofocus + get() = input.autofocus + set(value) { + input.autofocus = value + } + /** + * Determines if the date/time input is read-only. + */ + var readonly + get() = input.readonly + set(value) { + input.readonly = value + } + /** + * Day of the week start. 0 (Sunday) to 6 (Saturday). + */ + var weekStart + get() = input.weekStart + set(value) { + input.weekStart = value + } + /** + * Days of the week that should be disabled. Multiple values should be comma separated. + */ + var daysOfWeekDisabled + get() = input.daysOfWeekDisabled + set(value) { + input.daysOfWeekDisabled = value + } + /** + * Determines if *Clear* button should be visible. + */ + var clearBtn + get() = input.clearBtn + set(value) { + input.clearBtn = value + } + /** + * Determines if *Today* button should be visible. + */ + var todayBtn + get() = input.todayBtn + set(value) { + input.todayBtn = value + } + /** + * Determines if the current day should be highlighted. + */ + var todayHighlight + get() = input.todayHighlight + set(value) { + input.todayHighlight = value + } + /** + * The increment used to build the hour view. + */ + var minuteStep + get() = input.minuteStep + set(value) { + input.minuteStep = value + } + /** + * Determines if meridian views are visible in day and hour views. + */ + var showMeridian + get() = input.showMeridian + set(value) { + input.showMeridian = value + } + /** + * The label text bound to the input element. + */ + var label + get() = flabel.content + set(value) { + flabel.content = value + } + /** + * Determines if [label] can contain HTML code. + */ + var rich + get() = flabel.rich + set(value) { + flabel.rich = value + } + + private val idc = "kv_form_time_$counter" + final override val input: DateTimeInput = DateTimeInput(value, format).apply { + this.id = idc + this.name = name + } + final override val flabel: FieldLabel = FieldLabel(idc, label, rich) + final override val invalidFeedback: InvalidFeedback = InvalidFeedback().apply { visible = false } + + init { + @Suppress("LeakingThis") + input.eventTarget = this + this.addInternal(flabel) + this.addInternal(input) + this.addInternal(invalidFeedback) + counter++ + } + + override fun getSnClass(): List<StringBoolPair> { + val cl = super.getSnClass().toMutableList() + if (validatorError != null) { + cl.add("text-danger" to true) + } + return cl + } + + @Suppress("UNCHECKED_CAST") + override fun <T : Widget> setEventListener(block: SnOn<T>.() -> Unit): Widget { + input.setEventListener(block) + return this + } + + override fun setEventListener(block: SnOn<Widget>.() -> Unit): Widget { + input.setEventListener(block) + return this + } + + override fun removeEventListeners(): Widget { + input.removeEventListeners() + return this + } + + /** + * Open date/time chooser popup. + */ + open fun showPopup() { + input.showPopup() + } + + /** + * Hides date/time chooser popup. + */ + open fun hidePopup() { + input.hidePopup() + } + + override fun getValueAsString(): String? { + return input.getValueAsString() + } + + override fun focus() { + input.focus() + } + + override fun blur() { + input.blur() + } + + companion object { + internal var counter = 0 + + /** + * DSL builder extension function. + * + * It takes the same parameters as the constructor of the built component. + */ + fun Container.dateTime( + value: Date? = null, name: String? = null, format: String = "YYYY-MM-DD HH:mm", label: String? = null, + rich: Boolean = false, init: (DateTime.() -> Unit)? = null + ): DateTime { + val dateTime = DateTime(value, name, format, label, rich).apply { init?.invoke(this) } + this.add(dateTime) + return dateTime + } + } +} diff --git a/kvision-modules/kvision-bootstrap-datetime/src/main/kotlin/pl/treksoft/kvision/form/time/DateTimeInput.kt b/kvision-modules/kvision-bootstrap-datetime/src/main/kotlin/pl/treksoft/kvision/form/time/DateTimeInput.kt new file mode 100644 index 00000000..66cb6cc0 --- /dev/null +++ b/kvision-modules/kvision-bootstrap-datetime/src/main/kotlin/pl/treksoft/kvision/form/time/DateTimeInput.kt @@ -0,0 +1,328 @@ +/* + * Copyright (c) 2017-present Robert Jaros + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + */ +package pl.treksoft.kvision.form.time + +import com.github.snabbdom.VNode +import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.core.StringBoolPair +import pl.treksoft.kvision.core.StringPair +import pl.treksoft.kvision.core.Widget +import pl.treksoft.kvision.form.FormInput +import pl.treksoft.kvision.form.InputSize +import pl.treksoft.kvision.form.ValidationStatus +import pl.treksoft.kvision.i18n.I18n +import pl.treksoft.kvision.types.toDateF +import pl.treksoft.kvision.types.toStringF +import pl.treksoft.kvision.utils.obj +import kotlin.js.Date + +internal const val DEFAULT_MINUTE_STEP = 5 +internal const val MAX_VIEW = 4 + +/** + * Basic date/time chooser component. + * + * @constructor + * @param value date/time input value + * @param format date/time format (default YYYY-MM-DD HH:mm) + * @param classes a set of CSS class names + */ +@Suppress("TooManyFunctions") +open class DateTimeInput( + value: Date? = null, format: String = "YYYY-MM-DD HH:mm", + classes: Set<String> = setOf() +) : Widget(classes + "form-control"), FormInput { + + private var initialized = false + + init { + this.setInternalEventListener< |