optimized a interface

sentence_api/static/admin.js

@@ -11,6 +11,8 @@ const elements = {
   uploadForm: document.querySelector("#upload-form"),
   uploadState: document.querySelector("#upload-state"),
   uploadProgress: document.querySelector("#upload-progress"),
+  videoFile: document.querySelector("#video-file"),
+  videoTitle: document.querySelector("#video-title"),
   videoRows: document.querySelector("#video-rows"),
   videoCount: document.querySelector("#video-count"),
   emptyState: document.querySelector("#empty-state"),
@@ -30,6 +32,10 @@ elements.saveKey.addEventListener("click", () => {
 elements.refresh.addEventListener("click", loadVideos);
 elements.closeDialog.addEventListener("click", () => elements.dialog.close());
 elements.uploadForm.addEventListener("submit", uploadVideo);
+elements.videoFile.addEventListener("change", () => {
+  if (!elements.videoFile.files[0]) return;
+  elements.videoTitle.value = titleFromFilename(elements.videoFile.files[0].name);
+});
 
 async function api(path, options = {}) {
   const headers = new Headers(options.headers || {});
@@ -173,6 +179,13 @@ function uploadVideo(event) {
   request.send(file);
 }
 
+function titleFromFilename(filename) {
+  const name = filename.replace(/\\/g, "/").split("/").pop() || "";
+  const dotIndex = name.lastIndexOf(".");
+  const stem = dotIndex > 0 ? name.slice(0, dotIndex) : name;
+  return stem.slice(0, 200);
+}
+
 function readXhrError(request) {
   try { return JSON.parse(request.responseText).detail || `HTTP ${request.status}`; }
   catch (_) { return `HTTP ${request.status}`; }