/*
 * Copyright (C) 2018 The Qt Company Ltd.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

import QtQuick 2.6
import QtQuick.Layouts 1.1
import QtQuick.Controls 2.0

Page {
    id: root
    property alias model: listView.model
    
    property int appSize: 0
    property int pageSize: 0
    property int currentPageIndex: 0

    property int nPullHeight: 100
    
    BusyIndicator {
        id: prevBusyIndicator
        anchors.horizontalCenter: parent.horizontalCenter
        implicitWidth: 60
        implicitHeight: 60
        running: false
    }
	BusyIndicator {
        id: nextBusyIndicator
        anchors.horizontalCenter: parent.horizontalCenter
		anchors.bottom: parent.bottom
        implicitWidth: 60
        implicitHeight: 60
        running: false
    }

    StackView {
        id: stack
        initialItem: listView
        anchors.fill: parent
        anchors.margins: root.width * 0.075
    }

    ListView {
        id: listView
        //anchors.fill: parent
        //anchors.margins: root.width * 0.075
        clip: true
        
        delegate: MouseArea {
            id: delegate
            width: listView.width
            height: width / 6
			
            RowLayout {
                anchors.fill: parent
				
                Item {
                    Layout.preferredWidth: 80
                    Layout.preferredHeight: 80
					
					MouseArea{
						anchors.fill: parent	
						z: 2
						onClicked: {
							stack.push("qrc:/pages/DetailPage.qml", {stack: stack, model: model}, StackView.Immediate)							
						}
					}

                    Image {
						id: imageicon
                        anchors.fill: parent
                        source: model.icon != ""?model.icon : 'qrc:/images/blank.svg'
						property string initial: model.name.substring(0,1).toUpperCase()

						Label {
							style: Text.Outline
							styleColor: "#00ADDC"
							color: 'transparent'
							font.pixelSize: parent.height * 0.5
							anchors.centerIn: parent
							text: parent.initial
							visible: model.icon == ""
						}
                    }
                }

                ColumnLayout {
                    Label {
                        Layout.fillWidth: true
                        text: model.name.toUpperCase()
                        color: '#00ADDC'
                    }
                    Label {
                        text: 'Version: ' + model.version
                        font.pixelSize: 16
                        font.italic: true
                    }
                    Label {
                        text: 'Description: ' + model.description
                        font.pixelSize: 16
                        wrapMode: Text.Wrap
                        elide: Text.ElideRight
                        Layout.preferredWidth: 400
                        Layout.preferredHeight: 40
                    }					
                }
                ColumnLayout {
                    spacing: 5
                    Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
					
                    Button {
						anchors.right: parent.right
						anchors.rightMargin: 6
						text: model.statetext
                        onClicked: {
                            if (model.statetext === 'Install' || model.statetext === 'Update') {
                                listView.model.install(model.index)
                            } else if (model.statetext === 'Launch') {
                                if (listView.model.launch(model.id) > 1) {
                                    homescreenHandler.tapShortcut(model.name)
                                } else {
                                    console.warn('app cannot be launched')
                                }
                            }
                        }
                        implicitWidth: 140
                        implicitHeight: 40
                    }
                }
            }

            DownloadBar {
                anchors.fill: parent
                progress: model.progress
            }            
            Image {
                source: 'qrc:/images/DividingLine.svg'
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.top: parent.top
                visible: model.index > 0
            }

            
        }

        states: [
            State {
                name: "prevPageState"; when: (prevBusyIndicator.running == false) && listView.contentY < -nPullHeight
                StateChangeScript {
                    name: "prevPageScript"
                    script: getPrevPage()
                }
            },
			State {
				name: "nextPageState"; when: appSize > 8 && (nextBusyIndicator.running == false) && (listView.contentHeight > 0) && (listView.contentY > (listView.contentHeight - listView.height + nPullHeight))
				StateChangeScript {
					name: "nextPageScript"
					script: getNextPage()
				}
			}
        ]
    }

    function getPrevPage() {
        listView.y = nPullHeight;

        currentPageIndex = currentPageIndex > 0 ? currentPageIndex-1 : 0;
        prevBusyIndicator.running = true;
        prevPageTimer.start();
    }

    function getNextPage() {
        listView.y = nPullHeight;

        currentPageIndex++;
		nextBusyIndicator.running = true;
		nextPageTimer.start();
    }

    Timer {
        id: prevPageTimer
        interval: 1000
        repeat: false
        running: false
        onTriggered: {
            listView.model.getPrevPage(currentPageIndex)
            prevPageAnimation.start();
        }
    }

	Timer {
		id: nextPageTimer
		interval: 1000
		repeat: false
		running: false
		onTriggered: {
			listView.model.getNextPage(currentPageIndex)
			nextPageAnimation.start();
		}
	}
    NumberAnimation {
        id: prevPageAnimation
        target: listView
        property: "y"
        duration: 100
        from: nPullHeight
        to: 0
        onStopped: {
            prevBusyIndicator.running = false
            //listView.y = 0;
        }
    }

    NumberAnimation {
        id: nextPageAnimation
        target: listView
        property: "y"
        duration: 100
        from: nPullHeight
        to: 0
        onStopped: {
            nextBusyIndicator.running = false
            //listView.y = 0;
        }
    }
    Connections {
        target: listView.model
        onRequestCompleted: {
            appSize = appsize
            pageSize = pagesize
			console.log("request completed!", appSize, pageSize, currentPageIndex)
			if(appSize == 0 && currentPageIndex > 0) {
				listView.model.getPrevPage(--currentPageIndex)
			}else{
				listView.y = 0;
			}
        }
    }
}