Fixed libraries, removed instructions

main v3.2
Benjamin Kraft 1 year ago
parent 5471410b5d
commit 9960b133de
  1. 163
      public/index.html
  2. 6
      public/scripts/sketch.js

@ -1,8 +1,8 @@
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<script src="/lib/p5/p5.min.js" type="text/javascript"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.9.0/p5.min.js" type="text/javascript"></script>
<script src="/lib/jquery/jquery.min.js" type="text/javascript"></script> <script src="https://code.jquery.com/jquery-3.6.4.min.js" type="text/javascript"></script>
<script src="scripts/lib/BenjoLibrary.js" type="text/javascript"></script> <script src="scripts/lib/BenjoLibrary.js" type="text/javascript"></script>
<script src="scripts/Main.js" type="text/javascript"></script> <script src="scripts/Main.js" type="text/javascript"></script>
<script src="scripts/sketch.js" type="text/javascript"></script> <script src="scripts/sketch.js" type="text/javascript"></script>
@ -81,164 +81,5 @@
<div id="timeDiv"> <div id="timeDiv">
<span></span> <span></span>
</div> </div>
<div id="instructions">
<div id="instructionsWrapper">
<h1 id="instructionsHeader">Anleitung Bricks v3.1</h1>
<div id="instructionsContent">
<h2><u>Über das Spiel:</u></h2>
<p>
Die Aufgabe in dem Spiel besteht darin, jeden farbigen Block auf dem Spielfeld
mithilfe des Paddleboards zu zerstören!
Spezielle Items können helfen...oder nicht :D
</p>
<p>
Alle deine Statistiken und Fortschritte werden in Cookies gespeichert,
also stelle sicher, dass dein Browser Cookies zulässt und diese nicht
automatisch löscht.
</p>
<p>
Ein Level ist gewonnen wenn alle farbigen Blöcke zerstört wurden
und es ist verloren wenn alle Bälle aus dem Spielfeld verschwinden. Aber keine Sorge,
du hast eine unendliche Anzahl an Zügen :)<br>
Jedes mal, wenn du ein Level gewinnst, bist du in der Lage das Nächsthöhere zu starten.
</p>
<h2><u>Gameplay → Blöcke:</u></h2>
<p>
Bis jetzt gibt es 9 verschiedene Arten von Blöcken:
</p>
<table id="colors">
<tr>
<td>1</td>
<td>Dunkelgrün</td>
<td></td>
</tr>
<tr>
<td>2</td>
<td>Hellgrün</td>
<td></td>
</tr>
<tr>
<td>3</td>
<td>Hellblau</td>
<td></td>
</tr>
<tr>
<td>4</td>
<td>Dunkelblau</td>
<td></td>
</tr>
<tr>
<td>5</td>
<td>Violett</td>
<td></td>
</tr>
<tr>
<td>6</td>
<td>Rot</td>
<td></td>
</tr>
<tr>
<td>7</td>
<td>Orange</td>
<td></td>
</tr>
<tr>
<td>8</td>
<td>Gelb</td>
<td></td>
</tr>
<tr>
<td>(9)</td>
<td>Grau</td>
<td></td>
</tr>
</table>
<p>
Jeder Treffer auf einen Block verringert dessen Status um 1,
bis dieser 0 ist, denn dann ist der Block "tot" und verschwindet.
<br>
Die grauen Blöcke mit dem Wert 9 bzw. -1 sind eine Ausnahme, da sie unzerstörbar sind.
</p>
<h2><u>Gameplay → Items:</u></h2>
<p>
Ab und zu entsteht ein Item, nachdem ein Block zerstört wurde, um
es aufzusammeln, benutzt du ganz einfach dein Paddleboard -
Deine Bälle können sie nicht aufsammeln.
Je höher dein Level, desto häufiger entstehen Items, du wirst sie
anfangs also nur sehr selten antreffen.
</p>
<p>
Hier sind alle Items gelistet:
</p>
<table id="items">
<tr>
<td>Ball</td>
<td>→ Boost</td>
<td></td>
</tr>
<tr>
<td>Paddle</td>
<td>→ Boost</td>
<td></td>
</tr>
<tr>
<td>Ball</td>
<td>→ Slow</td>
<td></td>
</tr>
<tr>
<td>Paddle</td>
<td>→ Slow</td>
<td></td>
</tr>
<tr>
<td>Ball</td>
<td>→ Creator</td>
<td></td>
</tr>
<tr>
<td>Brick</td>
<td>→ Repair</td>
<td></td>
</tr>
</table>
<p>
Ein Boost gibt dem Objekt einen permanenten Geschwindigkeitsschub,
während ein Slow das Gegenteil verursacht.<br>
Der Ball-Creator fügt dem Spiel einen neuen Ball hinzu.
</p>
<p>
Pass auf bei dem Repair-Item,
denn das macht <b>jeden</b> Block im aktuellen Spiel
eine Stufe stärker.
</p>
<h2><u>Weitere Informationen:</u></h2>
<p>
Dieses Spiel wurde nicht fürs Handy programmiert, dort sind viele Bugs anzutreffen.
Alle nötigen Hotkeys sind links in der Info-Box aufgelistet.
</p>
<p>
Ich benutze für dieses Spiel JavaScript in Kombination mit der Processing
Library p5 von Lauren McCarthy und der sehr nützlichen auf HTML-DOM arbeitenden Library jQuery.
</p>
<h2><u>Changelog:</u></h2>
<p>
<b>Version 3.0:</b><br>
Erste eigene Web-Version von "Bricks"
</p>
<p>
<b>Version 3.1:</b><br>
Die ersten 5 Level hinzugefügt. Viel Spaß!
</p>
<p style="font-size: 20px; margin-top: 50px;">
Erstellt und veröffentlicht von BenjoCraeft,<br>
Gamer, Programmierer
</p>
<p style="font-size: 20px; float: right;">
Schließe diese Box mit ESC
</p>
</div>
</div>
</div>
</body> </body>
</html> </html>

@ -30,7 +30,7 @@ function setup(){
} }
setRekordInfo(); setRekordInfo();
for (var i = 0; i < stateCount; i++){ for (var i = 0; i < 0; i++){
$("#colors tr:eq(" + i + ") td:eq(2)").html("<canvas id=\"brick" + i + "\"></canvas>"); $("#colors tr:eq(" + i + ") td:eq(2)").html("<canvas id=\"brick" + i + "\"></canvas>");
$("#brick" + i).attr({ $("#brick" + i).attr({
"width": String(wWidth * 0.3 * 0.6), "width": String(wWidth * 0.3 * 0.6),
@ -46,7 +46,7 @@ function setup(){
ctx.fillRect(0, 0, c.width, c.height); ctx.fillRect(0, 0, c.width, c.height);
} }
for (var i = 0; i < itemCount; i++){ for (var i = 0; i < 0; i++){
$("#items tr:eq(" + i + ") td:eq(2)").html("<canvas id=\"item" + i + "\"></canvas>"); $("#items tr:eq(" + i + ") td:eq(2)").html("<canvas id=\"item" + i + "\"></canvas>");
$("#item" + i).attr({ $("#item" + i).attr({
"width": String(wWidth * 0.3 * 0.3), "width": String(wWidth * 0.3 * 0.3),
@ -163,7 +163,7 @@ function setup(){
currentGame = new Level(level); currentGame = new Level(level);
$("#currentLevel").html(level); $("#currentLevel").html(level);
checkLevelButtons(level); checkLevelButtons(level);
openInstructions(); // openInstructions();
} }
function draw(){ function draw(){

Loading…
Cancel
Save