Skip to content

Commit cd33e4f

Browse files
rjokenrjoken
authored
Initial commit
0 parents  commit cd33e4f

25 files changed

+3908
-0
lines changed

‎.github/workflows/pages.yml‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
name: Deploy site to Pages
2+
3+
on:
4+
# Runs on pushes targeting the default branch
5+
push:
6+
branches: ["main"]
7+
8+
# Allows you to run this workflow manually from the Actions tab
9+
workflow_dispatch:
10+
11+
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
12+
permissions:
13+
contents: read
14+
pages: write
15+
id-token: write
16+
17+
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
18+
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
19+
concurrency:
20+
group: "pages"
21+
cancel-in-progress: false
22+
23+
jobs:
24+
# Build job
25+
build:
26+
runs-on: ubuntu-latest
27+
steps:
28+
- name: Checkout
29+
uses: actions/checkout@v4
30+
- name: Setup Node
31+
uses: actions/setup-node@v4
32+
with:
33+
node-version: "20"
34+
cache: ${{ steps.detect-package-manager.outputs.manager }}
35+
36+
- name: Setup Pages
37+
uses: actions/configure-pages@v5
38+
39+
- name: Install dependencies
40+
run: yarn install
41+
42+
- name: Build
43+
run: yarn build
44+
- name: Upload artifact
45+
uses: actions/upload-pages-artifact@v3
46+
with:
47+
path: ./dist
48+
49+
# Deployment job
50+
deploy:
51+
environment:
52+
name: github-pages
53+
url: ${{ steps.deployment.outputs.page_url }}
54+
runs-on: ubuntu-latest
55+
needs: build
56+
steps:
57+
- name: Deploy to GitHub Pages
58+
id: deployment
59+
uses: actions/deploy-pages@v4

‎.gitignore‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

‎.yarn/install-state.gz‎

243 KB
Binary file not shown.

‎.yarnrc.yml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
nodeLinker: node-modules

‎README.md‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
# Gamejam
2+
3+
## Technologies Used
4+
5+
- TypeScript
6+
- React
7+
- Phaser 3
8+
- Vite
9+
- Yarn
10+
11+
## Adding Real Assets
12+
13+
The game currently uses generated placeholder assets. To add your own custom assets:
14+
15+
1. Add your image files to the `public/assets/` directory
16+
2. Update the asset paths in `src/game/scenes/GameScene.ts`
17+
18+
## License
19+
20+
[MIT](LICENSE)

‎eslint.config.js‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import js from '@eslint/js'
2+
import globals from 'globals'
3+
import reactHooks from 'eslint-plugin-react-hooks'
4+
import reactRefresh from 'eslint-plugin-react-refresh'
5+
import tseslint from 'typescript-eslint'
6+
7+
export default tseslint.config(
8+
{ ignores: ['dist'] },
9+
{
10+
extends: [js.configs.recommended, ...tseslint.configs.recommended],
11+
files: ['**/*.{ts,tsx}'],
12+
languageOptions: {
13+
ecmaVersion: 2020,
14+
globals: globals.browser,
15+
},
16+
plugins: {
17+
'react-hooks': reactHooks,
18+
'react-refresh': reactRefresh,
19+
},
20+
rules: {
21+
...reactHooks.configs.recommended.rules,
22+
'react-refresh/only-export-components': [
23+
'warn',
24+
{ allowConstantExport: true },
25+
],
26+
},
27+
},
28+
)

‎index.html‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<!doctype html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8" />
6+
<link rel="icon" type="image/png" href="/assets/switchy/hello.png" />
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
8+
<meta name="apple-mobile-web-app-capable" content="yes">
9+
<meta name="mobile-web-app-capable" content="yes">
10+
<title>Gamejam</title>
11+
</head>
12+
13+
<body style="margin: 0; padding: 0; width: 100%; height: 100%; overflow: hidden;">
14+
<div id="root"></div>
15+
<script type="module" src="/src/main.tsx"></script>
16+
</body>
17+
18+
</html>

‎package.json‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{
2+
"name": "gamejam",
3+
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
6+
"scripts": {
7+
"dev": "vite",
8+
"build": "tsc -b && vite build",
9+
"lint": "eslint .",
10+
"preview": "vite preview"
11+
},
12+
"dependencies": {
13+
"phaser": "^3.88.2",
14+
"react": "^19.0.0",
15+
"react-dom": "^19.0.0"
16+
},
17+
"devDependencies": {
18+
"@eslint/js": "^9.21.0",
19+
"@types/react": "^19.0.10",
20+
"@types/react-dom": "^19.0.4",
21+
"@types/w3c-web-hid": "^1.0.3",
22+
"@vitejs/plugin-react": "^4.3.4",
23+
"eslint": "^9.21.0",
24+
"eslint-plugin-react-hooks": "^5.1.0",
25+
"eslint-plugin-react-refresh": "^0.4.19",
26+
"globals": "^15.15.0",
27+
"typescript": "~5.7.2",
28+
"typescript-eslint": "^8.24.1",
29+
"vite": "^6.2.0"
30+
},
31+
"packageManager": "[email protected]"
32+
}

‎public/vite.svg‎

Lines changed: 1 addition & 0 deletions
Loading

‎src/App.css‎

Lines changed: 170 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,170 @@
1+
#root {
2+
max-width: 100%;
3+
margin: 0 auto;
4+
padding: 0;
5+
text-align: center;
6+
height: 100%;
7+
padding: env(safe-area-inset-top) env(safe-area-inset-right)
8+
env(safe-area-inset-bottom) env(safe-area-inset-left);
9+
}
10+
11+
.logo {
12+
height: 6em;
13+
padding: 1.5em;
14+
will-change: filter;
15+
transition: filter 300ms;
16+
}
17+
.logo:hover {
18+
filter: drop-shadow(0 0 2em #646cffaa);
19+
}
20+
.logo.react:hover {
21+
filter: drop-shadow(0 0 2em #61dafbaa);
22+
}
23+
24+
@keyframes logo-spin {
25+
from {
26+
transform: rotate(0deg);
27+
}
28+
to {
29+
transform: rotate(360deg);
30+
}
31+
}
32+
33+
@media (prefers-reduced-motion: no-preference) {
34+
a:nth-of-type(2) .logo {
35+
animation: logo-spin infinite 20s linear;
36+
}
37+
}
38+
39+
.card {
40+
padding: 2em;
41+
}
42+
43+
.read-the-docs {
44+
color: #888;
45+
}
46+
47+
.app-container {
48+
display: flex;
49+
flex-direction: column;
50+
align-items: center;
51+
width: 100%;
52+
height: 100%;
53+
max-width: 100%;
54+
margin: 0;
55+
padding: 0;
56+
box-sizing: border-box;
57+
overflow: hidden;
58+
position: absolute;
59+
top: 0;
60+
left: 0;
61+
right: 0;
62+
bottom: 0;
63+
}
64+
65+
main {
66+
width: 100%;
67+
height: 100%;
68+
flex-grow: 1;
69+
display: flex;
70+
justify-content: center;
71+
align-items: center;
72+
overflow: hidden;
73+
position: relative;
74+
}
75+
76+
footer {
77+
width: 100%;
78+
text-align: center;
79+
padding: 1rem 0;
80+
}
81+
82+
.game-container {
83+
width: 100% !important;
84+
height: 100% !important;
85+
border-radius: 0;
86+
overflow: hidden;
87+
box-shadow: none;
88+
position: absolute;
89+
top: 0;
90+
left: 0;
91+
right: 0;
92+
bottom: 0;
93+
display: block;
94+
}
95+
96+
.game-container canvas {
97+
width: 100% !important;
98+
height: 100% !important;
99+
display: block !important;
100+
}
101+
102+
@media (min-width: 768px) {
103+
#root {
104+
padding: 1rem;
105+
}
106+
107+
.app-container {
108+
max-width: 1200px;
109+
padding: 1rem;
110+
}
111+
112+
.game-container {
113+
width: 800px;
114+
height: 600px;
115+
max-width: 100%;
116+
border-radius: 8px;
117+
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
118+
}
119+
}
120+
121+
.orientation-message {
122+
position: fixed;
123+
top: 0;
124+
left: 0;
125+
width: 100%;
126+
height: 100%;
127+
background-color: rgba(0, 0, 0, 0.8);
128+
display: flex;
129+
flex-direction: column;
130+
justify-content: center;
131+
align-items: center;
132+
z-index: 1000;
133+
color: white;
134+
text-align: center;
135+
padding: 20px;
136+
}
137+
138+
.portrait-allowed {
139+
background-color: rgba(0, 0, 0, 0.7);
140+
height: auto;
141+
position: absolute;
142+
bottom: 0;
143+
top: auto;
144+
padding: 10px;
145+
}
146+
147+
.dismiss-btn {
148+
margin-top: 10px;
149+
padding: 8px 12px;
150+
background: #646cff;
151+
color: white;
152+
border: none;
153+
border-radius: 4px;
154+
cursor: pointer;
155+
}
156+
157+
.rotate-icon {
158+
font-size: 4rem;
159+
margin-bottom: 1rem;
160+
animation: rotate 2s infinite;
161+
}
162+
163+
@keyframes rotate {
164+
0% {
165+
transform: rotate(0deg);
166+
}
167+
100% {
168+
transform: rotate(90deg);
169+
}
170+
}

0 commit comments

Comments
 (0)