diff --git a/tools/server/public_simplechat/index.html b/tools/server/public_simplechat/index.html index e27ac93e64..e403509150 100644 --- a/tools/server/public_simplechat/index.html +++ b/tools/server/public_simplechat/index.html @@ -26,12 +26,13 @@
SimpleChat
- +
-
+ +

diff --git a/tools/server/public_simplechat/readme.md b/tools/server/public_simplechat/readme.md index 10c20e6cc8..8edd9af385 100644 --- a/tools/server/public_simplechat/readme.md +++ b/tools/server/public_simplechat/readme.md @@ -810,10 +810,13 @@ Cleanup in general * make the scrollbars more subtle and in the background. * allow user input textarea to grow vertically to some extent. * make things rounded across board by default. add some padding to toolcall details block, ... - * Auto ObjPropsEdit UI - * allow it to be themed by assigning id to top level block. - * fix a oversight (forgotten $) with use of templated literals and having variables in them. - * ensure full props hierarchy is accounted for when setting the id of elements. + * use icons without text wrt chat sessions++, new chat, clear chat and settings top level buttons. + * use title property/attribute to give a hint to the user about the button functionality +* Auto ObjPropsEdit UI + * allow it to be themed by assigning id to top level block. + * fix a oversight (forgotten $) with use of templated literals and having variables in them. + * ensure full props hierarchy is accounted for when setting the id of elements. +* Chat button to toggle sessions buttons and system prompt #### ToDo diff --git a/tools/server/public_simplechat/simplechat.css b/tools/server/public_simplechat/simplechat.css index f75fb95e65..f34f896c30 100644 --- a/tools/server/public_simplechat/simplechat.css +++ b/tools/server/public_simplechat/simplechat.css @@ -212,6 +212,16 @@ button { } +.visibility-visible { + visibility: visible; + display: block; +} +.visibility-hidden { + visibility: hidden; + display: none; +} + + * { margin: 0.6vmin; scrollbar-color: var(--background-color-contrast-vlight) var(--background-color); diff --git a/tools/server/public_simplechat/simplechat.js b/tools/server/public_simplechat/simplechat.js index 905446019d..feb4153182 100644 --- a/tools/server/public_simplechat/simplechat.js +++ b/tools/server/public_simplechat/simplechat.js @@ -442,6 +442,7 @@ function usage_note(sRecentUserMsgCnt) {
Usage Note
    +
  • Clicking chat icon, toggles chat session buttons and system prompt block
  • System prompt above, helps control ai response characteristics.
    • Completion mode - no system prompt normally.
    • @@ -454,7 +455,6 @@ function usage_note(sRecentUserMsgCnt) {
    • submit tool response placed into user query/response text area
  • Use image button for vision models, submitting or switching session clears same
  • -
  • Clicking main title, toggles chat session buttons and system prompt
  • ContextWindow = [System, ${sRecentUserMsgCnt} User Query/Resp, Cur Query].
    • ChatHistInCtxt, MaxTokens, ModelCtxt window to expand
    • @@ -1068,6 +1068,8 @@ class MultiChatUI { this.elDivSessions = /** @type{HTMLDivElement} */(document.getElementById("sessions-div")); this.elBtnSettings = /** @type{HTMLButtonElement} */(document.getElementById("settings")); this.elBtnClearChat = /** @type{HTMLButtonElement} */(document.getElementById("clearchat")); + this.elBtnSessionsPrompts = /** @type{HTMLButtonElement} */(document.getElementById("sessionsprompts")); + this.elDivSessionsPrompts = /** @type{HTMLDivElement} */(document.getElementById("sessionsprompts-div")); this.elDivTool = /** @type{HTMLDivElement} */(document.getElementById("tool-div")); this.elBtnTool = /** @type{HTMLButtonElement} */(document.getElementById("tool-btn")); this.elInToolName = /** @type{HTMLInputElement} */(document.getElementById("toolname-in")); @@ -1109,6 +1111,8 @@ class MultiChatUI { this.validate_element(this.elInToolName, "toolname-in"); this.validate_element(this.elInToolArgs, "toolargs-in"); this.validate_element(this.elBtnTool, "tool-btn"); + this.validate_element(this.elBtnSessionsPrompts, "sessionsprompts-btn"); + this.validate_element(this.elDivSessionsPrompts, "sessionsprompts-div"); } /** @@ -1497,6 +1501,13 @@ class MultiChatUI { this.simpleChats[this.curChatId].clear() this.chat_show(this.curChatId) }); + this.elBtnSessionsPrompts.addEventListener("click", (ev)=>{ + if (this.elDivSessionsPrompts.classList.contains("visibility-visible")) { + this.elDivSessionsPrompts.classList.replace("visibility-visible", "visibility-hidden") + } else { + this.elDivSessionsPrompts.classList.replace("visibility-hidden", "visibility-visible") + } + }) this.elBtnUser.addEventListener("click", (ev)=>{ clearTimeout(this.timers.toolcallResponseSubmitClick)