diff --git a/img/flip_icon.svg b/img/flip_icon.svg index 20dd973..5bdc4df 100644 --- a/img/flip_icon.svg +++ b/img/flip_icon.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/qml/DrawPile.qml b/qml/DrawPile.qml index d1cfec9..f812165 100644 --- a/qml/DrawPile.qml +++ b/qml/DrawPile.qml @@ -8,20 +8,36 @@ Item { CardModel { id: drawPileCard + anchors.fill: parent + visible: GameState.drawPile.length > 0 card: GameState.drawPile.length > 0 ? GameState.drawPile[GameState.drawPile.length - 1] : null isFaceDown: GameState.drawPile.length > 0 ? true : false - onClicked: { - if (GameState.drawNextCard()) { - if (GameState.isWinnable()) { - console.log("Still winnable") - } else { - console.warn("Game is lost") - } - } + } + + Rectangle { + id: emptyPileRect + + anchors.fill: parent + visible: GameState.drawPile.length === 0 + + color: "gray" + border.color: "white" + border.width: 3 + opacity: 0.4 + radius: 10 + + Image { + id: flipIcon + + anchors.centerIn: parent + visible: GameState.throwawayPile.length > 0 + + source: "qrc:/img/flip_icon.svg" + width: parent.width * 0.5 + height: width } - z: 0 } Rectangle { @@ -29,28 +45,41 @@ Item { color: "black" opacity: 0.7 - visible: cardCount.visible - width: cardCount.width + 8 // 8px padding - height: cardCount.height + 8 // ^^ + width: cardCountText.width + 8 // 8px padding + height: cardCountText.height + 8 // ^^ + visible: drawPileCard.visible anchors.bottom: parent.bottom anchors.left: parent.left anchors.margins: 4 - radius: 4 // rounded borders + radius: 4 z: 1 // Behind the text, but above the card } Text { - id: cardCount + id: cardCountText text: GameState.drawPile.length - visible: GameState.drawPile.length > 0 color: "white" font.pixelSize: 16 font.bold: true + visible: drawPileCard.visible anchors.centerIn: cardCountBackground z: 2 } + + MouseArea { + anchors.fill: parent + onClicked: { + if (GameState.drawNextCard()) { + if (GameState.isWinnable()) { + console.log("Still winnable"); + } else { + console.warn("Game is lost"); + } + } + } + } }