pragma ComponentBehavior: Bound
import QtQuick

import "topbar"

Item {
    id: topbar
    implicitWidth: 1312
    implicitHeight: 182

    anchors.centerIn: parent

    property var iconSources: ["item.png", "equip.png", "power.png", "config.png"]
    property int iconCount: iconSources.length
    property int selectedIndex: 0

    function moveSelection(delta) {
        if (iconCount <= 0)
            return;
        selectedIndex = (selectedIndex + delta + iconCount) % iconCount;
    }

    onIconCountChanged: {
        if (iconCount <= 0) {
            selectedIndex = 0;
        } else if (selectedIndex >= iconCount) {
            selectedIndex = iconCount - 1;
        }
    }

    DarkDollarsDisplay {}

    Image {
        source: "./topbar/setting_names/" + topbar.iconSources[topbar.selectedIndex]
        x: -64
    }

    FocusScope {
        id: focusScope
        focus: true
        anchors.fill: parent
        Keys.onLeftPressed: topbar.moveSelection(-1)
        Keys.onRightPressed: topbar.moveSelection(1)
        Component.onCompleted: forceActiveFocus()

        Row {
            id: iconRow
            spacing: 76
            anchors.horizontalCenter: parent.horizontalCenter
            y: 45
            anchors.horizontalCenterOffset: -38

            Repeater {
                model: topbar.iconSources

                delegate: Item {
                    id: repeatitem
                    required property int index
                    width: 149
                    height: 108

                    TopbarSettingIcon {
                        anchors.centerIn: parent
                        selected: topbar.selectedIndex == repeatitem.index
                        iconSource: topbar.iconSources[repeatitem.index]
                    }

                    MouseArea {
                        anchors.fill: parent
                        onClicked: {
                            topbar.selectedIndex = repeatitem.index;
                        }
                    }
                }
            }
        }
    }
}