From ad692bd9855aa20cfb87935d72e85892f099a575 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9ric=20Tempez?= <frederic.tempez@outlook.com>
Date: Mon, 31 Jan 2022 18:49:03 +0100
Subject: [PATCH] =?UTF-8?q?Informations=20sur=20l'image=20de=20la=20banni?=
 =?UTF-8?q?=C3=A8re?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 core/module/theme/view/header/header.js.php |  6 ++--
 core/module/theme/view/header/header.php    | 33 ++++++++++++++++-----
 2 files changed, 29 insertions(+), 10 deletions(-)

diff --git a/core/module/theme/view/header/header.js.php b/core/module/theme/view/header/header.js.php
index dece15cd..07e021db 100644
--- a/core/module/theme/view/header/header.js.php
+++ b/core/module/theme/view/header/header.js.php
@@ -47,9 +47,9 @@ $("input, select").on("change", function() {
 		var tmpImg = new Image();
 		tmpImg.onload = function() {
 			// Informations affichées
-			$("#themeHeaderImageHeight").html(tmpImg.height + "px");
-			$("#themeHeaderImageWidth").html(tmpImg.width + "px");
-			$("#themeHeaderImageRatio").html(tmpImg.width / tmpImg.height);
+			$("#themeHeaderImageHeight").val(tmpImg.height + " px");
+			$("#themeHeaderImageWidth").val(tmpImg.width + " px");
+			$("#themeHeaderImageRatio").val(tmpImg.width / tmpImg.height);
 
 			// Limiter la hauteur à 600 px
 			if (tmpImg.height > 600) {
diff --git a/core/module/theme/view/header/header.php b/core/module/theme/view/header/header.php
index 60020003..25cf67a4 100644
--- a/core/module/theme/view/header/header.php
+++ b/core/module/theme/view/header/header.php
@@ -163,6 +163,32 @@
                     ]); ?>
                 </div>
             </div>
+            <div class="row">
+                <div class="col3 textAlignRight">
+                    Informations sur l'image : 
+                </div>
+                <div class="col2">                    
+                    <?php echo template::text('themeHeaderImageWidth', [
+                            'label' => 'Largeur',
+                            'class' => 'textAlignCenter',
+                            'disable' => true
+                    ]); ?>
+                </div>
+                <div class="col2">                    
+                    <?php echo template::text('themeHeaderImageHeight', [
+                            'label' => 'Hauteur',
+                            'class' => 'textAlignCenter',
+                            'disable' => true
+                    ]); ?>
+                </div>
+                <div class="col2">                    
+                    <?php echo template::text('themeHeaderImageRatio', [
+                            'label' => 'Ratio (L/H)',
+                            'class' => 'textAlignCenter',
+                            'disable' => true
+                    ]); ?>
+                </div>
+            </div>
             <div id="themeHeaderImageOptions" class="displayNone">
                 <div class="row">
                     <div class="col3">
@@ -192,13 +218,6 @@
                             ]); ?>
                     </div>
                 </div>
-                <div class="row">
-                    <div class="col12 textAlignCenter">
-                        <span id="themeHeaderImage">
-                            Largeur : <span id="themeHeaderImageWidth"></span> | Hauteur : <span id="themeHeaderImageHeight"></span> | ratio : <span id="themeHeaderImageRatio"></span>
-                        </span>
-                    </div>
-                </div>
             </div>
         </div>
     </div>