ConsoleEmulatorAddProbes/ui/emulator/components/SegmentButton.qml

import QtQuick 2.0
import QtQuick.Controls 2.13
import QtGraphicalEffects 1.13

import "qrc:/theme"
import "qrc:/const"

Button {
	id: button
	property var timeToPress: 100
	property var angle: 45
	signal pressed
	signal released

	onPressed: { button.down = true }
	onReleased: { button.down = false }

	background: SegmentCircle {
		id: background

		angle: button.angle

		MouseArea {
			hoverEnabled: true
			anchors.fill: background
			onEntered: {
				button.state = "Hovering"
			}

			onExited: {
				button.state = ""
			}

			onPressed: {
				button.state = "Pressed"
				button.pressed()
			}

			onReleased: {
				button.released()
				if (containsMouse)
					button.state = "Hovering"
				else
					button.state = ""
			}
		}
	}

	DropShadow {
		id: dropDown
		anchors.fill: background
		source: background
		horizontalOffset: 6
		verticalOffset: 6
		radius: 10
		samples: 16
		color: Theme.current.shadow
	}

	DropShadow {
		id: dropUp
		anchors.fill: background
		source: background
		horizontalOffset: -4
		verticalOffset: -4
		radius: 5
		samples: 10
		color: Theme.current.light
	}


	InnerShadow {
		id: innerUp
		anchors.fill: background
		source: background
		horizontalOffset: 3
		verticalOffset: 3
		radius: 2
		samples: 6
		smooth: true
		color: Theme.current.shadow
	}

	Item {
		id: hoverLight
		anchors.fill: background

		layer.enabled: true
		layer.effect: OpacityMask {
			maskSource: background
		}

		Rectangle {
			id: hoverGlow
			width: 2 * parent.width
			height: parent.height
			x: - 2 * parent.width
			color: "transparent"

			HoverGlow {}
		}
	}

	states: [
		State {
			name: "Hovering"
			PropertyChanges {
				target: hoverGlow
				x: 0
			}
		},

		State {
			name: "Pressed"
			PropertyChanges {
				target: background
				color: Theme.current.buttonSelected
			}

			PropertyChanges {
				target: dropDown
				horizontalOffset: 0
				verticalOffset: 0
				radius: 0
				samples: 0
			}

			PropertyChanges {
				target: dropUp
				horizontalOffset: 0
				verticalOffset: 0
				radius: 0
				samples: 0
			}

			PropertyChanges {
				target: innerUp
				horizontalOffset: 6
				verticalOffset: 6
				radius: 6
				samples: 12
			}
		}
	]

	transitions: [
		Transition {
			from: ""; to: "Hovering"
			NumberAnimation {
				properties: "x"
				duration: 500
				easing.type: Easing.OutQuad
			}
		},

		Transition {
			from: "*"; to: "Pressed"

			ColorAnimation {
				properties: "color"
				duration: timeToPress
			}

			NumberAnimation {
				properties: "horizontalOffset, verticalOffset, radius, samples"
				duration: timeToPress
				easing.type: Easing.InOutQuad
			}
		},

		Transition {
			from: "Pressed"; to: "*"

			ColorAnimation {
				properties: "color"
				duration: timeToPress
			}

			NumberAnimation {
				properties: "horizontalOffset, verticalOffset, radius, samples"
				duration: timeToPress
				easing.type: Easing.InOutQuad
			}
		}
	]
}