/******************************************************************************
**
** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/
**
** This file is part of the Qt Quick Ultralite module.
**
** $QT_BEGIN_LICENSE:COMM$
**
** Commercial License Usage
** Licensees holding valid commercial Qt licenses may use this file in
** accordance with the commercial license agreement provided with the
** Software or, alternatively, in accordance with the terms contained in
** a written agreement between you and The Qt Company. For licensing terms
** and conditions see http://www.qt.io/terms-conditions. For further
** information use the contact form at http://www.qt.io/contact-us.
**
** $QT_END_LICENSE$
**
******************************************************************************/

import QtQuick 2.15
import QtQuick.Shapes 1.0

ShapesEntry {
    id: root
    text: "Cubic curve"

    Rectangle {
        color: "lightGray"
        anchors.top: parent.top
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.margins: root.contentMargins
        width: root.contentHeight
        height: root.contentHeight

        Shape {
            id: shape
            anchors.fill: parent

            ShapePath {
                strokeWidth: 4 * root.shapeScale
                strokeColor: "black"
                fillColor: "#55ff7788"

                startX: 50 * root.shapeScale
                startY: 150 * root.shapeScale
                PathCubic {
                    x: 150 * root.shapeScale
                    y: 150 * root.shapeScale
                    control1X: cp1.x; control1Y: cp1.y
                    control2X: cp2.x; control2Y: cp2.y
                }
            }
        }

        Rectangle {
            id: cp1
            color: "red"
            width: 10; height: 10
            SequentialAnimation {
                loops: Animation.Infinite
                running: true
                NumberAnimation {
                    target: cp1
                    property: "x"
                    from: 0
                    to: shape.width - cp1.width
                    duration: 5000
                }
                NumberAnimation {
                    target: cp1
                    property: "x"
                    from: shape.width - cp1.width
                    to: 0
                    duration: 5000
                }
                NumberAnimation {
                    target: cp1
                    property: "y"
                    from: 0
                    to: shape.height - cp1.height
                    duration: 5000
                }
                NumberAnimation {
                    target: cp1
                    property: "y"
                    from: shape.height - cp1.height
                    to: 0
                    duration: 5000
                }
            }
        }

        Rectangle {
            id: cp2
            color: "blue"
            width: 10; height: 10
            x: shape.width - width
            SequentialAnimation {
                loops: Animation.Infinite
                running: true
                NumberAnimation {
                    target: cp2
                    property: "y"
                    from: 0
                    to: shape.height - cp2.height
                    duration: 5000
                }
                NumberAnimation {
                    target: cp2
                    property: "y"
                    from: shape.height - cp2.height
                    to: 0
                    duration: 5000
                }
                NumberAnimation {
                    target: cp2
                    property: "x"
                    from: shape.width - cp2.width
                    to: 0
                    duration: 5000
                }
                NumberAnimation {
                    target: cp2
                    property: "x"
                    from: 0
                    to: shape.width - cp2.width
                    duration: 5000
                }
            }
        }
    }
}