const inputFields = document.querySelectorAll(".input-data input, .input-data textarea");

inputFields.forEach((field) => {
    field.addEventListener("input", onChange);
    if(field.value.length > 0) field.classList.add("filled");
})

function onChange(e){
    if(e.target.value.length > 0) e.target.classList.add("filled");
    else e.target.classList.remove("filled");
}

const imageInput = document.querySelectorAll('input[type=file]');

function preview(input){
    const imagePreview = input.parentElement.querySelector('.image-preview');

    input.addEventListener('change', function () {
    imagePreview.innerHTML = '';

    for (let i = 0; i < input.files.length; i++) {
        const file = input.files[i];
        if (file.type.match('image.*')) {
            const reader = new FileReader();
            reader.onload = function (e) {
                const imageItem = document.createElement('li');
                imageItem.className = 'image-item';
                const image = document.createElement('img');
                image.src = e.target.result;
                // remove img
                // virker ikke pga. sikkerheds forhold :-)))))))))
                // imageItem.addEventListener('click', function () {
                //     const newFiles = [];
                //     for (let j = 0; j < input.files.length; j++) {
                //         if(j !== i) newFiles.push(input.files[j]);
                //     }
                //     console.log(e.target.result);
                //     console.log(newFiles);
                //     console.log(input.files);
                //     input.files = newFiles;
                //     // imageItem.remove();
                // });
                imageItem.appendChild(image);
                imagePreview.appendChild(imageItem);
            };
            reader.readAsDataURL(file);
        }
    }
    });
}

imageInput.forEach(preview);