import QtQuick 2.0
import QtQuick.Controls 2.13
import QtGraphicalEffects 1.13

import "qrc:/const"

Item {
	id: control

	property var longBut: 70 //Const.macroButton
	property var shortBut: 32 //Const.microButton
	property var margin: 10 //Const.margin

	property alias leftDown: leftBut.down
	property alias rightDown: rightBut.down
	property alias topDown: topBut.down
	property alias bottomDown: bottomBut.down

	property alias topLeftDown: topLeftBut.down
	property alias topRightDown: topRightBut.down
	property alias bottomLeftDown: bottomLeftBut.down
	property alias bottomRightDown: bottomRightBut.down

	property var leftColor
	property var rightColor
	property var topColor
	property var bottomColor

	property var topLeftColor
	property var topRightColor
	property var bottomLeftColor
	property var bottomRightColor

	width: longBut + shortBut + 2 * margin
	height: width

	LightRing {
		colorMode: 0
		anchors.centerIn: parent
		width: longBut + shortBut + 2 * margin + 115
		height: width
		thickness: 70
	}

	NeuLight {
		id: leftBut
		anchors.right: parent.left
		anchors.verticalCenter: parent.verticalCenter
		implicitWidth: shortBut
		implicitHeight: longBut
		colorMode: leftColor
	}

	NeuLight {
		id: rightBut
		anchors.left: parent.right
		anchors.verticalCenter: parent.verticalCenter
		implicitWidth: shortBut
		implicitHeight: longBut
		colorMode: rightColor
	}

	NeuLight {
		id: topBut
		anchors.horizontalCenter: parent.horizontalCenter
		anchors.bottom: parent.top
		implicitWidth: longBut
		implicitHeight: shortBut
		colorMode: topColor
	}

	NeuLight {
		id: bottomBut
		anchors.horizontalCenter: parent.horizontalCenter
		anchors.top: parent.bottom
		implicitWidth: longBut
		implicitHeight: shortBut
		colorMode: bottomColor
	}

	NeuLight {
		id: topLeftBut
		anchors.verticalCenter: parent.top
		anchors.horizontalCenter: parent.left
		implicitWidth: shortBut
		implicitHeight: shortBut
		colorMode: topLeftColor
	}

	NeuLight {
		id: topRightBut
		anchors.verticalCenter: parent.top
		anchors.horizontalCenter: parent.right
		implicitWidth: shortBut
		implicitHeight: shortBut
		colorMode: topRightColor
	}

	NeuLight {
		id: bottomLeftBut
		anchors.verticalCenter: parent.bottom
		anchors.horizontalCenter: parent.left
		implicitWidth: shortBut
		implicitHeight: shortBut
		colorMode: bottomLeftColor
	}

	NeuLight {
		id: bottomRightBut
		anchors.verticalCenter: parent.bottom
		anchors.horizontalCenter: parent.right
		implicitWidth: shortBut
		implicitHeight: shortBut
		colorMode: bottomRightColor
	}
}