var racine = '/~lebeaulato/WF-Website'; //Mettre votre chemin à vous

//=============================== USERNAME ===============================

function editFieldUsername(id) {
    var pElement = document.getElementById(id); // Récupérer l'élément <p> via son identifiant
    var currentValue = pElement.textContent.trim(); // Obtenir le texte actuel du <p>

    // Créer un champ de saisie <input> avec la valeur actuelle
    var input = document.createElement('input');
    input.type = 'text';
    input.value = currentValue;
    input.class ='changeValue';
    input.name='pseudo';

    
    // Créer un bouton de validation
    var button = document.createElement('button');
    button.textContent = 'Valider';
    button.classList.add('saveButtonPasswd');
    button.type ="submit";

    // Remplacer le contenu du <p> par le champ <input> et le bouton
    pElement.innerHTML = '';
    pElement.appendChild(input);
    pElement.appendChild(button);

    input.focus(); // Mettre le focus sur le champ de saisie
}



//=============================== EMAIL ===============================

function editFieldEmail(id) {
    var pElement = document.getElementById(id); // Récupérer l'élément <p> via son identifiant
    var currentValue = pElement.textContent.trim(); // Obtenir le texte actuel du <p>

    // Créer un champ de saisie <input> avec la valeur actuelle
    var input = document.createElement('input');
    input.type = 'email';
    input.value = currentValue;
    input.class= 'changeValue'; // Correction de l'attribut 'class'
    input.name='email';


   // Créer un bouton de validation
   var button = document.createElement('button');
   button.textContent = 'Valider';
   button.classList.add('saveButtonPasswd');
   button.type ="submit";


    // Remplacer le contenu du <p> par le champ <input> et le bouton
    pElement.innerHTML = '';
    pElement.appendChild(input);
    pElement.appendChild(button);

    input.focus(); // Mettre le focus sur le champ de saisie
}


//=============================== PASSWORD ===============================


function editFieldPassWd(id) {
    var pElement = document.getElementById(id);// Récupérer l'élément <p> via son identifiant
    pElement.innerHTML = '';// Effacer le contenu actuel de <p> pour insérer les inputs

    // Créer le champ de saisie pour le nouveau mot de passe
    var inputNewPass = document.createElement('input');
    inputNewPass.type = 'password';
    inputNewPass.placeholder = 'Nouveau mot de passe'; // Un placeholder pour indiquer la fonction du champ
    inputNewPass.classList.add('changeValue'); // Ajouter une classe CSS pour styliser l'input
    inputNewPass.setAttribute('id', 'newPassword'); // Ajouter un ID pour la gestion
    inputNewPass.classList.add('inputPasswd'); // Ajouter une classe au input
    inputNewPass.name='passwdFirst';
    

    // Créer le champ de saisie pour la confirmation du mot de passe
    var inputConfirmPass = document.createElement('input');
    inputConfirmPass.type = 'password';
    inputConfirmPass.placeholder = 'Confirmer le mot de passe'; // Un placeholder pour indiquer la fonction du champ
    inputConfirmPass.classList.add('changeValue'); // Ajouter une classe CSS pour styliser l'input
    inputConfirmPass.setAttribute('id', 'confirmPassword'); // Ajouter un ID pour la gestion
    inputConfirmPass.classList.add('inputPasswd'); // Ajouter une classe au input
    inputConfirmPass.name='passwdSecond';
    
    // Ajouter un bouton de sauvegarde
    var saveButton = document.createElement('button');
    saveButton.textContent = 'Sauvegarder le mot de passe';
    saveButton.classList.add('saveButtonPasswd'); // Ajouter une classe au bouton
    saveButton.type="submit";

    // Ajouter les deux champs de saisie et le bouton dans l'élément <p>
    pElement.appendChild(inputNewPass);
    pElement.appendChild(document.createElement('br')); // Saut de ligne pour espacer les champs
    pElement.appendChild(inputConfirmPass);
    pElement.appendChild(document.createElement('br')); // Saut de ligne pour espacer
    pElement.appendChild(saveButton);

    inputNewPass.focus();// Mettre le focus sur le premier champ de saisie
}