119 lines
3.9 KiB
TypeScript
119 lines
3.9 KiB
TypeScript
import localforage from "localforage";
|
|
import { v4 } from "uuid";
|
|
import { getDatabase } from "../../storage/database.svelte";
|
|
import { checkImageType } from "../../parser.svelte";
|
|
|
|
const inlayStorage = localforage.createInstance({
|
|
name: 'inlay',
|
|
storeName: 'inlay'
|
|
})
|
|
|
|
export async function postInlayImage(img:{
|
|
name:string,
|
|
data:Uint8Array
|
|
}){
|
|
|
|
const extention = img.name.split('.').at(-1)
|
|
const imgObj = new Image()
|
|
imgObj.src = URL.createObjectURL(new Blob([img.data], {type: `image/${extention}`}))
|
|
|
|
return await writeInlayImage(imgObj, {
|
|
name: img.name,
|
|
ext: extention
|
|
})
|
|
}
|
|
|
|
export async function writeInlayImage(imgObj:HTMLImageElement, arg:{name?:string, ext?:string} = {}) {
|
|
|
|
let drawHeight = 0
|
|
let drawWidth = 0
|
|
const canvas = document.createElement('canvas')
|
|
const ctx = canvas.getContext('2d')
|
|
await new Promise((resolve) => {
|
|
imgObj.onload = () => {
|
|
drawHeight = imgObj.height
|
|
drawWidth = imgObj.width
|
|
|
|
//resize image to fit inlay, if it's too big (max 1024px)
|
|
if(drawHeight > 1024){
|
|
drawWidth = drawWidth * (1024 / drawHeight)
|
|
drawHeight = 1024
|
|
}
|
|
if(drawWidth > 1024){
|
|
drawHeight = drawHeight * (1024 / drawWidth)
|
|
drawWidth = 1024
|
|
}
|
|
drawHeight = Math.floor(drawHeight)
|
|
drawWidth = Math.floor(drawWidth)
|
|
|
|
canvas.width = drawWidth
|
|
canvas.height = drawHeight
|
|
ctx.drawImage(imgObj, 0, 0, drawWidth, drawHeight)
|
|
resolve(null)
|
|
}
|
|
})
|
|
const dataURI = canvas.toDataURL('image/png')
|
|
|
|
|
|
const imgid = v4()
|
|
|
|
await inlayStorage.setItem(imgid, {
|
|
name: arg.name ?? imgid,
|
|
data: dataURI,
|
|
ext: arg.ext ?? 'png',
|
|
height: drawHeight,
|
|
width: drawWidth
|
|
})
|
|
|
|
return `${imgid}`
|
|
}
|
|
|
|
export async function getInlayImage(id: string){
|
|
const img:{
|
|
name: string,
|
|
data: string
|
|
ext: string
|
|
height: number
|
|
width: number
|
|
} = await inlayStorage.getItem(id)
|
|
if(img === null){
|
|
return null
|
|
}
|
|
return img
|
|
}
|
|
|
|
export function supportsInlayImage(){
|
|
const db = getDatabase()
|
|
return db.aiModel.startsWith('gptv') || db.aiModel === 'gemini-pro-vision' || db.aiModel.startsWith('gemini-exp') || db.aiModel.startsWith('claude-3') || db.aiModel.startsWith('gpt4_turbo') || db.aiModel.startsWith('gpt5') || db.aiModel.startsWith('gpt4o') ||
|
|
(db.aiModel === 'reverse_proxy' && (
|
|
db.proxyRequestModel?.startsWith('gptv') || db.proxyRequestModel === 'gemini-pro-vision' || db.proxyRequestModel?.startsWith('claude-3') || db.proxyRequestModel.startsWith('gpt4_turbo') ||
|
|
db.proxyRequestModel?.startsWith('gpt5') || db.proxyRequestModel?.startsWith('gpt4o') ||
|
|
db.proxyRequestModel === 'custom' && (
|
|
db.customProxyRequestModel?.startsWith('gptv') ||
|
|
db.customProxyRequestModel === 'gemini-pro-vision' ||
|
|
db.customProxyRequestModel?.startsWith('claude-3') ||
|
|
db.customProxyRequestModel.startsWith('gpt-4-turbo') ||
|
|
db.customProxyRequestModel?.startsWith('gpt5') ||
|
|
db.customProxyRequestModel?.startsWith('gpt4o')
|
|
)
|
|
))
|
|
}
|
|
|
|
export async function reencodeImage(img:Uint8Array){
|
|
if(checkImageType(img) === 'PNG'){
|
|
return img
|
|
}
|
|
const canvas = document.createElement('canvas')
|
|
const imgObj = new Image()
|
|
imgObj.src = URL.createObjectURL(new Blob([img], {type: `image/png`}))
|
|
await imgObj.decode()
|
|
let drawHeight = imgObj.height
|
|
let drawWidth = imgObj.width
|
|
canvas.width = drawWidth
|
|
canvas.height = drawHeight
|
|
const ctx = canvas.getContext('2d')
|
|
ctx.drawImage(imgObj, 0, 0, drawWidth, drawHeight)
|
|
const b64 = canvas.toDataURL('image/png').split(',')[1]
|
|
const b = Buffer.from(b64, 'base64')
|
|
return b
|
|
} |