Skip to content

Commit b62ce76

Browse files
committed
refactor: Cleanup file handling logic, part 1
1 parent b31926b commit b62ce76

File tree

3 files changed

+88
-81
lines changed

3 files changed

+88
-81
lines changed

src/scripts/app.ts

Lines changed: 79 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -1370,13 +1370,7 @@ export class ComfyApp {
13701370
* @param {File} file
13711371
*/
13721372
async handleFile(file: File) {
1373-
const removeExt = (f: string) => {
1374-
if (!f) return f
1375-
const p = f.lastIndexOf('.')
1376-
if (p === -1) return f
1377-
return f.substring(0, p)
1378-
}
1379-
const fileName = removeExt(file.name)
1373+
const fileName = file.name.replace(/\.\w+$/, '') // Strip file extension
13801374
if (file.type === 'image/png') {
13811375
const pngInfo = await getPngMetadata(file)
13821376
if (pngInfo?.workflow) {
@@ -1386,9 +1380,13 @@ export class ComfyApp {
13861380
true,
13871381
fileName
13881382
)
1389-
} else if (pngInfo?.prompt) {
1383+
return
1384+
}
1385+
if (pngInfo?.prompt) {
13901386
this.loadApiJson(JSON.parse(pngInfo.prompt), fileName)
1391-
} else if (pngInfo?.parameters) {
1387+
return
1388+
}
1389+
if (pngInfo?.parameters) {
13921390
// Note: Not putting this in `importA1111` as it is mostly not used
13931391
// by external callers, and `importA1111` has no access to `app`.
13941392
useWorkflowService().beforeLoadNewGraph()
@@ -1397,72 +1395,84 @@ export class ComfyApp {
13971395
fileName,
13981396
this.graph.serialize() as unknown as ComfyWorkflowJSON
13991397
)
1400-
} else {
1401-
this.showErrorOnFileLoad(file)
1398+
return
14021399
}
1403-
} else if (file.type === 'image/avif') {
1400+
}
1401+
if (file.type === 'image/avif') {
14041402
const { workflow, prompt } = await getAvifMetadata(file)
14051403

14061404
if (workflow) {
14071405
this.loadGraphData(JSON.parse(workflow), true, true, fileName)
1408-
} else if (prompt) {
1406+
return
1407+
}
1408+
if (prompt) {
14091409
this.loadApiJson(JSON.parse(prompt), fileName)
1410-
} else {
1411-
this.showErrorOnFileLoad(file)
1410+
return
14121411
}
1413-
} else if (file.type === 'image/webp') {
1412+
}
1413+
if (file.type === 'image/webp') {
14141414
const pngInfo = await getWebpMetadata(file)
14151415
// Support loading workflows from that webp custom node.
14161416
const workflow = pngInfo?.workflow || pngInfo?.Workflow
14171417
const prompt = pngInfo?.prompt || pngInfo?.Prompt
14181418

14191419
if (workflow) {
14201420
this.loadGraphData(JSON.parse(workflow), true, true, fileName)
1421-
} else if (prompt) {
1421+
return
1422+
}
1423+
if (prompt) {
14221424
this.loadApiJson(JSON.parse(prompt), fileName)
1423-
} else {
1424-
this.showErrorOnFileLoad(file)
1425+
return
14251426
}
1426-
} else if (file.type === 'audio/mpeg') {
1427+
}
1428+
if (file.type === 'audio/mpeg') {
14271429
const { workflow, prompt } = await getMp3Metadata(file)
14281430
if (workflow) {
14291431
this.loadGraphData(workflow, true, true, fileName)
1430-
} else if (prompt) {
1432+
return
1433+
}
1434+
if (prompt) {
14311435
this.loadApiJson(prompt, fileName)
1432-
} else {
1433-
this.showErrorOnFileLoad(file)
1436+
return
14341437
}
1435-
} else if (file.type === 'audio/ogg') {
1438+
}
1439+
if (file.type === 'audio/ogg') {
14361440
const { workflow, prompt } = await getOggMetadata(file)
14371441
if (workflow) {
14381442
this.loadGraphData(workflow, true, true, fileName)
1439-
} else if (prompt) {
1443+
return
1444+
}
1445+
if (prompt) {
14401446
this.loadApiJson(prompt, fileName)
1441-
} else {
1442-
this.showErrorOnFileLoad(file)
1447+
return
14431448
}
1444-
} else if (file.type === 'audio/flac' || file.type === 'audio/x-flac') {
1449+
}
1450+
if (file.type === 'audio/flac' || file.type === 'audio/x-flac') {
14451451
const pngInfo = await getFlacMetadata(file)
14461452
const workflow = pngInfo?.workflow || pngInfo?.Workflow
14471453
const prompt = pngInfo?.prompt || pngInfo?.Prompt
14481454

14491455
if (workflow) {
14501456
this.loadGraphData(JSON.parse(workflow), true, true, fileName)
1451-
} else if (prompt) {
1457+
return
1458+
}
1459+
if (prompt) {
14521460
this.loadApiJson(JSON.parse(prompt), fileName)
1453-
} else {
1454-
this.showErrorOnFileLoad(file)
1461+
return
14551462
}
1456-
} else if (file.type === 'video/webm') {
1463+
}
1464+
if (file.type === 'video/webm') {
14571465
const webmInfo = await getFromWebmFile(file)
14581466
if (webmInfo.workflow) {
14591467
this.loadGraphData(webmInfo.workflow, true, true, fileName)
1460-
} else if (webmInfo.prompt) {
1468+
return
1469+
}
1470+
if (webmInfo.prompt) {
14611471
this.loadApiJson(webmInfo.prompt, fileName)
1462-
} else {
1463-
this.showErrorOnFileLoad(file)
1472+
return
14641473
}
1465-
} else if (
1474+
}
1475+
if (
14661476
file.type === 'video/mp4' ||
14671477
file.name?.endsWith('.mp4') ||
14681478
file.name?.endsWith('.mov') ||
@@ -1473,77 +1483,72 @@ export class ComfyApp {
14731483
const mp4Info = await getFromIsobmffFile(file)
14741484
if (mp4Info.workflow) {
14751485
this.loadGraphData(mp4Info.workflow, true, true, fileName)
1476-
} else if (mp4Info.prompt) {
1486+
return
1487+
}
1488+
if (mp4Info.prompt) {
14771489
this.loadApiJson(mp4Info.prompt, fileName)
1490+
return
14781491
}
1479-
} else if (file.type === 'image/svg+xml' || file.name?.endsWith('.svg')) {
1492+
}
1493+
if (file.type === 'image/svg+xml' || file.name?.endsWith('.svg')) {
14801494
const svgInfo = await getSvgMetadata(file)
14811495
if (svgInfo.workflow) {
14821496
this.loadGraphData(svgInfo.workflow, true, true, fileName)
1483-
} else if (svgInfo.prompt) {
1497+
return
1498+
}
1499+
if (svgInfo.prompt) {
14841500
this.loadApiJson(svgInfo.prompt, fileName)
1485-
} else {
1486-
this.showErrorOnFileLoad(file)
1501+
return
14871502
}
1488-
} else if (
1489-
file.type === 'model/gltf-binary' ||
1490-
file.name?.endsWith('.glb')
1491-
) {
1503+
}
1504+
if (file.type === 'model/gltf-binary' || file.name?.endsWith('.glb')) {
14921505
const gltfInfo = await getGltfBinaryMetadata(file)
14931506
if (gltfInfo.workflow) {
14941507
this.loadGraphData(gltfInfo.workflow, true, true, fileName)
1495-
} else if (gltfInfo.prompt) {
1508+
return
1509+
}
1510+
if (gltfInfo.prompt) {
14961511
this.loadApiJson(gltfInfo.prompt, fileName)
1497-
} else {
1498-
this.showErrorOnFileLoad(file)
1512+
return
14991513
}
1500-
} else if (
1501-
file.type === 'application/json' ||
1502-
file.name?.endsWith('.json')
1503-
) {
1514+
}
1515+
if (file.type === 'application/json' || file.name?.endsWith('.json')) {
15041516
const reader = new FileReader()
15051517
reader.onload = async () => {
15061518
const readerResult = reader.result as string
15071519
const jsonContent = JSON.parse(readerResult)
15081520
if (jsonContent?.templates) {
15091521
this.loadTemplateData(jsonContent)
1510-
} else if (this.isApiJson(jsonContent)) {
1522+
return
1523+
}
1524+
if (this.isApiJson(jsonContent)) {
15111525
this.loadApiJson(jsonContent, fileName)
1512-
} else {
1513-
await this.loadGraphData(
1514-
JSON.parse(readerResult),
1515-
true,
1516-
true,
1517-
fileName
1518-
)
1526+
return
15191527
}
1528+
await this.loadGraphData(JSON.parse(readerResult), true, true, fileName)
15201529
}
15211530
reader.readAsText(file)
1522-
} else if (
1523-
file.name?.endsWith('.latent') ||
1524-
file.name?.endsWith('.safetensors')
1525-
) {
1531+
return
1532+
}
1533+
if (file.name?.endsWith('.latent') || file.name?.endsWith('.safetensors')) {
15261534
const info = await getLatentMetadata(file)
15271535
// TODO define schema to LatentMetadata
1528-
// @ts-expect-error
15291536
if (info.workflow) {
15301537
await this.loadGraphData(
1531-
// @ts-expect-error
15321538
JSON.parse(info.workflow),
15331539
true,
15341540
true,
15351541
fileName
15361542
)
1537-
// @ts-expect-error
1538-
} else if (info.prompt) {
1539-
// @ts-expect-error
1540-
this.loadApiJson(JSON.parse(info.prompt))
1541-
} else {
1542-
this.showErrorOnFileLoad(file)
1543+
return
1544+
}
1545+
if (info.prompt) {
1546+
this.loadApiJson(JSON.parse(info.prompt), fileName)
1547+
return
15431548
}
1544-
} else {
1545-
this.showErrorOnFileLoad(file)
15461549
}
1550+
1551+
this.showErrorOnFileLoad(file)
15471552
}
15481553

15491554
isApiJson(data: unknown) {

src/scripts/pnginfo.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -138,13 +138,13 @@ export function getWebpMetadata(file) {
138138
})
139139
}
140140

141-
// @ts-expect-error fixme ts strict error
142-
export function getLatentMetadata(file) {
141+
export function getLatentMetadata(file: File): Promise<Record<string, string>> {
143142
return new Promise((r) => {
144143
const reader = new FileReader()
145144
reader.onload = (event) => {
146-
// @ts-expect-error fixme ts strict error
147-
const safetensorsData = new Uint8Array(event.target.result as ArrayBuffer)
145+
const safetensorsData = new Uint8Array(
146+
event.target?.result as ArrayBuffer
147+
)
148148
const dataView = new DataView(safetensorsData.buffer)
149149
let header_size = dataView.getUint32(0, true)
150150
let offset = 8

src/scripts/ui.ts

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -391,9 +391,11 @@ export class ComfyUI {
391391
style: { display: 'none' },
392392
parent: document.body,
393393
onchange: async () => {
394-
// @ts-expect-error fixme ts strict error
395-
await app.handleFile(fileInput.files[0])
396-
fileInput.value = ''
394+
const file = fileInput.files?.[0]
395+
if (file) {
396+
await app.handleFile(file)
397+
fileInput.value = ''
398+
}
397399
}
398400
})
399401

0 commit comments

Comments
 (0)