jan/web/utils/base64.ts
hiro e6c10202e0
feat: Jan can see (#2069)
* feat: jan can see

feat: Add GPT-4 Vision model (Preview)

fix: Add visionModel as property in ModelInfo

fix: Fix condition to load local messages in useSetActiveThread hook

feat: Enable Image as input for chat

fix: Update model parameters in JSON files for remote GPT models

fix: Add thread as optional

fix: Add support for message as image

fix: Linter

fix: Update proxyModel to proxy_model and add textModel

chore: Change proxyModel to proxy_model

fix: Update settings with visionModel and textModel

fix: vision model passed through the retrieval tool

fix: linter

* fix: could not load image and request is not able to be sent

---------

Co-authored-by: Louis <louis@jan.ai>
2024-03-05 08:33:09 +07:00

46 lines
1.3 KiB
TypeScript

export const getBase64 = async (file: File): Promise<string> =>
new Promise((resolve) => {
const reader = new FileReader()
reader.readAsDataURL(file)
reader.onload = () => {
const baseURL = reader.result
resolve(baseURL as string)
}
})
export function compressImage(
base64Image: string,
size: number
): Promise<string> {
// Create a canvas element
const canvas = document.createElement('canvas')
const ctx = canvas.getContext('2d')
// Create an image object
const image = new Image()
// Set the image source to the base64 string
image.src = base64Image
return new Promise((resolve) => {
// Wait for the image to load
image.onload = () => {
// Set the canvas width and height to the image width and height
const width = Math.min(size, image.width)
const height = (image.height / image.width) * width
canvas.width = width
canvas.height = height
// Draw the image on the canvas
ctx?.drawImage(image, 0, 0, canvas.width, canvas.height)
// Convert the canvas to a data URL with the specified quality
const compressedBase64Image = canvas.toDataURL(`image/jpeg`, 1)
// Log the compressed base64 image
return resolve(compressedBase64Image)
}
})
}