diff --git a/tools/server/public_simplechat/index.html b/tools/server/public_simplechat/index.html
index c188cb4ab2..dd9b12af7c 100644
--- a/tools/server/public_simplechat/index.html
+++ b/tools/server/public_simplechat/index.html
@@ -60,7 +60,7 @@
- file
+
diff --git a/tools/server/public_simplechat/simplechat.js b/tools/server/public_simplechat/simplechat.js
index 3d75ded4cc..dbd283ab5d 100644
--- a/tools/server/public_simplechat/simplechat.js
+++ b/tools/server/public_simplechat/simplechat.js
@@ -954,7 +954,22 @@ class MultiChatUI {
this.elInToolName = /** @type{HTMLInputElement} */(document.getElementById("toolname-in"));
this.elInToolArgs = /** @type{HTMLInputElement} */(document.getElementById("toolargs-in"));
+ // Save any placeholder set by default like through html, to restore where needed
this.elInUser.dataset.placeholder = this.elInUser.placeholder
+ this.elInFileX = ui.el_creatediv_inputfile('file', 'file', '', ()=>{
+ let f0 = this.elInFileX.el.files?.item(0);
+ if (!f0) {
+ return
+ }
+ console.log(`DBUG:InFileX:${f0?.name}`)
+ let fR = new FileReader()
+ fR.onload = () => {
+ this.me.dataURLs.push(fR.result)
+ console.log(`INFO:InFileX:Loaded file ${f0.name}`)
+ }
+ fR.readAsDataURL(f0)
+ }, "")
+ this.elBtnUser.parentElement?.appendChild(this.elInFileX.elB)
this.validate_element(this.elInSystem, "system-in");
this.validate_element(this.elDivChat, "chat-div");
@@ -1552,6 +1567,10 @@ export class Me {
//"presence_penalty": 1.2,
};
this.toolsMgr = new mTools.ToolsManager()
+ /**
+ * @type {(string | ArrayBuffer | null)[]}
+ */
+ this.dataURLs = []
}
/**
diff --git a/tools/server/public_simplechat/ui.mjs b/tools/server/public_simplechat/ui.mjs
index fb447d3e6e..cbd8c578e6 100644
--- a/tools/server/public_simplechat/ui.mjs
+++ b/tools/server/public_simplechat/ui.mjs
@@ -232,6 +232,26 @@ export function el_creatediv_input(id, label, type, defaultValue, cb, className=
}
+/**
+ * Create a div wrapped input of type file,
+ * which hides input and shows a button which chains to underlying file type input.
+ * @param {string} id
+ * @param {string} label
+ * @param {any} defaultValue
+ * @param {(arg0: any) => void} cb
+ * @param {string} className
+ */
+export function el_creatediv_inputfile(id, label, defaultValue, cb, className) {
+ let elX = el_creatediv_input(id, label, "file", defaultValue, cb, className)
+ elX.el.hidden = true
+ let idB = `${id}-button`
+ let elB = el_create_button(idB, (mev) => {
+ elX.el.click()
+ }, idB, label)
+ return { div: elX.div, el: elX.el, elB: elB };
+}
+
+
/**
* Auto create ui input elements for specified fields/properties in given object
* Currently supports text, number, boolean field types.