import QtQuick
import Nebula.Bigscreen

Item {
    id: root

    property var tiles: []
    property int focusIndex: 0
    property real accentFocus: 0

    signal tileActivated(int index)

    implicitHeight: Theme.tileHeight + 24

    onFocusIndexChanged: root.accentFocus = focusIndex / Math.max(1, tiles.length - 1)

    Row {
        id: rail
        anchors.verticalCenter: parent.verticalCenter
        anchors.left: parent.left
        anchors.leftMargin: 40
        spacing: Theme.tileGap

        Repeater {
            model: root.tiles

            AppTile {
                label: modelData.label
                meta: modelData.meta
                iconText: modelData.icon
                focused: index === root.focusIndex

                onActivated: root.tileActivated(index)
            }
        }
    }

    function moveFocus(delta) {
        if (tiles.length === 0) {
            return
        }
        const next = Math.max(0, Math.min(tiles.length - 1, focusIndex + delta))
        focusIndex = next
    }

    function activateFocused() {
        if (tiles.length === 0) {
            return
        }
        tileActivated(focusIndex)
    }
}