extern/easydiffusion
1
0
Fork 1
mirror of https://github.com/easydiffusion/easydiffusion.git synced 2025-02-26 15:21:54 +01:00
Code Issues Packages Projects Releases Wiki Activity

updated nav and removed ts comments

Browse Source
This commit is contained in:
caranicas 2022-09-28 12:19:44 -04:00
parent 2c52c8efb7
commit b560d2953f
31 changed files with 136 additions and 216 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
ui/frontend/build_src/src/App.tsx
View File

@ -2,8 +2,7 @@ import React, { useState } from "react";
import { ReactLocation, Router } from "@tanstack/react-location";
import Home from "./pages/Home";
import Settings from "./pages/Settings";
// @ts-expect-error
import { darkTheme, lightTheme } from "./styles/theme/index.css.ts";
import { darkTheme, lightTheme } from "./styles/theme/index.css";
import "./Translation/config";
const location = new ReactLocation();

3
ui/frontend/build_src/src/components/atoms/modifierTag/index.tsx
View File

@ -9,8 +9,7 @@ import { API_URL } from "../../../api";
import {
ModifierTagMain,
tagPreview
// @ts-expect-error
} from "./modifierTags.css.ts";
} from "./modifierTags.css";
interface ModifierTagProps {
name: string;

110
ui/frontend/build_src/src/components/molecules/drawImage/index.tsx
View File

@ -1,15 +1,14 @@
// @ts-nocheck
import React, { useRef, useState, useEffect } from "react";
import {
DrawImageMain, // @ts-expect-error
} from "./drawImage.css.ts";
DrawImageMain,
} from "./drawImage.css";
// https://github.com/embiem/react-canvas-draw
interface DrawImageProps {
imageData: string;
brushSize: string;
brushSize: number;
brushShape: string;
brushColor: string;
@ -46,16 +45,19 @@ export default function DrawImage({
// drawn pixels to the new color
if (drawingRef.current != null) {
const ctx = drawingRef.current.getContext("2d");
const imageData = ctx.getImageData(0, 0, canvasWidth, canvasHeight);
const data = imageData.data;
for (let i = 0; i < data.length; i += 4) {
if (data[i + 3] > 0) {
data[i] = parseInt(brushColor, 16);
data[i + 1] = parseInt(brushColor, 16);
data[i + 2] = parseInt(brushColor, 16);
if (ctx != null) {
const imageData = ctx.getImageData(0, 0, canvasWidth, canvasHeight);
const data = imageData.data;
for (let i = 0; i < data.length; i += 4) {
if (data[i + 3] > 0) {
data[i] = parseInt(brushColor, 16);
data[i + 1] = parseInt(brushColor, 16);
data[i + 2] = parseInt(brushColor, 16);
}
}
ctx.putImageData(imageData, 0, 0);
}
ctx.putImageData(imageData, 0, 0);
}
}, [brushColor]);
@ -80,23 +82,25 @@ export default function DrawImage({
}
};
const _drawCanvas = (x, y, brushSize, brushShape, brushColor) => {
const _drawCanvas = (x: number, y: number, brushSize: number, brushShape: string, brushColor: string | CanvasGradient | CanvasPattern) => {
const canvas = drawingRef.current;
if (canvas != null) {
const ctx = canvas.getContext("2d");
if (isErasing) {
// stack overflow https://stackoverflow.com/questions/10396991/clearing-circular-regions-from-html5-canvas
const offset = brushSize / 2;
ctx.clearRect(x - offset, y - offset, brushSize, brushSize);
} else {
ctx.beginPath();
ctx.lineWidth = brushSize;
ctx.lineCap = brushShape;
ctx.strokeStyle = brushColor;
ctx.moveTo(x, y);
ctx.lineTo(x, y);
ctx.stroke();
if (ctx != null) {
if (isErasing) {
// stack overflow https://stackoverflow.com/questions/10396991/clearing-circular-regions-from-html5-canvas
const offset = brushSize / 2;
ctx.clearRect(x - offset, y - offset, brushSize, brushSize);
} else {
ctx.beginPath();
ctx.lineWidth = brushSize;
// @ts-expect-error
ctx.lineCap = brushShape;
ctx.strokeStyle = brushColor;
ctx.moveTo(x, y);
ctx.lineTo(x, y);
ctx.stroke();
}
}
}
};
@ -111,29 +115,35 @@ export default function DrawImage({
const canvas = cursorRef.current;
if (canvas != null) {
const ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.clearRect(0, 0, canvas.width, canvas.height);
if (ctx != null) {
ctx.beginPath();
ctx.clearRect(0, 0, canvas.width, canvas.height);
if (isErasing) {
const offset = brushSize / 2;
// draw a quare
ctx.lineWidth = 2;
ctx.lineCap = "butt";
ctx.strokeStyle = brushColor;
ctx.moveTo(x - offset, y - offset);
ctx.lineTo(x + offset, y - offset);
ctx.lineTo(x + offset, y + offset);
ctx.lineTo(x - offset, y + offset);
ctx.lineTo(x - offset, y - offset);
ctx.stroke();
} else {
ctx.lineWidth = brushSize;
ctx.lineCap = brushShape;
ctx.strokeStyle = brushColor;
ctx.moveTo(x, y);
ctx.lineTo(x, y);
ctx.stroke();
if (isErasing) {
const offset = brushSize / 2;
// draw a quare
ctx.lineWidth = 2;
ctx.lineCap = "butt";
ctx.strokeStyle = brushColor;
ctx.moveTo(x - offset, y - offset);
ctx.lineTo(x + offset, y - offset);
ctx.lineTo(x + offset, y + offset);
ctx.lineTo(x - offset, y + offset);
ctx.lineTo(x - offset, y - offset);
ctx.stroke();
} else {
ctx.lineWidth = brushSize;
// @ts-expect-error
ctx.lineCap = brushShape;
ctx.strokeStyle = brushColor;
ctx.moveTo(x, y);
ctx.lineTo(x, y);
ctx.stroke();
}
}
}
};
@ -156,8 +166,10 @@ export default function DrawImage({
const canvas = drawingRef.current;
if (canvas != null) {
const ctx = canvas.getContext("2d");
ctx.fillStyle = brushColor;
ctx.fillRect(0, 0, canvas.width, canvas.height);
if (ctx != null) {
ctx.fillStyle = brushColor;
ctx.fillRect(0, 0, canvas.width, canvas.height);
}
}
};

4
ui/frontend/build_src/src/components/molecules/generatedImage/index.tsx
View File

@ -4,8 +4,8 @@ import { ImageRequest } from "../../../stores/imageCreateStore";
import {
generatedImageMain,
image, // @ts-expect-error
} from "./generatedImage.css.ts";
image,
} from "./generatedImage.css";
interface GeneretaedImageProps {
imageData: string | undefined;

3
ui/frontend/build_src/src/components/organisms/creationPanel/advancedSettings/advancedsettings.css.ts
View File

@ -1,7 +1,6 @@
import { style, globalStyle } from "@vanilla-extract/css";
// @ts-expect-error
import { vars } from "../../../../styles/theme/index.css.ts";
import { vars } from "../../../../styles/theme/index.css";
// import { PanelBox } from "../../../../styles/shared.css.ts";

74
ui/frontend/build_src/src/components/organisms/creationPanel/advancedSettings/gpuSettings/index.tsx
View File

@ -1,74 +0,0 @@
import React from "react";
import { useImageCreate } from "../../../../../stores/imageCreateStore";
import { useCreateUI } from "../../creationPanelUIStore";
import {
SettingItem, // @ts-expect-error
} from "../../../../../styles/shared.css.ts";
import {
MenuButton, // @ts-expect-error
} from "../advancedsettings.css.ts";
import { useTranslation } from "react-i18next";
export default function GpuSettings() {
const { t } = useTranslation();
const turbo = useImageCreate((state) => state.getValueForRequestKey("turbo"));
const useCpu = useImageCreate((state) =>
state.getValueForRequestKey("use_cpu")
);
const useFullPrecision = useImageCreate((state) =>
state.getValueForRequestKey("use_full_precision")
);
const setRequestOption = useImageCreate((state) => state.setRequestOptions);
const gpuOpen = useCreateUI((state) => state.isOpenAdvGPUSettings);
const toggleGpuOpen = useCreateUI((state) => state.toggleAdvGPUSettings);
return (
<div>
<button type="button" className={MenuButton} onClick={toggleGpuOpen}>
<h4>GPU Settings</h4>
</button>
{gpuOpen && (
<>
<div className={SettingItem}>
<label>
<input
checked={turbo}
onChange={(e) => setRequestOption("turbo", e.target.checked)}
type="checkbox"
/>
{t("advanced-settings.turbo")} {t("advanced-settings.turbo-disc")}
</label>
</div>
<div className={SettingItem}>
<label>
<input
type="checkbox"
checked={useCpu}
onChange={(e) => setRequestOption("use_cpu", e.target.checked)}
/>
{t("advanced-settings.cpu")} {t("advanced-settings.cpu-disc")}
</label>
</div>
<div className={SettingItem}>
<label>
<input
checked={useFullPrecision}
onChange={(e) =>
setRequestOption("use_full_precision", e.target.checked)
}
type="checkbox"
/>
{t("advanced-settings.gpu")} {t("advanced-settings.gpu-disc")}
</label>
</div>
</>
)}
</div>
);
}

8
ui/frontend/build_src/src/components/organisms/creationPanel/advancedSettings/improvementSettings/index.tsx
View File

@ -4,11 +4,11 @@ import { useImageCreate } from "../../../../../stores/imageCreateStore";
import { useCreateUI } from "../../creationPanelUIStore";
import {
SettingItem, // @ts-expect-error
} from "../../../../../styles/shared.css.ts";
SettingItem,
} from "../../../../../styles/shared.css";
import {
MenuButton, // @ts-expect-error
} from "../advancedsettings.css.ts";
MenuButton,
} from "../advancedsettings.css";
import { useTranslation } from "react-i18next";

17
ui/frontend/build_src/src/components/organisms/creationPanel/advancedSettings/index.tsx
View File

@ -1,20 +1,16 @@
import React, { useEffect } from "react";
import { useCreateUI } from "../creationPanelUIStore";
// @ts-expect-error
import { PanelBox } from "../../../../styles/shared.css.ts";
import { PanelBox } from "../../../../styles/shared.css";
import {
AdvancedSettingsList,
AdvancedSettingGrouping, // @ts-expect-error
} from "./advancedsettings.css.ts";
AdvancedSettingGrouping,
} from "./advancedsettings.css";
import ImprovementSettings from "./improvementSettings";
import PropertySettings from "./propertySettings";
import WorkflowSettings from "./workflowSettings";
// import GpuSettings from "./gpuSettings";
// import BetaMode from "../../../molecules/betaMode";
function SettingsList() {
return (
@ -28,13 +24,6 @@ function SettingsList() {
<li className={AdvancedSettingGrouping}>
<WorkflowSettings />
</li>
{/* <li className={AdvancedSettingGrouping}>
<GpuSettings />
</li> */}
{/* <li className={AdvancedSettingGrouping}>
<BetaMode />
</li> */}
</ul>
);
}

8
ui/frontend/build_src/src/components/organisms/creationPanel/advancedSettings/propertySettings/index.tsx
View File

@ -3,12 +3,12 @@ import { useImageCreate, SAMPLER_OPTIONS } from "../../../../../stores/imageCrea
import { useCreateUI } from "../../creationPanelUIStore";
import {
SettingItem, // @ts-expect-error
} from "../../../../../styles/shared.css.ts";
SettingItem,
} from "../../../../../styles/shared.css";
import {
MenuButton, // @ts-expect-error
} from "../advancedsettings.css.ts";
MenuButton,
} from "../advancedsettings.css";
import { useTranslation } from "react-i18next";

4
ui/frontend/build_src/src/components/organisms/creationPanel/advancedSettings/workflowSettings/index.tsx
View File

@ -8,8 +8,8 @@ import {
} from "../../../../../styles/shared.css";
import {
MenuButton, // @ts-expect-error
} from "../advancedsettings.css.ts";
MenuButton,
} from "../advancedsettings.css";
import { useTranslation } from "react-i18next";

4
ui/frontend/build_src/src/components/organisms/creationPanel/basicCreation/index.tsx
View File

@ -3,8 +3,8 @@ import { useImageCreate } from "../../../../stores/imageCreateStore";
import {
CreationBasicMain,
PromptDisplay, // @ts-expect-error
} from "./basicCreation.css.ts";
PromptDisplay,
} from "./basicCreation.css";
import SeedImage from "./seedImage";
import ActiveTags from "./activeTags";

4
ui/frontend/build_src/src/components/organisms/creationPanel/basicCreation/makeButton/index.tsx
View File

@ -15,8 +15,8 @@ import { v4 as uuidv4 } from "uuid";
import { useRandomSeed } from "../../../../../utils";
import { doMakeImage } from "../../../../../api";
import {
MakeButtonStyle, // @ts-expect-error
} from "./makeButton.css.ts";
MakeButtonStyle,
} from "./makeButton.css";
import { useTranslation } from "react-i18next";

3
ui/frontend/build_src/src/components/organisms/creationPanel/basicCreation/makeButton/makeButton.css.ts
View File

@ -1,7 +1,6 @@
import { style } from "@vanilla-extract/css";
// @ts-expect-error
import { vars } from "../../../../../styles/theme/index.css.ts";
import { vars } from "../../../../../styles/theme/index.css";
export const MakeButtonStyle = style({
width: "100%",

4
ui/frontend/build_src/src/components/organisms/creationPanel/basicCreation/seedImage/index.tsx
View File

@ -6,8 +6,8 @@ import {
ImageInput,
ImageInputButton,
ImageFixer,
XButton, // @ts-expect-error
} from "./seedImage.css.ts";
XButton,
} from "./seedImage.css";
import { useImageCreate } from "../../../../../stores/imageCreateStore";
import { useTranslation } from "react-i18next";

3
ui/frontend/build_src/src/components/organisms/creationPanel/basicCreation/seedImage/seedImage.css.ts
View File

@ -1,7 +1,6 @@
import { style } from "@vanilla-extract/css";
// @ts-expect-error
import { vars } from "../../../../../styles/theme/index.css.ts";
import { vars } from "../../../../../styles/theme/index.css";
export const ImageInputDisplay = style({
display: "flex",

3
ui/frontend/build_src/src/components/organisms/creationPanel/imageModifiers/imageModifiers.css.ts
View File

@ -1,6 +1,5 @@
import { style, globalStyle } from "@vanilla-extract/css";
// @ts-expect-error
import { vars } from "../../../../styles/theme/index.css.ts";
import { vars } from "../../../../styles/theme/index.css";
export const ImagerModifierGroups = style({
// marginBottom: vars.spacing.small,

8
ui/frontend/build_src/src/components/organisms/creationPanel/imageModifiers/index.tsx
View File

@ -1,14 +1,14 @@
import React, { useState } from "react";
// @ts-expect-error
import { PanelBox } from "../../../../styles/shared.css.ts";
import { PanelBox } from "../../../../styles/shared.css";
import {
ImagerModifierGroups,
ImageModifierGrouping,
MenuButton,
ModifierListStyle, //@ts-expect-error
} from "./imageModifiers.css.ts";
ModifierListStyle,
} from "./imageModifiers.css";
import { ModifierObject, useImageCreate } from "../../../../stores/imageCreateStore";
import { useCreateUI } from "../creationPanelUIStore";

4
ui/frontend/build_src/src/components/organisms/creationPanel/index.tsx
View File

@ -13,8 +13,8 @@ import "./creationPanel.css";
import {
CreationPaneMain,
InpaintingSlider, // @ts-expect-error
} from "./creationpane.css.ts";
InpaintingSlider,
} from "./creationpane.css";
import BasicCreation from "./basicCreation";

5
ui/frontend/build_src/src/components/organisms/creationPanel/inpaintingPanel/index.tsx
View File

@ -6,8 +6,8 @@ import { useImageCreate } from "../../../../stores/imageCreateStore";
import {
InpaintingPanelMain,
InpaintingControls,
InpaintingControlRow, // @ts-expect-error
} from "./inpaintingPanel.css.ts";
InpaintingControlRow,
} from "./inpaintingPanel.css";
export default function InpaintingPanel() {
// no idea if this is the right typing
@ -47,6 +47,7 @@ export default function InpaintingPanel() {
<DrawImage
// ref={drawingRef}
imageData={initImage}
// @ts-expect-error
brushSize={brushSize}
brushShape={brushShape}
brushColor={brushColor}

5
ui/frontend/build_src/src/components/organisms/displayPanel/completedImages/completedImages.css.ts
View File

@ -1,7 +1,6 @@
import { style, globalStyle } from "@vanilla-extract/css";
// @ts-expect-error
import { vars } from "../../../../styles/theme/index.css.ts";
import { vars } from "../../../../styles/theme/index.css";
export const completedImagesMain = style({
height: "100%",
@ -56,5 +55,5 @@ export const RemoveButton = style({
border: "0 none",
padding: vars.spacing.small,
cursor: "pointer",
borderRadius: vars.trim.borderRadiusSmall,
borderRadius: vars.trim.smallBorderRadius,
});

3
ui/frontend/build_src/src/components/organisms/displayPanel/completedImages/index.tsx
View File

@ -8,8 +8,7 @@ import {
completedImagesList,
imageContain,
RemoveButton,
// @ts-expect-error
} from "./completedImages.css.ts";
} from "./completedImages.css";

3
ui/frontend/build_src/src/components/organisms/displayPanel/index.tsx
View File

@ -8,8 +8,7 @@ import {
displayPanel,
displayContainer,
previousImages,
// @ts-expect-error
} from "./displayPanel.css.ts";
} from "./displayPanel.css";
const idDelim = "_batch";

3
ui/frontend/build_src/src/components/organisms/footerDisplay/footerDisplay.css.ts
View File

@ -1,7 +1,6 @@
import { style, globalStyle } from "@vanilla-extract/css";
// @ts-expect-error
import { vars } from "../../../styles/theme/index.css.ts";
import { vars } from "../../../styles/theme/index.css";
export const FooterDisplayMain = style({
color: vars.colors.text.normal,

4
ui/frontend/build_src/src/components/organisms/footerDisplay/index.tsx
View File

@ -2,8 +2,8 @@ import React from "react";
import {
FooterDisplayMain,
CoffeeButton, // @ts-expect-error
} from "./footerDisplay.css.ts";
CoffeeButton,
} from "./footerDisplay.css";
import { API_URL } from "../../../api";

3
ui/frontend/build_src/src/components/organisms/headerDisplay/statusDisplay/statusDisplay.css.ts
View File

@ -1,7 +1,6 @@
import { style } from "@vanilla-extract/css";
// @ts-expect-error
import { vars } from "../../../../styles/theme/index.css.ts";
import { vars } from "../../../../styles/theme/index.css";
export const StartingStatus = style({
color: vars.colors.warning,

3
ui/frontend/build_src/src/pages/Home/home.css.ts
View File

@ -1,6 +1,5 @@
import { style } from "@vanilla-extract/css";
// @ts-expect-error
import { vars } from "../../styles/theme/index.css.ts";
import { vars } from "../../styles/theme/index.css";
export const AppLayout = style({
position: "relative",

3
ui/frontend/build_src/src/styles/index.css.ts
View File

@ -1,6 +1,5 @@
import { globalStyle } from "@vanilla-extract/css";
// @ts-expect-error
import { vars } from "./theme/index.css.ts";
import { vars } from "./theme/index.css";
// baisc body style
globalStyle("body", {

3
ui/frontend/build_src/src/styles/shared.css.ts
View File

@ -1,6 +1,5 @@
import { style, globalStyle } from "@vanilla-extract/css";
// @ts-expect-error
import { vars } from "./theme/index.css.ts";
import { vars } from "./theme/index.css";
export const PanelBox = style({
background: vars.colors.backgroundAlt,

2
ui/frontend/dist/index.css vendored
View File

File diff suppressed because one or more lines are too long

3
ui/frontend/dist/index.html vendored
View File

@ -3,7 +3,10 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="icon" type="image/png" href="/media/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/media/favicon-32x32.png" sizes="32x32">
<meta name="color-scheme" content="dark light" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css">
<title>Stable Diffusion UI</title>
<script type="module" crossorigin src="/index.js"></script>
<link rel="stylesheet" href="/index.css">

45
ui/frontend/dist/index.js vendored
View File

File diff suppressed because one or more lines are too long