static/save_artwork.js

async () => {
        // Get the username from the URL itself
        const gradioEl = document.querySelector('gradio-app');
        const imgEls = gradioEl.querySelectorAll('#gallery img');

        // Get the necessary fields 
        const promptTxt = gradioEl.querySelector('#prompt-text-input textarea').value;
        const negativePromptTxt = gradioEl.querySelector('#negative-prompt-text-input textarea').value;
       
        // Get values from the sliders
        const modelGuidanceScale = parseFloat(gradioEl.querySelector('#guidance-scale-slider input').value);

        const numSteps = parseInt(gradioEl.querySelector('#num-inference-step-slider input').value);
        const imageSize = parseInt(gradioEl.querySelector('#image-size-slider input').value);
        const seed = parseInt(gradioEl.querySelector('#seed-slider input').value);

        // Get the values from dropdowns
        const modelName = gradioEl.querySelector('#model-dropdown input').value;
        const schedulerName = gradioEl.querySelector('#scheduler-dropdown input').value;

        const shareBtnEl = gradioEl.querySelector('#share-btn');
        const shareIconEl = gradioEl.querySelector('#share-btn-share-icon');
        const loadingIconEl = gradioEl.querySelector('#share-btn-loading-icon');

        if(!imgEls.length){
            return;
        };

        shareBtnEl.style.pointerEvents = 'none';
        shareIconEl.style.display = 'none';
        loadingIconEl.style.removeProperty('display');
        const files = await Promise.all(
            [...imgEls].map(async (imgEl) => {
                const res = await fetch(imgEl.src);
                const blob = await res.blob();
                const fileSrc = imgEl.src.split('/').pop(); // Get the file name from the img src path
                const imgId = Date.now();
                const fileName = `${fileSrc}-${imgId}.jpg`; // Fixed fileName construction
                return new File([blob], fileName, { type: 'image/jpeg' });
            })
        );

        // Ensure that only one image is uploaded by taking the first element if there are multiple
        if (files.length > 1) {
            files.splice(1, files.length - 1);
        }

        const urls = await Promise.all(files.map((f) => uploadFile(
            f,
            promptTxt,
            negativePromptTxt,
            modelName,
            schedulerName,
            modelGuidanceScale,
            numSteps,
            imageSize,
            seed,
            )));

        shareBtnEl.style.removeProperty('pointer-events');
        shareIconEl.style.removeProperty('display');
        loadingIconEl.style.display = 'none';
    }