Skip to content

Commit 18c965f

Browse files
TobiasMue91TobiasMue91
committed
- rename tetris clone to blockdrop and change block variety
1 parent e8fd52b commit 18c965f

File tree

5 files changed

+41
-86
lines changed

5 files changed

+41
-86
lines changed

‎data/games.json‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -341,10 +341,10 @@
341341
"date": "2024-11-13"
342342
},
343343
{
344-
"id": "tetris",
345-
"title": "Tetris",
346-
"description": "Welcome to the ultimate Tetris experience! Play the classic game with a new twist and beat your high\n score!",
347-
"url": "games/tetris.html",
344+
"id": "blockdrop",
345+
"title": "Blockdrop",
346+
"description": "Blockdrop is a fast-paced reimagining of the classic Tetris formula. Stack blocks, clear lines, and push your high score higher with every round.",
347+
"url": "games/blockdrop.html",
348348
"screenshot": "screenshots/screenshot_44.png",
349349
"type": "game",
350350
"aiPowered": false,

‎games/tetris.html‎ renamed to ‎games/blockdrop.html‎

Lines changed: 36 additions & 81 deletions
Original file line numberDiff line numberDiff line change
@@ -4,15 +4,15 @@
44
<link rel="icon"
55
href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🧩</text></svg>">
66
<meta charset="UTF-8">
7-
<title>Tetris</title>
7+
<title>BlockDrop</title>
88
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
99
integrity="sha512-1ycn6IcaQQ40/MKBW2W4Rhis/DbILU74C1vSrLJxCq57o941Ym01SwNsOMqvEBFlcgUa6xLiPY/NS5R+E6ztJQ=="
1010
crossorigin="anonymous" referrerpolicy="no-referrer"/>
1111
<meta name="viewport"
1212
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover">
1313
<meta name="description"
14-
content="Play Tetris online for free. A classic arcade game that tests your skills and strategy.">
15-
<meta name="keywords" content="Tetris, arcade game, free online game, online tetris, tetris online game">
14+
content="Play BlockDrop online for free. A block-stacking puzzle game that tests your skills and strategy.">
15+
<meta name="keywords" content="BlockDrop, puzzle game, free online game, block stacking game">
1616
<style>:root {
1717
--primary: #2c3e50;
1818
--secondary: #3498db;
@@ -74,7 +74,7 @@
7474
max-height: 60vh
7575
}
7676

77-
#tetris-board {
77+
#blockdrop-board {
7878
border: 2px solid var(--primary);
7979
border-radius: 5px;
8080
max-height: 100%;
@@ -263,6 +263,17 @@
263263
font-size: 14px
264264
}
265265

266+
.disclaimer {
267+
position: absolute;
268+
bottom: 5px;
269+
left: 0;
270+
right: 0;
271+
text-align: center;
272+
font-size: 10px;
273+
opacity: 0.7;
274+
color: var(--primary)
275+
}
276+
266277
@media (min-width: 768px) {
267278
#preview-area {
268279
width: 120px;
@@ -278,14 +289,12 @@
278289
margin-bottom: 15px
279290
}
280291

281-
#tetris-board {
292+
#blockdrop-board {
282293
max-height: 80vh
283294
}
284295
}</style>
285296
</head>
286297
<body>
287-
<audio id="tetris-song" src="sfx/tetris.mp3" type="audio/mp3" loop></audio>
288-
<audio id="tetris-song-b" src="sfx/tetris_b.mp3" type="audio/mp3" loop></audio>
289298
<div id="game-container">
290299
<div id="header-info">
291300
<div class="info-block">
@@ -316,7 +325,7 @@
316325
</div>
317326
</div>
318327
<div id="game-area">
319-
<canvas id="tetris-board"></canvas>
328+
<canvas id="blockdrop-board"></canvas>
320329
</div>
321330
<div id="controls">
322331
<div class="controls-group">
@@ -333,16 +342,10 @@
333342
</div>
334343
<button id="options-btn"><i class="fas fa-cog"></i></button>
335344
<div id="options-menu">
336-
<div class="option-item"><label class="option-label" for="volume-slider">Volume</label><input type="range"
337-
id="volume-slider"
338-
min="0" max="1"
339-
step="0.1"
340-
value="0.5"></div>
341-
<div class="option-item"><label class="option-label"><input type="checkbox" id="mute-checkbox"> Mute</label>
342-
</div>
345+
<div class="option-item"><label class="option-label">Game settings</label></div>
343346
</div>
344347
<div id="game-ui">
345-
<div class="ui-panel" id="start-screen"><h1 class="ui-title">TETRIS</h1>
348+
<div class="ui-panel" id="start-screen"><h1 class="ui-title">BLOCKDROP</h1>
346349
<p class="ui-text">Use buttons or keyboard to play:<br>Arrow keys - Move/Rotate<br>Space - Hard drop<br>H -
347350
Hold piece</p>
348351
<button class="ui-btn" id="start-btn">Start Game</button>
@@ -357,8 +360,11 @@
357360
<button class="ui-btn" id="play-again-btn">Play Again</button>
358361
</div>
359362
</div>
363+
<div class="disclaimer">BlockDrop is an original block-stacking puzzle game and is not affiliated with any other
364+
puzzle game brands.
365+
</div>
360366
</div>
361-
<script>const canvas = document.getElementById('tetris-board');
367+
<script>const canvas = document.getElementById('blockdrop-board');
362368
const ctx = canvas.getContext('2d');
363369
const nextPieceCanvas = document.getElementById('next-piece-board');
364370
const nextPieceCtx = nextPieceCanvas.getContext('2d');
@@ -374,16 +380,10 @@
374380
const startScreen = document.getElementById('start-screen');
375381
const pauseScreen = document.getElementById('pause-screen');
376382
const gameOverScreen = document.getElementById('game-over-screen');
377-
const tetrisSong = document.getElementById('tetris-song');
378-
const tetrisSongB = document.getElementById('tetris-song-b');
379-
let isMuted = false;
380-
let volume = 0.5;
381383
const ROW = 20;
382384
const COLUMN = 10;
383385
let BLOCK_SIZE = 30;
384386
let PREVIEW_SIZE = 15;
385-
tetrisSong.volume = volume;
386-
tetrisSongB.volume = volume;
387387

388388
function resizeGame() {
389389
const gameArea = document.getElementById('game-area');
@@ -409,7 +409,7 @@
409409
drawHeldPiece()
410410
}
411411

412-
const PIECES = [[[0, 1, 0], [1, 1, 1], [0, 0, 0]], [[0, 0, 1], [1, 1, 1], [0, 0, 0]], [[1, 0, 0], [1, 1, 1], [0, 0, 0]], [[1, 1], [1, 1]], [[0, 1, 1], [1, 1, 0], [0, 0, 0]], [[1, 1, 0], [0, 1, 1], [0, 0, 0]], [[0, 0, 0, 0], [1, 1, 1, 1], [0, 0, 0, 0], [0, 0, 0, 0]]];
412+
const PIECES = [[[1, 1, 0], [0, 1, 0], [0, 0, 0]], [[1, 0, 0], [1, 0, 0], [1, 1, 0]], [[1, 1, 1], [0, 1, 0], [0, 1, 0]], [[1, 1], [1, 1]], [[1, 0, 0], [1, 1, 1], [0, 0, 0]], [[0, 1, 0], [1, 1, 1], [0, 0, 0]], [[1, 1, 1, 0], [0, 0, 1, 0], [0, 0, 0, 0], [0, 0, 0, 0]]];
413413
const COLORS = ["#9b59b6", "#f39c12", "#3498db", "#f1c40f", "#2ecc71", "#e74c3c", "#1abc9c"];
414414
let board = [];
415415
let piece, nextPiece;
@@ -418,7 +418,7 @@
418418
let score = 0;
419419
let level = 0;
420420
let lines = 0;
421-
let highScore = localStorage.getItem('tetris-high-score') || 0;
421+
let highScore = localStorage.getItem('blockdrop-high-score') || 0;
422422
let gameLoop;
423423
let gameState = 'start';
424424

@@ -651,10 +651,10 @@
651651
}
652652
}
653653
if (linesCleared > 0) {
654-
const scoreMultiplier = [0, 40, 100, 300, 1200];
654+
const scoreMultiplier = [0, 50, 120, 350, 1000];
655655
score += scoreMultiplier[linesCleared] * (level + 1);
656656
lines += linesCleared;
657-
level = Math.floor(lines / 10);
657+
level = Math.floor(lines / 8);
658658
updateScore();
659659
updateGameSpeed()
660660
}
@@ -690,19 +690,15 @@
690690
if (score > highScore) {
691691
highScore = score;
692692
highScoreElement.textContent = highScore;
693-
localStorage.setItem('tetris-high-score', highScore)
693+
localStorage.setItem('blockdrop-high-score', highScore)
694694
}
695695
}
696696

697697
function updateGameSpeed() {
698698
clearInterval(gameLoop);
699699
const baseSpeed = 1000;
700-
const speed = Math.max(baseSpeed - (level * 50), 100);
701-
startGameLoop(speed);
702-
if (level >= 10 && !isMuted) {
703-
tetrisSong.pause();
704-
tetrisSongB.play()
705-
}
700+
const speed = Math.max(baseSpeed - (level * 60), 100);
701+
startGameLoop(speed)
706702
}
707703

708704
function gameOver() {
@@ -713,9 +709,7 @@
713709
gameUI.style.display = 'flex';
714710
pauseScreen.style.display = 'none';
715711
startScreen.style.display = 'none';
716-
gameOverScreen.style.display = 'block';
717-
tetrisSong.pause();
718-
tetrisSongB.pause()
712+
gameOverScreen.style.display = 'block'
719713
}
720714

721715
function startGame() {
@@ -734,14 +728,7 @@
734728
drawBoard();
735729
drawNextPiece();
736730
drawHeldPiece();
737-
updateGameSpeed();
738-
if (!isMuted) {
739-
tetrisSong.currentTime = 0;
740-
tetrisSongB.currentTime = 0;
741-
tetrisSong.volume = volume;
742-
tetrisSongB.volume = volume;
743-
tetrisSong.play()
744-
}
731+
updateGameSpeed()
745732
}
746733

747734
function pauseGame() {
@@ -751,9 +738,7 @@
751738
gameUI.style.display = 'flex';
752739
pauseScreen.style.display = 'block';
753740
startScreen.style.display = 'none';
754-
gameOverScreen.style.display = 'none';
755-
tetrisSong.pause();
756-
tetrisSongB.pause()
741+
gameOverScreen.style.display = 'none'
757742
} else if (gameState === 'paused') {
758743
resumeGame()
759744
}
@@ -763,14 +748,7 @@
763748
if (gameState === 'paused') {
764749
gameState = 'playing';
765750
updateGameSpeed();
766-
gameUI.style.display = 'none';
767-
if (!isMuted) {
768-
if (level >= 10) {
769-
tetrisSongB.play()
770-
} else {
771-
tetrisSong.play()
772-
}
773-
}
751+
gameUI.style.display = 'none'
774752
}
775753
}
776754

@@ -784,11 +762,7 @@
784762
highScoreElement.textContent = highScore;
785763
initBoard();
786764
resizeGame();
787-
drawBoard();
788-
const volumeSlider = document.getElementById('volume-slider');
789-
volumeSlider.value = volume;
790-
tetrisSong.volume = volume;
791-
tetrisSongB.volume = volume
765+
drawBoard()
792766
});
793767
window.addEventListener('resize', resizeGame);
794768
window.addEventListener('orientationchange', function () {
@@ -830,29 +804,9 @@
830804
document.getElementById('play-again-btn').addEventListener('click', startGame);
831805
const optionsBtn = document.getElementById('options-btn');
832806
const optionsMenu = document.getElementById('options-menu');
833-
const volumeSlider = document.getElementById('volume-slider');
834-
const muteCheckbox = document.getElementById('mute-checkbox');
835807
optionsBtn.addEventListener('click', () => {
836808
optionsMenu.style.display = optionsMenu.style.display === 'block' ? 'none' : 'block'
837809
});
838-
volumeSlider.addEventListener('input', (e) => {
839-
volume = parseFloat(e.target.value);
840-
tetrisSong.volume = volume;
841-
tetrisSongB.volume = volume
842-
});
843-
muteCheckbox.addEventListener('change', (e) => {
844-
isMuted = e.target.checked;
845-
if (isMuted) {
846-
tetrisSong.pause();
847-
tetrisSongB.pause()
848-
} else if (gameState === 'playing') {
849-
if (level >= 10) {
850-
tetrisSongB.play()
851-
} else {
852-
tetrisSong.play()
853-
}
854-
}
855-
});
856810
document.addEventListener('click', (e) => {
857811
if (!optionsMenu.contains(e.target) && e.target !== optionsBtn) {
858812
optionsMenu.style.display = 'none'
@@ -863,5 +817,6 @@
863817
e.preventDefault()
864818
}
865819
});</script>
820+
<script src="../logo.js"></script>
866821
</body>
867822
</html>

‎games/sfx/tetris.mp3‎

-1.28 MB
Binary file not shown.

‎games/sfx/tetris_b.mp3‎

-2.86 MB
Binary file not shown.

‎sidebar.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ <h2>Games by ChatGPT</h2>
117117
<li><a href="/games/simon_says.html">Simon Says</a></li>
118118
<li><a href="/games/snake.html">Snake</a></li>
119119
<li><a href="/games/sudoku.html">Sudoku</a></li>
120-
<li><a href="/games/tetris.html">Tetris</a></li>
120+
<li><a href="/games/blockdrop.html">Blockdrop</a></li>
121121
<li><a href="/games/tic_tac_toe_mp.html">Tic-Tac-Toe</a></li>
122122
<li><a href="/games/time_travel_agency.html">Time Travel Agency</a></li>
123123
<li><a href="/games/typing_game.html">Typing Game</a></li>

0 commit comments

Comments
 (0)