Github/screenshot-to-code
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

clean up

Browse Source
This commit is contained in:
Abi Raja 2023-11-23 11:02:22 -05:00
parent 219b241a67
commit 56b9e8bf50
2 changed files with 13 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
frontend/src/App.tsx
View File

@ -29,7 +29,7 @@ import { OnboardingNote } from "./components/OnboardingNote";
import { usePersistedState } from "./hooks/usePersistedState"; import { usePersistedState } from "./hooks/usePersistedState";
import { UrlInputSection } from "./components/UrlInputSection"; import { UrlInputSection } from "./components/UrlInputSection";
import TermsOfServiceDialog from "./components/TermsOfServiceDialog"; import TermsOfServiceDialog from "./components/TermsOfServiceDialog";
import html2canvas from 'html2canvas'; import html2canvas from "html2canvas";
import { USER_CLOSE_WEB_SOCKET_CODE } from "./constants"; import { USER_CLOSE_WEB_SOCKET_CODE } from "./constants";
function App() { function App() {
@ -53,15 +53,17 @@ function App() {
const wsRef = useRef<WebSocket>(null); const wsRef = useRef<WebSocket>(null);
const takeScreenshot = async (): Promise<string> => { const takeScreenshot = async (): Promise<string> => {
const iframeElement = document.querySelector('#preview-desktop') as HTMLIFrameElement; const iframeElement = document.querySelector(
"#preview-desktop"
) as HTMLIFrameElement;
if (!iframeElement?.contentWindow?.document.body) { if (!iframeElement?.contentWindow?.document.body) {
return ''; return "";
} }
const canvas = await html2canvas(iframeElement.contentWindow.document.body); const canvas = await html2canvas(iframeElement.contentWindow.document.body);
const png = canvas.toDataURL('image/png'); const png = canvas.toDataURL("image/png");
return png; return png;
} };
const downloadCode = () => { const downloadCode = () => {
// Create a blob from the generated code // Create a blob from the generated code
@ -91,8 +93,8 @@ function App() {
const stop = () => { const stop = () => {
wsRef.current?.close?.(USER_CLOSE_WEB_SOCKET_CODE); wsRef.current?.close?.(USER_CLOSE_WEB_SOCKET_CODE);
// make sure stop can correct the state even if the websocket is already closed // make sure stop can correct the state even if the websocket is already closed
setAppState(AppStatus.CODE_READY); setAppState(AppState.CODE_READY);
} };
function doGenerateCode(params: CodeGenerationParams) { function doGenerateCode(params: CodeGenerationParams) {
setExecutionConsole([]); setExecutionConsole([]);
@ -204,13 +206,11 @@ function App() {
{appState === AppState.CODE_READY && ( {appState === AppState.CODE_READY && (
<div> <div>
<div className="grid w-full gap-2"> <div className="grid w-full gap-2">
<div className="flex justify-between items-center gap-x-2"> <div className="flex justify-between items-center gap-x-2">
<div className="font-500"> <div className="font-500">Auto Image Comparison</div>
Auto Image Comparison
</div>
<Switch <Switch
checked={isImgCompare} checked={isImgCompare}
onCheckedChange={setIsImgCompare} onCheckedChange={setIsImgCompare}
/> />
</div> </div>
<Textarea <Textarea

1
frontend/src/generateCode.ts
View File

@ -53,7 +53,6 @@ export function generateCode(
} else if (event.code !== 1000) { } else if (event.code !== 1000) {
console.error("WebSocket error code", event); console.error("WebSocket error code", event);
toast.error(ERROR_MESSAGE); toast.error(ERROR_MESSAGE);
onComplete();
} }
onComplete(); onComplete();
}); });