Skip to content

Commit 89e4fd7

Browse files
DPigeonDPigeon
authored andcommitted
Add files for V3
1 parent 08110ab commit 89e4fd7

25 files changed

Lines changed: 688 additions & 6334 deletions

.gitignore

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,4 @@
33
.vscode/c_cpp_properties.json
44
.vscode/launch.json
55
.vscode/ipch
6-
lib
6+
data/wifi-.*.txt

data/favicon.png

1.15 KB
Loading

data/highscores.html

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
<!DOCTYPE HTML>
2+
<html>
3+
<head>
4+
<title>
5+
HighScores
6+
</title>
7+
<link href="https://fonts.googleapis.com/css?family=Press+Start+2P" rel="stylesheet">
8+
<link href="https://unpkg.com/nes.css@2.3.0/css/nes.min.css" rel="stylesheet" />
9+
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
10+
<meta name="viewport" content="width=device-width, initial-scale=1">
11+
<style>
12+
body {
13+
background-image: url('https://img.freepik.com/free-vector/background-abstract-pixel-rain_23-2148374568.jpg');
14+
background-repeat: no-repeat;
15+
background-attachment: fixed;
16+
background-size: cover;
17+
}
18+
</style>
19+
</head>
20+
<body>
21+
<center>
22+
<a href="/">
23+
<button type="button" class="nes-btn is-primary" href="/">
24+
<i class="nes-icon coin is-small"></i> Home
25+
</button>
26+
</a>
27+
<a href="/highscores">
28+
<button type="button" class="nes-btn is-primary">
29+
> <i class="nes-icon trophy is-small"></i> HiScores
30+
</button>
31+
</a>
32+
<br>
33+
<br>
34+
<div class="nes-table-responsive">
35+
<table class="nes-table is-bordered is-centered" id="highscores">
36+
<thead>
37+
<tr>
38+
<th>Rank</th>
39+
<th>Name</th>
40+
<th>Time</th>
41+
<th>Score</th>
42+
</tr>
43+
</thead>
44+
</table>
45+
</div>
46+
</center>
47+
<script type="module">
48+
import { initializeApp } from "https://www.gstatic.com/firebasejs/10.7.1/firebase-app.js";
49+
import { getDatabase, ref, query, onValue, orderByChild, limitToFirst } from "https://www.gstatic.com/firebasejs/10.7.1/firebase-database.js";
50+
51+
window.addEventListener('load', function() {
52+
const firebaseConfig = {
53+
databaseURL: "https://esp32-stacker-default-rtdb.firebaseio.com/"
54+
};
55+
56+
const app = initializeApp(firebaseConfig);
57+
const db = getDatabase(app);
58+
const topLimit = 20;
59+
60+
onValue(query(ref(db, 'users/'), orderByChild('score'), limitToFirst(topLimit)), function(snapshot) {
61+
if (snapshot.exists()) {
62+
var content = '';
63+
var index = 0;
64+
snapshot.forEach(function(data) {
65+
var i = index + 1;
66+
var score = -1 * data.val().score;
67+
index++;
68+
content += '<tbody>';
69+
content += '<tr>';
70+
content += '<td>' + i + '</td>';
71+
content += '<td>' + data.key + '</td>';
72+
content += '<td>' + data.val().time + '</td>';
73+
content += '<td>' + score + '</td>';
74+
content += '</tr>';
75+
content += '</tbody>';
76+
});
77+
$('#highscores').append(content);
78+
}
79+
}, {
80+
onlyOnce: true
81+
});
82+
});
83+
</script>
84+
</body>
85+
</html>

data/index.html

Lines changed: 121 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,121 @@
1+
<!DOCTYPE HTML>
2+
<html>
3+
<head>
4+
<title>
5+
Arcade
6+
</title>
7+
<link href="https://fonts.googleapis.com/css?family=Press+Start+2P" rel="stylesheet">
8+
<link href="https://unpkg.com/nes.css@2.3.0/css/nes.min.css" rel="stylesheet" />
9+
<meta name="viewport" content="width=device-width, initial-scale=1">
10+
<style>
11+
body {
12+
background-image: url('https://img.freepik.com/free-vector/background-abstract-pixel-rain_23-2148374568.jpg');
13+
background-repeat: no-repeat;
14+
background-attachment: fixed;
15+
background-size: cover;
16+
}
17+
.bottomRight {
18+
float: right;
19+
}
20+
</style>
21+
</head>
22+
<body>
23+
<center>
24+
<a href="/">
25+
<button type="button" class="nes-btn is-primary" href="/">
26+
> <i class="nes-icon coin is-small"></i> Home
27+
</button>
28+
</a>
29+
<a href="/highscores">
30+
<button type="button" class="nes-btn is-primary">
31+
<i class="nes-icon trophy is-small"></i> HiScores
32+
</button>
33+
</a>
34+
<br>
35+
<br>
36+
<label for="textbox-name"><span style="color:white;">Name:</span></label>
37+
<input type="text" id="textbox-name" name="textbox-name">
38+
<br>
39+
<br>
40+
<b><span style="color:white;">Status:</span></b> <span id="clientState" style="color:white;">%CLIENTSTATE%</span>
41+
<br>
42+
<b><span style="color:white;">Game:</span></b> <span id="gameState" style="color:white;">%GAMESTATE%</span>
43+
<br>
44+
<br>
45+
<b><span style="color:white;">Score:</span></b> <span id="score" style="color:white;">%SCORE%</span>
46+
<br>
47+
<b><span style="color:white;">Timer:</span></b> <span id="chrono" style="color:white;">%CHRONO%</span>
48+
<br>
49+
<br>
50+
<button
51+
id="stack-button"
52+
type="button"
53+
style="
54+
cursor:pointer;
55+
border:15px solid black;
56+
background-color:rgb(0, 162, 255);
57+
border-radius:50%;
58+
width:200px;
59+
height:200px;
60+
">
61+
<i class="nes-icon close is-medium"></i>
62+
</button>
63+
</center>
64+
<div class="bottomRight">
65+
<a href="/info" class="nes-badge is-splited">
66+
<span class="is-dark">Stack</span>
67+
<span class="is-primary">3.3.2</span>
68+
</a>
69+
</div>
70+
<script>
71+
var timer = 0;
72+
var score = 0;
73+
window.addEventListener('load', function() {
74+
var ws = new WebSocket(`ws://${window.location.hostname}/ws`);
75+
ws.onopen = function(event) {
76+
console.log('WS connection opened!');
77+
document.getElementById('clientState').innerHTML = "Connected";
78+
}
79+
ws.onclose = function(event) {
80+
console.log('WS connection closed!');
81+
document.getElementById('clientState').innerHTML = "Disconnected";
82+
if (location) {
83+
location.reload();
84+
}
85+
}
86+
ws.onerror = function(error) {
87+
console.log(error);
88+
};
89+
ws.onmessage = function(event) {
90+
if (event.data == "In Used") {
91+
document.getElementById('gameState').innerHTML = "In Used";
92+
} else if (event.data == "Ready") {
93+
document.getElementById('gameState').innerHTML = "Ready";
94+
} else if (event.data.startsWith("UpdateChrono:")) {
95+
timer = event.data.replace("UpdateChrono: ", "");
96+
document.getElementById('chrono').innerHTML = timer + " s";
97+
} else if (event.data == "StopChrono") {
98+
timer = 0;
99+
score = 0;
100+
document.getElementById('chrono').innerHTML = timer + " s";
101+
} else if (event.data.startsWith("UpdateScore:")) {
102+
score = event.data.replace("UpdateScore: ", "");
103+
document.getElementById('score').innerHTML = score;
104+
}
105+
};
106+
document.getElementById('stack-button').addEventListener('click', function() {
107+
if (ws.readyState != 1 && location) { // Reset board but web still up
108+
location.reload();
109+
} else {
110+
var name = document.getElementById('textbox-name').value;
111+
if (name === "") {
112+
alert("Enter your name to play!");
113+
} else {
114+
ws.send('stack: ' + name);
115+
}
116+
}
117+
});
118+
});
119+
</script>
120+
</body>
121+
</html>

data/info.html

Lines changed: 98 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,98 @@
1+
<!DOCTYPE HTML>
2+
<html>
3+
<head>
4+
<title>
5+
Info
6+
</title>
7+
<link href="https://fonts.googleapis.com/css?family=Press+Start+2P" rel="stylesheet">
8+
<link href="https://unpkg.com/nes.css@2.3.0/css/nes.min.css" rel="stylesheet" />
9+
<meta name="viewport" content="width=device-width, initial-scale=1">
10+
<style>
11+
body {
12+
background-image: url('https://img.freepik.com/free-vector/background-abstract-pixel-rain_23-2148374568.jpg');
13+
background-repeat: no-repeat;
14+
background-attachment: fixed;
15+
background-size: cover;
16+
}
17+
</style>
18+
</head>
19+
<body>
20+
<center>
21+
<a href="/">
22+
<button type="button" class="nes-btn is-primary" href="/">
23+
<i class="nes-icon coin is-small"></i> Home
24+
</button>
25+
</a>
26+
<a>
27+
<button type="button" class="nes-btn is-primary">
28+
> <i class="nes-icon star is-small"></i> Info
29+
</button>
30+
</a>
31+
<br>
32+
<br>
33+
<p>
34+
<span style="color:white;">Developed by
35+
<i class="nes-icon github is-small"></i><a href="https://github.com/DPigeon">DPigeon</a>
36+
</span>
37+
</p>
38+
<p>
39+
<span style="color:white;">
40+
<i class="nes-icon is-small like"></i> Written in C++
41+
</span>
42+
</p>
43+
<br>
44+
</center>
45+
<div class="nes-container is-dark with-title">
46+
<p class="title">Stacker v3</p>
47+
<div class="lists">
48+
<ul class="nes-list is-circle">
49+
<li>- Integrate with 64x64 <a href="https://github.com/mrfaptastic/ESP32-HUB75-MatrixPanel-DMA">ESP32-HUB75-MatrixPanel-DMA
50+
</a></li>
51+
<li>- Block color design</li>
52+
<li>- Integrate <a href="https://docs.espressif.com/projects/esp-idf/en/stable/esp32/api-reference/storage/spiffs.html">SPIFFS</a> to load web files</li>
53+
<li>- Favicon Integration</li>
54+
<li>- Level up transition showing level and retro icon</li>
55+
<li>- CCSS webpage design with <a href="https://github.com/nostalgic-css/NES.css">NES.css</a></li>
56+
<li>- Display current score live in webpage</li>
57+
<li>- Replace Buzzers by a Speaker for sounds</li>
58+
<li>- Adjust Volume with range bar in webpage</li>
59+
<li>- Fix chrono overflow of 60 days</li>
60+
</ul>
61+
</div>
62+
</div>
63+
<br>
64+
<div class="nes-container is-dark with-title">
65+
<p class="title">Stacker v2</p>
66+
<div class="lists">
67+
<ul class="nes-list is-circle">
68+
<li>- Integrate ESP32-WROOM-32 with WiFi</li>
69+
<li>- Simple webpage</li>
70+
<li>- Button on webpage</li>
71+
<li>- Avoid Reset when Game Over</li>
72+
<li>- Level Design</li>
73+
<li>- Add second buzzer</li>
74+
<li>- Chrono timer: update live on webpage</li>
75+
<li>- Score Calculator</li>
76+
<li>- HighScores using <a href="https://github.com/mobizt/Firebase-ESP-Client">Firebase-ESP-Client</a></li>
77+
</ul>
78+
</div>
79+
</div>
80+
<br>
81+
<div class="nes-container is-dark with-title">
82+
<p class="title">Stacker v1</p>
83+
<div class="lists">
84+
<ul class="nes-list is-circle">
85+
<li>- Use Arduino with <a href="https://lastminuteengineers.com/max7219-dot-matrix-arduino-tutorial/">MAX7219 Matrix</a></li>
86+
<li>- Integrate timer for animations</li>
87+
<li>- Move animation</li>
88+
<li>- Miss animation</li>
89+
<li>- Buzzer sound for Game Over</li>
90+
<li>- Implement a real button to stack cubes</li>
91+
<li>- Core mechanics for Stacker game</li>
92+
</ul>
93+
</div>
94+
</div>
95+
<br>
96+
<br>
97+
</body>
98+
</html>

data/wifi-pass.txt

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

data/wifi-user.txt

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

lib/download-from-platform-ini.txt

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
lib/AsyncTCP https://github.com/me-no-dev/AsyncTCP
2+
lib/ESP_Async_WebServer https://github.com/me-no-dev/ESPAsyncWebServer
3+
Firebase_Arduino_Client_Library_for_ESP8266_and_ESP32 https://github.com/mobizt/Firebase-ESP-Client/releases
4+
lib/Timer https://github.com/JChristensen/Timer/blob/master/Timer.h

platformio.ini

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,14 @@ platform = espressif32
1313
board = esp32doit-devkit-v1
1414
framework = arduino
1515
monitor_speed = 115200
16-
build_flags = -DBOARD_HAS_PSRAM -mfix-esp32-psram-cache-issue
16+
lib_deps =
17+
adafruit/Adafruit GFX Library@^1.11.9
18+
mrfaptastic/ESP32 HUB75 LED MATRIX PANEL DMA Display@^3.0.10
19+
links2004/WebSockets@^2.4.1
20+
; lib/AsyncTCP
21+
; lib/ESP_Async_WebServer
22+
; Firebase_Arduino_Client_Library_for_ESP8266_and_ESP32
23+
; lib/Timer https://github.com/JChristensen/Timer/blob/master/Timer.h
1724

1825
[platformio]
1926
description = Stacker Game.

src/Audio.cpp

Lines changed: 0 additions & 26 deletions
This file was deleted.

0 commit comments

Comments
 (0)