Start mission button working

ChromeGaming · Jul 1, 2024 · 2eb511f · 2eb511f
1 parent 30cd798
commit 2eb511f
Show file tree

Hide file tree

Showing 2 changed files with 280 additions and 215 deletions.
diff --git a/index.html b/index.html
@@ -342,29 +342,100 @@
 				id="botonPlay"
 				style="text-align: center; width: 100%; margin-top: 30px"
 			>
-				<div
-					id="bpTxt"
-					class="blink_me"
-					onclick="play();"
-					style="
-						display: inline-block;
-						text-align: center;
-						padding: 6px 20px 6px 20px;
-						font-size: 20px;
-						color: #1a0f09;
-						font-weight: 500;
-						box-shadow: 0px 0px 10px 5px #a1ab8a;
-						border-radius: 10px;
-						border: 3px solid #ebf20c;
-						background-color: rgba(234, 183, 183, 0.844);
-					    cursor: pointer;
-					"
-				>
-					Start Mission🚀
-				</div>
+			<div id="bpTxt" class="blink_me" style="
+        display: inline-block;
+        text-align: center;
+        padding: 6px 20px;
+        font-size: 20px;
+        color: #1a0f09;
+        font-weight: 500;
+        box-shadow: 0px 0px 10px 5px #a1ab8a;
+        border-radius: 10px;
+        border: 3px solid #ebf20c;
+        background-color: rgba(234, 183, 183, 0.844);
+        cursor: pointer;">
+        Start Mission🚀
+    </div>
+
 			</div>
 		</div>
 
+		<script>
+        var zzfxV = 0.5;    
+        var zzfx = null;
+
+        let zzfxX, zzfxR;
+
+        function play() {
+            console.log("Play function called");
+
+            if (typeof zzfx === 'undefined' || zzfx == null) {
+                console.log("Initializing zzfx");
+                zzfx = (p = 1, k = .05, b = 220, e = 0, r = 0, t = .1, q = 0, D = 1, u = 0, y = 0, v = 0, z = 0, l = 0, E = 0, A = 0, F = 0, c = 0, w = 1, m = 0, B = 0) => {
+                    let M = Math, R = 44100, d = 2 * M.PI, G = u *= 500 * d / R / R, C = b *= (1 - k + 2 * k * M.random(k = [])) * d / R, g = 0, H = 0, a = 0, n = 1, I = 0, J = 0, f = 0, x, h;
+                    e = R * e + 9; m *= R; r *= R; t *= R; c *= R; y *= 500 * d / R ** 3; A *= d / R; v *= d / R; z *= R; l = R * l | 0;
+                    for (h = e + m + r + t + c | 0; a < h; k[a++] = f) ++J % (100 * F | 0) || (f = q ? 1 < q ? 2 < q ? 3 < q ? M.sin((g % d) ** 3) : M.max(M.min(M.tan(g), 1), -1) : 1 - (2 * g / d % 2 + 2) % 2 : 1 - 4 * M.abs(M.round(g / d) - g / d) : M.sin(g), f = (l ? 1 - B + B * M.sin(d * a / l) : 1) * (0 < f ? 1 : -1) * M.abs(f) ** D * p * zzfxV * (a < e ? a / e : a < e + m ? 1 - (a - e) / m * (1 - w) : a < e + m + r ? w : a < h - c ? (h - a - c) / t * w : 0), f = c ? f / 2 + (c > a ? 0 : (a < h - c ? 1 : (h - a) / c) * k[a - c | 0] / 2) : f), x = (b += u += y) * M.cos(A * H++), g += x - x * E * (1 - 1E9 * (M.sin(a) + 1) % 2), n && ++n > z && (b += v, C += v, n = 0), !l || ++I % l || (b = C, u = G, n = n || 1);
+                    p = zzfxX.createBuffer(1, h, R); p.getChannelData(0).set(k); b = zzfxX.createBufferSource(); b.buffer = p; b.connect(zzfxX.destination); b.start(); return b
+                };
+                zzfxX = new (window.AudioContext || webkitAudioContext)();
+            }	
+
+            console.log("Calling reset");
+            reset();
+
+            StarVel = 0.1;
+            console.log("Hiding and showing elements");
+            document.getElementById('Gametitle').style.display = "none";
+            document.getElementById('botonPlayInfo').style.display = "none";
+            document.getElementById("mainMenu").style.display = "block";
+            document.getElementById('botonPlay').style.display = "none";
+
+            document.getElementById('shipMenuDIV').style.display = 'block';
+
+            console.log("Placing ships");
+            ponerNave(cWidth / 2, cHeight + 10, 1);
+            canPutItems = true;
+            ponerNave((cWidth / 2) + 150, cHeight - 400, -1);
+            ponerNave((cWidth / 2) - 150, cHeight - 400, -1);
+            canPutItems = false;
+
+            document.getElementById('gameStartMSG').style.opacity = "0";
+            document.getElementById("gameStartMSG").style.display = "block";
+            setTimeout(function () { document.getElementById('gameStartMSG').style.opacity = "1"; }, 10);
+            setTimeout(function () { document.getElementById('gameStartMSG').style.opacity = "0"; }, 6000);
+            setTimeout(function () { document.getElementById('gameStartMSG').style.display = "none"; }, 9000);
+
+            setTimeout(function () { nextWave2(); }, 8000);
+
+            setTimeout(function () {
+                document.getElementById("mainMenu").style.display = "none";
+                canPutItems = true;
+                mainCounter = 0;
+                shipsMoving = true;
+            }, 1000);
+        }
+
+        // Assign the onclick event to the div after the DOM is fully loaded
+        document.addEventListener("DOMContentLoaded", function() {
+            document.getElementById("bpTxt").addEventListener("click", play);
+        });
+
+        // Dummy reset function for demonstration purposes
+        function reset() {
+            console.log("Reset function called");
+        }
+
+        // Dummy ponerNave function for demonstration purposes
+        function ponerNave(x, y, direction) {
+            console.log(`Poner nave at (${x}, ${y}) with direction ${direction}`);
+        }
+
+        // Dummy nextWave2 function for demonstration purposes
+        function nextWave2() {
+            console.log("Next wave 2 called");
+        }
+    </script>
+
 		<div
 			id="mainDIV"
 			style="
@@ -728,13 +799,11 @@
 							font-size: 13px;
 							border-radius: 50px;
 							background-color: black;
- 
 							cursor: pointer;/* add cursor to attractive*/
-
-							cursor: pointer;
+							cursor: pointer;"
 
 
-						id="setting"	
+						id = "setting"	
 					>
 						&#x2699;
 					</div>
@@ -760,6 +829,7 @@
 						});
 				</script>
 
+
 					<div
 						style="
 							position: relative;
@@ -774,7 +844,7 @@
 							max-height: 17px;
 							color: #00b0b0;
 							background-color: rgba(0, 0, 0, 0.5);
-							cursor: pointer;/* add cursor to attractive*/
+							cursor: pointer;
 						"
 					>
 						<span