diff options
Diffstat (limited to 'sw-ui/src/main')
10 files changed, 66 insertions, 20 deletions
diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Board.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Board.kt index 03177cca..30efc894 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Board.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Board.kt @@ -7,6 +7,7 @@ import kotlinx.html.HTMLTag import kotlinx.html.IMG import kotlinx.html.title import org.luxons.sevenwonders.model.boards.Board +import org.luxons.sevenwonders.model.boards.Military import org.luxons.sevenwonders.model.cards.TableCard import org.luxons.sevenwonders.model.wonders.ApiWonder import org.luxons.sevenwonders.model.wonders.ApiWonderStage @@ -25,7 +26,7 @@ fun RBuilder.boardComponent(board: Board, block: StyledDOMBuilder<DIV>.() -> Uni styledDiv { block() tableCards(cardColumns = board.playedCards) - wonderComponent(wonder = board.wonder) + wonderComponent(wonder = board.wonder, military = board.military) } } @@ -83,7 +84,7 @@ private fun RBuilder.tableCard(card: TableCard, indexInColumn: Int, block: Style } } -private fun RBuilder.wonderComponent(wonder: ApiWonder) { +private fun RBuilder.wonderComponent(wonder: ApiWonder, military: Military) { styledDiv { css { position = Position.relative @@ -112,11 +113,26 @@ private fun RBuilder.wonderComponent(wonder: ApiWonder) { this.alt = "Wonder ${wonder.name}" } } + victoryPoints(military.totalPoints) { + css { + position = Position.absolute + top = 25.pct // below the wonder name + left = 60.pct + zIndex = 2 // go above the wonder, but below the table cards + } + } + defeatTokenCount(military.nbDefeatTokens) { + css { + position = Position.absolute + top = 25.pct // below the wonder name + left = 80.pct + zIndex = 2 // go above the wonder, but below the table cards + } + } wonder.stages.forEachIndexed { index, stage -> wonderStageElement(stage) { css { - wonderCardStyle() - left = stagePositionPercent(index, wonder.stages.size).pct + wonderCardStyle(index, wonder.stages.size) } } } @@ -124,6 +140,38 @@ private fun RBuilder.wonderComponent(wonder: ApiWonder) { } } +private fun RBuilder.victoryPoints(points: Int, block: StyledDOMBuilder<DIV>.() -> Unit = {}) { + boardToken("military/victory1", points, block) +} + +private fun RBuilder.defeatTokenCount(nbDefeatTokens: Int, block: StyledDOMBuilder<DIV>.() -> Unit = {}) { + boardToken("military/defeat1", nbDefeatTokens, block) +} + +private fun RBuilder.boardToken(tokenName: String, count: Int, block: StyledDOMBuilder<DIV>.() -> Unit) { + tokenWithCount( + tokenName = tokenName, + count = count, + countPosition = TokenCountPosition.RIGHT, + brightText = true + ) { + css { + filter = "drop-shadow(0.2rem 0.2rem 0.5rem black)" + height = 15.pct + } + block() + } +} + +private fun CSSBuilder.wonderCardStyle(stageIndex: Int, nbStages: Int) { + position = Position.absolute + top = 60.pct + left = stagePositionPercent(stageIndex, nbStages).pct + maxWidth = 24.pct + maxHeight = 90.pct + zIndex = -1 +} + private fun RBuilder.wonderStageElement(stage: ApiWonderStage, block: StyledDOMBuilder<HTMLTag>.() -> Unit) { val back = stage.cardBack if (back != null) { diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/BoardSummary.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/BoardSummary.kt index 715fc25d..05a043bf 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/BoardSummary.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/BoardSummary.kt @@ -103,7 +103,7 @@ private fun StyledDOMBuilder<DIV>.generalCounts( brightText = countPosition == TokenCountPosition.OVER ) tokenWithCount( - tokenName = "military", + tokenName = "military/shield", count = board.military.nbShields, imgSize = tokenSize, countPosition = countPosition, @@ -117,21 +117,21 @@ private fun RBuilder.scienceTokens( sciencePosition: TokenCountPosition ) { tokenWithCount( - tokenName = "compass", + tokenName = "science/compass", count = board.science.nbCompasses, imgSize = tokenSize, countPosition = sciencePosition, brightText = sciencePosition == TokenCountPosition.OVER ) tokenWithCount( - tokenName = "cog", + tokenName = "science/cog", count = board.science.nbWheels, imgSize = tokenSize, countPosition = sciencePosition, brightText = sciencePosition == TokenCountPosition.OVER ) tokenWithCount( - tokenName = "tablet", + tokenName = "science/tablet", count = board.science.nbTablets, imgSize = tokenSize, countPosition = sciencePosition, diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/ProductionBar.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/ProductionBar.kt index a3e4cd11..b7684b2b 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/ProductionBar.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/ProductionBar.kt @@ -54,7 +54,7 @@ private fun RBuilder.fixedResources(resources: List<CountedResource>) { display = Display.flex } resources.forEach { - tokenWithCount(tokenName = getResourceTokenName(it.type), count = it.count) { + tokenWithCount(tokenName = getResourceTokenName(it.type), count = it.count, imgSize = 3.rem) { attrs { key = it.type.toString() } css { marginLeft = 1.rem } } @@ -85,7 +85,7 @@ private fun RBuilder.resourceChoice(types: Set<ResourceType>, block: StyledDOMBu } block() for ((i, t) in types.withIndex()) { - tokenImage(tokenName = getResourceTokenName(t)) { + tokenImage(tokenName = getResourceTokenName(t), size = 3.rem) { attrs { this.key = t.toString() } } if (i < types.indices.last) { diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Tokens.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Tokens.kt index d8ace2ee..7d19b17a 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Tokens.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Tokens.kt @@ -34,7 +34,7 @@ fun RBuilder.tokenWithCount( tokenName: String, count: Int, title: String = tokenName, - imgSize: LinearDimension = 3.rem, + imgSize: LinearDimension? = null, countPosition: TokenCountPosition = TokenCountPosition.RIGHT, brightText: Boolean = false, customCountStyle: CSSBuilder.() -> Unit = {}, @@ -42,7 +42,7 @@ fun RBuilder.tokenWithCount( ) { styledDiv { block() - val tokenCountSize = imgSize * 0.6 + val tokenCountSize = if (imgSize != null) imgSize * 0.6 else 1.5.rem when (countPosition) { TokenCountPosition.RIGHT -> { tokenImage(tokenName, title = title, size = imgSize) @@ -84,12 +84,16 @@ fun RBuilder.tokenWithCount( fun RBuilder.tokenImage( tokenName: String, title: String = tokenName, - size: LinearDimension = 3.rem, + size: LinearDimension?, block: StyledDOMBuilder<IMG>.() -> Unit = {} ) { styledImg(src = getTokenImagePath(tokenName)) { css { - tokenImageStyle(size) + height = size ?: 100.pct + if (size != null) { + width = size + } + verticalAlign = VerticalAlign.middle } attrs { this.title = title @@ -101,12 +105,6 @@ fun RBuilder.tokenImage( private fun getTokenImagePath(tokenName: String) = "/images/tokens/$tokenName.png" -private fun CSSBuilder.tokenImageStyle(size: LinearDimension) { - height = size - width = size - verticalAlign = VerticalAlign.middle -} - private fun CSSBuilder.tokenCountStyle( size: LinearDimension, brightText: Boolean, diff --git a/sw-ui/src/main/resources/images/tokens/military/defeat1.png b/sw-ui/src/main/resources/images/tokens/military/defeat1.png Binary files differnew file mode 100644 index 00000000..00a615c7 --- /dev/null +++ b/sw-ui/src/main/resources/images/tokens/military/defeat1.png diff --git a/sw-ui/src/main/resources/images/tokens/military.png b/sw-ui/src/main/resources/images/tokens/military/shield.png Binary files differindex 3a0e1dea..3a0e1dea 100644 --- a/sw-ui/src/main/resources/images/tokens/military.png +++ b/sw-ui/src/main/resources/images/tokens/military/shield.png diff --git a/sw-ui/src/main/resources/images/tokens/military/victory1.png b/sw-ui/src/main/resources/images/tokens/military/victory1.png Binary files differnew file mode 100644 index 00000000..6b9aff29 --- /dev/null +++ b/sw-ui/src/main/resources/images/tokens/military/victory1.png diff --git a/sw-ui/src/main/resources/images/tokens/cog.png b/sw-ui/src/main/resources/images/tokens/science/cog.png Binary files differindex 61250d8a..61250d8a 100644 --- a/sw-ui/src/main/resources/images/tokens/cog.png +++ b/sw-ui/src/main/resources/images/tokens/science/cog.png diff --git a/sw-ui/src/main/resources/images/tokens/compass.png b/sw-ui/src/main/resources/images/tokens/science/compass.png Binary files differindex 6497e34f..6497e34f 100644 --- a/sw-ui/src/main/resources/images/tokens/compass.png +++ b/sw-ui/src/main/resources/images/tokens/science/compass.png diff --git a/sw-ui/src/main/resources/images/tokens/tablet.png b/sw-ui/src/main/resources/images/tokens/science/tablet.png Binary files differindex 954fd9ef..954fd9ef 100644 --- a/sw-ui/src/main/resources/images/tokens/tablet.png +++ b/sw-ui/src/main/resources/images/tokens/science/tablet.png |
