import QtQuick
import QtQuick.Layouts
import QtQuick.Controls

import roulette

Item {
    ColumnLayout {

        anchors {
            left: parent.left
            leftMargin: 532
            top: parent.top
            topMargin: 68
        }

        spacing: 2

        Repeater {
            model: 3

            Item {

                id: betButton
                height: 43
                width: 35

                Rectangle {
                    id: selected
                    visible: true
                    height: parent.height
                    width: parent.width
                    border.color: "blue"
                    border.width: 0

                    color: {
                        if (rouletteTable.numberOfBets < 2 || border.width == 2) {
                            if (tapHandler1.pressed) {
                                "#AA999999"
                            } else if (hoverHandler.hovered) {
                                "#AAEEEEEE"
                            } else {
                                "#00000000"
                            }
                        } else {
                            "#00000000"
                        }
                    }

                    HoverHandler {
                        id: hoverHandler
                    }
                    TapHandler {
                        id: tapHandler1

                        onTapped: {
                            if (rouletteTable.numberOfBets < 2 && parent.border.width == 0) {
                                parent.border.width = 2
                                roulette.showBetInputDialog(PlayerAreaModel.COLUMN, index, betButton.x, betButton.y)
                            } else if (parent.border.width == 2) {
                                parent.border.width = 0
                                PlayerAreaModel.removeBet(PlayerAreaModel.COLUMN, index)
                                rouletteTable.numberOfBets -= 1
                            }
                        }
                    }

                    Connections {
                        target: PlayerAreaModel

                        function onFocusedPlayerChanged(b1, n1, b2, n2) {
                            if (b1 == PlayerAreaModel.COLUMN && n1 == index) {
                                if (selected.border.width != 0) {
                                    rouletteTable.numberOfBets -=1
                                }

                                selected.border.width = 2;
                                rouletteTable.numberOfBets += 1
                            } else if (b2 == PlayerAreaModel.COLUMN && n2 == index) {
                                if (selected.border.width != 0) {
                                    rouletteTable.numberOfBets -=1
                                }

                                selected.border.width = 2;
                                rouletteTable.numberOfBets += 1
                            } else {
                                if (selected.border.width != 0) {
                                    rouletteTable.numberOfBets -=1
                                }
                                selected.border.width = 0;
                            }
                        }

                        function onBetCanceled(b, n) {
                            if (b == PlayerAreaModel.COLUMN && index == n) {
                                selected.border.width = 0
                            }
                        }
                    }
                }
            }
        }
    }
}