diff options
Diffstat (limited to 'sw-ui-kt/src/main')
6 files changed, 76 insertions, 28 deletions
diff --git a/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/GlobalStyles.kt b/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/GlobalStyles.kt new file mode 100644 index 00000000..f5b16248 --- /dev/null +++ b/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/GlobalStyles.kt @@ -0,0 +1,36 @@ +package org.luxons.sevenwonders.ui.components + +import kotlinx.css.Overflow +import kotlinx.css.Position +import kotlinx.css.bottom +import kotlinx.css.left +import kotlinx.css.overflow +import kotlinx.css.pct +import kotlinx.css.position +import kotlinx.css.properties.transform +import kotlinx.css.properties.translate +import kotlinx.css.px +import kotlinx.css.right +import kotlinx.css.top +import styled.StyleSheet + +object GlobalStyles : StyleSheet("GlobalStyles", isStatic = true) { + + val fullscreen by css { + position = Position.fixed + top = 0.px + left = 0.px + bottom = 0.px + right = 0.px + overflow = Overflow.hidden + } + + val fixedCenter by css { + position = Position.fixed + left = 50.pct + top = 50.pct + transform { + translate((-50).pct, (-50).pct) + } + } +} diff --git a/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameScene.kt b/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameScene.kt index 48c993fc..2551b43c 100644 --- a/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameScene.kt +++ b/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameScene.kt @@ -3,15 +3,12 @@ package org.luxons.sevenwonders.ui.components.game import com.palantir.blueprintjs.Intent import com.palantir.blueprintjs.bpButton import com.palantir.blueprintjs.bpButtonGroup -import com.palantir.blueprintjs.org.luxons.sevenwonders.ui.components.game.handComponent -import kotlinx.css.CSSBuilder -import kotlinx.css.Overflow +import com.palantir.blueprintjs.bpOverlay import kotlinx.css.Position import kotlinx.css.background import kotlinx.css.backgroundSize import kotlinx.css.bottom import kotlinx.css.left -import kotlinx.css.overflow import kotlinx.css.pct import kotlinx.css.position import kotlinx.css.properties.transform @@ -25,9 +22,12 @@ import org.luxons.sevenwonders.model.Action import org.luxons.sevenwonders.model.PlayerMove import org.luxons.sevenwonders.model.PlayerTurnInfo import org.luxons.sevenwonders.model.api.PlayerDTO +import org.luxons.sevenwonders.model.cards.HandCard +import org.luxons.sevenwonders.ui.components.GlobalStyles import org.luxons.sevenwonders.ui.redux.GameState import org.luxons.sevenwonders.ui.redux.RequestPrepareMove import org.luxons.sevenwonders.ui.redux.RequestSayReady +import org.luxons.sevenwonders.ui.redux.RequestUnprepareMove import org.luxons.sevenwonders.ui.redux.connectStateAndDispatch import react.RBuilder import react.RClass @@ -45,11 +45,13 @@ interface GameSceneStateProps: RProps { var players: List<PlayerDTO> var gameState: GameState? var preparedMove: PlayerMove? + var preparedCard: HandCard? } interface GameSceneDispatchProps: RProps { var sayReady: () -> Unit var prepareMove: (move: PlayerMove) -> Unit + var unprepareMove: () -> Unit } interface GameSceneProps : GameSceneStateProps, GameSceneDispatchProps @@ -61,7 +63,7 @@ private class GameScene(props: GameSceneProps) : RComponent<GameSceneProps, RSta css { background = "url('images/background-papyrus3.jpg')" backgroundSize = "cover" - fullScreen() + +GlobalStyles.fullscreen } val turnInfo = props.gameState?.turnInfo if (turnInfo == null) { @@ -114,6 +116,28 @@ private class GameScene(props: GameSceneProps) : RComponent<GameSceneProps, RSta prepareMove = props.prepareMove ) } + val card = props.preparedCard + if (card != null) { + bpOverlay(isOpen = true, onClose = props.unprepareMove) { + styledDiv { + css { +GlobalStyles.fixedCenter } + cardImage(card) + styledDiv { + css { + position = Position.absolute + top = 0.px + right = 0.px + } + bpButton( + icon = "cross", + title = "Cancel prepared move", + small = true, + intent = Intent.DANGER, onClick = { props.unprepareMove() } + ) + } + } + } + } if (turnInfo.action == Action.SAY_READY) { sayReadyButton { css { @@ -136,6 +160,7 @@ private val gameScene: RClass<GameSceneProps> = connectStateAndDispatch<GameScen clazz = GameScene::class, mapDispatchToProps = { dispatch, _ -> prepareMove = { move -> dispatch(RequestPrepareMove(move)) } + unprepareMove = { dispatch(RequestUnprepareMove()) } sayReady = { dispatch(RequestSayReady()) } }, mapStateToProps = { state, _ -> @@ -143,14 +168,7 @@ private val gameScene: RClass<GameSceneProps> = connectStateAndDispatch<GameScen players = state.gameState?.players ?: emptyList() gameState = state.gameState preparedMove = state.gameState?.currentPreparedMove + preparedCard = state.gameState?.currentPreparedCard } ) -private fun CSSBuilder.fullScreen() { - position = Position.fixed - top = 0.px - left = 0.px - bottom = 0.px - right = 0.px - overflow = Overflow.hidden -} diff --git a/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Hand.kt b/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Hand.kt index 985b3deb..17ceffd2 100644 --- a/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Hand.kt +++ b/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Hand.kt @@ -1,4 +1,4 @@ -package com.palantir.blueprintjs.org.luxons.sevenwonders.ui.components.game +package org.luxons.sevenwonders.ui.components.game import com.palantir.blueprintjs.Intent import com.palantir.blueprintjs.bpButton diff --git a/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/home/Home.kt b/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/home/Home.kt index 458dc7c4..43a1592b 100644 --- a/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/home/Home.kt +++ b/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/home/Home.kt @@ -1,5 +1,6 @@ package org.luxons.sevenwonders.ui.components.home +import org.luxons.sevenwonders.ui.components.GlobalStyles import react.RBuilder import react.dom.* import styled.css @@ -9,9 +10,9 @@ private const val LOGO = "images/logo-7-wonders.png" fun RBuilder.home() = styledDiv { css { - +HomeStyles.fullscreen - +HomeStyles.center - +HomeStyles.homeRoot + +GlobalStyles.fullscreen + +HomeStyles.centerChildren + +HomeStyles.zeusBackground } img(src = LOGO, alt = "Seven Wonders") {} diff --git a/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/home/HomeStyles.kt b/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/home/HomeStyles.kt index 3686f35c..624f430c 100644 --- a/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/home/HomeStyles.kt +++ b/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/components/home/HomeStyles.kt @@ -5,24 +5,15 @@ import styled.StyleSheet object HomeStyles : StyleSheet("HomeStyles", isStatic = true) { - val homeRoot by css { + val zeusBackground by css { background = "url('images/background-zeus-temple.jpg') center no-repeat" backgroundSize = "cover" } - val center by css { + val centerChildren by css { display = Display.flex flexDirection = FlexDirection.column alignItems = Align.center justifyContent = JustifyContent.center } - - val fullscreen by css { - position = Position.fixed - top = 0.px - left = 0.px - bottom = 0.px - right = 0.px - overflow = Overflow.hidden - } } diff --git a/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/redux/sagas/GameSagas.kt b/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/redux/sagas/GameSagas.kt index c1788c98..a9c2ca2c 100644 --- a/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/redux/sagas/GameSagas.kt +++ b/sw-ui-kt/src/main/kotlin/org/luxons/sevenwonders/ui/redux/sagas/GameSagas.kt @@ -8,6 +8,7 @@ import org.luxons.sevenwonders.ui.redux.PreparedCardEvent import org.luxons.sevenwonders.ui.redux.PreparedMoveEvent import org.luxons.sevenwonders.ui.redux.RequestPrepareMove import org.luxons.sevenwonders.ui.redux.RequestSayReady +import org.luxons.sevenwonders.ui.redux.RequestUnprepareMove import org.luxons.sevenwonders.ui.redux.TurnInfoEvent suspend fun SwSagaContext.gameSaga(session: SevenWondersSession) { @@ -17,6 +18,7 @@ suspend fun SwSagaContext.gameSaga(session: SevenWondersSession) { val preparedCardsSub = session.watchPreparedCards(game.id) val turnInfoSub = session.watchTurns() val sayReadyJob = launch { onEach<RequestSayReady> { session.sayReady() } } + val unprepareJob = launch { onEach<RequestUnprepareMove> { session.unprepareMove() } } val prepareMoveJob = launch { onEach<RequestPrepareMove> { val move = session.prepareMove(it.move) |