Import initial du projet shipheart_cm5
This commit is contained in:
@@ -0,0 +1,856 @@
|
||||
//========================================================================================================================================================================
|
||||
// CONFIG_PAGE_EDITION.QML
|
||||
// Ce fichier traite la configuration d'une page personnalisée.
|
||||
// La page est appelée depuis la page CONFIG_PAGE, en cliquant sur le bouton "Edition"
|
||||
//========================================================================================================================================================================
|
||||
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Controls 2.12
|
||||
import QtQml.Models 2.1
|
||||
|
||||
import qt.koriolan.shipheart 1.0
|
||||
import"fonctions.js" as Fonctions
|
||||
|
||||
|
||||
Shipheart_page {
|
||||
id: page_config_page_edition
|
||||
|
||||
// Mis en forme :
|
||||
readonly property double pourcentage_largeur_colonne_gauche: 0.20
|
||||
readonly property double pourcentage_bandeau_bas_largeur_zone_retour: 1.0
|
||||
readonly property double espace_colonnes_principales: 20
|
||||
|
||||
readonly property double pourcentage_hauteur_ligne_haut: 0.75
|
||||
readonly property double affichage_hauteur_utile: shipheart_hauteur_page - shipheart_hauteur_bandeau_haut - shipheart_hauteur_bandeau_bas
|
||||
readonly property double espace_lignes_principales: 20
|
||||
|
||||
readonly property int nombre_lignes_points_visibles: 6
|
||||
readonly property int diametre_points_deplacables: 100
|
||||
|
||||
readonly property int periode_init_raffraichissement_parametres: 1 // En ms
|
||||
readonly property int periode_raffraichissement_parametres: 1000 // En ms
|
||||
|
||||
|
||||
// Affichage :
|
||||
property bool flag_aucun_points: true
|
||||
|
||||
property bool flag_init: true // Permet de bloquer certains affichage tant qu el'init n'est pas terminée
|
||||
property bool flag_alignement_demande: false
|
||||
property bool flag_nouvelles_valeurs: false
|
||||
property bool flag_affichage_ajout_point: true
|
||||
|
||||
|
||||
// Données :
|
||||
property int id_page: 0
|
||||
property string nom_page: ""
|
||||
property string fichier: ""
|
||||
property int opacite: 0
|
||||
property int taille: 0
|
||||
property int offset_x: 0
|
||||
property int offset_y: 0
|
||||
property string chaine_points: ""
|
||||
property int nb_points: 0
|
||||
property int index_point_en_cours: -1
|
||||
|
||||
property double ecart_maxi_detectable: 0.0001
|
||||
|
||||
|
||||
// Modèles :
|
||||
// Note : les modèles chargés dans 'main.qml' n'ont pas à être rechargés dans les pages suivantes
|
||||
|
||||
|
||||
//===========================================================
|
||||
// Signaux :
|
||||
//===========================================================
|
||||
|
||||
//----------------------------------------------------------------------------------
|
||||
// Connexion au signaux de pages créées depuis celle-ci :
|
||||
Connections {
|
||||
target: stackView.currentItem // Pointe sur la page active de StackView (qui sera créée... bientôt, ou pas)
|
||||
ignoreUnknownSignals: true // Permet de ne pas déclencher d'erreur AVANT que la page ne soit créée par un StackView.push()
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
// Fonction d'enregistrement des nouvelles data provenant de 'config_page' :
|
||||
// ----------------------------------------------------------------------------
|
||||
function onEnregistrer_config_page(new_id_page)
|
||||
{
|
||||
//console.log("Mise à jour de l'ID de la page : new_id_page = "+new_id_page);
|
||||
|
||||
id_page = new_id_page;
|
||||
}
|
||||
|
||||
// ---------------------------------------------------------------------------------
|
||||
// Fonction d'enregistrement des nouvelles data provenant de 'config_page_point' :
|
||||
// ---------------------------------------------------------------------------------
|
||||
function onEnregistrer_config_page_point(new_flag_point_existant, new_type_source, new_id_source, new_type_point, new_taille_point)
|
||||
{
|
||||
//console.log("index_point_en_cours = " + index_point_en_cours + " | Mise à jour des nouvelles valeur : new_flag_point_existant = " + new_flag_point_existant + ", new_type_source = " + new_type_source + ", new_id_source = " + new_id_source + ", new_type_point = " + new_type_point + ", new_taille_point = " + new_taille_point);
|
||||
|
||||
//----------------------------------------
|
||||
// Cas d'une mise à jour :
|
||||
if (index_point_en_cours !== -1) // Le point existait avant l'appel :
|
||||
{
|
||||
if (new_flag_point_existant) // Il existe toujours = mise à jour des données du point sélectionné :
|
||||
{
|
||||
modele_liste_points.set(index_point_en_cours, {
|
||||
"type_source": new_type_source,
|
||||
"id_source": new_id_source,
|
||||
"type_point": new_type_point,
|
||||
"taille_point": new_taille_point } );
|
||||
}
|
||||
else // Il n'existe plus = suppression du point :
|
||||
{
|
||||
modele_liste_points.remove(index_point_en_cours, 1);
|
||||
index_point_en_cours = -1;
|
||||
}
|
||||
}
|
||||
//----------------------------------------
|
||||
// Cas de l'ajout d'un point :
|
||||
else // Le point n'existait pas avant l'appel :
|
||||
{
|
||||
if (new_flag_point_existant) // Il existe maintenant = insertion du nouveau point :
|
||||
{
|
||||
modele_liste_points.append({
|
||||
"validite": 1,
|
||||
"type_source": new_type_source,
|
||||
"id_source": new_id_source,
|
||||
"x": -0.5, // Insertion sur le bord gauche...
|
||||
"y": -0.5, // .... et en haut de la page pour être visible
|
||||
"x_initial": -0.5,
|
||||
"y_initial": -0.5,
|
||||
"type_point": new_type_point,
|
||||
"taille_point": new_taille_point,
|
||||
"actif": false,
|
||||
"changed": true });
|
||||
|
||||
flag_alignement_demande = true // Permet de déclencher un traitement au niveau du repeater pour mettre à jour la position du rectangle/cercle.
|
||||
flag_alignement_demande = false // La RAZ ne peut pas se faire dans le repeater. Donc on la fait ici car le front montant a déjà été détecté par le signe de changement.
|
||||
}
|
||||
else ; // Il n'existe toujours pas (création abandonnée)
|
||||
}
|
||||
enregistrer_points(); // Mémorise dans la BDD les éventuels changements faits dans 'config_page_point'. Obligatoire car, ensuite, une 'init_page()' sera fait et rechargera les points depuis la BDD... (sans ça, les modifs faites sont perdues !)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//===========================================================
|
||||
// Timer periode raffraichissement parametres :
|
||||
//===========================================================
|
||||
Timer {
|
||||
id: timer_raffraichissement_parametres
|
||||
interval: periode_init_raffraichissement_parametres
|
||||
triggeredOnStart: false
|
||||
running: true
|
||||
repeat: true
|
||||
onTriggered: {
|
||||
if (interval == periode_init_raffraichissement_parametres) // Premier passage, 1ms après le premier chargement
|
||||
{
|
||||
interval = periode_raffraichissement_parametres;
|
||||
}
|
||||
else
|
||||
{
|
||||
// Recherche s'il y a au moins un point qui a été modifié :
|
||||
let flag = false;
|
||||
for(let i = 0; i < modele_liste_points.count; i++) {
|
||||
if (modele_liste_points.get(i).changed) { flag = true; break; }
|
||||
}
|
||||
flag_nouvelles_valeurs = flag;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//===========================================================
|
||||
// Lorsque la page est sur le point d'être affichée dans la pile :
|
||||
//===========================================================
|
||||
StackView.onActivating: {
|
||||
if (id_page !== 0) init_page(); // Permet que lors du retour sur la page, l'état des différentes variables soit mise à jour avant l'affichage proprement dit. Y compris lors de l'ouverture initiale...
|
||||
}
|
||||
|
||||
//===========================================================
|
||||
// Lorsque la page est affichée dans la pile :
|
||||
//===========================================================
|
||||
StackView.onActivated: {
|
||||
if (id_page === 0) init_page(); // Permet, lorsque l'ouverture est terminée, de rediriger si besoin vers una autre page ('config_page' lors de la création)
|
||||
}
|
||||
|
||||
// Titre de la page :
|
||||
Shipheart_titre_1 {titre: qsTr("Edition de la page [%1]").arg(nom_page); hauteur: shipheart_hauteur_bandeau_haut}
|
||||
|
||||
//-------------------------------------------------------
|
||||
// Ecran Haut - Gauche :
|
||||
//-------------------------------------------------------
|
||||
Rectangle {
|
||||
id: zone_affichage_haut_gauche
|
||||
x: 0
|
||||
y: shipheart_hauteur_bandeau_haut;
|
||||
width: (shipheart_largeur_page * pourcentage_largeur_colonne_gauche) - (espace_colonnes_principales / 2)
|
||||
height: (affichage_hauteur_utile * pourcentage_hauteur_ligne_haut) - (espace_lignes_principales / 2)
|
||||
clip:true // Evite que le ListView suivant ne puisse dépasser du rectangle
|
||||
color: "transparent"
|
||||
|
||||
ListModel {
|
||||
id: modele_liste_points
|
||||
}
|
||||
|
||||
ListView {
|
||||
id: liste_points
|
||||
anchors.fill: parent
|
||||
model: modele_liste_points
|
||||
spacing: 5
|
||||
snapMode: GridView.SnapToRow // L'arret de l'affichage se fera sur une rangée entière
|
||||
highlightMoveDuration: 600 // défini la vitesse à laquelle on va se déplacer sur l'item sélectionné (utilisé avec l'affectation du 'currentIndex' quand on touche un rectangle/cercle)
|
||||
highlightMoveVelocity: -1 // -1 si le précedent est actif et réciproquement
|
||||
footerPositioning: ListView.InlineFooter // Positionne le footer à la fin des enregistrements (pratique pour le bouton MORE...)
|
||||
visible: flag_init ? false : true;
|
||||
opacity: Math.max(0.1, 1.0 - (Math.abs(verticalOvershoot) *3 / height)) // Permet de rendre transparent le contenu lorsqu'on dépasse la zone de défilement
|
||||
delegate: Rectangle {
|
||||
height: ((liste_points.height - ((nombre_lignes_points_visibles - 1) * liste_points.spacing)) / nombre_lignes_points_visibles)
|
||||
width:zone_affichage_haut_gauche.width
|
||||
color: model.actif ? shipheart_couleur_fond_bouton_actif : shipheart_couleur_fond_bouton
|
||||
radius: shipheart_rayon_bouton
|
||||
|
||||
//--------------------------------------------------------------------
|
||||
// N° du point :
|
||||
Text {
|
||||
id: no_point // Premier élément du bouton : n° de ligne
|
||||
width: parent.width * 0.1;
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
horizontalAlignment: Text.AlignRight
|
||||
rightPadding: 5
|
||||
text: index + 1
|
||||
font.pixelSize: 18
|
||||
font.bold: true
|
||||
color: couleur_blanc_casse
|
||||
}
|
||||
|
||||
//--------------------------------------------------------------------
|
||||
// Icone du point :
|
||||
Rectangle { // Le passage par un rectangle avant l'image permet de centrer l'image sur le rectangle et pas juste caler les images à gaiche (elles n'ont pas la même largeur donc elles n'étaient pas centrées les unes par rapport aux autres)
|
||||
id: icone_point
|
||||
width: parent.width * 0.1;
|
||||
height: parent.height
|
||||
x: no_point.width
|
||||
color: "transparent"
|
||||
|
||||
Image {
|
||||
source: "/images/" + model.icone
|
||||
sourceSize.height: parent.height * 0.4
|
||||
sourceSize.width: parent.width
|
||||
anchors {
|
||||
verticalCenter: parent.verticalCenter
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
visible: (model.icone !== "")
|
||||
}
|
||||
}
|
||||
|
||||
//--------------------------------------------------------------------
|
||||
// Nom du point :
|
||||
Text {
|
||||
id: nom_point
|
||||
x: no_point.width + icone_point.width;
|
||||
width: parent.width - no_point.width - icone_point.width;
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
horizontalAlignment: Text.AlignLeft
|
||||
leftPadding: 5
|
||||
text: model.nom
|
||||
font.pixelSize: 15
|
||||
color: couleur_blanc_casse
|
||||
}
|
||||
|
||||
//--------------------------------------------------------------------
|
||||
// Triangle orange de modification :
|
||||
Image {
|
||||
id: image_changed // Affichage du coin inférieur-droit en orange si le point a été modifié
|
||||
source: "/images/coin_bas_droite_orange.png"
|
||||
sourceSize.height: 20
|
||||
anchors {
|
||||
bottom: parent.bottom
|
||||
right: parent.right
|
||||
}
|
||||
visible: model.changed
|
||||
}
|
||||
|
||||
//--------------------------------------------------------------------
|
||||
MouseArea{
|
||||
anchors.fill : parent
|
||||
onClicked: {
|
||||
shipheart_clic();
|
||||
index_point_en_cours = index;
|
||||
stackView.push("config_page_point.qml", {
|
||||
"flag_point_existant" : true,
|
||||
"type_source": model.type_source,
|
||||
"id_source": model.id_source,
|
||||
"type_point": model.type_point,
|
||||
"taille_point": model.taille_point })
|
||||
}
|
||||
pressAndHoldInterval: shipheart_mouse_press_and_hold_interval_long;
|
||||
onPressAndHold: {
|
||||
shipheart_clic();
|
||||
|
||||
// Appui long = Remise en position initiale du point :
|
||||
modele_liste_points.setProperty(index, "x", model.x_initial) // Recopie des coordonnées originelles dans les coordonnées actuelles
|
||||
modele_liste_points.setProperty(index, "y", model.y_initial)
|
||||
flag_alignement_demande = true // Permet de déclencher un traitement au nivea du repeater pour mettre à jour la position du rectangle/cercle.
|
||||
flag_alignement_demande = false // La RAZ ne peut pas se faire dans le repeater. Donc on la fait ici car le front montant a déjà été détecté par le signe de changement.
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
footer: Rectangle { // Ce premier rectangle sert juste à créer un espace un peu plu sgrand pour le bouton '+' et le décaler de 'spacing' vers le bas...
|
||||
height: ((liste_points.height - ((nombre_lignes_points_visibles - 1) * liste_points.spacing)) / nombre_lignes_points_visibles) + liste_points.spacing
|
||||
width:parent.width
|
||||
color: "transparent"
|
||||
visible: flag_affichage_ajout_point
|
||||
|
||||
Rectangle { // c'est le bouton proprement dit...
|
||||
height: ((liste_points.height - ((nombre_lignes_points_visibles - 1) * liste_points.spacing)) / nombre_lignes_points_visibles)
|
||||
width:parent.width
|
||||
color: shipheart_couleur_fond_bouton
|
||||
radius: shipheart_rayon_bouton
|
||||
anchors.bottom: parent.bottom
|
||||
Text {
|
||||
anchors {
|
||||
verticalCenter: parent.verticalCenter
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
text: "+"
|
||||
font.pixelSize: 40
|
||||
font.bold: true
|
||||
color: couleur_gris_moyen
|
||||
}
|
||||
MouseArea{
|
||||
anchors.fill : parent
|
||||
onClicked: {
|
||||
shipheart_clic();
|
||||
index_point_en_cours = -1;
|
||||
stackView.push("config_page_point.qml", {"flag_point_existant" : false, "type_source": 0, "id_source": 0, "type_point": 0 })
|
||||
}
|
||||
onPressed: shipheart_clic();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Label {
|
||||
anchors.fill: parent
|
||||
horizontalAlignment: Qt.AlignHCenter
|
||||
verticalAlignment: Qt.AlignVCenter
|
||||
visible: parent.count === 0
|
||||
text: qsTr("Aucun équipement n'est configuré sur cette page pour le moment...")
|
||||
color: couleur_rouge_transparent
|
||||
font.pixelSize: 15
|
||||
font.bold: true
|
||||
wrapMode: Label.Wrap
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//-------------------------------------------------------
|
||||
// Ecran Bas - Gauche :
|
||||
//-------------------------------------------------------
|
||||
Rectangle {
|
||||
id: zone_affichage_bas_gauche
|
||||
x: 0
|
||||
y: shipheart_hauteur_bandeau_haut + zone_affichage_haut_gauche.height + espace_lignes_principales;
|
||||
width: (shipheart_largeur_page * pourcentage_largeur_colonne_gauche) - (espace_colonnes_principales / 2)
|
||||
height: (affichage_hauteur_utile * (1 - pourcentage_hauteur_ligne_haut)) - (espace_lignes_principales * 3 / 2)
|
||||
color: "transparent"
|
||||
|
||||
Column {
|
||||
anchors.fill: parent
|
||||
spacing: 5
|
||||
|
||||
//-----------------------------
|
||||
// Config de la page :
|
||||
//-----------------------------
|
||||
Rectangle {
|
||||
width: parent.width
|
||||
height: (parent.height/2) - (parent.spacing/2)
|
||||
color: shipheart_couleur_fond_bouton
|
||||
radius: shipheart_rayon_bouton
|
||||
Text {
|
||||
anchors {
|
||||
verticalCenter: parent.verticalCenter
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
font.pixelSize: 20
|
||||
text: qsTr("Page")
|
||||
color: couleur_blanc_casse
|
||||
}
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
onClicked: {
|
||||
shipheart_clic();
|
||||
stackView.push("config_page.qml", {"id_page": id_page})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//-----------------------------
|
||||
// Bouton Enregistrer/créer :
|
||||
//-----------------------------
|
||||
Rectangle {
|
||||
width: parent.width
|
||||
height: (parent.height/2) - (parent.spacing/2)
|
||||
color: shipheart_couleur_fond_bouton
|
||||
radius: shipheart_rayon_bouton
|
||||
Text {
|
||||
anchors {
|
||||
verticalCenter: parent.verticalCenter
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
font.pixelSize: 20
|
||||
text: qsTr("Enregistrer")
|
||||
color: flag_nouvelles_valeurs ? couleur_blanc_casse : couleur_gris_fonce
|
||||
}
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
onClicked: {
|
||||
shipheart_clic();
|
||||
if (flag_nouvelles_valeurs) enregistrer_points();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//-------------------------------------------------------
|
||||
// Ecran Droite :
|
||||
//-------------------------------------------------------
|
||||
Rectangle {
|
||||
id: zone_affichage_droite
|
||||
x: zone_affichage_haut_gauche.width + espace_colonnes_principales
|
||||
y: shipheart_hauteur_bandeau_haut + ((affichage_hauteur_utile - height) / 2);
|
||||
width: (shipheart_largeur_page * (1 - pourcentage_largeur_colonne_gauche)) - (espace_colonnes_principales / 2)
|
||||
height: (affichage_hauteur_utile - espace_lignes_principales) * (zone_affichage_droite.width / shipheart_largeur_page) // Permet d'avoir le même ratio que lors de l'affichage dans 'page_personnalisee.qml'
|
||||
color: "transparent"
|
||||
border.color: couleur_gris_moyen
|
||||
|
||||
//==========================
|
||||
// Image de la silhouette :
|
||||
Image {
|
||||
id: image_silhouette
|
||||
anchors.fill: parent
|
||||
source: (fichier !== "")
|
||||
? "file://" + shipheart_repertoire_config + shipheart_sous_repertoire_images_silhouette + "/" + fichier
|
||||
: ""
|
||||
fillMode: Image.PreserveAspectFit
|
||||
opacity: (opacite / 100)
|
||||
visible: (fichier !== "")
|
||||
}
|
||||
|
||||
//==========================
|
||||
// Points :
|
||||
Repeater {
|
||||
model: modele_liste_points
|
||||
|
||||
Rectangle {
|
||||
id: point_deplacable
|
||||
|
||||
property bool flag_init_point_deplacable: flag_init // Recopie au niveau du delegate du flag général pour pouvoir utiliser onFlag_xxxChanged et déclencher l'appel à une fonction JS une seule fois en fin d'init
|
||||
property bool flag_align_point_deplacable: flag_alignement_demande // Idem lorsqu'une mise à jour directe des coordonnées a été fait (par exemple, dans le menu de gauche, la remise aux conditions initiales d'un point) et qu'il faut aligner le rectangle/cerlce sur ces nouvelles coordonnées.
|
||||
|
||||
radius: diametre_points_deplacables / 2 // Défini dans l'entete
|
||||
width: diametre_points_deplacables // Rectangle => devient cercle
|
||||
height: width
|
||||
color: couleur_bleu_koriolan_tres_transparent
|
||||
|
||||
// Principe de coordonnées X/Y d'un point :
|
||||
// Les valeurs X et Y stockées dans la chaine Points dans la BDD sont des valeurs décimales, calculées
|
||||
// à partir du CENTRE de l'image.
|
||||
// La valeur 0/0 représente donc le centre de l'image, 0.5/0.5 représente le coin en bas à droite de l'image,
|
||||
// le point -0.5/-0.5 le point en haut à gauche et 0.5/0.0, le point sur le bord droit de l'image et au milieu dans le sens vertical.
|
||||
// Important, les valeurs peuvent être supérieures à 0.5 en valeur absolue car le point peut être hors de l'image. Par exemple,
|
||||
// dans le cas d'une image large et peu haute, des points peuvent être posés au-dessus ou au-dessous (et réciproquement).
|
||||
// L'objectif de cette méthode est de pouvoir ensuite afficher la page dans n'importe quelle proportion avec des points
|
||||
// toujours correctement placés sur ou autour de l'image.
|
||||
|
||||
//-----------------------------------------------------
|
||||
// Croix de positionnement :
|
||||
// (actives lorsque le point est en cours de déplacement)
|
||||
Rectangle {
|
||||
y: diametre_points_deplacables / 2
|
||||
width: diametre_points_deplacables
|
||||
height: 1
|
||||
color: couleur_green_yellow
|
||||
visible: model.actif
|
||||
}
|
||||
Rectangle {
|
||||
x: diametre_points_deplacables / 2
|
||||
width: 1
|
||||
height: diametre_points_deplacables
|
||||
color: couleur_green_yellow
|
||||
visible: model.actif
|
||||
}
|
||||
|
||||
//-----------------------------------------------------
|
||||
// Icone :
|
||||
// (remplacée par la croix de positionnement en cours de déplacement)
|
||||
Image {
|
||||
source: "/images/" + shipheart_page_personnalisee_type_point_icones[model.type_source][model.type_point]
|
||||
sourceSize.height: model.taille_point
|
||||
anchors {
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
visible: !model.actif
|
||||
}
|
||||
|
||||
//-----------------------------------------------------
|
||||
// N° du point afin de faire le lien avec l'écran de gauche :
|
||||
Text {
|
||||
id: libelle_point // N° du point dans le modèle (qui est commun à l'écran de gauche et sur les points déplaçables
|
||||
anchors.top: parent.top
|
||||
anchors.left: parent.left
|
||||
text: (index + 1)
|
||||
font.pixelSize: 20
|
||||
font.weight: Font.Bold
|
||||
color: couleur_blanc_casse
|
||||
}
|
||||
|
||||
//-----------------------------------------------------
|
||||
// Prise en compte des déplacements horizontaux :
|
||||
onXChanged: { // Si le rectangle/cercle a bougé (avec le doigt), on met à jour la valeur de X de 'modèle_liste_points'
|
||||
if (image_silhouette.visible) modele_liste_points.setProperty(index, "x", ((x + (point_deplacable.width / 2) - (zone_affichage_droite.width / 2)) / image_silhouette.paintedWidth) )
|
||||
else modele_liste_points.setProperty(index, "x", ((x + (point_deplacable.width / 2) - (zone_affichage_droite.width / 2)) / zone_affichage_droite.width) )
|
||||
|
||||
if ((Math.abs(model.x - model.x_initial) > ecart_maxi_detectable)
|
||||
|| (Math.abs(model.y - model.y_initial) > ecart_maxi_detectable)) { // On est obligé de tester X et Y à chaque fois car on pourrait dévalider un changed si X est revenu à sa position initiale et pas Y
|
||||
modele_liste_points.setProperty(index, "changed", true);
|
||||
}
|
||||
else modele_liste_points.setProperty(index, "changed", false);
|
||||
}
|
||||
|
||||
//-----------------------------------------------------
|
||||
// Prise en compte des déplacements verticaux :
|
||||
onYChanged: { // Iem pour l'axe Y
|
||||
if (image_silhouette.visible) modele_liste_points.setProperty(index, "y", ((y + (point_deplacable.height / 2) - (zone_affichage_droite.height / 2)) / image_silhouette.paintedHeight) )
|
||||
else modele_liste_points.setProperty(index, "y", ((y + (point_deplacable.height / 2) - (zone_affichage_droite.height / 2)) / zone_affichage_droite.height) )
|
||||
|
||||
if ((Math.abs(model.x - model.x_initial) > ecart_maxi_detectable)
|
||||
|| (Math.abs(model.y - model.y_initial) > ecart_maxi_detectable)) { // On est obligé de tester X et Y à chaque fois car on pourrait dévalider un changed si Y est revenu à sa position initiale et pas X
|
||||
modele_liste_points.setProperty(index, "changed", true);
|
||||
}
|
||||
else modele_liste_points.setProperty(index, "changed", false);
|
||||
}
|
||||
|
||||
//-----------------------------------------------------
|
||||
MouseArea {
|
||||
id: mouse_area_point_deplacable // Zone dragable
|
||||
anchors.fill: parent
|
||||
drag.target: point_deplacable
|
||||
drag.axis: Drag.XAndYAxis
|
||||
drag {
|
||||
// Note : Le 'point' est le coin haut-gauche du rectangle (retaillé en cercle).
|
||||
// Il faut donc décaler les références d'une demi-largeur de rectangle pour que
|
||||
// le centre du cercle arrive aux extrémités attendues...
|
||||
minimumX: 0 - (point_deplacable.width / 2)
|
||||
maximumX: zone_affichage_droite.width - (point_deplacable.width / 2)
|
||||
minimumY: 0 - (point_deplacable.width / 2)
|
||||
maximumY: zone_affichage_droite.height - (point_deplacable.width / 2)
|
||||
}
|
||||
preventStealing: true
|
||||
onPressed: {
|
||||
modele_liste_points.setProperty(index, "actif", true) // Permet d'informer le bouton correpondant sur la liste gauche de passer en "actif"
|
||||
liste_points.currentIndex = index // Permet de ramener le bouton correspondant dans la zone visible du ListView de gauche
|
||||
}
|
||||
onReleased: {
|
||||
modele_liste_points.setProperty(index, "actif", false) // Permet d'informer le bouton correpondant sur la liste gauche de repasser au "repos"
|
||||
}
|
||||
}
|
||||
onFlag_init_point_deplacableChanged: { // Activé en fin d'init : Positionne le rectangle/cercle sur la valeur initiale du modèle.
|
||||
if (image_silhouette.visible)
|
||||
{
|
||||
point_deplacable.x = (model.x * image_silhouette.paintedWidth) + (zone_affichage_droite.width / 2) - (point_deplacable.width / 2)
|
||||
point_deplacable.y = (model.y * image_silhouette.paintedHeight) + (zone_affichage_droite.height / 2) - (point_deplacable.height / 2)
|
||||
}
|
||||
else
|
||||
{
|
||||
point_deplacable.x = (model.x * zone_affichage_droite.width) + (zone_affichage_droite.width / 2) - (point_deplacable.width / 2)
|
||||
point_deplacable.y = (model.y * zone_affichage_droite.height) + (zone_affichage_droite.height / 2) - (point_deplacable.height / 2)
|
||||
}
|
||||
}
|
||||
|
||||
onFlag_align_point_deplacableChanged: {
|
||||
if (flag_alignement_demande) // Permet de limiter le traitement au front montant de 'flag_alignement_demande'
|
||||
{ // PS : ce traitement est fait pour tous les points de repeater, même si la plupart du temps, un seul point a été modifié...
|
||||
if (image_silhouette.visible)
|
||||
{
|
||||
point_deplacable.x = (model.x * image_silhouette.paintedWidth) + (zone_affichage_droite.width / 2) - (point_deplacable.width / 2)
|
||||
point_deplacable.y = (model.y * image_silhouette.paintedHeight) + (zone_affichage_droite.height / 2) - (point_deplacable.height / 2)
|
||||
}
|
||||
else
|
||||
{
|
||||
point_deplacable.x = (model.x * zone_affichage_droite.width) + (zone_affichage_droite.width / 2) - (point_deplacable.width / 2)
|
||||
point_deplacable.y = (model.y * zone_affichage_droite.height) + (zone_affichage_droite.height / 2) - (point_deplacable.height / 2)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//-------------------------------------------------------
|
||||
// Bandeau bas :
|
||||
//-------------------------------------------------------
|
||||
Row {
|
||||
x: 0
|
||||
y: shipheart_hauteur_page - shipheart_hauteur_bandeau_bas;
|
||||
width: shipheart_largeur_page;
|
||||
height: shipheart_hauteur_bandeau_bas;
|
||||
spacing: 5
|
||||
padding: 5
|
||||
|
||||
|
||||
//.................................................
|
||||
// Bouton retour
|
||||
//.................................................
|
||||
Rectangle {
|
||||
id: bandeau_bas_zone_retour
|
||||
width: (parent.width * pourcentage_bandeau_bas_largeur_zone_retour) - parent.leftPadding - (parent.spacing / 2)
|
||||
height: shipheart_hauteur_bandeau_bas - parent.topPadding - parent.bottomPadding;
|
||||
radius: shipheart_rayon_bouton
|
||||
color: shipheart_couleur_fond_bouton
|
||||
Image {
|
||||
source: "/images/icone_retour.png"
|
||||
sourceSize.height: 30
|
||||
anchors {
|
||||
verticalCenter: parent.verticalCenter
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
}
|
||||
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_bandeau_bas_zone_retour
|
||||
anchors.fill: parent
|
||||
onClicked: {
|
||||
shipheart_clic();
|
||||
|
||||
if (flag_nouvelles_valeurs) // Si on demande le retour alors que des points ont été modifiés et pas enregistrés :
|
||||
{
|
||||
boite_validation_sortie.imageTitreSource = "/images/attention.png";
|
||||
boite_validation_sortie.message = qsTr("Vous avez effectué des modifications qui n'ont pes été enregistrées<br />Cliquer sur Annuler pour revenir en arrière et les enregistrer.<br />Cliquer sur OK pour sortir sans enregistrer.")
|
||||
boite_validation_sortie.open();
|
||||
}
|
||||
else stackView.pop() // Si retour alors qu'il n'y a aucun point non enregistrés, on sort sans rien demander.
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//-------------------------------------------------------
|
||||
// Boite de validation :
|
||||
// NB : il est important que ce composant soit directement
|
||||
// rattaché à la page pour qu'elle s'affiche en plein écran.
|
||||
//-------------------------------------------------------
|
||||
Shipheart_boite_dialogue {
|
||||
id: boite_validation_sortie
|
||||
niveau: 1
|
||||
boutonAnnuler: true
|
||||
onClicked: {
|
||||
switch(bouton)
|
||||
{
|
||||
case shipheart_boite_dialogue_bouton_1: // Si Ok, on sort sans chercher plus loin
|
||||
stackView.pop()
|
||||
break;
|
||||
case shipheart_boite_dialogue_bouton_2: // Si Annuler, on revient sur la page pour que l'on puisse enregistrer.
|
||||
break;
|
||||
default:
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Note : il est inutile de prévoir un Mousearea pour sortir de l'économiseur sur cette page puisqu'il
|
||||
// est systématiquement bloqué pour toutes les pages lancées depuis 'Paramètres Avancés'.
|
||||
|
||||
|
||||
|
||||
//=============================================================================================================
|
||||
// Init de la page
|
||||
//=============================================================================================================
|
||||
function init_page()
|
||||
{
|
||||
var req, res;
|
||||
var i;
|
||||
var nb;
|
||||
|
||||
if (id_page === 0) stackView.push("config_page.qml", {"id_page": 0}); // Lors de la création, on va directement à la config de la page
|
||||
else
|
||||
{
|
||||
flag_nouvelles_valeurs = false;
|
||||
|
||||
|
||||
i = 0;
|
||||
// Récupération des infos correspondant à la page concernée :
|
||||
req = 'SELECT Nom, ';
|
||||
// req += ' Type, ';
|
||||
req += ' Fichier, ';
|
||||
req += ' Opacite, ';
|
||||
req += ' Taille, ';
|
||||
req += ' Offset_x, ';
|
||||
req += ' Offset_y, ';
|
||||
req += ' Points ';
|
||||
req += ' FROM TB_Pages ';
|
||||
req += ' WHERE Cle_primaire=' + id_page + ' ';
|
||||
//console.log("req = [ " + req + "; ]");
|
||||
res = bdd.requete_unique(req);
|
||||
|
||||
nom_page = res[i++];
|
||||
fichier = res[i++];
|
||||
opacite = Number(res[i++]);
|
||||
taille = Number(res[i++]);
|
||||
offset_x = Number(res[i++]);
|
||||
offset_y = Number(res[i++]);
|
||||
chaine_points = res[i++];
|
||||
|
||||
// Remplissage des courbes et modèles :
|
||||
if (chaine_points !== "") init_points(chaine_points.split(';'));
|
||||
else init_points(""); // L'appel avec un array vide (cas du résultat de split sur une chaine vide) donne des résultats pas très clairs...
|
||||
|
||||
|
||||
flag_init = false; // Indique que l'init est terminée
|
||||
}
|
||||
}
|
||||
|
||||
//=============================================================================================================
|
||||
// Met à jour 'modele_liste_points', 'points_originaux' et 'points_nouveaux' avec les paramètres contenu dans 'chaines_points'
|
||||
//=============================================================================================================
|
||||
function init_points(chaines_points)
|
||||
{
|
||||
var req, res;
|
||||
var nb;
|
||||
var i;
|
||||
var chaine_point;
|
||||
var point;
|
||||
var validite;
|
||||
var type_source;
|
||||
var id_source;
|
||||
var x, y;
|
||||
var type_point;
|
||||
var taille_point;
|
||||
var icone;
|
||||
|
||||
// RAZ des courbes :
|
||||
nb_points = 0;
|
||||
modele_liste_points.clear();
|
||||
flag_aucun_points = true;
|
||||
|
||||
if (chaines_points === "")
|
||||
{
|
||||
console.log("La liste de points est vide")
|
||||
return; // Si le tableau est vide (aucun point), il ne faut pas faire de traitement supplémentaire...
|
||||
}
|
||||
|
||||
|
||||
// Ajout des points dans les modèles :
|
||||
for (chaine_point of chaines_points) // Chaque point est du type : [validite/type_source/id_source/x/y/type_point/taille_point]
|
||||
{
|
||||
point = chaine_point.split('/');
|
||||
i = 0;
|
||||
validite = Number(point[i++]);
|
||||
type_source = Number(point[i++]);
|
||||
id_source = Number(point[i++]);
|
||||
x = Number(point[i++]);
|
||||
y = Number(point[i++]);
|
||||
type_point = Number(point[i++]);
|
||||
taille_point = Number(point[i++]);
|
||||
|
||||
// Recherche des infos de l'équipement :
|
||||
switch(type_source)
|
||||
{
|
||||
case shipheart_type_source_circuits:
|
||||
req = ' SELECT Nom FROM TB_Circuits WHERE Cle_primaire=' + id_source + ' ';
|
||||
icone = "icone_consommation_electrique.png";
|
||||
break;
|
||||
|
||||
case shipheart_type_source_reservoirs:
|
||||
req = ' SELECT Nom FROM TB_Reservoirs WHERE Cle_primaire=' + id_source + ' ';
|
||||
icone = "reservoir_eau.png";
|
||||
break;
|
||||
|
||||
case shipheart_type_source_batteries:
|
||||
req = ' SELECT Nom FROM TB_Batteries WHERE Cle_primaire=' + id_source + ' ';
|
||||
icone = "batterie_moyen.png";
|
||||
break;
|
||||
|
||||
case shipheart_type_source_capteurs:
|
||||
req = ' SELECT Nom FROM TB_Capteurs WHERE Cle_primaire=' + id_source + ' ';
|
||||
icone = "icone_auxiliaires.png";
|
||||
break;
|
||||
|
||||
case shipheart_type_source_modules:
|
||||
req = ' SELECT Type FROM TB_Modules_config WHERE Adresse_k_bus=' + id_source + ' ';
|
||||
icone = "soh_sombre.png";
|
||||
break;
|
||||
}
|
||||
//console.log("req = [ " + req + "; ]");
|
||||
res = bdd.requete_unique(req);
|
||||
|
||||
modele_liste_points.append({
|
||||
"validite": validite,
|
||||
"type_source": type_source,
|
||||
"id_source": id_source,
|
||||
"x": x,
|
||||
"y": y,
|
||||
"x_initial": x,
|
||||
"y_initial": y,
|
||||
"type_point": type_point,
|
||||
"taille_point": taille_point,
|
||||
"nom": (type_source !== shipheart_type_source_modules) ? res[0] : Fonctions.nom_type_module(Number(res[0])),
|
||||
"icone": icone,
|
||||
"actif": false,
|
||||
"changed": false }); // Modèle pour la liste de gauche + les rectangle/cercles utilisés pour les bouger
|
||||
|
||||
|
||||
flag_aucun_points = false; // Utilisé pour afficher le message "aucune données...'
|
||||
|
||||
if (++nb_points >= shipheart_page_personnalisee_nb_max_points)
|
||||
{
|
||||
flag_affichage_ajout_point = false;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
flag_alignement_demande = true // Permet de déclencher un traitement au niveau du repeater pour mettre à jour la position du rectangle/cercle.
|
||||
flag_alignement_demande = false // La RAZ ne peut pas se faire dans le repeater. Donc on la fait ici car le front montant a déjà été détecté par le signe de changement.
|
||||
}
|
||||
|
||||
|
||||
//=============================================================================================================
|
||||
// Enregistre dans la BDD les nouvelles valeurs
|
||||
//=============================================================================================================
|
||||
function enregistrer_points()
|
||||
{
|
||||
var i;
|
||||
var req;
|
||||
var chaine = "";
|
||||
|
||||
// Génération de la chaine de points [validite/type_source/id_source/x/y/type_point/taille_point] :
|
||||
for(i = 0; i < modele_liste_points.count; i++) {
|
||||
if (chaine !== "") chaine += ";";
|
||||
chaine += (modele_liste_points.get(i).validite) ? "1" : "0";
|
||||
chaine += "/";
|
||||
chaine += (modele_liste_points.get(i).type_source);
|
||||
chaine += "/";
|
||||
chaine += (modele_liste_points.get(i).id_source);
|
||||
chaine += "/";
|
||||
chaine += (modele_liste_points.get(i).x).toFixed(4);
|
||||
chaine += "/";
|
||||
chaine += (modele_liste_points.get(i).y).toFixed(4);
|
||||
chaine += "/";
|
||||
chaine += (modele_liste_points.get(i).type_point);
|
||||
chaine += "/";
|
||||
chaine += (modele_liste_points.get(i).taille_point);
|
||||
|
||||
modele_liste_points.setProperty(i, "changed", false) // On en profite pour RAZ tous les flags Changed
|
||||
}
|
||||
flag_nouvelles_valeurs = false; // ainsi que le flag de nouvelles valeurs
|
||||
|
||||
// Mise à jour de l'entrée dans la table :
|
||||
req = 'UPDATE TB_Pages SET Points="' + chaine + '" WHERE Cle_primaire=' + id_page + ' '
|
||||
//console.log("req = [ " + req + "; ]");
|
||||
bdd.requete_unique(req);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user