import QtQuick 2.9
import QtQuick.Controls 2.4
import QtQuick.Controls.Material 2.3

import "../Components"

Page {
    id: root

    title: (nation === "" ? "IFSC":nation === "GER" ? "DAV":"SAC") + " " + qsTr("competition calendar")

    property bool ready

    property Component headerComponent: Item {
        anchors.fill: parent

        Row {
            anchors.fill: parent
            anchors.rightMargin: 5

            spacing: width * 0.05

            Label {
                anchors.verticalCenter: parent.verticalCenter

                width: parent.width * 0.4
                height: parent.height * 0.6

                fontSizeMode: Text.Fit
                font.pixelSize: height
                verticalAlignment: Text.AlignVCenter
                horizontalAlignment: Text.AlignHCenter
                minimumPixelSize: 1

                text: root.year

            }

            Button {
                id:yearToolBt

                anchors {
                    verticalCenter: parent.verticalCenter
                }

                height: parent.height * 0.5
                width: parent.width * 0.25

                onClicked: {
                    yearSelectPu.open()
                }

                onPressed: yearToolBt.scale = 0.9
                onReleased: yearToolBt.scale = 1.0

                background: Image {

                    anchors.centerIn: parent

                    source: "qrc:/icons/calendar.png"

                    height: parent.height > parent.width ? parent.width : parent.height
                    width: height

                    mipmap: true

                    fillMode: Image.PreserveAspectFit
                    Behavior on scale {
                        PropertyAnimation {
                            duration: 100
                        }
                    }
                }
            }

            Button {
                id: cupToolBt

                anchors {
                    verticalCenter: parent.verticalCenter
                }

                height: parent.height * 0.5
                width: parent.width * 0.25

                onClicked: {
                    cupSelectPu.open()
                }

                onPressed: cupToolBt.scale = 0.9
                onReleased: cupToolBt.scale = 1.0

                background: Image {

                    anchors.centerIn: parent

                    source: "qrc:/icons/cup.png"

                    height: parent.height > parent.width ? parent.width : parent.height
                    width: height

                    mipmap: true

                    fillMode: Image.PreserveAspectFit
                    Behavior on scale {
                        PropertyAnimation {
                            duration: 100
                        }
                    }
                }
            }

        }
    }

    property string nation: ""
    property int year: new Date().getFullYear()
    property int status: -1
    property var calendarData

    Component.onCompleted: {
        root.ready = loadData(root.nation, root.year)
    }

    function loadData(nation, year) {
        loadingDl.open()

        //console.log("loading calendar data and old data is: " + (root.calendarData !== undefined) + " because of: " + root.calendarData + " and: ")

        root.status = 905

        var ret = serverConn.getCalendar(nation, year)

        if(ret["status"] === 200){
            root.status = 200
            root.calendarData = ret["data"]
            calendarList.listData = ret["data"]["competitions"]



        }
        else if (root.calendarData !== undefined ){
            // there is still old data available
            root.status = 902
            //console.log("old data")
        }
        else {
            root.status = parseInt(ret["status"])
            app.errorCode = parseInt(ret["status"])
            root.calendarData = ({})
            calendarList.listData = ({})
            //console.log("error: " + root.status)
            loadingDl.close()
            app.errorCode = root.status
            return false
        }

        loadingDl.close()
        app.errorCode = root.status

        return true
    }

    DataListView {
        id: calendarList

        property var listData

        anchors.fill: parent

        //boundsBehavior: Flickable.StopAtBounds

        model: listData.length

        status: root.status

        onRefresh: {
            root.loadData(root.nation, root.year)
        }

        onModelChanged: {
            autoScroll()
        }

        function autoScroll() {
            if(parseInt(root.year) === new Date().getFullYear()){
                for(var i = 0; i < listData.length; i ++){
                    // get the start date pf the competition
                    var startDate = Date.fromLocaleString(Qt.locale(), calendarList.listData[i]["date"], "yyyy-MM-dd")

                    // get the duration of the competition
                    var durationString = calendarList.listData[i]["duration"] === undefined ? "1":calendarList.listData[i]["duration"]
                    var days = parseInt(durationString.replace(/\D/g,''))
                    // calculate the end date of the competition
                    var endDate = new Date(startDate.valueOf())
                    endDate.setDate(endDate.getDate() + days);

                    //console.log(calendarList.listData[i]["date"] + ": " + startDate + " to " + endDate)

                    if(endDate.getTime() < new Date().getTime()){
                        // end date is already over -> move the list view up!
                        calendarList.positionViewAtIndex(i, ListView.Top)
                        //console.log("moving down!")
                    }
                }
            }
        }

        delegate: ItemDelegate {
            id: competitionDel

            property string name: calendarList.listData[index]["name"]
            property string date: calendarList.listData[index]["date_span"]
            property var cats: calendarList.listData[index]["cats"]
            property int catId: calendarList.listData[index]["cat_id"]
            property bool over

            width: parent.width
            height: compDelCol.height + 10

            enabled: calendarList.listData[index]["cats"] !== undefined && calendarList.listData[index]["cats"].length > 0

            onClicked: {
                catSelectPu.appear(index, false)
            }

            Rectangle {
                id: delBackroundRect

                anchors.fill: parent

                opacity: 0.5

                color: app.competitionCategoryColors[catId]
            }

            Column {
                id: compDelCol

                anchors.centerIn: parent

                width: parent.width * 0.97

                spacing: 10

                Label {
                    id: nameLa

                    width: parent.width

                    font.bold: true

                    wrapMode: Text.WordWrap

                    text: name
                }

                Label {
                    id: dateLa

                    color: "grey"

                    text: date
                }

                Label {
                    id: catIdLa

                    color: "grey"

                    text: catId
                }
            }

            Rectangle {
                id: bottomLineRa

                anchors {
                    bottom: parent.bottom
                    left: parent.left
                    right: parent.right
                }

                height: 1

                color: "lightgrey"

            }
        }
    }

    Dialog {
        id: catSelectPu

        property int index: -1
        property bool cupCat: false
        property var catObj: undefined

        x: 0 //root.width / 2 - width / 2
        y: root.height - height //root.height / 2 - height / 2

        width: root.width
        height: catsLv.height //root.height * 0.6

        modal: true
        focus: true

        title: qsTr("select category")

        function appear(index, cupCat) {
            catSelectPu.cupCat = cupCat
            catSelectPu.index = index

            if(cupCat){
                catSelectPu.catObj = root.calendarData["cups"][index]["cats"]
            }
            else {
                catSelectPu.catObj = calendarList.listData[index]["cats"]
            }

            catSelectPu.open()

        }

        function getText(index){
            // ----------------------------
            // get the text
            // returns list with [catId, catName]

            if(catSelectPu.cupCat){
                var catName // category name
                var catId // category id

                for(var i = 0; i < root.calendarData["cats"].length; i ++ ){
                    //console.log("checking " + i + ": cat: " + parseInt(listData["categorys"][i]["GrpId"]) + " searched cat: " + root.catId)
                    if(root.calendarData["cats"][i]["rkey"] === root.calendarData["cups"][catSelectPu.index]["cats"][index] && root.calendarData["cats"][i]["sex"] !== undefined){
                        catName = root.calendarData["cats"][i]["name"]
                        catId = root.calendarData["cats"][i]["GrpId"]
                    }
                }

                return [catId, catName]
            }
            else {
                return [catSelectPu.catObj[index]["GrpId"], catSelectPu.catObj[index]["name"]]
            }


        }

        ListView {
            id: catsLv

            property int delegateHeight: 50

            anchors {
                top: parent.top
                left: parent.left
                right: parent.right
            }

            width: parent.width
            height: root.height * 0.6 < ( (delegateHeight + spacing) * model ) ? root.height * 0.6 : (delegateHeight + spacing) * model + 75

            model: catSelectPu.catObj !== undefined ? catSelectPu.catObj.length:0

            ScrollIndicator.vertical: ScrollIndicator {
                parent: catsLv.parent
                anchors {
                    top: catsLv.top
                    left: catsLv.right
                    margins: 10
                    leftMargin: 3
                    bottom: catsLv.bottom
                }

            }

            delegate: Button {
                id: catBt

                property var catData: catSelectPu.getText(index)

                width: parent.width
                height: text !== "" ? catsLv.delegateHeight:0

                flat: true

                text: catData[1]

                onClicked: {
                    catSelectPu.close()
                    app.openResults( catSelectPu.cupCat ? root.calendarData["cups"][catSelectPu.index]["SerId"]:calendarList.listData[catSelectPu.index]["WetId"], catData[0], catSelectPu.cupCat ? -1:catSelectPu.catObj[index]["status"] )
                }
            }
        }

        enter: Transition {
            NumberAnimation { property: "opacity"; from: 0.0; to: 1.0 }
            NumberAnimation {
                property: "y"
                from: root.height - catSelectPu.height * 0.7
                to: root.height - catSelectPu.height
            }
        }

        exit: Transition {
            NumberAnimation { property: "opacity"; from: 1.0; to: 0.0 }
            NumberAnimation {
                property: "y"
                from: root.height - catSelectPu.height
                to: root.height - catSelectPu.height * 0.7
            }
        }
    }

    Dialog {
        id: yearSelectPu

        property var yearList: root.calendarData["years"]

        x: 0 //root.width / 2 - width / 2
        y: root.height - height //root.height / 2 - height / 2

        width: root.width
        height: root.height * 0.6

        modal: true
        focus: true

        title: qsTr("select year")

        contentItem: ListView {
            id: yearsLv

            width: parent.width
            height: root.height * 0.6

            model: yearSelectPu.yearList !== undefined ? yearSelectPu.yearList.length:0

            clip: true

            ScrollIndicator.vertical: ScrollIndicator {
                parent: yearsLv.parent
                anchors {
                    top: yearsLv.top
                    left: yearsLv.right
                    margins: 10
                    leftMargin: 3
                    bottom: yearsLv.bottom
                }

            }

            delegate: Button {
                id: yearBt

                width: parent.width

                flat: true

                text: yearSelectPu.yearList[index]

                onClicked: {
                    yearSelectPu.close()
                    root.year = yearSelectPu.yearList[index]
                    root.loadData(root.nation, root.year)
                }
            }
        }

        enter: Transition {
            NumberAnimation { property: "opacity"; from: 0.0; to: 1.0 }
            NumberAnimation {
                property: "y"
                from: root.height - yearSelectPu.height * 0.7
                to: root.height - yearSelectPu.height
            }
        }

        exit: Transition {
            NumberAnimation { property: "opacity"; from: 1.0; to: 0.0 }
            NumberAnimation {
                property: "y"
                from: root.height - yearSelectPu.height
                to: root.height - yearSelectPu.height * 0.7
            }
        }
    }

    Dialog {
        id: cupSelectPu

        property var cupList: getCupList()

        function getCupList() {
            if(root.nation === "") {
                root.calendarData["cups"].unshift({"SerId":"","rkey":"","name":"Worldranking","modified":"2018-10-24 16:11:12","modifier":"","year":"","num_comps":"","cats":["ICC-COA","ICC-HD","ICC-MED","ICC_F","ICC_FB","ICC_FS","ICC_M","ICC_MB","ICC_MS"]})
            }
            return root.calendarData["cups"]
        }

        x: 0 //root.width / 2 - width / 2
        y: root.height - height //root.height / 2 - height / 2

        width: root.width
        height: cupsLv.height //root.height * 0.6

        modal: true
        focus: true

        title: qsTr("select cup")

        ListView {
            id: cupsLv

            property int delegateHeight: 50

            anchors {
                top: parent.top
                left: parent.left
                right: parent.right
            }

            width: parent.width
            height: root.height * 0.6 < ( (delegateHeight + spacing) * model ) ? root.height * 0.6 : (delegateHeight + spacing) * model + 75

            model: cupSelectPu.cupList !== undefined ? cupSelectPu.cupList.length:0

            ScrollIndicator.vertical: ScrollIndicator {
                parent: cupsLv.parent
                anchors {
                    top: cupsLv.top
                    left: cupsLv.right
                    margins: 10
                    leftMargin: 3
                    bottom: cupsLv.bottom
                }

            }

            delegate: Button {
                id: cupBt

                width: parent.width
                height: cupsLv.delegateHeight

                flat: true

                text: cupSelectPu.cupList[index]["name"]

                onClicked: {
                    cupSelectPu.close()
                    catSelectPu.appear(index, true)
                }
            }
        }

        enter: Transition {
            NumberAnimation { property: "opacity"; from: 0.0; to: 1.0 }
            NumberAnimation {
                property: "y"
                from: root.height - cupSelectPu.height * 0.7
                to: root.height - cupSelectPu.height
            }
        }

        exit: Transition {
            NumberAnimation { property: "opacity"; from: 1.0; to: 0.0 }
            NumberAnimation {
                property: "y"
                from: root.height - cupSelectPu.height
                to: root.height - cupSelectPu.height * 0.7
            }
        }

    }

}