import QtQuick 2.0

import "qrc:/emulator/components"
import "qrc:/emulator/elements"
import "qrc:/const"
import "qrc:/theme"

Item {
	width: childrenRect.width
	height: childrenRect.height

	Column {
		spacing: 15

		Item {
			width: Const.textWidth
			implicitHeight: Const.textHeight

			Text {
				horizontalAlignment: Text.horizontalCenter
				text: "Incremental step"
				color: Theme.current.text
				anchors.verticalCenter: parent.verticalCenter
			}
		}

		SliderBarBind {
			name: "stepInc"
		}

		Item {
			width: Const.textWidth
			implicitHeight: Const.textHeight

			Text {
				horizontalAlignment: Text.horizontalCenter
				text: "Decremental step"
				color: Theme.current.text
			}
		}

		SliderBarBind {
			name: "stepDec"
			color: Theme.current.yellow
			colorDeep: Theme.current.yellowDeep
			flip: true
		}

		Row {
			width: Const.sliderWidth
			height: Const.sliderHeight

			Item {
				width: Const.textWidth / 3
				height: Const.textHeight
				anchors.verticalCenter: parent.verticalCenter
				Text {
					anchors.verticalCenter: parent.verticalCenter
					horizontalAlignment: Text.horizontalCenter
					text: "Theme"
					color: Theme.current.text
				}
			}

			NeuLight {
				anchors.verticalCenter: parent.verticalCenter
				colorMode: 0
				width: Const.microButton
				height: Const.microButton
				image: Theme.current=== Theme.dark ? "qrc:/icons/uiMode/light.svg" :
													 "qrc:/icons/uiMode/dark.svg"
				MouseArea{
					anchors.fill: parent
					onClicked: {
						if(Theme.current=== Theme.dark) {
							Theme.current = Theme.light
						} else {
							Theme.current = Theme.dark
						}
					}
				}
			}
		}
	}
}