diff --git a/web/packages/demo/www/index.css b/web/packages/demo/www/index.css
index c74162a3d..c838b9f47 100644
--- a/web/packages/demo/www/index.css
+++ b/web/packages/demo/www/index.css
@@ -115,6 +115,12 @@ body {
background-color: white;
}
+#local-file-name {
+ min-width: 150px;
+ display: inline-block;
+ font-size: smaller;
+}
+
#sample-swfs {
background-color: white;
color: var(--ruffle-blue);
diff --git a/web/packages/demo/www/index.html b/web/packages/demo/www/index.html
index 70892378b..a340310fc 100644
--- a/web/packages/demo/www/index.html
+++ b/web/packages/demo/www/index.html
@@ -25,6 +25,7 @@
Local SWF:
+ No file selected.
Sample SWF:
diff --git a/web/packages/demo/www/index.js b/web/packages/demo/www/index.js
index b3696d882..00969b129 100644
--- a/web/packages/demo/www/index.js
+++ b/web/packages/demo/www/index.js
@@ -21,6 +21,7 @@ const sampleFileInputContainer = document.getElementById(
);
const localFileInput = document.getElementById("local-file");
const sampleFileInput = document.getElementById("sample-swfs");
+const localFileName = document.getElementById("local-file-name");
// prettier-ignore
const optionGroups = {
"Animation": document.getElementById("anim-optgroup"),
@@ -68,6 +69,9 @@ async function loadFile(file) {
if (!file) {
return;
}
+ if (file.name) {
+ localFileName.textContent = file.name;
+ }
hideSample();
const data = await new Response(file).arrayBuffer();
load({ data, ...config });
@@ -75,6 +79,7 @@ async function loadFile(file) {
function loadSample() {
const swfData = sampleFileInput[sampleFileInput.selectedIndex].swfData;
+ localFileName.textContent = "No file selected.";
if (swfData) {
showSample(swfData);
load({ url: swfData.location, ...config });