kamp/IOPaint
1
0
Fork 0
Code Issues Pull Requests Releases 1 Activity

update file manager

Browse Source
This commit is contained in:
Qing 2023-01-01 22:36:11 +08:00
parent 39397fc829
commit 2e8e52f7a5
7 changed files with 79 additions and 112 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
lama_cleaner/app/src/App.tsx
View File

@ -5,11 +5,20 @@ import useInputImage from './hooks/useInputImage'
import LandingPage from './components/LandingPage/LandingPage'
import { themeState } from './components/Header/ThemeChanger'
import Workspace from './components/Workspace'
import { fileState, isDisableModelSwitchState, toastState } from './store/Atoms'
import {
enableFileManagerState,
fileState,
isDisableModelSwitchState,
toastState,
} from './store/Atoms'
import { keepGUIAlive } from './utils'
import Header from './components/Header/Header'
import useHotKey from './hooks/useHotkey'
import { getIsDisableModelSwitch, isDesktop } from './adapters/inpainting'
import {
getEnableFileManager,
getIsDisableModelSwitch,
isDesktop,
} from './adapters/inpainting'
const SUPPORTED_FILE_TYPE = [
'image/jpeg',
@ -27,6 +36,9 @@ function App() {
const [isDisableModelSwitch, setIsDisableModelSwitch] = useRecoilState(
isDisableModelSwitchState
)
const [enableFileManager, setEnableFileManager] = useRecoilState(
enableFileManagerState
)
// Set Input Image
useEffect(() => {
@ -53,6 +65,12 @@ function App() {
}
fetchData()
const fetchData2 = async () => {
const isEnabled = await getEnableFileManager().then(res => res.text())
setEnableFileManager(isEnabled === 'true')
}
fetchData2()
}, [])
// Dark Mode Hotkey

25
lama_cleaner/app/src/adapters/inpainting.ts
View File

@ -110,6 +110,12 @@ export function getIsDisableModelSwitch() {
})
}
export function getEnableFileManager() {
return fetch(`${API_ENDPOINT}/is_enable_file_manager`, {
method: 'GET',
})
}
export function switchModel(name: string) {
const fd = new FormData()
fd.append('name', name)
@ -166,9 +172,12 @@ export async function postInteractiveSeg(
}
export async function getMediaFile(filename: string) {
const res = await fetch(`${API_ENDPOINT}/media/${filename}`, {
const res = await fetch(
`${API_ENDPOINT}/media/${encodeURIComponent(filename)}`,
{
method: 'GET',
})
}
)
if (res.ok) {
const blob = await res.blob()
const file = new File([blob], filename)
@ -177,3 +186,15 @@ export async function getMediaFile(filename: string) {
const errMsg = await res.text()
throw new Error(errMsg)
}
export async function getMedias() {
const res = await fetch(`${API_ENDPOINT}/medias`, {
method: 'GET',
})
if (res.ok) {
const filenames = await res.json()
return filenames
}
const errMsg = await res.text()
throw new Error(errMsg)
}

23
lama_cleaner/app/src/components/FileManager/FileManager.tsx
View File

@ -4,12 +4,13 @@ import React, {
useMemo,
useState,
useCallback,
useRef,
} from 'react'
import { useRecoilState, useRecoilValue } from 'recoil'
import PhotoAlbum, { RenderPhoto } from 'react-photo-album'
import * as ScrollArea from '@radix-ui/react-scroll-area'
import Modal from '../shared/Modal'
import Button from '../shared/Button'
import { toastState } from '../../store/Atoms'
import { getMedias } from '../../adapters/inpainting'
interface Photo {
src: string
@ -54,6 +55,7 @@ export default function FileManager(props: Props) {
const [filenames, setFileNames] = useState<Filename[]>([])
const [scrollTop, setScrollTop] = useState(0)
const [closeScrollTop, setCloseScrollTop] = useState(0)
const [toastVal, setToastState] = useRecoilState(toastState)
useEffect(() => {
if (!show) {
@ -81,15 +83,22 @@ export default function FileManager(props: Props) {
useEffect(() => {
const fetchData = async () => {
const res = await fetch('/medias')
if (res.ok) {
const newFilenames = await res.json()
try {
const newFilenames = await getMedias()
setFileNames(newFilenames)
} catch (e: any) {
setToastState({
open: true,
desc: e.message ? e.message : e.toString(),
state: 'error',
duration: 2000,
})
}
}
if (show) {
fetchData()
}, [])
}
}, [show])
const onScroll = (event: SyntheticEvent) => {
setScrollTop(event.currentTarget.scrollTop)

4
lama_cleaner/app/src/components/Settings/Settings.scss
View File

@ -17,10 +17,6 @@
margin-top: -11rem;
animation: slideDown 0.2s ease-out;
}
.modal-header {
padding-left: 8px;
}
}
/* reset */

86
lama_cleaner/app/src/components/Settings/SettingsModal.tsx
View File

@ -62,92 +62,10 @@ export default function SettingModal(props: SettingModalProps) {
className="modal-setting"
show={setting.show}
>
<Tabs.Root
className="TabsRoot"
defaultValue="tab1"
orientation="vertical"
>
<Tabs.List className="TabsList">
<Tabs.Trigger className="TabsTrigger" value="tab1">
Model
</Tabs.Trigger>
<Tabs.Trigger className="TabsTrigger" value="tab2">
File
</Tabs.Trigger>
</Tabs.List>
<Tabs.Content className="TabsContent" value="tab1">
{isSD || isPaintByExample ? (
<></>
) : (
<ManualRunInpaintingSettingBlock />
)}
<DownloadMaskSettingBlock />
{isSD || isPaintByExample ? <></> : <ManualRunInpaintingSettingBlock />}
<ModelSettingBlock />
{isSD ? <></> : <HDSettingBlock />}
</Tabs.Content>
<Tabs.Content className="TabsContent" value="tab2">
<DownloadMaskSettingBlock />
<SettingBlock
title="File Manager"
desc="Toggle File Manager"
input={
<Switch
checked={setting.enableFileManager}
onCheckedChange={checked => {
setSettingState(old => {
return { ...old, enableFileManager: checked }
})
}}
>
<SwitchThumb />
</Switch>
}
optionDesc={
<div
style={{
display: 'flex',
flexDirection: 'column',
gap: 16,
}}
>
<div className="folder-path-block">
<span>Image directory</span>
<TextInput
disabled={!setting.enableFileManager}
value={setting.imageDirectory}
placeholder="Image directory"
className="folder-path"
onInput={(evt: FormEvent<HTMLInputElement>) => {
evt.preventDefault()
evt.stopPropagation()
const target = evt.target as HTMLInputElement
setSettingState(old => {
return { ...old, imageDirectory: target.value }
})
}}
/>
</div>
<div className="folder-path-block">
<span>Output directory</span>
<TextInput
disabled={!setting.enableFileManager}
value={setting.outputDirectory}
placeholder="Output directory"
className="folder-path"
onInput={(evt: FormEvent<HTMLInputElement>) => {
evt.preventDefault()
evt.stopPropagation()
const target = evt.target as HTMLInputElement
setSettingState(old => {
return { ...old, outputDirectory: target.value }
})
}}
/>
</div>
</div>
}
/>
</Tabs.Content>
</Tabs.Root>
</Modal>
)
}

14
lama_cleaner/app/src/store/Atoms.tsx
View File

@ -42,6 +42,7 @@ interface AppState {
isInteractiveSegRunning: boolean
interactiveSegClicks: number[][]
showFileManager: boolean
enableFileManager: boolean
}
export const appState = atom<AppState>({
@ -55,6 +56,7 @@ export const appState = atom<AppState>({
isInteractiveSegRunning: false,
interactiveSegClicks: [],
showFileManager: false,
enableFileManager: false,
},
})
@ -95,12 +97,12 @@ export const showFileManagerState = selector({
export const enableFileManagerState = selector({
key: 'enableFileManagerState',
get: ({ get }) => {
const app = get(settingState)
const app = get(appState)
return app.enableFileManager
},
set: ({ get, set }, newValue: any) => {
const app = get(settingState)
set(settingState, { ...app, enableFileManager: newValue })
const app = get(appState)
set(appState, { ...app, enableFileManager: newValue })
},
})
@ -257,9 +259,6 @@ export interface Settings {
show: boolean
showCroper: boolean
downloadMask: boolean
enableFileManager: boolean
imageDirectory: string
outputDirectory: string
graduallyInpainting: boolean
runInpaintingManually: boolean
model: AIModel
@ -388,9 +387,6 @@ export enum SDMode {
export const settingStateDefault: Settings = {
show: false,
showCroper: false,
enableFileManager: false,
imageDirectory: '',
outputDirectory: '',
downloadMask: false,
graduallyInpainting: true,
runInpaintingManually: false,

9
lama_cleaner/server.py
View File

@ -80,6 +80,7 @@ interactive_seg_model: InteractiveSeg = None
device = None
input_image_path: str = None
is_disable_model_switch: bool = False
is_enable_file_manager: bool = False
is_desktop: bool = False
@ -273,6 +274,12 @@ def get_is_disable_model_switch():
return res, 200
@app.route("/is_enable_file_manager")
def get_is_enable_file_manager():
res = 'true' if is_enable_file_manager else 'false'
return res, 200
@app.route("/model_downloaded/<name>")
def model_downloaded(name):
return str(model.is_downloaded(name)), 200
@ -325,6 +332,7 @@ def main(args):
global device
global input_image_path
global is_disable_model_switch
global is_enable_file_manager
global is_desktop
device = torch.device(args.device)
@ -336,6 +344,7 @@ def main(args):
if os.path.isdir(args.input):
app.config["THUMBNAIL_MEDIA_ROOT"] = args.input
app.config["THUMBNAIL_MEDIA_THUMBNAIL_ROOT"] = os.path.join(args.output_dir, 'thumbnails')
is_enable_file_manager = True
else:
input_image_path = args.input