Spaces:
Running
Running
File size: 2,907 Bytes
7b16419 6c3c19b 7b16419 6c3c19b 7b16419 6c3c19b 7b16419 6c3c19b 7b16419 3358461 7b16419 |
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 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 |
const fileContainer = document.querySelector(".file-container");
const label = document.querySelector("#label-input");
const inputFile = document.querySelector("#document-input");
const form = document.querySelector("form");
const prompt_txt = document.querySelector("#text-prompt");
const result_section = document.querySelector(".result");
const chart_wrapper = result_section.querySelector(".chart-wrapper");
let file = null;
const notifications = document.querySelector(".notifications");
const toast = (message, type) => {
const notification = document.createElement("div");
notification.innerHTML = `
<i class="fa fa-xmark close" onclick="this.parentNode.remove()"></i>
<i class="fa-solid ${
type === "error" ? "fa-circle-xmark" : "fa-triangle-exclamation"
} icon"></i>
<div class="notification-content">
<h3>${type}</h3>
<p>${message}</p>
</div>
`;
notification.classList.add(...["notification", type]);
notifications.appendChild(notification);
setTimeout(() => {
notification.remove();
}, 10000);
};
function clear() {
file = null;
label.style.display = "flex";
fileContainer.innerHTML = "";
}
const upload = (fileData) => {
file = fileData;
const ext = file.name.split(".").pop();
if (ext === "pdf") {
label.style.display = "none";
fileContainer.innerHTML = `
<div class="file-wrapper">
<i class="fa fa-file-excel"></i>
<p>
${file.name}
</p>
<button id='btn-clear' type="button" ><i class="fa fa-close" ></i></button>
</div>
`;
document
.querySelector("#btn-clear")
.addEventListener("click", (e) => clear(e));
} else {
console.error("file is not supported");
toast("file is not supported", "error");
}
};
inputFile.addEventListener("change", (e) => {
e.preventDefault();
if (inputFile.files[0]) upload(inputFile.files[0]);
});
label.addEventListener("dragover", (e) => {
e.preventDefault();
});
label.addEventListener("drop", (e) => {
e.preventDefault();
if (e.dataTransfer.files[0]) upload(e.dataTransfer.files[0]);
});
form.addEventListener("submit", (e) => {
e.preventDefault();
const prompt = prompt_txt.value.trim();
if (prompt && file) {
showchart("");
} else {
console.log("no file selected or no prompted");
}
});
const showchart = (url) => {
chart_wrapper.innerHTML = `
<i class="fas fa-download" id="btn-download" onclick='download()'></i>
<img src=${url} id="chart">
`;
result_section.style.display = "block";
result_section.scrollIntoView({ behavior: "smooth" });
};
const download = () => {
const imageurl = document.querySelector("#chart").src;
const a = document.createElement("a");
a.href = imageurl;
a.download = "SmartDoc-chart.jpg";
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
};
|