import QtQuick 2.0
import QtQuick.Controls 2.13
import QtGraphicalEffects 1.13

import "qrc:/const"

ModeBg {
	id: modeBackground

	property var image: "qrc:/icons/topLeft/utils.png"

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

	property var led: 1

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

	Knob {
		id: mainKnob
		image: parent.image
		x: Const.microButton / 2 + Const.margin
		anchors.bottom: parent.bottom
		anchors.bottomMargin: x
	}

	Knob {
		id: decButton
		anchors.verticalCenter: mainKnob.verticalCenter
		anchors.right: mainKnob.left
		anchors.rightMargin: Const.margin
		implicitWidth: Const.microButton
		implicitHeight: Const.microButton
		onPressed: lightRing.angle = lightRing.angle - Const.rotateStep
	}

	Knob {
		id: incButton
		anchors.verticalCenter: mainKnob.verticalCenter
		anchors.left: mainKnob.right
		anchors.leftMargin: Const.margin
		implicitWidth: Const.microButton
		implicitHeight: Const.microButton
		onPressed: lightRing.angle = lightRing.angle + Const.rotateStep
	}
}