Spaces:
Sleeping
Sleeping
Update proxy/templates/index.html
Browse files- proxy/templates/index.html +73 -20
proxy/templates/index.html
CHANGED
|
@@ -33,13 +33,15 @@
|
|
| 33 |
</head>
|
| 34 |
<body>
|
| 35 |
<h1>ConlluEditor Online</h1>
|
| 36 |
-
|
| 37 |
-
<!-- Drag-and-drop upload panel -->
|
| 38 |
<div id="dropzone">
|
| 39 |
-
|
| 40 |
-
<input id="fileInput" type="file" accept=".conllu" style="display:none;">
|
| 41 |
</div>
|
| 42 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 43 |
<!-- File list + download -->
|
| 44 |
<div id="fileList">
|
| 45 |
<label for="fileSelect"><strong>Available files:</strong></label>
|
|
@@ -83,24 +85,70 @@
|
|
| 83 |
if (fileInput.files.length > 0) uploadFile(fileInput.files[0]);
|
| 84 |
});
|
| 85 |
|
| 86 |
-
function uploadFile(file) {
|
| 87 |
-
|
| 88 |
-
|
| 89 |
-
|
| 90 |
-
|
| 91 |
-
|
| 92 |
-
|
| 93 |
-
|
| 94 |
-
|
| 95 |
-
|
| 96 |
-
|
| 97 |
-
|
| 98 |
-
|
| 99 |
-
|
| 100 |
-
|
| 101 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 102 |
}
|
| 103 |
|
|
|
|
| 104 |
function loadFiles() {
|
| 105 |
fetch("/api/files")
|
| 106 |
.then(r => r.json())
|
|
@@ -115,6 +163,11 @@
|
|
| 115 |
});
|
| 116 |
}
|
| 117 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 118 |
openBtn.addEventListener("click", () => {
|
| 119 |
const f = fileSelect.value;
|
| 120 |
if (!f) return;
|
|
|
|
| 33 |
</head>
|
| 34 |
<body>
|
| 35 |
<h1>ConlluEditor Online</h1>
|
|
|
|
|
|
|
| 36 |
<div id="dropzone">
|
| 37 |
+
Drag & drop a .conllu file here, or click to select.
|
|
|
|
| 38 |
</div>
|
| 39 |
|
| 40 |
+
|
| 41 |
+
<!-- Drag-and-drop upload panel -->
|
| 42 |
+
<input type="file" id="fileInput" accept=".conllu">
|
| 43 |
+
<button onclick="uploadFile()">Upload</button>
|
| 44 |
+
|
| 45 |
<!-- File list + download -->
|
| 46 |
<div id="fileList">
|
| 47 |
<label for="fileSelect"><strong>Available files:</strong></label>
|
|
|
|
| 85 |
if (fileInput.files.length > 0) uploadFile(fileInput.files[0]);
|
| 86 |
});
|
| 87 |
|
| 88 |
+
// function uploadFile(file) {
|
| 89 |
+
// if (!file.name.toLowerCase().endsWith(".conllu")) {
|
| 90 |
+
// alert("Please upload a .conllu file");
|
| 91 |
+
// return;
|
| 92 |
+
// }
|
| 93 |
+
// const formData = new FormData();
|
| 94 |
+
// formData.append("file", file);
|
| 95 |
+
// fetch("/api/upload", {
|
| 96 |
+
// method: "POST",
|
| 97 |
+
// body: formData
|
| 98 |
+
// }).then(r => {
|
| 99 |
+
// if (!r.ok) throw new Error("Upload failed");
|
| 100 |
+
// return r.text();
|
| 101 |
+
// }).then(() => {
|
| 102 |
+
// loadFiles();
|
| 103 |
+
// }).catch(err => alert(err));
|
| 104 |
+
// }
|
| 105 |
+
async function uploadFile(file) {
|
| 106 |
+
if (!file) {
|
| 107 |
+
const input = document.getElementById("fileInput");
|
| 108 |
+
if (!input.files.length) {
|
| 109 |
+
alert("Please select a file first");
|
| 110 |
+
return;
|
| 111 |
+
}
|
| 112 |
+
file = input.files[0];
|
| 113 |
+
}
|
| 114 |
+
|
| 115 |
+
if (!file.name.toLowerCase().endsWith(".conllu")) {
|
| 116 |
+
alert("Please upload a .conllu file");
|
| 117 |
+
return;
|
| 118 |
+
}
|
| 119 |
+
|
| 120 |
+
const form = new FormData();
|
| 121 |
+
form.append("file", file);
|
| 122 |
+
|
| 123 |
+
const res = await fetch("/api/upload", {
|
| 124 |
+
method: "POST",
|
| 125 |
+
body: form
|
| 126 |
+
});
|
| 127 |
+
|
| 128 |
+
if (res.ok) {
|
| 129 |
+
refreshFileList();
|
| 130 |
+
} else {
|
| 131 |
+
alert("Upload failed");
|
| 132 |
+
}
|
| 133 |
+
}
|
| 134 |
+
|
| 135 |
+
|
| 136 |
+
async function refreshFileList() {
|
| 137 |
+
const res = await fetch("/api/files");
|
| 138 |
+
const files = await res.json();
|
| 139 |
+
|
| 140 |
+
const select = document.getElementById("fileSelect");
|
| 141 |
+
select.innerHTML = "";
|
| 142 |
+
|
| 143 |
+
files.forEach(f => {
|
| 144 |
+
const opt = document.createElement("option");
|
| 145 |
+
opt.value = f;
|
| 146 |
+
opt.textContent = f;
|
| 147 |
+
select.appendChild(opt);
|
| 148 |
+
});
|
| 149 |
}
|
| 150 |
|
| 151 |
+
|
| 152 |
function loadFiles() {
|
| 153 |
fetch("/api/files")
|
| 154 |
.then(r => r.json())
|
|
|
|
| 163 |
});
|
| 164 |
}
|
| 165 |
|
| 166 |
+
function openInEditor(filename) {
|
| 167 |
+
const iframe = document.getElementById("editorFrame");
|
| 168 |
+
iframe.src = "/editor/?file=" + encodeURIComponent(filename);
|
| 169 |
+
}
|
| 170 |
+
|
| 171 |
openBtn.addEventListener("click", () => {
|
| 172 |
const f = fileSelect.value;
|
| 173 |
if (!f) return;
|