import QtQuick 2.12
import QtQuick.Layouts 1.12

import qt.koriolan.shipheart 1.0
import"fonctions_couleurs.js" as Fonctions_couleurs



Shipheart_page {
    id: page_accueil

    property int no_couleur_off: 0
    property int no_couleur_on: 1


    // Modèles :
    property Bdd bdd : Bdd{}


    //===========================================================
    // Timer 1 seconde :
    //===========================================================
    Timer {
        id: timer_principal
        interval: 1                             // Cette valeur n'est utilisée qu'une fois au démarrage. Ensuite, elle est fixée à 1s
        triggeredOnStart: false
        running: true
        repeat: true
        onTriggered: {
            if (interval == 1) {                // Premier passage, 1ms après le premier chargement
                init_page();
                interval = 1000;
            }
console.log("--")

        }
    }

    //===========================================================
    // Grille principale :
    //===========================================================
    GridLayout {
        id: home_grid
        columns: nombre_colonnes_matrice_test
        columnSpacing: 5
        rowSpacing: 5

        ListModel {
            id: modele_test
        }

        Repeater {
            id: repeteur

            model: modele_test

            Rectangle {
                Layout.preferredWidth: (shipheart_largeur_page - (nombre_colonnes_matrice_test * home_grid.columnSpacing)) / nombre_colonnes_matrice_test
                Layout.preferredHeight: (shipheart_hauteur_page - (nombre_lignes_matrice_test * home_grid.rowSpacing)) / nombre_lignes_matrice_test
                border.width: 1
                border.color: couleur_gris_fonce
                radius: 10
                color: Fonctions_couleurs.couleur_test_ecran(model.no_couleur)

                Text {
                   text: model.texte;
                   anchors.fill: parent                                 // Permet que le texte occupe tout l'espace du parent (et que le centrage vertical qui suit fonctionne...)
                   verticalAlignment: Text.AlignVCenter
                   horizontalAlignment: Text.AlignHCenter
                   font.pixelSize: 12
                   color: (model.no_couleur === no_couleur_off) ? Fonctions_couleurs.couleur_test_ecran(no_couleur_on) : Fonctions_couleurs.couleur_test_ecran(no_couleur_off)
                   visible: (model.texte === "Back") ? false : true
                }
                Image {
                    source: "/images/icone_retour.png"
                    sourceSize.height: 30
                    anchors {
                        verticalCenter: parent.verticalCenter
                        horizontalCenter: parent.horizontalCenter
                    }
                    visible: (model.texte === "Back") ? true : false
                }
                MouseArea {                             // Zone d'interaction. On est obligé de la mettre dans la grille pour que Rectangle et MouseArea soient frères ou parent/enfant ET qu'on n'occupe qu'un espace dans la grille.
                    id: mouse_area_consigne
                    anchors.fill: parent
                    onClicked: {
console.log("click détecté")
                        switch(model.texte)
                        {
                            case "Back":
                                stackView.pop();
                                break;
                            default :
                                if (model.no_couleur === no_couleur_off) modele_test.setProperty(index, "no_couleur", no_couleur_on);
                                else modele_test.setProperty(index, "no_couleur", no_couleur_off);
                                break;
                        }
                    }
                }
            }
        }
    }       // Fin de grille principale




    //=================================================================================================
    // Fonction :   Traite les tâches à effectuer à l'ouverture de la page
    //=================================================================================================
    function init_page()
    {
        var i, j, k;
        var texte;

        modele_test.clear();

        for (i = 0; i < nombre_colonnes_matrice_test; i ++)
        {
            for (j = 0; j < nombre_lignes_matrice_test; j ++)
            {
                k = (i * nombre_lignes_matrice_test) + j;

                switch(k)
                {
                    case (nombre_colonnes_matrice_test * (nombre_lignes_matrice_test - 1)) : texte = "Back"; break;
                    default: texte = k.toFixed(0);
                }

                modele_test.append({ "no_couleur": no_couleur_off, "texte": texte});
            }
        }
    }
}