File size: 3,964 Bytes
932a7fd 241036e 932a7fd cb3fdda dbc8f44 932a7fd cb3fdda 932a7fd 241036e cb3fdda 8c5d17c dbc8f44 f4dea7d 932a7fd cb3fdda 241036e 8c5d17c dbc8f44 f4dea7d 932a7fd dbc8f44 932a7fd 11443d4 932a7fd cb3fdda 932a7fd 241036e cb3fdda 974ed41 dbc8f44 f4dea7d 932a7fd 241036e cb3fdda 241036e cb3fdda 241036e cb3fdda 241036e 932a7fd 241036e cb3fdda 8c5d17c dbc8f44 f4dea7d 932a7fd dbc8f44 932a7fd |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 |
"use client"
import { create } from "zustand"
import { FontName } from "@/lib/fonts"
import { Preset, getPreset } from "@/app/engine/presets"
import { LayoutName, getRandomLayoutNames } from "../layouts"
import html2canvas from "html2canvas"
export const useStore = create<{
prompt: string
font: FontName
preset: Preset
nbFrames: number
panels: string[]
captions: Record<string, string>
layouts: LayoutName[]
zoomLevel: number
page: HTMLDivElement
isGeneratingStory: boolean
panelGenerationStatus: Record<number, boolean>
isGeneratingText: boolean
atLeastOnePanelIsBusy: boolean
setPrompt: (prompt: string) => void
setFont: (font: FontName) => void
setPreset: (preset: Preset) => void
setPanels: (panels: string[]) => void
setLayouts: (layouts: LayoutName[]) => void
setCaption: (panelId: number, caption: string) => void
setZoomLevel: (zoomLevel: number) => void
setPage: (page: HTMLDivElement) => void
setGeneratingStory: (isGeneratingStory: boolean) => void
setGeneratingImages: (panelId: number, value: boolean) => void
setGeneratingText: (isGeneratingText: boolean) => void
download: () => void
}>((set, get) => ({
prompt: "",
font: "actionman",
preset: getPreset("japanese_manga"),
nbFrames: 1,
panels: [],
captions: {},
layouts: getRandomLayoutNames(),
zoomLevel: 60,
page: undefined as unknown as HTMLDivElement,
isGeneratingStory: false,
panelGenerationStatus: {},
isGeneratingText: false,
atLeastOnePanelIsBusy: false,
setPrompt: (prompt: string) => {
const existingPrompt = get().prompt
if (prompt === existingPrompt) { return }
set({
prompt,
layouts: getRandomLayoutNames(),
panels: [],
captions: {},
})
},
setFont: (font: FontName) => {
const existingFont = get().font
if (font === existingFont) { return }
set({
font,
layouts: getRandomLayoutNames(),
panels: [],
captions: {}
})
},
setPreset: (preset: Preset) => {
const existingPreset = get().preset
if (preset.label === existingPreset.label) { return }
set({
preset,
layouts: getRandomLayoutNames(),
panels: [],
captions: {}
})
},
setNbFrames: (nbFrames: number) => {
const existingNbFrames = get().nbFrames
if (nbFrames === existingNbFrames) { return }
set({
nbFrames,
layouts: getRandomLayoutNames(),
panels: [],
captions: {}
})
},
setPanels: (panels: string[]) => set({ panels }),
setCaption: (panelId: number, caption: string) => {
set({
captions: {
...get().captions,
[panelId]: caption
}
})
},
setLayouts: (layouts: LayoutName[]) => set({ layouts }),
setZoomLevel: (zoomLevel: number) => set({ zoomLevel }),
setPage: (page: HTMLDivElement) => {
if (!page) { return }
set({ page })
},
setGeneratingStory: (isGeneratingStory: boolean) => set({ isGeneratingStory }),
setGeneratingImages: (panelId: number, value: boolean) => {
const panelGenerationStatus: Record<number, boolean> = {
...get().panelGenerationStatus,
[panelId]: value
}
const atLeastOnePanelIsBusy = Object.values(panelGenerationStatus).includes(true)
set({
panelGenerationStatus,
atLeastOnePanelIsBusy
})
},
setGeneratingText: (isGeneratingText: boolean) => set({ isGeneratingText }),
download: async () => {
console.log("download called!")
const { page } = get()
console.log("page:", page)
if (!page) { return }
const canvas = await html2canvas(page)
console.log("canvas:", canvas)
const data = canvas.toDataURL('image/jpg')
const link = document.createElement('a')
if (typeof link.download === 'string') {
link.href = data
link.download = 'comic.jpg'
document.body.appendChild(link)
link.click()
document.body.removeChild(link)
} else {
window.open(data)
}
}
}))
|