/*!
 *
 * Copyright (c) 2019-2020 Diality Inc. - All Rights Reserved.
 * \copyright                                                       \n
 *          THIS CODE MAY NOT BE COPIED OR REPRODUCED IN ANY FORM,  \n
 *          IN PART OR IN WHOLE,                                    \n
 *          WITHOUT THE EXPLICIT PERMISSION OF THE COPYRIGHT OWNER. \n
 *
 * \file    TouchArea.qml
 * \date    2019/01/09
 * \author  Behrouz NematiPour
 *
 */

// Qt
import QtQuick 2.12

// Project
//  Qml imports
import "qrc:/globals"

/*!
 * \brief   The TouchArea Component
 * which is used as a touchable component(s) container
 * with a title at the top
 * if set to be touchable will show an arrow right side of the title
 * next to the right edge of the component.
 */
Rectangle { id : _root
    property string     title               : ""
    property int        titleLetterSpacing  : 3
    property bool       isTouchable         : true

    property alias      notification        : _notification

    signal clicked()

    color: "transparent"
    clip  : false

    Text { id: _titleText
        anchors {
            top: parent.top
            left: parent.left
        }
        text: _root.title
        font {
            pixelSize: Fonts.fontPixelTouchAreaTitle
            letterSpacing: titleLetterSpacing
        }
        color: Colors.touchTextAreaTitle
    }

    Image { id: _arrowImage
        visible: isTouchable
        anchors {
            top: parent.top
            right: parent.right
        }
        width : Variables.arrowWidth
        height: Variables.arrowHeight
        source: "qrc:/images/iArrow"
    }

    MouseArea { id: _mouseArea
        anchors.fill: parent
        onClicked: {
            if (isTouchable) {
                _root.clicked()
            }
        }
    }

    Component.onCompleted: {
    }

    NotificationBar { id: _notification
        height  : 25
        imageAutoSize: true
        color: "transparent"
        anchors {
            bottom  : parent.bottom
            left    : parent.left
            right   : parent.right
        }
        imageSource : ""
        text        : ""
        textColor   : "gray"
        textfontSize: 16
        rowAnchors.centerIn: null
    }
}