Upgraded ui

This commit is contained in:
ParisNeo 2023-05-03 00:02:00 +02:00
parent 0a15b43fc9
commit 677bd32e00
6 changed files with 119 additions and 7 deletions

84
web/package-lock.json generated
View File

@ -11,6 +11,7 @@
"axios": "^1.3.6",
"dotenv": "^16.0.3",
"feather-icons": "^4.29.0",
"socket.io-client": "^4.6.1",
"vue": "^3.2.47",
"vue-router": "^4.1.6"
},
@ -574,6 +575,11 @@
"integrity": "sha512-sXo/qW2/pAcmT43VoRKOJbDOfV3cYpq3szSVfIThQXNt+E4DfKj361vaAt3c88U5tPUxzEswam7GW48PJqtKAg==",
"dev": true
},
"node_modules/@socket.io/component-emitter": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz",
"integrity": "sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg=="
},
"node_modules/@vitejs/plugin-vue": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-4.1.0.tgz",
@ -1106,7 +1112,6 @@
"version": "4.3.4",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
"integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
"dev": true,
"dependencies": {
"ms": "2.1.2"
},
@ -1171,6 +1176,26 @@
"integrity": "sha512-e2aeCAixCj9M7nJxdB/wDjO6mbYX+lJJxSJCXDzlr5YPGYVofuJwGN9nKg2o6wWInjX6XmxRinn3AeJMK81ltw==",
"dev": true
},
"node_modules/engine.io-client": {
"version": "6.4.0",
"resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-6.4.0.tgz",
"integrity": "sha512-GyKPDyoEha+XZ7iEqam49vz6auPnNJ9ZBfy89f+rMMas8AuiMWOZ9PVzu8xb9ZC6rafUqiGHSCfu22ih66E+1g==",
"dependencies": {
"@socket.io/component-emitter": "~3.1.0",
"debug": "~4.3.1",
"engine.io-parser": "~5.0.3",
"ws": "~8.11.0",
"xmlhttprequest-ssl": "~2.0.0"
}
},
"node_modules/engine.io-parser": {
"version": "5.0.6",
"resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-5.0.6.tgz",
"integrity": "sha512-tjuoZDMAdEhVnSFleYPCtdL2GXwVTGtNjoeJd9IhIG3C1xs9uwxqRNEu5WpnDZCaozwVlK/nuQhpodhXSIMaxw==",
"engines": {
"node": ">=10.0.0"
}
},
"node_modules/esbuild": {
"version": "0.17.17",
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.17.17.tgz",
@ -1999,8 +2024,7 @@
"node_modules/ms": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
"dev": true
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
},
"node_modules/mz": {
"version": "2.7.0",
@ -2585,6 +2609,32 @@
"node": ">=8"
}
},
"node_modules/socket.io-client": {
"version": "4.6.1",
"resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-4.6.1.tgz",
"integrity": "sha512-5UswCV6hpaRsNg5kkEHVcbBIXEYoVbMQaHJBXJCyEQ+CiFPV1NIOY0XOFWG4XR4GZcB8Kn6AsRs/9cy9TbqVMQ==",
"dependencies": {
"@socket.io/component-emitter": "~3.1.0",
"debug": "~4.3.2",
"engine.io-client": "~6.4.0",
"socket.io-parser": "~4.2.1"
},
"engines": {
"node": ">=10.0.0"
}
},
"node_modules/socket.io-parser": {
"version": "4.2.2",
"resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.2.2.tgz",
"integrity": "sha512-DJtziuKypFkMMHCm2uIshOYC7QaylbtzQwiMYDuCKy3OPkjLzu4B2vAhTlqipRHHzrI0NJeBAizTK7X+6m1jVw==",
"dependencies": {
"@socket.io/component-emitter": "~3.1.0",
"debug": "~4.3.1"
},
"engines": {
"node": ">=10.0.0"
}
},
"node_modules/source-map": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
@ -2981,6 +3031,26 @@
"integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
"dev": true
},
"node_modules/ws": {
"version": "8.11.0",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.11.0.tgz",
"integrity": "sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg==",
"engines": {
"node": ">=10.0.0"
},
"peerDependencies": {
"bufferutil": "^4.0.1",
"utf-8-validate": "^5.0.2"
},
"peerDependenciesMeta": {
"bufferutil": {
"optional": true
},
"utf-8-validate": {
"optional": true
}
}
},
"node_modules/xml-name-validator": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-4.0.0.tgz",
@ -2990,6 +3060,14 @@
"node": ">=12"
}
},
"node_modules/xmlhttprequest-ssl": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-2.0.0.tgz",
"integrity": "sha512-QKxVRxiRACQcVuQEYFsI1hhkrMlrXHPegbbd1yn9UHOmRxY+si12nQYzri3vbzt8VdTTRviqcKxcyllFas5z2A==",
"engines": {
"node": ">=0.4.0"
}
},
"node_modules/yallist": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",

View File

@ -13,6 +13,7 @@
"axios": "^1.3.6",
"dotenv": "^16.0.3",
"feather-icons": "^4.29.0",
"socket.io-client": "^4.6.1",
"vue": "^3.2.47",
"vue-router": "^4.1.6"
},

View File

@ -26,5 +26,6 @@ import { RouterView } from 'vue-router'
import TopBar from './components/TopBar.vue';
import Footer from './components/Footer.vue';
</script>
<!-- <script src="../node_modules/feather-icons/dist/feather"></script> -->

View File

@ -7,7 +7,7 @@
<textarea id="chat" rows="1"
class="block min-h-11 no-scrollbar p-2.5 w-full text-sm text-gray-900 bg-bg-light rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 dark:bg-bg-dark dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
placeholder="Send message..." @keydown.enter.exact="submitOnEnter($event)" ></textarea>
<button type="submit"
<button type="submit" on on-click=""
class="inline-flex justify-center p-2 rounded-full cursor-pointer hover:text-primary duration-75 active:scale-90">
<i data-feather="send" class=" w-6 h-6 m-1"></i>
@ -25,6 +25,7 @@
<script>
import {nextTick} from 'vue'
import feather from 'feather-icons'
import websocket from '@/services/websocket.js';
export default {
name: 'ChatBox',
@ -34,13 +35,22 @@ export default {
methods: {
submitOnEnter(event) {
if (event.which === 13) {
event.preventDefault(); // Prevents the addition of a new line in the text field
console.log("enter detected");
if (!event.repeat) {
const newEvent = new Event("submit", { cancelable: true });
event.target.form.dispatchEvent(newEvent);
// const newEvent = new Event("submit", { cancelable: true });
// event.target.form.dispatchEvent(newEvent);
console.log(event.target.value)
console.log(websocket)
websocket.emit('generate_msg',{prompt: event.target.value});
}
event.preventDefault(); // Prevents the addition of a new line in the text field
}
},
submit(event){
event.preventDefault(); // Prevents the addition of a new line in the text field
websocket.emit('generate_msg',{prompt: event.target.value});
}
},mounted(){
nextTick(()=>{

View File

@ -0,0 +1,21 @@
// Project : GPT4ALL-ui
// Author : ParisNeo
// Description :
// All websocket stuff can be found here.
import io from 'socket.io-client';
const socket = new io('http://' + document.domain + ':' + location.port);
socket.onopen = () => {
console.log('WebSocket connection established.');
};
socket.onclose = (event) => {
console.log('WebSocket connection closed:', event.code, event.reason);
};
socket.onerror = (error) => {
console.error('WebSocket error:', error);
};
export default socket;

View File

@ -86,6 +86,7 @@
</style>
<script>
import io from 'socket.io-client';
import axios from "axios";
import { nextTick } from 'vue'
export default {