/******************************************************************************
**
** Copyright (C) 2020 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.14

Item {
    id: root
    width: clipedImage.width
    height: clipedImage.height
    enum HorizontalDirection { Right = 0, Left = 1 }
    property int horizontalDirection: ClipingItem.Right
    enum VerticalDirection { Down = 0, Up = 1 }
    property int verticalDirection: ClipingItem.Up
    property bool horizontalClipping: false
    property bool verticalClipping: false
    property bool active: false
    property int duration: 600
    property alias running: clipingAnimation.running

    property bool isDayMode: true
    property image dayModeSource
    property image nightModeSource

    onIsDayModeChanged:
    {
        changeDayModeAnimation.start()
    }
    SequentialAnimation
    {
        id: changeDayModeAnimation
        PauseAnimation {  duration: 600 }
        NumberAnimation { target: root; property: "opacity"; to: 0; duration: 500; easing.type: Easing.OutCubic }
        ScriptAction { script: clipedImage.source = isDayMode ? dayModeSource : nightModeSource }
        NumberAnimation { target: root; property: "opacity"; to: 1; duration: 500; easing.type: Easing.OutCubic }
    }

    Component.onCompleted: {
        clipedImage.source = nightModeSource
    }

    onActiveChanged:
    {
        if(active)
        {
            startAnimation()
        }
        else
        {
            hiddingAnimation()
        }
    }

    function startAnimation()
    {
        clipingAnimation.start()
    }

    function hiddingAnimation()
    {
        hidingAnimation.start()
    }

    Item {
        id: clipingItem
        height: root.verticalClipping ? 0 : clipedImage.height
        width: root.horizontalClipping ? 0 : clipedImage.width
        property int horizontalOffset : root.width - clipingItem.width
        property int verticalOffset: root.height - clipingItem.height
        anchors.left: root.left
        anchors.leftMargin: root.horizontalDirection === ClipingItem.Right ? 0 : clipingItem.horizontalOffset
        anchors.top: root.top
        anchors.topMargin: root.verticalDirection === ClipingItem.Down ? 0 : clipingItem.verticalOffset
        clip: true
        Image {
            id: clipedImage
            anchors.left: clipingItem.left
            anchors.leftMargin: root.horizontalDirection === ClipingItem.Right ? 0 : -clipingItem.horizontalOffset
            anchors.top: clipingItem.top
            anchors.topMargin: root.verticalDirection === ClipingItem.Down ? 0 : -clipingItem.verticalOffset
        }

        ParallelAnimation {
            id: clipingAnimation
            alwaysRunToEnd: true
            NumberAnimation {
                target: clipingItem
                property: "width"
                duration: root.duration
                to: clipedImage.width
            }
            NumberAnimation {
                target: clipingItem
                property: "height"
                duration: root.duration
                to: clipedImage.height
            }
        }
        ParallelAnimation {
            id: hidingAnimation
            alwaysRunToEnd: true
            NumberAnimation {
                target: clipingItem
                property: "width"
                duration: root.duration
                to: root.horizontalClipping ? 0 : clipedImage.width
            }
            NumberAnimation {
                target: clipingItem
                property: "height"
                duration: root.duration
                to: root.verticalClipping ? 0 : clipedImage.height
            }
        }
    }
}