SimpleChatTCRV:MultipleImages:UI: Load track multiple images

This commit is contained in:
hanishkvc 2025-11-20 18:45:48 +05:30
parent ae68ee1850
commit 1b9190d722
3 changed files with 17 additions and 11 deletions

View File

@ -61,9 +61,12 @@
</div> </div>
<hr> <hr>
<div id="user-in-div" class="sameline role-user"> <div id="user-in-div" class="role-user">
<div id="user-in-imgs"></div>
<div class="sameline">
<textarea id="user-in" class="flex-grow" rows="2" placeholder="enter your query to the ai model here" ></textarea> <textarea id="user-in" class="flex-grow" rows="2" placeholder="enter your query to the ai model here" ></textarea>
<button id="user-btn">submit</button> <button id="user-btn">submit</button>
</div>
</div> </div>
</div> </div>

View File

@ -122,9 +122,9 @@ body {
max-width: fit-content; max-width: fit-content;
max-height: 20vh; max-height: 20vh;
} }
.user-in-img { #user-in-imgs img {
max-width: 20vmin; max-width: 12vmin;
max-height: 20vmin; max-height: 12vmin;
} }
#popover-chatmsg { #popover-chatmsg {
position:fixed; position:fixed;

View File

@ -1064,6 +1064,7 @@ class MultiChatUI {
this.elDivChat = /** @type{HTMLDivElement} */(document.getElementById("chat-div")); this.elDivChat = /** @type{HTMLDivElement} */(document.getElementById("chat-div"));
this.elBtnUser = /** @type{HTMLButtonElement} */(document.getElementById("user-btn")); this.elBtnUser = /** @type{HTMLButtonElement} */(document.getElementById("user-btn"));
this.elInUser = /** @type{HTMLInputElement} */(document.getElementById("user-in")); this.elInUser = /** @type{HTMLInputElement} */(document.getElementById("user-in"));
this.elDivUserInImgs = /** @type{HTMLSelectElement} */(document.getElementById("user-in-imgs"));
this.elDivHeading = /** @type{HTMLSelectElement} */(document.getElementById("heading")); this.elDivHeading = /** @type{HTMLSelectElement} */(document.getElementById("heading"));
this.elDivSessions = /** @type{HTMLDivElement} */(document.getElementById("sessions-div")); this.elDivSessions = /** @type{HTMLDivElement} */(document.getElementById("sessions-div"));
this.elBtnSettings = /** @type{HTMLButtonElement} */(document.getElementById("settings")); this.elBtnSettings = /** @type{HTMLButtonElement} */(document.getElementById("settings"));
@ -1172,26 +1173,28 @@ class MultiChatUI {
*/ */
dataurl_plus_add(dataUrl) { dataurl_plus_add(dataUrl) {
if (typeof(dataUrl) == 'string') { if (typeof(dataUrl) == 'string') {
//this.me.dataURLs.push(dataUrl) this.me.dataURLs.push(dataUrl)
this.me.dataURLs[0] = dataUrl this.me.dataURLs[0] = dataUrl
this.elInFileX.elImg.src = dataUrl let elImg = document.createElement('img')
elImg.src = dataUrl
this.elDivUserInImgs.appendChild(elImg)
} }
} }
/** /**
* Get the stored dataUrl * Get the stored dataUrl
* @param {number} index
*/ */
dataurl_get() { dataurl_get(index) {
//this.me.dataURLs.pop() return /** @type{string} */(this.me.dataURLs[index])
return /** @type{string} */(this.me.dataURLs[0])
} }
/** /**
* Clear dataUrls, as well as clear Image. * Clear dataUrls, as well as clear Image.
*/ */
dataurl_plus_clear() { dataurl_plus_clear() {
this.elInFileX.elImg.src = "";
this.me.dataURLs.length = 0; this.me.dataURLs.length = 0;
this.elDivUserInImgs.replaceChildren()
} }
/** /**
@ -1669,7 +1672,7 @@ class MultiChatUI {
try { try {
let image = undefined let image = undefined
if (this.me.dataURLs.length > 0) { if (this.me.dataURLs.length > 0) {
image = this.dataurl_get() image = this.dataurl_get(0)
} }
this.chatmsg_addsmart_uishow(chat.chatId, new ChatMessageEx(new NSChatMessage(Roles.User, content, undefined, undefined, undefined, undefined, image))) this.chatmsg_addsmart_uishow(chat.chatId, new ChatMessageEx(new NSChatMessage(Roles.User, content, undefined, undefined, undefined, undefined, image)))
} catch (err) { } catch (err) {