From 123f6b45107db13a22b74a7a029a09846f626597 Mon Sep 17 00:00:00 2001
From: Vincent LAURENT <vince.laurent@gmail.com>
Date: Tue, 28 Sep 2021 21:32:35 +0200
Subject: [PATCH] =?UTF-8?q?Possibilit=C3=A9=20d'ajout=C3=A9=20une=20zone?=
 =?UTF-8?q?=20de=20texte=20dans=20le=20pdf?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/js/app.js       | 44 +++++++++++++++++++++++++++---------------
 templates/pdf.html.php |  6 +++++-
 2 files changed, 33 insertions(+), 17 deletions(-)

diff --git a/public/js/app.js b/public/js/app.js
index 56ae56c..14668a8 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -250,24 +250,36 @@ loadingTask.promise.then(function(pdf) {
           });
 
           canvasEdition.on('mouse:dblclick', function(event) {
-              x = event.pointer.x
-              y = event.pointer.y
-              if(document.querySelector('input[name="svg_2_add"]:checked')) {
-                  fabric.loadSVGFromURL(document.querySelector('input[name="svg_2_add"]:checked').value, function(objects, options) {
-                      var svg = fabric.util.groupSVGElements(objects, options);
-                      svg.scaleToHeight(100);
-                      svg.top = y - (svg.getScaledHeight() / 2);
-                      svg.left = x - (svg.getScaledWidth() / 2);
-                      canvasEdition.add(svg).renderAll();
-                  });
+              var input_selected = document.querySelector('input[name="svg_2_add"]:checked');
+
+              if(!input_selected) {
+                  return;
               }
               
-              /*if(document.getElementById('radio_signature_text_classic').checked) {
-                var textSignature = new fabric.Text(document.getElementById('input-signature-text-classic').value, { fontSize: 16 });
-                textSignature.top = y - (textSignature.getScaledHeight() / 2);    
-                textSignature.left = x - (textSignature.getScaledWidth() / 2);    
-                canvasEdition.add(textSignature).renderAll();
-            }*/
+              x = event.pointer.x
+              y = event.pointer.y
+
+              if(input_selected.value == 'text') {
+                  var textbox = new fabric.Textbox('Texte à modifier', {
+                  left: x - 10,
+                  top: y - 10,
+                  width: 300,
+                  fontSize: 20
+                });
+                canvasEdition.add(textbox).setActiveObject(textbox);
+                textbox.enterEditing();
+                textbox.selectAll();
+                
+                return;
+              }
+
+              fabric.loadSVGFromURL(input_selected.value, function(objects, options) {
+                  var svg = fabric.util.groupSVGElements(objects, options);
+                  svg.scaleToHeight(100);
+                  svg.top = y - (svg.getScaledHeight() / 2);
+                  svg.left = x - (svg.getScaledWidth() / 2);
+                  canvasEdition.add(svg).renderAll();
+              });
           });
           
           canvasEditions.push(canvasEdition);
diff --git a/templates/pdf.html.php b/templates/pdf.html.php
index ef9badd..fea6b77 100644
--- a/templates/pdf.html.php
+++ b/templates/pdf.html.php
@@ -23,8 +23,12 @@
             <div id="container-pages" class="col-lg-10 col-md-9 col-sm-8 col-xs-6 bg-light text-center"></div>
             <aside class="col-lg-2 col-md-3 col-sm-4 col-xs-6 mt-2 position-fixed end-0 bg-white">
                 <div id="svg_list" class="d-grid gap-2"></div>
+                <div class="d-grid gap-2 mt-2">
+                    <button type="button" class="btn btn-lg btn-light" data-bs-toggle="modal" data-bs-target="#modalAddSvg"><i class="bi bi-plus-circle"></i> Ajouter un élément</button>
+                </div>
                 <div class="d-grid gap-2 mt-3">
-                    <button type="button" class="btn btn-secondary" data-bs-toggle="modal" data-bs-target="#modalAddSvg"><i class="bi bi-plus-circle"></i> Ajouter un élément</button>
+                    <input type="radio" class="btn-check" id="radio_svg_text" name="svg_2_add" autocomplete="off" value="text">
+                    <label class="btn btn-lg btn-outline-secondary text-black text-start" for="radio_svg_text"><i class="bi bi-textarea-t"></i> Ajouter du texte</label>
                 </div>
                 <hr />
                 <p><small class="text-muted"><i class="bi bi-hand-index"></i><i class="bi bi-hand-index"></i> <i class="bi bi-plus-circle-fill"></i> Double-cliquez sur le PDF pour ajouter l'élément sélectionné</small></p>