Refactor node image upload and preview (#2580)

Co-authored-by: huchenlei <huchenlei@proton.me>

src/utils/formatUtil.ts

@@ -1,3 +1,5 @@
+import { ResultItem } from '@/types/apiTypes'
+
 export function formatCamelCase(str: string): string {
   // Check if the string is camel case
   const isCamelCase = /^([A-Z][a-z]*)+$/.test(str)
@@ -213,3 +215,20 @@ export function isValidUrl(url: string): boolean {
     return false
   }
 }
+
+const createAnnotation = (rootFolder = 'input'): string =>
+  rootFolder !== 'input' ? ` [${rootFolder}]` : ''
+
+const createPath = (filename: string, subfolder = ''): string =>
+  subfolder ? `${subfolder}/${filename}` : filename
+
+/** Creates annotated filepath in format used by folder_paths.py */
+export function createAnnotatedPath(
+  item: string | ResultItem,
+  options: { rootFolder?: string; subfolder?: string } = {}
+): string {
+  const { rootFolder = 'input', subfolder } = options
+  if (typeof item === 'string')
+    return `${createPath(item, subfolder)}${createAnnotation(rootFolder)}`
+  return `${createPath(item.filename ?? '', item.subfolder)}${createAnnotation(item.type)}`
+}

src/utils/imageUtil.ts

@@ -0,0 +1,12 @@
+export const is_all_same_aspect_ratio = (imgs: HTMLImageElement[]): boolean => {
+  if (!imgs.length || imgs.length === 1) return true
+
+  const ratio = imgs[0].naturalWidth / imgs[0].naturalHeight
+
+  for (let i = 1; i < imgs.length; i++) {
+    const this_ratio = imgs[i].naturalWidth / imgs[i].naturalHeight
+    if (ratio != this_ratio) return false
+  }
+
+  return true
+}