Hugging Face's logo

Spaces:
failfast
/
2D-GameCreator
Runtime error

App Files Community
2
2D-GameCreator
File size: 3,553 Bytes 
2f65818
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
 
import { Alert, Link, List, ListItem, ListItemText, Paper, Typography } from "@mui/material";
import { DividerBox, SectionBox, OutlinedBox } from "@/components/base/boxes";
import { systemMessage } from "@/constants";

export default function Instructions() {
	return (
		<>
			<DividerBox />

			<SectionBox>
				<Typography component="h3" variant="h2">
					Under the Hood
				</Typography>
			</SectionBox>

			<Paper>
				<List>
					<ListItem>
						<ListItemText>
							Build on top of{" "}
							<Link
								href="https://huggingface.co/spaces/failfast/nextjs-hf-spaces"
								target="_blank"
								rel="noopener"
							>
								nextjs-hf-spaces
							</Link>{" "}
							with NextJS + TypeScript +{" "}
							<Link
								href="https://github.com/openai/openai-node"
								target="_blank"
								rel="noopener"
							>
								openai-node
							</Link>
							. The full source code can be found on{" "}
							<Link
								href="https://github.com/failfa-st/2D-GameCreator-GPT"
								target="_blank"
								rel="noopener"
							>
								failfa-st/2D-GameCreator-GPT.
							</Link>
						</ListItemText>
					</ListItem>
					<ListItem>
						<ListItemText>Games are stored in localStorage.</ListItemText>
					</ListItem>
					<ListItem>
						<ListItemText>
							We use a very strong <b>system message</b> to make sure that the AI
							behaves like a 2D Game Developer, where <b>&quot;TEMPLATE&quot;</b>{" "}
							refers to the code of the selected game in the{" "}
							<OutlinedBox>Games</OutlinedBox> list, intitally this is the{" "}
							<b>Base Game</b>:
						</ListItemText>
					</ListItem>
					<ListItem>
						<ListItemText>
							<code>
								<pre>{systemMessage}</pre>
							</code>
						</ListItemText>
					</ListItem>
					<ListItem>
						<ListItemText>
							The <b>user message</b> follows another template, to make sure that the
							selected <OutlinedBox>Command</OutlinedBox> is included and that the AI
							always returns the full source code, as this is easier to process
							instead of just parts of the code. The prompt is the message that you
							entered into the <OutlinedBox>prompt</OutlinedBox> field:
						</ListItemText>
					</ListItem>
					<ListItem>
						<ListItemText>
							<code>
								<pre>
									{`"$\{command\}": $\{prompt\}. Return the full source code of the game.
TEMPLATE:`}
								</pre>
							</code>
						</ListItemText>
					</ListItem>
				</List>
			</Paper>

			<SectionBox>
				<Typography component="h3" variant="h2">
					Troubleshooting
				</Typography>
			</SectionBox>

			<Paper sx={{ p: 1 }}>
				<Alert severity="error" sx={{ fontSize: "1.25rem", mb: 1 }}>
					Unhandled Runtime Error: SyntaxError: Unexpected identifier
				</Alert>

				<Typography variant="body1">
					The generated output was interrupted, as it was too long and the OpenAI API
					delivered not everything. If you can, switch to GPT-4 as it allows a bigger
					context size (change it in the options and also increase the max_tokens). If you
					can&apos;t do this, then please help us extend the GameCreator so that it can
					also resume when the output is interrupted.
				</Typography>
			</Paper>

			<DividerBox />

			<Paper sx={{ p: 1 }}>
				<Typography>
					You need help? Something is not working?{" "}
					<Link
						href="https://huggingface.co/spaces/failfast/2D-GameCreator-GPT/discussions"
						target="_blank"
						rel="noopener"
					>
						Please let us know!
					</Link>
				</Typography>
			</Paper>
		</>
	);
}