{% extends "base.html.twig" %}


{% block h4 %}Modification
	{{ oeuvre.name|capitalize }}
{% endblock %}

{% block body %}

<div class="container-fluid">


	<a class="btn btn-dark my-3" href="{{ path('app_admin_oeuvres') }}">Retour</a>


	{# {% include "_flashes.html.twig" %} #}
	<div class="Edit">
		<div class="col-md-6 mx-auto" id="edit2">
			{{ form_start(formEdit) }}
<div class="row col-12 ">
<div class="col-6 d-flex justify-content-center align-items-center">

<div class="col-12">




				<div class="col-md-6">
					{{ form_row(formEdit.name) }}
				</div>
				<div class="col-md-6">
					{# {{ form_row(formEdit.themes) }} #}
				

				{# 

				<div class="col-md-6">
					{{ form_row(formEdit.prix) }}
				</div> #}


			</div>
				<div class="col-md-6">
					{{ form_row(formEdit.categorie) }}
				</div>
				<div class="col-md-6">
					{{ form_row(formEdit.theme) }}
				</div>
				{# <div class="col-md-6">
					{{ form_row(formEdit.size) }}
				</div> #}
				<div class="col-md-6">
					{{ form_row(formEdit.description) }}
				</div>
				<div class="  ">
		<input type="submit" value="Modifier" class="btn btn-info col-3 mt-3">
	</div>


</div>

	


</div>
<div class="col-6">



		<div class="imageEdit">
			{{ form_row(formEdit.imageUpdate) }}
			<div id="zone" class="text-center" style="display:flex; flex-direction:column ;">

				{% if oeuvre.image %}
					<img src="{{ asset('images/oeuvre/' ~ oeuvre.image) }}" alt="imageId"class="rounded mx-auto img-fluid img-thumbnail d-block"/>
				
				
					</a>

					        <a href="#" id="deleteImageLink" class="btn" onclick="deleteImage(); return false;"><i class="fa fa-trash" ></i></a>


				{% endif %}
			</div>
		</div>


</div>




</div>

	

				</div>


			</div>

		</div>


	</div>
	{# <div class="col-md-6 col-3 mx-auto hh">
		<input type="submit" value="Modifier" class="btn btn-info col-3 mt-3">
	</div> #}
	{{ form_end(formEdit) }}
</div>

{% endblock %}


{% block javascripts %}


	<script>

	  function deleteImage() {
        if (confirm("Êtes-vous sûr de vouloir supprimer cette image ?")) {
            // Supprimez l'image actuelle de l'affichage
            $("#currentImage").remove();

            // Réinitialisez le champ de téléchargement de fichier pour supprimer l'image lors de la soumission
            $("input[name='{{ formEdit.imageUpdate.vars.full_name }}']").val(null);
        }
    }

	 

		function loadFile(event) {
let zone = document.getElementById('zone');

console.log("test");

$("#zone").html("");
let image = document.createElement("img");
image.setAttribute("src", URL.createObjectURL(event.target.files[0]));
image.setAttribute("class", "img300");

zone.innerHTML = "";

zone.appendChild(image); 

}
	</script>
{% endblock %}