PandoraAI is a web chat client powered by node-chatgpt-api, allowing users to easily chat with multiple AI systems while also offering support for custom presets. With its seamless and convenient design, PandoraAI provides an engaging conversational AI experience.
Description
I would like to suggest a possible enhancement for the web interface that would allow users to use the Bing image recognition feature. This feature is already implemented in the API server, but not yet available in the web interface.
Acceptance Criteria
There is a button close to the message input where a smaller menu open.
In that smaller menu the user has the option to write a URL or upload an image from their device.
(Optional) A preview of the image will be displayed.
The URL or base64 string of the image will be temporarily saved.
The user is notified in any way, that they have added an image successfully. For example with the image preview or a small message that persists until the user sends the message,
When the user sends a message the previous URL or base64 string will be used in the request.
The variables are emptied after sending the message.
The rest is handled by the API and current functionality.
Design Details
I have no existing experience in Vue, so there's not much I can write.
However the backend functionality exists from this PR for the API.
It is only necessary to set the variables in the sendMessage function in the Chat.vue file.
Of course it's also necessary to create the necessary HTML elements, CSS styling, a function to convert the uploaded image to base64, functions for the button clicks etc..
You can take a look at this commit as a reference to the functionality for the request. For example it is possible to manually set the variables and the API can use it, however this is just for testing.
zhouxinhao1208
commented
1 year ago
Description I would like to suggest a possible enhancement for the web interface that would allow users to use the Bing image recognition feature. This feature is already implemented in the API server, but not yet available in the web interface.
Acceptance Criteria
Design Details I have no existing experience in Vue, so there's not much I can write. However the backend functionality exists from this PR for the API. It is only necessary to set the variables in the sendMessage function in the Chat.vue file. Of course it's also necessary to create the necessary HTML elements, CSS styling, a function to convert the uploaded image to base64, functions for the button clicks etc.. You can take a look at this commit as a reference to the functionality for the request. For example it is possible to manually set the variables and the API can use it, however this is just for testing.