diff --git a/examples/server/public/index.html b/examples/server/public/index.html index 35b4f61c7..9a19c5e83 100644 --- a/examples/server/public/index.html +++ b/examples/server/public/index.html @@ -83,12 +83,12 @@ Server rendered element contains fewer child nodes than client vdom.`),T=!0),fu( ${c} - `},window.copyStr=Zf;const n=Eo(()=>t.value.render(e.source));return()=>Co("div",{innerHTML:n.value})},{props:["source"]}),r_=ln({template:document.getElementById("settings-modal-short-input").innerHTML,props:{label:{type:String,required:!1},configKey:String,configDefault:Object,configInfo:Object,modelValue:[Object,String,Number]}}),i_=ln({components:{VueMarkdown:Jf},template:document.getElementById("message-bubble").innerHTML,props:{config:Object,msg:Object,isGenerating:Boolean,editUserMsgAndRegenerate:Function,regenerateMsg:Function},data(){return{editingContent:null}},computed:{timings(){return this.msg.timings?{...this.msg.timings,prompt_per_second:this.msg.timings.prompt_n/(this.msg.timings.prompt_ms/1e3),predicted_per_second:this.msg.timings.predicted_n/(this.msg.timings.predicted_ms/1e3)}:null}},methods:{copyMsg(){Zf(this.msg.content)},editMsg(){this.editUserMsgAndRegenerate({...this.msg,content:this.editingContent}),this.editingContent=null}}}),he={getAllConversations(){const e=[];for(const t in localStorage)t.startsWith("conv-")&&e.push(JSON.parse(localStorage.getItem(t)));return e.sort((t,u)=>u.lastModified-t.lastModified),e},getOneConversation(e){return JSON.parse(localStorage.getItem(e)||"null")},appendMsg(e,t){if(t.content===null)return;const u=he.getOneConversation(e)||{id:e,lastModified:Date.now(),messages:[]};u.messages.push(t),u.lastModified=Date.now(),localStorage.setItem(e,JSON.stringify(u))},getNewConvId(){return`conv-${Date.now()}`},remove(e){localStorage.removeItem(e)},filterAndKeepMsgs(e,t){const u=he.getOneConversation(e);u&&(u.messages=u.messages.filter(t),u.lastModified=Date.now(),localStorage.setItem(e,JSON.stringify(u)))},popMsg(e){const t=he.getOneConversation(e);if(!t)return;const u=t.messages.pop();return t.lastModified=Date.now(),t.messages.length===0?he.remove(e):localStorage.setItem(e,JSON.stringify(t)),u},getConfig(){const e=JSON.parse(localStorage.getItem("config")||"{}");return{...ci,...e}},setConfig(e){localStorage.setItem("config",JSON.stringify(e))},getTheme(){return localStorage.getItem("theme")||"auto"},setTheme(e){e==="auto"?localStorage.removeItem("theme"):localStorage.setItem("theme",e)}},Sr=e=>{const t=document.getElementById("messages-list"),u=t.scrollHeight-t.scrollTop-t.clientHeight;(!e||u<100)&&setTimeout(()=>t.scrollTo({top:t.scrollHeight}),1)};async function*s_(e,t){const n=(await fetch(e,t)).body.pipeThrough(new TextDecoderStream).pipeThrough(new Z3);for await(const r of n)if(r.startsWith("data:")&&!r.endsWith("[DONE]"))yield JSON.parse(r.slice(5));else if(r.startsWith("error:")){const i=JSON.parse(r.slice(6));throw new Error(i.message||"Unknown error")}}const Yf=Jr({components:{VueMarkdown:Jf,SettingsModalShortInput:r_,MessageBubble:i_},data(){return{conversations:he.getAllConversations(),messages:[],viewingConvId:he.getNewConvId(),inputMsg:"",isGenerating:!1,pendingMsg:null,stopGeneration:()=>{},selectedTheme:he.getTheme(),config:he.getConfig(),showConfigDialog:!1,themes:n_,configDefault:{...ci},configInfo:{...t_}}},computed:{},mounted(){document.getElementById("app").classList.remove("opacity-0");const e=document.getElementById("pending-msg");new ResizeObserver(()=>{this.isGenerating&&Sr(!0)}).observe(e)},watch:{viewingConvId:function(e,t){e!=t&&(this.fetchMessages(),Sr(),this.hideSidebar())}},methods:{hideSidebar(){document.getElementById("toggle-drawer").checked=!1},setSelectedTheme(e){this.selectedTheme=e,he.setTheme(e)},newConversation(){this.isGenerating||(this.viewingConvId=he.getNewConvId())},setViewingConv(e){this.isGenerating||(this.viewingConvId=e)},deleteConv(e){this.isGenerating||window.confirm("Are you sure to delete this conversation?")&&(he.remove(e),this.viewingConvId===e&&(this.viewingConvId=he.getNewConvId()),this.fetchConversation(),this.fetchMessages())},downloadConv(e){const t=he.getOneConversation(e);if(!t){alert("Conversation not found.");return}const u=JSON.stringify(t,null,2),n=new Blob([u],{type:"application/json"}),r=URL.createObjectURL(n),i=document.createElement("a");i.href=r,i.download=`conversation_${e}.json`,document.body.appendChild(i),i.click(),document.body.removeChild(i),URL.revokeObjectURL(r)},async sendMessage(){if(!this.inputMsg)return;const e=this.viewingConvId;he.appendMsg(e,{id:Date.now(),role:"user",content:this.inputMsg}),this.fetchConversation(),this.fetchMessages(),this.inputMsg="",this.generateMessage(e),Sr()},async generateMessage(e){if(!this.isGenerating){this.pendingMsg={id:Date.now()+1,role:"assistant",content:null},this.isGenerating=!0;try{const t=new AbortController;this.stopGeneration=()=>t.abort();const u={messages:[{role:"system",content:this.config.systemMessage},...this.messages],stream:!0,cache_prompt:!0,samplers:this.config.samplers,temperature:this.config.temperature,dynatemp_range:this.config.dynatemp_range,dynatemp_exponent:this.config.dynatemp_exponent,top_k:this.config.top_k,top_p:this.config.top_p,min_p:this.config.min_p,typical_p:this.config.typical_p,xtc_probability:this.config.xtc_probability,xtc_threshold:this.config.xtc_threshold,repeat_last_n:this.config.repeat_last_n,repeat_penalty:this.config.repeat_penalty,presence_penalty:this.config.presence_penalty,frequency_penalty:this.config.frequency_penalty,dry_multiplier:this.config.dry_multiplier,dry_base:this.config.dry_base,dry_allowed_length:this.config.dry_allowed_length,dry_penalty_last_n:this.config.dry_penalty_last_n,max_tokens:this.config.max_tokens,timings_per_token:!!this.config.showTokensPerSecond,...this.config.custom.length?JSON.parse(this.config.custom):{}},n=s_(`${e_}/v1/chat/completions`,{method:"POST",headers:{"Content-Type":"application/json",Authorization:this.config.apiKey?`Bearer ${this.config.apiKey}`:void 0},body:JSON.stringify(u),signal:t.signal});for await(const r of n){const i=r.stop,s=r.choices[0].delta.content,o=this.pendingMsg.content||"";s&&(this.pendingMsg={id:this.pendingMsg.id,role:"assistant",content:o+s});const c=r.timings;c&&(this.pendingMsg.timings={prompt_n:c.prompt_n,prompt_ms:c.prompt_ms,predicted_n:c.predicted_n,predicted_ms:c.predicted_ms})}he.appendMsg(e,this.pendingMsg),this.fetchConversation(),this.fetchMessages(),setTimeout(()=>document.getElementById("msg-input").focus(),1)}catch(t){if(t.name==="AbortError")he.appendMsg(e,this.pendingMsg),this.fetchConversation(),this.fetchMessages();else{console.error(t),alert(t);const u=he.popMsg(e);this.inputMsg=u?u.content:""}}this.pendingMsg=null,this.isGenerating=!1,this.stopGeneration=()=>{},this.fetchMessages(),Sr()}},regenerateMsg(e){if(this.isGenerating)return;const t=this.viewingConvId;he.filterAndKeepMsgs(t,u=>u.idn.id + `},window.copyStr=Zf;const n=Eo(()=>t.value.render(e.source));return()=>Co("div",{innerHTML:n.value})},{props:["source"]}),r_=ln({template:document.getElementById("settings-modal-short-input").innerHTML,props:{label:{type:String,required:!1},configKey:String,configDefault:Object,configInfo:Object,modelValue:[Object,String,Number]}}),i_=ln({components:{VueMarkdown:Jf},template:document.getElementById("message-bubble").innerHTML,props:{config:Object,msg:Object,isGenerating:Boolean,editUserMsgAndRegenerate:Function,regenerateMsg:Function},data(){return{editingContent:null}},computed:{timings(){return this.msg.timings?{...this.msg.timings,prompt_per_second:this.msg.timings.prompt_n/(this.msg.timings.prompt_ms/1e3),predicted_per_second:this.msg.timings.predicted_n/(this.msg.timings.predicted_ms/1e3)}:null}},methods:{copyMsg(){Zf(this.msg.content)},editMsg(){this.editUserMsgAndRegenerate({...this.msg,content:this.editingContent}),this.editingContent=null}}}),he={getAllConversations(){const e=[];for(const t in localStorage)t.startsWith("conv-")&&e.push(JSON.parse(localStorage.getItem(t)));return e.sort((t,u)=>u.lastModified-t.lastModified),e},getOneConversation(e){return JSON.parse(localStorage.getItem(e)||"null")},appendMsg(e,t){if(t.content===null)return;const u=he.getOneConversation(e)||{id:e,lastModified:Date.now(),messages:[]};u.messages.push(t),u.lastModified=Date.now(),localStorage.setItem(e,JSON.stringify(u))},getNewConvId(){return`conv-${Date.now()}`},remove(e){localStorage.removeItem(e)},filterAndKeepMsgs(e,t){const u=he.getOneConversation(e);u&&(u.messages=u.messages.filter(t),u.lastModified=Date.now(),localStorage.setItem(e,JSON.stringify(u)))},popMsg(e){const t=he.getOneConversation(e);if(!t)return;const u=t.messages.pop();return t.lastModified=Date.now(),t.messages.length===0?he.remove(e):localStorage.setItem(e,JSON.stringify(t)),u},getConfig(){const e=JSON.parse(localStorage.getItem("config")||"{}");return{...ci,...e}},setConfig(e){localStorage.setItem("config",JSON.stringify(e))},getTheme(){return localStorage.getItem("theme")||"auto"},setTheme(e){e==="auto"?localStorage.removeItem("theme"):localStorage.setItem("theme",e)}},Sr=e=>{const t=document.getElementById("messages-list"),u=t.scrollHeight-t.scrollTop-t.clientHeight;(!e||u<100)&&setTimeout(()=>t.scrollTo({top:t.scrollHeight}),1)};async function*s_(e,t){const n=(await fetch(e,t)).body.pipeThrough(new TextDecoderStream).pipeThrough(new Z3);for await(const r of n)if(r.startsWith("data:")&&!r.endsWith("[DONE]"))yield JSON.parse(r.slice(5));else if(r.startsWith("error:")){const i=JSON.parse(r.slice(6));throw new Error(i.message||"Unknown error")}}const Yf=Jr({components:{VueMarkdown:Jf,SettingsModalShortInput:r_,MessageBubble:i_},data(){return{conversations:he.getAllConversations(),messages:[],viewingConvId:he.getNewConvId(),inputMsg:"",isGenerating:!1,pendingMsg:null,stopGeneration:()=>{},selectedTheme:he.getTheme(),config:he.getConfig(),showConfigDialog:!1,themes:n_,configDefault:{...ci},configInfo:{...t_}}},computed:{},mounted(){document.getElementById("app").classList.remove("opacity-0");const e=document.getElementById("pending-msg");new ResizeObserver(()=>{this.isGenerating&&Sr(!0)}).observe(e)},watch:{viewingConvId:function(e,t){e!=t&&(this.fetchMessages(),Sr(),this.hideSidebar())}},methods:{hideSidebar(){document.getElementById("toggle-drawer").checked=!1},setSelectedTheme(e){this.selectedTheme=e,he.setTheme(e)},newConversation(){this.isGenerating||(this.viewingConvId=he.getNewConvId())},setViewingConv(e){this.isGenerating||(this.viewingConvId=e)},deleteConv(e){this.isGenerating||window.confirm("Are you sure to delete this conversation?")&&(he.remove(e),this.viewingConvId===e&&(this.viewingConvId=he.getNewConvId()),this.fetchConversation(),this.fetchMessages())},downloadConv(e){const t=he.getOneConversation(e);if(!t){alert("Conversation not found.");return}const u=JSON.stringify(t,null,2),n=new Blob([u],{type:"application/json"}),r=URL.createObjectURL(n),i=document.createElement("a");i.href=r,i.download=`conversation_${e}.json`,document.body.appendChild(i),i.click(),document.body.removeChild(i),URL.revokeObjectURL(r)},async sendMessage(){if(!this.inputMsg)return;const e=this.viewingConvId;he.appendMsg(e,{id:Date.now(),role:"user",content:this.inputMsg}),this.fetchConversation(),this.fetchMessages(),this.inputMsg="",this.generateMessage(e),Sr()},async generateMessage(e){if(!this.isGenerating){this.pendingMsg={id:Date.now()+1,role:"assistant",content:null},this.isGenerating=!0;try{const t=new AbortController;this.stopGeneration=()=>t.abort();const u={messages:[{role:"system",content:this.config.systemMessage},...this.messages],stream:!0,cache_prompt:!0,samplers:this.config.samplers,temperature:this.config.temperature,dynatemp_range:this.config.dynatemp_range,dynatemp_exponent:this.config.dynatemp_exponent,top_k:this.config.top_k,top_p:this.config.top_p,min_p:this.config.min_p,typical_p:this.config.typical_p,xtc_probability:this.config.xtc_probability,xtc_threshold:this.config.xtc_threshold,repeat_last_n:this.config.repeat_last_n,repeat_penalty:this.config.repeat_penalty,presence_penalty:this.config.presence_penalty,frequency_penalty:this.config.frequency_penalty,dry_multiplier:this.config.dry_multiplier,dry_base:this.config.dry_base,dry_allowed_length:this.config.dry_allowed_length,dry_penalty_last_n:this.config.dry_penalty_last_n,max_tokens:this.config.max_tokens,timings_per_token:!!this.config.showTokensPerSecond,...this.config.custom.length?JSON.parse(this.config.custom):{}},n=s_(`${e_}/v1/chat/completions`,{method:"POST",headers:{"Content-Type":"application/json",Authorization:this.config.apiKey?`Bearer ${this.config.apiKey}`:void 0},body:JSON.stringify(u),signal:t.signal});for await(const r of n){const i=r.stop,s=r.choices[0].delta.content,o=this.pendingMsg.content||"";s&&(this.pendingMsg={id:this.pendingMsg.id,role:"assistant",content:o+s});const c=r.timings;c&&this.config.showTokensPerSecond&&(this.pendingMsg.timings={prompt_n:c.prompt_n,prompt_ms:c.prompt_ms,predicted_n:c.predicted_n,predicted_ms:c.predicted_ms})}he.appendMsg(e,this.pendingMsg),this.fetchConversation(),this.fetchMessages(),setTimeout(()=>document.getElementById("msg-input").focus(),1)}catch(t){if(t.name==="AbortError")he.appendMsg(e,this.pendingMsg),this.fetchConversation(),this.fetchMessages();else{console.error(t),alert(t);const u=he.popMsg(e);this.inputMsg=u?u.content:""}}this.pendingMsg=null,this.isGenerating=!1,this.stopGeneration=()=>{},this.fetchMessages(),Sr()}},regenerateMsg(e){if(this.isGenerating)return;const t=this.viewingConvId;he.filterAndKeepMsgs(t,u=>u.idn.id Failed to start app. Please try clearing localStorage and try again.

`} - + @@ -214,15 +214,16 @@ Server rendered element contains fewer child nodes than client vdom.`),T=!0),fu( -
- +
+ +
@@ -336,7 +337,7 @@ Server rendered element contains fewer child nodes than client vdom.`),T=!0),fu(
-
Speed: {{ timings.predicted_per_second.toFixed(1) }} t/s
+
Speed: {{ timings.predicted_per_second.toFixed(1) }} t/s
Prompt
- Tokens: {{ timings.prompt_n }}
diff --git a/examples/server/webui/index.html b/examples/server/webui/index.html index 454b06787..9d29fe005 100644 --- a/examples/server/webui/index.html +++ b/examples/server/webui/index.html @@ -130,15 +130,16 @@
-
- +
+ +