// This example demonstrates placing items in a view using
// an ObjectModel

import QtQuick 2.3
import QtQml.Models 2.1
import QtQuick.Layouts 1.1
import "../../commons/"

Core {
    id: root
    color: "lightgray"
    width: 320
    height: 480

    property string vqml_system_logic_name: "AC-01"

    property int vqml_system_core_version_0: 1
    property int vqml_system_core_version_1: 0
    property int vqml_system_core_version_2: 1

    property int vqml_system_logic_version_0: 1
    property int vqml_system_logic_version_1: 0
    property int vqml_system_logic_version_2: 0

    property int vqml_system_gui_version_0: 0
    property int vqml_system_gui_version_1: 1
    property int vqml_system_gui_version_2: 1

    property int vqml_system_serial_0: 0
    property int vqml_system_serial_1: 0
    property int vqml_system_serial_2: 0
    property int vqml_system_serial_3: 0

    property bool printDestruction: false

    ObjectModel {
        id: pagesModel

        Rectangle {
            width: view.width; height: view.height
            color: "white"

            ColumnLayout {
                id: layout
                anchors.fill: parent
                spacing: 6

                Item {
                    Layout.fillWidth: true
                    Layout.minimumWidth: 320
                    Layout.preferredWidth: 320
                    Layout.maximumWidth: 450

                    Layout.fillHeight: true
                    Layout.minimumHeight: 200
                    Layout.preferredHeight: 200

                    Layout.alignment: Qt.AlignHCenter


                    Item {
                        anchors.centerIn: parent
                        width: 0.9 * parent.width
                        height: parent.height

//                        Rectangle{
//                            color: 'lightblue'
//                            anchors.fill: parent
//                        }

                        Image {
                            source: "../../images/logo_ibsystem.png"

                            anchors.centerIn: parent
                            anchors.baselineOffset: 50
                            anchors.fill: parent

                            fillMode: Image.PreserveAspectFit
                        }
                    }
                }


                Item {
                    Layout.fillWidth: true
                    Layout.minimumWidth: 200
                    Layout.preferredWidth: 200

                    Layout.fillHeight: true
                    Layout.minimumHeight: 100
                    Layout.preferredHeight: 100

//                    Rectangle{
//                        color: 'plum'
//                        anchors.fill: parent
//                    }

                    Text {
                        id: txt_system_logic_name
                        text: vqml_system_logic_name
                        font.pointSize: 12
                        font.bold: true
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.top: parent.top
                    }

                    Text {
                        id: txt_core_version
                        text: "core v. " + vqml_system_core_version_0 + "." + vqml_system_core_version_1 + "." + vqml_system_core_version_2
                        font.pointSize: 10
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.top: txt_system_logic_name.bottom
                        anchors.topMargin: 10
                    }

                    Text {
                        id: txt_logic_version
                        text: "logic v. " + vqml_system_logic_version_0 + "." + vqml_system_logic_version_1 + "." + vqml_system_logic_version_2
                        font.pointSize: 10
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.top: txt_core_version.bottom
                    }

                    Text {
                        id: txt_gui_version
                        text: "gui v. " + vqml_system_gui_version_0 + "." + vqml_system_gui_version_1 + "." + vqml_system_gui_version_2
                        font.pointSize: 10
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.top: txt_logic_version.bottom
                    }

                    Text {
                        id: txt_serial
                        text: "serial: " + vqml_system_serial_0 + "-" + vqml_system_serial_1 + "-" + vqml_system_serial_2 + "-" + vqml_system_serial_3
                        font.pointSize: 10
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.top: txt_gui_version.bottom
                    }

                }

            }



            Component.onDestruction: if (printDestruction) print("destroyed 1")
        }
        Rectangle {
            width: view.width; height: view.height
            color: "white"

            Text {
                text: "Licence, copyright, warnings etc (page 2)"
                font.bold: true
                anchors.centerIn: parent
                font.pixelSize: 10
                clip: true
            }

            Component.onDestruction: if (printDestruction) print("destroyed 2")
        }
        Rectangle {
            width: view.width; height: view.height
            color: "white"

            Text {
                text: "Licence, copyright, warnings etc (page 3)"
                font.bold: true
                anchors.centerIn: parent
                font.pixelSize: 10
                clip: true
            }

            Component.onDestruction: if (printDestruction) print("destroyed 3")
        }
    }

    ListView {
        id: view
        anchors { fill: parent; bottomMargin: 30 }
        model: pagesModel
        preferredHighlightBegin: 0; preferredHighlightEnd: 0
        highlightRangeMode: ListView.StrictlyEnforceRange
        orientation: ListView.Horizontal
        snapMode: ListView.SnapOneItem; flickDeceleration: 2000
        cacheBuffer: 200
    }

    Rectangle {
        width: root.width; height: 30
        anchors { top: view.bottom; bottom: parent.bottom }
        color: "gray"

        Row {
            anchors.centerIn: parent
            spacing: 20

            Repeater {
                model: pagesModel.count

                Rectangle {
                    width: 5; height: 5
                    radius: 3
                    color: view.currentIndex == index ? "blue" : "white"

                    MouseArea {
                        width: 20; height: 20
                        anchors.centerIn: parent
                        onClicked: view.currentIndex = index
                    }
                }
            }
        }
    }
}