diff --git a/WebApp/src/jsMain/kotlin/main.kt b/WebApp/src/jsMain/kotlin/main.kt index 1d35337..c6d6bb2 100644 --- a/WebApp/src/jsMain/kotlin/main.kt +++ b/WebApp/src/jsMain/kotlin/main.kt @@ -1,6 +1,7 @@ import dev.inmo.micro_utils.coroutines.launchSafelyWithoutExceptions import dev.inmo.tgbotapi.types.webAppQueryIdField import dev.inmo.tgbotapi.webapps.* +import dev.inmo.tgbotapi.webapps.cloud.* import dev.inmo.tgbotapi.webapps.haptic.HapticFeedbackStyle import dev.inmo.tgbotapi.webapps.haptic.HapticFeedbackType import dev.inmo.tgbotapi.webapps.popup.* @@ -14,9 +15,9 @@ import kotlinx.browser.window import kotlinx.coroutines.* import kotlinx.dom.appendElement import kotlinx.dom.appendText +import kotlinx.dom.clear import kotlinx.serialization.json.Json -import org.w3c.dom.HTMLButtonElement -import org.w3c.dom.HTMLElement +import org.w3c.dom.* import kotlin.random.Random import kotlin.random.nextUBytes @@ -177,7 +178,7 @@ fun main() { document.body ?.appendElement("button") { fun updateHeaderColor() { val (r, g, b) = Random.nextUBytes(3) - val hex = Color.Hex("#${r.toString(16)}${g.toString(16)}${b.toString(16)}") + val hex = Color.Hex(r, g, b) webApp.setHeaderColor(hex) (this as? HTMLButtonElement) ?.style ?.backgroundColor = hex.value textContent = "Header color: ${hex.value.uppercase()} (click to change)" @@ -190,6 +191,75 @@ fun main() { document.body ?.appendElement("p", {}) + fun Element.updateCloudStorageContent() { + clear() + webApp.cloudStorage.getAll { + it.onSuccess { + document.body ?.log(it.toString()) + appendElement("label") { textContent = "Cloud storage" } + + appendElement("p", {}) + + it.forEach { (k, v) -> + appendElement("div") { + val kInput = appendElement("input", {}) as HTMLInputElement + val vInput = appendElement("input", {}) as HTMLInputElement + + kInput.value = k.key + vInput.value = v.value + + appendElement("button") { + addEventListener("click", { + if (k.key == kInput.value) { + webApp.cloudStorage.set(k.key, vInput.value) { + document.body ?.log(it.toString()) + this@updateCloudStorageContent.updateCloudStorageContent() + } + } else { + webApp.cloudStorage.remove(k.key) { + it.onSuccess { + webApp.cloudStorage.set(kInput.value, vInput.value) { + document.body ?.log(it.toString()) + this@updateCloudStorageContent.updateCloudStorageContent() + } + } + } + } + }) + this.textContent = "Save" + } + } + + appendElement("p", {}) + } + appendElement("label") { textContent = "Cloud storage: add new" } + + appendElement("p", {}) + + appendElement("div") { + val kInput = appendElement("input", {}) as HTMLInputElement + + appendElement("button") { + textContent = "Add key" + addEventListener("click", { + webApp.cloudStorage.set(kInput.value, kInput.value) { + document.body ?.log(it.toString()) + this@updateCloudStorageContent.updateCloudStorageContent() + } + }) + } + } + + appendElement("p", {}) + }.onFailure { + document.body ?.log(it.stackTraceToString()) + } + } + } + val cloudStorageContentDiv = document.body ?.appendElement("div") {} as HTMLDivElement + + document.body ?.appendElement("p", {}) + webApp.apply { onThemeChanged { document.body ?.log("Theme changed: ${webApp.themeParams}") @@ -227,6 +297,10 @@ fun main() { } } webApp.ready() + document.body ?.appendElement("input", { + (this as HTMLInputElement).value = window.location.href + }) + cloudStorageContentDiv.updateCloudStorageContent() }.onFailure { window.alert(it.stackTraceToString()) }