Merge lavoro/daitarn-trafilo-ritaglio

src/frontend/flask_app/templates/maker/recipe_editor.html

@@ -503,6 +503,32 @@
 {% endblock %}
 
 {% block extra_js %}
+<script src="{{ url_for('static', filename='js/image-crop.js') }}"></script>
+<script>
+// #56: stringhe e percorsi per il ritaglio prima dell'upload
+ImageCrop.configure({
+  pdfSrc: '{{ url_for('static', filename='vendor/pdf-3.11.174.min.js') }}',
+  workerSrc: '{{ url_for('static', filename='vendor/pdf.worker-3.11.174.min.js') }}',
+  labels: {
+    title: {{ _('Ritaglia immagine')|tojson }},
+    page: {{ _('Pagina')|tojson }},
+    hint: {{ _('Trascina il rettangolo o i suoi bordi per scegliere la zona da tenere.')|tojson }},
+    pdfNote: {{ _('Un PDF ritagliato viene salvato come immagine PNG.')|tojson }},
+    confirm: {{ _('Conferma ritaglio')|tojson }},
+    original: {{ _('Usa originale')|tojson }},
+    cancel: {{ _('Annulla')|tojson }},
+    loading: {{ _('Caricamento...')|tojson }},
+    error: {{ _('Impossibile aprire il file per il ritaglio.')|tojson }}
+  }
+});
+// #56: apre la modale di ritaglio; null = annullato, altrimenti il file da caricare
+async function tmfCropBeforeUpload(file) {
+  const res = await ImageCrop.open(file);
+  if (res === null || res === file) return res;
+  const base = (file.name || 'file').replace(/\.[^.]+$/, '');
+  return new File([res], base + '-ritaglio.png', { type: 'image/png' });
+}
+</script>
 <script>
 function recipeEditor() {
   return {
@@ -673,6 +699,10 @@ function recipeEditor() {
         return;
       }
 
+      // #56: scelta di ritaglio (immagine/PDF) prima dell'upload; senza ritaglio il file resta invariato
+      file = await tmfCropBeforeUpload(file);
+      if (!file) return;
+
       this.uploadingFile = true;
       this.errorMessage = '';