import qs.config
import qs.custom
import qs.services
import qs.util
import QtQuick
import QtQuick.Controls
import QtQuick.Shapes

Switch {
    id: root

    property real size: Config.font.size.normal * 1.5
    property color bg: Config.colors.container
    property color accent: Color.mute(Config.colors.accent)

    implicitWidth: implicitIndicatorWidth
    implicitHeight: implicitIndicatorHeight

    indicator: CustomRect {
        radius: 1000
        color: root.checked ? root.accent : root.bg

        implicitWidth: implicitHeight * 1.7
        implicitHeight: size

        CustomRect {
            readonly property real nonAnimWidth: root.pressed ? implicitHeight * 1.3 : implicitHeight

            radius: 1000
            color: root.checked ? Config.colors.secondary : Config.colors.tertiary

            x: root.checked ? parent.implicitWidth - nonAnimWidth : 0
            implicitWidth: nonAnimWidth
            implicitHeight: parent.implicitHeight
            anchors.verticalCenter: parent.verticalCenter

            CustomRect {
                anchors.fill: parent
                radius: parent.radius

                color: root.checked ? Config.colors.tertiary : Config.colors.secondary
                opacity: root.pressed ? 0.4 : root.hovered ? 0.2 : 0

                Behavior on opacity {
                    Anim {}
                }
            }

            Shape {
                id: icon

                property point start1: {
                    if (root.pressed)
                        return Qt.point(width * 0.2, height / 2);
                    if (root.checked)
                        return Qt.point(width * 0.2, height / 2);
                    return Qt.point(width * 0.15, height * 0.15);
                }
                property point end1: {
                    if (root.pressed) {
                        if (root.checked)
                            return Qt.point(width * 0.4, height / 2);
                        return Qt.point(width * 0.8, height / 2);
                    }
                    if (root.checked)
                        return Qt.point(width * 0.45, height * 0.7);
                    return Qt.point(width * 0.85, height * 0.85);
                }
                property point start2: {
                    if (root.pressed) {
                        if (root.checked)
                            return Qt.point(width * 0.4, height / 2);
                        return Qt.point(width * 0.2, height / 2);
                    }
                    if (root.checked)
                        return Qt.point(width * 0.45, height * 0.7);
                    return Qt.point(width * 0.15, height * 0.85);
                }
                property point end2: {
                    if (root.pressed)
                        return Qt.point(width * 0.8, height / 2);
                    if (root.checked)
                        return Qt.point(width * 0.9, height * 0.2);
                    return Qt.point(width * 0.85, height * 0.15);
                }

                anchors.centerIn: parent
                width: height
                height: parent.implicitHeight * 0.45
                preferredRendererType: Shape.CurveRenderer
                asynchronous: true

                ShapePath {
                    strokeWidth: root.size * 0.1
                    strokeColor: Config.colors.primaryDark
                    fillColor: "transparent"
                    capStyle: ShapePath.RoundCap

                    startX: icon.start1.x
                    startY: icon.start1.y

                    PathLine {
                        x: icon.end1.x
                        y: icon.end1.y
                    }
                    PathMove {
                        x: icon.start2.x
                        y: icon.start2.y
                    }
                    PathLine {
                        x: icon.end2.x
                        y: icon.end2.y
                    }

                    Behavior on strokeColor {
                        CAnim {}
                    }
                }

                Behavior on start1 {
                    PropAnim {}
                }
                Behavior on end1 {
                    PropAnim {}
                }
                Behavior on start2 {
                    PropAnim {}
                }
                Behavior on end2 {
                    PropAnim {}
                }
            }

            Behavior on x {
                Anim {}
            }

            Behavior on implicitWidth {
                Anim {}
            }
        }
    }

    MouseArea {
        anchors.fill: parent
        cursorShape: Qt.PointingHandCursor
        enabled: false
    }

    component PropAnim: PropertyAnimation {
        duration: Config.anim.durations.normal
        easing.type: Easing.BezierSpline
        easing.bezierCurve: Config.anim.curves.standard
    }
}