File size: 2,646 Bytes
a3e9046
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
2819d19
a3e9046
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
2819d19
a3e9046
 
 
 
 
 
 
 
 
 
 
 
 
2819d19
a3e9046
 
 
 
 
 
 
 
 
 
 
 
 
 
a6a0e08
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
document.getElementById("uploadForm").addEventListener("submit", async (e) => {
    e.preventDefault();

    const fileInput = document.getElementById("excelFile");
    const promptInput = document.getElementById("prompt");
    const visualizationImage = document.getElementById("visualizationImage");
    const generatedCodeElement = document.getElementById("generatedCode");
    const loadingElement = document.getElementById("loading");
    const errorElement = document.getElementById("error");

    visualizationImage.src = "";
    visualizationImage.classList.remove("loaded");
    generatedCodeElement.textContent = "";
    errorElement.textContent = "";
    errorElement.classList.add("hidden");

    loadingElement.classList.remove("hidden");

    try {
        const uploadFormData = new FormData();
        uploadFormData.append("file", fileInput.files[0]);

        const uploadResponse = await fetch("/upload/", {
            method: "POST",
            body: uploadFormData,
        });

        if (!uploadResponse.ok) {
            const errorData = await uploadResponse.json();
            throw new Error(`File upload failed: ${errorData.detail || 'Unknown error'}`);
        }

        const uploadResult = await uploadResponse.json();
        console.log("โœ… File uploaded:", uploadResult);

        const visFormData = new FormData();
        visFormData.append("filename", uploadResult.filename);
        visFormData.append("prompt", promptInput.value);

        const visResponse = await fetch("/generate-visualization/", {
            method: "POST",
            body: visFormData,
        });

        if (!visResponse.ok) {
            const errorData = await visResponse.json();
            throw new Error(`Visualization generation failed: ${errorData.detail || 'Unknown error'}`);
        }

        const result = await visResponse.json();
        console.log("๐Ÿ”น Response from API:", result);

        if (result.plot_url) {
            visualizationImage.src = result.plot_url;  // Relative URL works in Spaces
            visualizationImage.onload = () => {
                visualizationImage.classList.add("loaded");
            };
            generatedCodeElement.textContent = result.generated_code;
        } else {
            throw new Error("No plot URL received.");
        }
    } catch (error) {
        console.error("Error:", error);
        errorElement.textContent = `An error occurred: ${error.message}`;
        errorElement.classList.remove("hidden");
    } finally {
        loadingElement.classList.add("hidden");
    }
});