From ce0ce7c78e6cc87dc59f3ab279dc3b071e8e43f4 Mon Sep 17 00:00:00 2001
From: "Steve L. Nyemba" <steve.l.nyemba@vumc.org>
Date: Wed, 19 Mar 2025 20:36:02 +0000
Subject: [PATCH] Upload files to "/"

---
 about.html         |  25 +++++++
 documents.html     |  38 ++++++++++
 index.html         | 174 +++++++++++++++++++++++++++++++++++++++++++++
 qcms-manifest.json |  50 +++++++++++++
 requirements.txt   |   7 ++
 5 files changed, 294 insertions(+)
 create mode 100644 about.html
 create mode 100644 documents.html
 create mode 100644 index.html
 create mode 100644 qcms-manifest.json
 create mode 100644 requirements.txt

diff --git a/about.html b/about.html
new file mode 100644
index 0000000..6c28d4f
--- /dev/null
+++ b/about.html
@@ -0,0 +1,25 @@
+<style>
+    .main .pane { border-color: transparent; line-height: 1.5; padding:0}
+    .fa-trash {color:red;}
+</style>
+<div class="border-round border">
+    <div align="center">
+        <h4>Vanderbilt University Medical Center</h4>
+    </div>
+    <p>
+
+    </p>
+</div>
+<br>
+<div class="border-round border">
+    <b>{{layout.header.title}}</B>, empowers patients with answers to questions they may have around kidney transplant care and other related conditions.
+
+    <div>
+            Click on the following:
+        <ul class="">
+            <div><i class="fa-solid fa-volume-high" style="margin-right:20px"></i> read response</div>
+            <div><i class="fa-solid fa-file" style="margin-right:20px"></i> supporting documents</div>
+            <div><i class="fa-solid fa-trash" style="margin-right:20px"></i> delete question</div>
+        </ul>
+    </div>
+</div>
\ No newline at end of file
diff --git a/documents.html b/documents.html
new file mode 100644
index 0000000..ae8095c
--- /dev/null
+++ b/documents.html
@@ -0,0 +1,38 @@
+<script>
+var papers  = {}
+papers.render = function (_data){
+    _index = 0
+    _data.documents.forEach(_item => {
+        css = (_index % 2 ==0)?'shadow': ''
+        var _html = (['<div class="cell ',css,'">',_item.name,'</div><div class="cell ',css,'" align="right">',_item.page,'</div>']).join('')
+        _html = $(_html)
+        $('.documents').append(_html)
+        _index += 1
+
+    });
+}
+$(document).ready(function(){
+    var _data = JSON.parse(sessionStorage['llm'])
+    papers.render(_data)
+})
+</script>
+<style>
+    .documents {
+        display: grid;
+        grid-template-columns: auto 64px;
+        gap:4px;
+        width:650px;
+        font-weight:lighter;
+        font-size:14px;
+        line-height: 1.5;
+        font-family: sans-serif;
+    }
+    
+    .cell {padding:4px;}
+    .shadow {background-color: #f3f3f3;}
+</style>
+<div>
+    <div class="documents">
+        <div class="cell bold border-bottom" >Documents</div><div class="cell bold border-bottom"  align="right">Page</div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..c314d9f
--- /dev/null
+++ b/index.html
@@ -0,0 +1,174 @@
+<link href="www/html/_assets/themes/common.css" type="text/css" rel="stylesheet">
+<script src="www/html/_assets/js/assistant.js"></script>
+<script>
+    var chat = {get:{}}
+    // var _assistant = new Assistant()
+    chat.get.id = function (_index){
+        return (['.llm-pane-',_index,' .answer .llm-answer']).join('')
+    }
+    chat.read = function (_index){
+        var _id = (['.llm-pane-',_index,' .answer .llm-answer']).join('')
+        var text = $(_id).text()
+        // Assistant.speak(text)
+        //
+        // We need to submit the box to retrieve the audio file and transcript
+        //
+        _args = {title:'{{layout.header.title}} Transcript Reader',uri:'www/html/transcript.html',context:'{{system.context}}'}
+        uri = '{{system.context}}/api/medix/audio?token='+$('.chat').attr('token')+'&index='+_index
+        uri = uri.replace(/\/\//g,'/')
+        dialog.show(_args,()=>{
+            
+            $('.jxmodal .text').html(text)
+            $('audio').attr('src',uri)
+            $('audio')[0].play()
+            
+            // Assistant.speak(text)
+            // $('audio').hide()
+        
+        })
+        
+        // console.log(uri)
+        
+    }
+    chat.print = function (){
+        //
+        // if the log pane is empty then I should throw a message
+        if ($('.logs').children().length >  0){
+
+            // var _html = ['<div class="main">',$('head').html(), ,$('#header').html(), '<br>',$('.logs').html(),'</div></div]
+            style=["<style>",".menu {border:1px solid transparent;}",".content {grid-column:1 / span 2;}","</style>"]
+            _html = [$('head').html(),'<link href="www/html/_assets/themes/common.css" type="text/css" rel="stylesheet">',style.join(' '),'<div class="main {{system.theme}}"><div id="header" class="header">',$('#header').html(),'</div><div class="menu"></div><div class="content"><div class="logs">',$('.logs').html(),'</div></div></div>']
+            _html = _html.join('')
+            var _printer = window.open('','','width=500,height=500')
+            
+            _printer.document.open()
+            _printer.document.write(_html)
+
+        }else{
+            //
+            // Throw an error, no printing is needed
+            _args = {uri:'www/html/alert.html',title:'{{layout.header.title}} - Print Error',context:'{{system.context}}'}
+            _args.pointer = function (){$('.alert-controls').hide()}
+            dialog.show(_args)
+            
+            
+            setTimeout(function(){
+                $('.alert-icon').html('<i class="fa-solid fa-times fa-2x" style="color:maroon"></i>')
+                $('.alert-message').html('There are no conversations to be printed')
+                $('.alert-controls').hide()
+            },50)
+        }
+    }
+    chat.delete = function (_index){
+        var _id = '.llm-pane-'+_index
+        $(_id).remove()
+        if ($(_id).children().length == 0){
+            $('.logs').animate({'height':'42%'})
+        }
+    }
+    chat.support = function(_index){
+        // dialog.show({message:'Work in progress'})
+        var _div = $('.answer')[_index]
+        sessionStorage['llm'] = JSON.stringify(_div.data)
+        _args = {uri:'www/html/documents.html',title:'{{layout.header.title}} ',context:'{{system.context}}'}
+        dialog.show(_args)
+
+    }
+    chat.question = {}
+    chat.question.ask = function (){
+        
+        var height = $('.chat').height() -  $('.question-input').height() - 16 - 48
+        $('.logs').animate({'height':height})
+        var _index = $('.logs').children().length
+        var _q = $('textarea').val().trim()
+        var uri = '{{system.context}}/api/medix/answer'
+        //
+        // @TODO: perform validation here
+        if (_q.length > 0 ){
+            chat.question.render()
+            chat.answer.render()
+            token = $('.chat').attr('token')
+            var _data = {'question':_q,'index':_index}
+            if (token){
+                _data.token = token
+            }
+            
+            _data = JSON.stringify(_data)
+            
+            var http = HttpClient.instance()
+            http.setHeader('Content-Type','application/json')
+            http.setData(_data)
+            http.post(uri,function(x){
+                if(x.readyState == 4 && x.status == 200){
+                    var _data = JSON.parse(x.responseText)
+                    $('.chat').attr('token',_data.token)
+                    chat.answer.render(_data)
+                }
+            })
+        }else{
+            //
+            // alert the user something is wrong
+        }
+    }
+    chat.question.render = function (){
+        //
+        // showing a 
+        var _index = $('.logs').children().length
+        var _q = $('textarea').val().trim()
+        if (_q.length > 0){
+            //
+            // Add read, documents, delete buttons 
+            _delete = ['<div class="active" align="center" title="Delete Question" onclick="chat.delete(',_index,')"><i class="fa-solid fa-trash"></i></div>']
+            var _html = ['<div class="llm-pane-',_index,'"> <div class="border-round border question-frame"><div><i class="fa-solid fa-user fa-2x"></i></div><div class="question">',_q,'</div>',_delete.join(''),'</div> <div class="answer-frame">  </div></div>']
+            _html = _html.join('')
+
+            $('.logs').append(_html)
+            $('textarea').val('')
+        }
+    }
+    chat.answer  = {}
+    chat.answer.render = function (_answer){
+        var _index = $('.answer-frame').length - 1
+        if (_answer == null){
+            var _html = ['<div class="answer border-round border"><div class="answer-status"><i class="fa-solid fa-cog fa-spin fa-2x" style="color:gray"></i></div></div>']
+            _html =$( _html.join(''))
+
+            $($('.answer-frame')[_index]).append(_html)
+        }else{
+            _action = ['<div class="active" align="center" title="read out" onclick="chat.read(',_index,')"><i class="fa-solid fa-volume-high"></i></div>']
+            _action.push('<div class="active" align="center" title="supporting documents" onclick="chat.support(',_index,')"><i class="fa-solid fa-file"></i></div>')
+
+            var _div = $('.answer')[_index]
+
+            var _html = ['<div class="llm-answer">',_answer.answer,'</div><div class="border-left">',_action.join(''), '</div>']
+            
+            _html = $( _html.join(''))
+            $(_div).append(_html)
+            // $(_div).attr('data',_answer)
+            _div.data = _answer
+            
+            $('.answer-status').html('<i class="fa-solid fa-user-doctor fa-2x" style="color:#4682B4"></i>')
+        }
+        //
+        
+        
+    }
+    $(document).ready(()=>{
+        $('.logs').animate({'height':'42%'})
+    })
+</script>
+<div class="chat border-round border">
+    <div align="right" style="background-color: #f3f3f3;" class="border-round-top-left border-round-top-right">
+        <div class="active" onclick="chat.print()" title="Print conversation" style="justify-self: right; width:100px" align="center"><i class="fa-solid fa-print"></i></div>
+    </div>
+  <div class="logs"></div>
+  <div class="question-input border-top">
+    <textarea class="question" placeholder="[Enter your question]"></textarea>
+    <div class="active" onclick="chat.question.ask()">
+        <div align="center" style="display:grid; grid-template-rows:48px auto; gap:4px; align-items:center">
+            <div><i class="fa-solid fa-paper-plane fa-2x"></i></div>
+            <div class="small">Submit</div>
+        </div>
+    </div>
+  </div>
+</div>
\ No newline at end of file
diff --git a/qcms-manifest.json b/qcms-manifest.json
new file mode 100644
index 0000000..3796dba
--- /dev/null
+++ b/qcms-manifest.json
@@ -0,0 +1,50 @@
+{
+  "system": {
+    "app": {
+      "debug": true,
+      "port": 8084,
+      "threaded": true,
+      "host": "0.0.0.0"
+    },
+    "context": "medix-ai",
+    "logo": "www/html/_assets/images/logo.png",
+    "source": {
+      "id": "disk",
+      "key": "/home/steve/git/sites/medix/secure-key",
+      "llm":{
+        "prompt":{
+          "temperature":0.4,
+          "input_variables":["context","question"],
+          "template":"You ares medix-ai, and AI assistant! You only answer questions related healthcare and kidney transplant. Your answers are provided using simple english so non college educated people can understand. Decline to answer questions that aren't related to the context. Use the following context {context} to give a short answer (markdown format, spacing, line breaks, bullets) the following question: {question}"
+        },
+        "openai":"/home/steve/git/llm/data/llm-keys/zhijun-args.json"
+       
+          
+          
+      }
+    },
+    "theme": "default",
+    "version": "1.0"
+  },
+  "layout": {
+    "footer": [
+      
+      {"text":"Vanderbilt University Medical Center - Transplant Center"},
+      {"text":"Designed & Built By HIPLAB"}
+    ],
+    "header": {
+      "title": "Medix-ai",
+      "subtitle": "Medical A.i Assitant, kidney transplant"
+    },
+    "index": "index.html",
+    "on": {
+      "load": {"pane":["www/html/about.html"]}
+    },
+    "order": {
+      "menu": []
+    },
+    "overwrite": {},
+    "root": "www/html"
+  },
+  "plugins": {"medix":["answer","info","audio"]}
+}
diff --git a/requirements.txt b/requirements.txt
new file mode 100644
index 0000000..b0b64dc
--- /dev/null
+++ b/requirements.txt
@@ -0,0 +1,7 @@
+langchain
+langchain-community
+langchain-ollama
+langchain-openai
+langchain-text-splitters
+gtts
+git+https://dev.the-phi.com/git/qcms/cms