// SmoothScroll.qml
import QtQuick

Item {
    id: root
    readonly property Flickable target: parent.parent as Flickable
    // If casting failed, don't fill the parent
    // (which blocks the mouse wheel events),
    // let the underlying item handle mouse wheel events instead.
    anchors.fill: !!target ? parent : null
    readonly property real minContentX: 0
    // Math.max is used here to prevent getting a negative horizontal position.
    readonly property real maxContentX: Math.max(target.contentWidth - target.width, 0)
    readonly property real minContentY: 0
    readonly property real maxContentY: Math.max(target.contentHeight - target.height, 0)
    function getBoundedX(x) {
        if (x <= minContentX)
            return minContentX;
        else if (x >= maxContentX)
            return maxContentX;
        else
            return x;
    }
    function getBoundedY(y) {
        if (y <= minContentY)
            return minContentY;
        else if (y >= maxContentY)
            return maxContentY;
        else
            return y;
    }

    property real targetContentX
    property real targetContentY
    property bool animatingX
    property bool animatingY

    // When flickable is not moving by the custom animation,
    // bind the targetContentX/Y to the actual ContentX/Y.
    // Otherwise, the animation should take care of
    // updating the contentX/Y to match targetContentX/Y.
    Binding {
        root.targetContentX: root.target.contentX
        when: !root.animatingX
        restoreMode: Binding.RestoreBinding
    }
    Binding {
        root.targetContentY: root.target.contentY
        when: !root.animatingY
        restoreMode: Binding.RestoreBinding
    }
    WheelHandler {
        id: mouse
        // Only want mouse here, touchpad scrolling should be untouched.
        acceptedDevices: PointerDevice.Mouse
        // Boilerplates
        onWheel: event => {
            const old_targetContentX = root.targetContentX;
            const old_targetContentY = root.targetContentY;
            const deltaX = event.angleDelta.x / -2;
            const deltaY = event.angleDelta.y / -2;
            let new_targetContentX;
            let new_targetContentY;

            if (event.modifiers & Qt.ShiftModifier) {
                new_targetContentX = root.targetContentX + deltaY;
                new_targetContentY = root.targetContentY + deltaX;
            } else if (!event.modifiers) {
                new_targetContentX = root.targetContentX + deltaX;
                new_targetContentY = root.targetContentY + deltaY;
            } else if (event.modifiers & Qt.ControlModifier) {
                event.accepted = false;
                return;
            } else {
                event.accepted = false;
                return;
            }

            new_targetContentX = root.getBoundedX(new_targetContentX);
            new_targetContentY = root.getBoundedY(new_targetContentY);
            if (new_targetContentX != old_targetContentX) {
                root.targetContentX = new_targetContentX;
                animationX.restart();
            }
            if (new_targetContentY != old_targetContentY) {
                root.targetContentY = new_targetContentY;
                animationY.restart();
            }
        }
    }
    NumberAnimation {
        id: animationX
        target: root.target
        properties: "contentX"
        duration: 300
        from: root.target.contentX
        to: root.targetContentX
        // stop() by default stops the animation.
        // This prevents that from happening.
        alwaysRunToEnd: true

        // OutQuad closely replicates WinUI style scrolling animation
        easing.type: Easing.OutQuad
        onStarted: {
            root.animatingX = true;
        }
        onStopped: {
            root.animatingX = false;
        }
    }
    NumberAnimation {
        // The same animation for Y axis
        id: animationY
        target: root.target
        properties: "contentY"
        duration: 300
        from: root.target.contentY
        to: root.targetContentY
        alwaysRunToEnd: true

        easing.type: Easing.OutQuad
        onStarted: {
            root.animatingY = true;
        }
        onStopped: {
            root.animatingY = false;
        }
    }
}

Flickable {
  ...
  SmoothScroll {} // activates the alternate scrolling animation behavior
}