yasder5/projet_php
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

jolie beau

Browse source
This commit is contained in:
Yasder5 2026-03-02 21:25:54 +01:00
parent 42ec68178a
commit 334dd55dee
9 changed files with 70 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

31
views/_partial/delphoto.tpl Normal file
View file

@ -0,0 +1,31 @@
<script>
const defaultAvatar = "{$smarty.env.IMG_USER_PATH}images.jpg";
// Suppression du listener précédent avant d'en ajouter un nouveau
const inputImage = document.getElementById('image');
const btnDelete = document.getElementById('btn-delete-image');
const previewAvatar = document.getElementById('preview-avatar');
const deleteInput = document.getElementById('delete_image');
inputImage?.addEventListener('change', function () {
const file = this.files[0];
if (!file) return;
const reader = new FileReader();
reader.onload = e => {
previewAvatar.src = e.target.result;
previewAvatar.style.opacity = '1';
};
reader.readAsDataURL(file);
deleteInput.value = '0';
if (btnDelete) {
btnDelete.disabled = false;
}
});
btnDelete?.addEventListener('click', function () {
deleteInput.value = '1';
previewAvatar.src = defaultAvatar;
previewAvatar.style.opacity = '0.5';
this.disabled = true;
});
</script>

51
views/useredit.tpl
View file

@ -72,23 +72,42 @@
</div>
</div>
<div class="col-12">
<label class="form-label" for="image">
Photo de profil
</label>
{if $objUser->getImage()}
<div class="mb-2">
<img src="{$smarty.env.IMG_USER_PATH}{$objUser->getImage()}" alt="image actuel" class="rounded-circle" width="80" height="80">
</div>
{/if}
<input
class="form-control"
type="file"
id="image"
name="image"
accept="image/jpeg, image/png, image/webp"
<label class="form-label" for="image">Photo de profil</label>
<div class="d-flex align-items-center gap-4 mb-3">
<!-- Avatar preview -->
<img
id="preview-avatar"
src="{if $objUser->getImage()}{$smarty.env.IMG_USER_PATH}{$objUser->getImage()}{else}assests/img/images.jpg{/if}"
alt="Photo de profil"
class="rounded-circle border"
style="width:80px; height:80px; object-fit:cover;"
>
<div class="form-text">Formats acceptés : JPG, PNG, WEBP. Laisser vide pour ne pas changer.</div>
<!-- Actions à droite de l'avatar -->
<div class="d-flex flex-column gap-2">
<label for="image" class="btn btn-outline-secondary btn-sm mb-0">
<i class="fa-solid fa-upload me-1"></i> Changer la photo
</label>
{if $objUser->getImage() != "images.jpg"}
<button type="button" class="btn btn-outline-danger btn-sm" id="btn-delete-image">
<i class="fa-solid fa-trash me-1"></i> Supprimer la photo
</button>
{/if}
</div>
</div>
<!-- Input file caché, déclenché par le label -->
<input
class="d-none"
type="file"
id="image"
name="image"
accept="image/jpeg, image/png, image/webp"
>
<input type="hidden" name="delete_image" id="delete_image" value="0">
<div class="form-text">Formats acceptés : JPG, PNG, WEBP. Laisser vide pour ne pas changer.</div>
</div>
<div class="col-12">
<label class="form-label" for="user_mail">
Adresse e-mail
@ -187,6 +206,6 @@
</div>
</div>
</main>
{include file="views/_partial/delphoto.tpl"}
{include file="views/_partial/apigeo.tpl"}
{/block}