import type { IEntity } from '@/app/interfaces/environment'; import { useFilesWebsocketStore } from '@/app/stores/filesWebsocket'; import type { IImage } from '@/app/interfaces/entities'; import { useWebsocketStore } from '@/app/stores/websocket'; import { useInterfaceStore } from '@/app/stores/interface'; import { imageScaleOptions } from '@/components/sheets/entities/settings/lists/constants/options'; import type { IImageMainInfo } from '@/app/interfaces'; export const calcImageWidth = (fileWidth: number, windowWidth: number) => { let imageWidth = Math.ceil((fileWidth / (windowWidth - 128)) * 100); if (imageWidth > 100) { imageWidth = 100; } if (imageWidth < 5) { imageWidth = 5; } return imageWidth; }; export const sendReturnOriginalSize = (newState: IEntity) => { const websocketStore = useWebsocketStore(); const data = { event: 'returnOriginalImageSize', body: { ...newState } }; websocketStore.sendData(data); }; export const uploadImage = ($event) => { const target = $event.target as HTMLInputElement; const image = new Image(); const file = target.files![0]; image.src = URL.createObjectURL(file); return image; }; export const backgroundImageOnLoad = (image, windowWidth: number) => { const backgroundImageInfo = { image_url: '', image_width: 0, file_width: 0, file_height: 0 }; const imageWidth = calcImageWidth(image.width, windowWidth); backgroundImageInfo.image_url = image.src; backgroundImageInfo.image_width = imageWidth; backgroundImageInfo.file_width = image.width; backgroundImageInfo.file_height = image.height; return backgroundImageInfo; }; export const setDefaultSheetBackground = () => { const interfaceStore = useInterfaceStore(); interfaceStore.resetSheetBackground(); }; export const addUrlsToImageEntities = (entities: IEntity[]) => { const filesWebsocketStore = useFilesWebsocketStore(); const filesBuffer = filesWebsocketStore.filesBuffer; let index = 0; const entitiesToReturn = entities.map((entity: IEntity) => { if (!entity?.image_width) return entity; if (entity.image_url) return entity; if (filesWebsocketStore.image_url) { // редактирование сущности изображения entity.image_url = filesWebsocketStore.image_url; filesWebsocketStore.cleanImageUrl(); } else { filesBuffer[index] = new Blob([filesBuffer[index].data], { type: 'image/jpeg' }); entity.image_url = URL.createObjectURL(filesBuffer[index]); index += 1; filesBuffer[index] = new Blob([filesBuffer[index].data], { type: 'image/jpeg' }); entity.image_url_initial = URL.createObjectURL(filesBuffer[index]); index += 1; } return entity; }); filesWebsocketStore.cleanFilesBuffer(); return entitiesToReturn; }; export const checkIsImage = (entity: IEntity) => { if (!entity?.image_width) { return entity; } const entityToReturn = { ...entity }; const filesWebsocketStore = useFilesWebsocketStore(); filesWebsocketStore.saveImageUrl(entityToReturn.image_url!); delete entityToReturn.image_url; return entityToReturn; }; export const sendCropImage = async (newUrl: string, entity: IImage) => { const filesWebsocketStore = useFilesWebsocketStore(); filesWebsocketStore.saveImageUrl(newUrl); const websocketStore = useWebsocketStore(); const response = await fetch(newUrl); const blob = await response.blob(); const buffer = await blob.arrayBuffer(); const dataSetCropNow = { event: 'setCropNow' }; websocketStore.sendData(dataSetCropNow); filesWebsocketStore.sendData(buffer); const data = { event: 'cropImage', body: { ...entity } }; websocketStore.sendData(data); }; export const getImageScalesToRemove = ( entity: IImage, isText?: boolean, isEntityWidthFull: boolean ) => { const valuesToRemove = []; let scale = entity.image_scale; if (scale[0] === 'x') scale = scale.slice(1); const initialImageWidth = Math.ceil(+entity.image_width / +scale); const initialImageHeight = +entity.file_height_initial; if (initialImageWidth <= 20) { valuesToRemove.push('x0.25'); if (initialImageWidth <= 10) { valuesToRemove.push('x0.5'); } } if (initialImageWidth <= 7 || (!isEntityWidthFull && isText && initialImageWidth > 66)) { valuesToRemove.push('x0.75'); } if (initialImageWidth > 75 && isText) { valuesToRemove.push('x1'); } if ( initialImageWidth > 80 || (initialImageWidth > 60 && isText) || (!isEntityWidthFull && isText && initialImageWidth > 40) || initialImageHeight * 1.25 > 1000 ) { valuesToRemove.push('x1.25'); } if ( initialImageWidth > 66 || (initialImageWidth > 50 && isText) || (!isEntityWidthFull && isText && initialImageWidth > 33) || initialImageHeight * 1.5 > 1000 ) { valuesToRemove.push('x1.5'); } if ( initialImageWidth > 57 || (initialImageWidth > 42 && isText) || (!isEntityWidthFull && isText && initialImageWidth > 28) || initialImageHeight * 1.75 > 1000 ) { valuesToRemove.push('x1.75'); } if ( initialImageWidth > 57 || (initialImageWidth > 42 && isText) || (!isEntityWidthFull && isText && initialImageWidth > 28) || initialImageHeight * 1.75 > 1000 ) { valuesToRemove.push('x1.75'); } if ( initialImageWidth > 50 || (initialImageWidth > 37 && isText) || (!isEntityWidthFull && isText && initialImageWidth > 25) || initialImageHeight * 2 > 1000 ) { valuesToRemove.push('x2'); } return valuesToRemove; }; export const filterImageScaleOptions = ( entityData: IImage, isText: boolean, isEntityWidthFull: boolean ) => { const scalesToRemove = getImageScalesToRemove(entityData, isText, isEntityWidthFull); let initialScales = imageScaleOptions; if (!scalesToRemove.length) return imageScaleOptions; initialScales = initialScales.filter((item) => !~scalesToRemove.indexOf(item.label)); for (let i = 0; i < initialScales.length; i++) { initialScales[i].value = i; } return initialScales; }; export const scaleImage = (entityData: IImage, prevScale: string) => { let scale = entityData.image_scale; if (scale[0] === 'x') scale = scale.slice(1); if (prevScale[0] === 'x') prevScale = prevScale.slice(1); const initialWidth = Math.ceil(+entityData.image_width / +prevScale); entityData.image_width = Math.ceil(initialWidth * +scale); return entityData; };