From fc557b04b75d089cb4d333dedbd33bef97e5aa02 Mon Sep 17 00:00:00 2001 From: akuleshov7 Date: Mon, 9 Sep 2024 14:12:49 +0300 Subject: [PATCH] Adding randomizer machine: fix --- .../kotlin/ru/posidata/views/main/MainView.kt | 184 ++++++++++-------- 1 file changed, 101 insertions(+), 83 deletions(-) diff --git a/frontend/src/jsMain/kotlin/ru/posidata/views/main/MainView.kt b/frontend/src/jsMain/kotlin/ru/posidata/views/main/MainView.kt index 2dbcfdb..886b746 100644 --- a/frontend/src/jsMain/kotlin/ru/posidata/views/main/MainView.kt +++ b/frontend/src/jsMain/kotlin/ru/posidata/views/main/MainView.kt @@ -3,6 +3,7 @@ package ru.posidata.views.main import js.objects.jso import react.* import react.dom.html.ReactHTML +import react.dom.html.ReactHTML.button import react.dom.html.ReactHTML.div import ru.posidata.common.Answer.NONE import ru.posidata.common.Selection @@ -15,6 +16,8 @@ import ru.posidata.common.UserForSerializationDTO import web.cssom.* val mainView = FC { + val (luckyDraw, setLuckyDraw) = useState(false) + Particles::class.react { id = "tsparticles" url = "${kotlinx.browser.window.location.origin}/particles.json" @@ -28,122 +31,137 @@ val mainView = FC { val (user, setUser) = useState(null) val (tgUser, setTgUser) = useState(null) - div { - className = ClassName("full-width-container") + if (!luckyDraw) { div { - className = ClassName("row justify-content-center align-items-center") - style = jso { - minHeight = "100vh".unsafeCast() - } - + className = ClassName("full-width-container") div { - id = "back" - className = ClassName("card col-xl-4 col-lg-5 col-md-7 col-sm-8 col-12") + className = ClassName("row justify-content-center align-items-center") style = jso { - minHeight = "80vh".unsafeCast() - borderRadius = "40px 40px 40px 40px".unsafeCast() - boxShadow = "10px 10px 20px rgba(0, 0, 0, 0.5)".unsafeCast() + minHeight = "100vh".unsafeCast() } - headerRow {} - div { - className = ClassName("row justify-content-center text-white mt-3 ") + id = "back" + className = ClassName("card col-xl-4 col-lg-5 col-md-7 col-sm-8 col-12") style = jso { - zIndex = "1000".unsafeCast() - minHeight = "53vh".unsafeCast() - display = Display.flex + minHeight = "80vh".unsafeCast() + borderRadius = "40px 40px 40px 40px".unsafeCast() + boxShadow = "10px 10px 20px rgba(0, 0, 0, 0.5)".unsafeCast() } - if (user != null && user.gameNumber() == 4) { - ReactHTML.h6 { - className = ClassName("mb-2 text-white mx-2") - +"Ты отыграл уже три раза, в рейтинге участвовать больше не получится, обнови страницу если хочешь просто пройти тест. Твои результаты:" + headerRow {} + + div { + className = ClassName("row justify-content-center text-white mt-3 ") + style = jso { + zIndex = "1000".unsafeCast() + minHeight = "53vh".unsafeCast() + display = Display.flex } - ReactHTML.h6 { - className = ClassName("mb-2 text-center") - style = jso { - color = "yellow".unsafeCast() - } - +"${user.firstGameScore}/12" - } - ReactHTML.h6 { - className = ClassName("mb-2 text-center") - style = jso { - color = "yellow".unsafeCast() - } - +"${user.firstGameScore}/12" - } - ReactHTML.h6 { - className = ClassName("mb-2 text-center") - style = jso { - color = "yellow".unsafeCast() + if (user != null && user.gameNumber() == 4) { + ReactHTML.h6 { + className = ClassName("mb-2 text-white mx-2") + +"Ты отыграл уже три раза, в рейтинге участвовать больше не получится, обнови страницу если хочешь просто пройти тест. Твои результаты:" + } - +"${user.thirdGameScore}/12" - } - } else { - when (selection) { - Selection.NONE -> { - welcomeCard { - this.setSelection = setSelection - this.setUser = setUser - this.tgUser = tgUser - this.setTgUser = setTgUser + ReactHTML.h6 { + className = ClassName("mb-2 text-center") + style = jso { + color = "yellow".unsafeCast() } + +"${user.firstGameScore}/12" } - - QUESTION -> questionCard { - this.counter = counter - this.setCounter = setCounter - this.answers = answers - this.setAnswers = setAnswers - this.setPokemonId = setPokemonId - this.pokemonId = pokemonId - this.setSelection = setSelection - this.uniqueRandom = uniqueRandom - this.setUniqueRandom = setUniqueRandom - - this.user = user - this.tgUser = tgUser - this.setUser = setUser + ReactHTML.h6 { + className = ClassName("mb-2 text-center") + style = jso { + color = "yellow".unsafeCast() + } + +"${user.firstGameScore}/12" } - - ANSWER -> { - answerCard { - this.setSelection = setSelection - this.counter = counter - this.pokemonId = pokemonId - this.answers = answers + ReactHTML.h6 { + className = ClassName("mb-2 text-center") + style = jso { + color = "yellow".unsafeCast() } + +"${user.thirdGameScore}/12" } + } else { + when (selection) { + Selection.NONE -> { + welcomeCard { + this.setSelection = setSelection + this.setUser = setUser + this.tgUser = tgUser + this.setTgUser = setTgUser + } + } - RESULTS -> { - resultCard { + QUESTION -> questionCard { this.counter = counter - this.answers = answers - this.setSelection = setSelection this.setCounter = setCounter + this.answers = answers this.setAnswers = setAnswers - this.setUniqueRandom = setUniqueRandom + this.setPokemonId = setPokemonId + this.pokemonId = pokemonId this.setSelection = setSelection + this.uniqueRandom = uniqueRandom + this.setUniqueRandom = setUniqueRandom this.user = user this.tgUser = tgUser this.setUser = setUser } + + ANSWER -> { + answerCard { + this.setSelection = setSelection + this.counter = counter + this.pokemonId = pokemonId + this.answers = answers + } + } + + RESULTS -> { + resultCard { + this.counter = counter + this.answers = answers + this.setSelection = setSelection + this.setCounter = setCounter + this.setAnswers = setAnswers + this.setUniqueRandom = setUniqueRandom + this.setSelection = setSelection + + this.user = user + this.tgUser = tgUser + this.setUser = setUser + } + } } } } - } - if (selection != Selection.NONE) { - progressBar { - this.counter = counter - this.selection = selection - this.answers = answers + if (selection != Selection.NONE) { + progressBar { + this.counter = counter + this.selection = selection + this.answers = answers + } + } + + button { + className = ClassName("btn btn-outline-info btn-lg") + onClick = { + setLuckyDraw(true) + } + +"Розыгрыш" } } } } + } else { + luckyDrawCard { + + } } } +