import QtQuick 2.0
import QtQuick.Controls 2.13
import QtGraphicalEffects 1.13

import "qrc:/const"

Item {
	id: control

	property var longBut: Const.macroButton
	property var shortBut: Const.microButton

//	property alias increase: incButton.down
//	property alias decrease: decButton.down

//	LightRing {
//		id: lightRing
//		colorMode: parent.led
//		anchors.verticalCenter: mainKnob.verticalCenter
//		anchors.horizontalCenter: mainKnob.horizontalCenter
//		width: Const.macroButton + 2 * thickness
//	}

//	ModeBg {
//		additionalLength: 3 * shortBut
//		anchors.centerIn: parent
//	}

//	ModeBg {
//		additionalLength: - shortBut
//		anchors.centerIn: parent
//	}

	width: Const.macroButton + Const.microButton + 2 * Const.margin
	height: width

	LightRing {
		colorMode: 0
		anchors.centerIn: parent
		width: Const.macroButton + Const.microButton + 2 * Const.margin + 3 * shortBut
		height: width
		thickness: 60
	}

	Knob {
		id: leftBut
		anchors.right: parent.left
		anchors.verticalCenter: parent.verticalCenter
		implicitWidth: shortBut
		implicitHeight: longBut
	}

	Knob {
		id: rightBut
		anchors.left: parent.right
		anchors.verticalCenter: parent.verticalCenter
		implicitWidth: shortBut
		implicitHeight: longBut
	}

	Knob {
		id: topBut
		anchors.horizontalCenter: parent.horizontalCenter
		anchors.bottom: parent.top
		implicitWidth: longBut
		implicitHeight: shortBut
	}

	Knob {
		id: bottomBut
		anchors.horizontalCenter: parent.horizontalCenter
		anchors.top: parent.bottom
		implicitWidth: longBut
		implicitHeight: shortBut
	}

	Knob {
		id: topLeftBut
		anchors.verticalCenter: parent.top
		anchors.horizontalCenter: parent.left
		implicitWidth: shortBut
		implicitHeight: shortBut
	}

	Knob {
		id: topRightBut
		anchors.verticalCenter: parent.top
		anchors.horizontalCenter: parent.right
		implicitWidth: shortBut
		implicitHeight: shortBut
	}

	Knob {
		id: bottomLeftBut
		anchors.verticalCenter: parent.bottom
		anchors.horizontalCenter: parent.left
		implicitWidth: shortBut
		implicitHeight: shortBut
	}

	Knob {
		id: bottomRightBut
		anchors.verticalCenter: parent.bottom
		anchors.horizontalCenter: parent.right
		implicitWidth: shortBut
		implicitHeight: shortBut
	}
}