sageTheDm/pages
1
0
Fork 0
forked from interstellar_development/interstellar_website
Code Pull requests Activity

Merge pull request 'main' (#25) from sageTheDm/pages:main into main

Browse source 
Reviewed-on: https://interstellardevelopment.org/code/code/interstellar_development/interstellar_website/pulls/25
This commit is contained in:
Patrick 2025-02-23 15:03:30 +01:00
commit a86124a754
20 changed files with 339 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
favicon_io/about.txt Normal file
View file

@ -0,0 +1,6 @@
This favicon was generated using the following graphics from Twitter Twemoji:
- Graphics Title: 1f680.svg
- Graphics Author: Copyright 2020 Twitter, Inc and other contributors (https://github.com/twitter/twemoji)
- Graphics Source: https://github.com/twitter/twemoji/blob/master/assets/svg/1f680.svg
- Graphics License: CC-BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

BIN
favicon_io/android-chrome-192x192.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
favicon_io/android-chrome-512x512.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 47 KiB

BIN
favicon_io/apple-touch-icon.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 13 KiB

BIN
favicon_io/favicon-16x16.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 751 B

BIN
favicon_io/favicon-32x32.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
favicon_io/favicon.ico Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 15 KiB

1
favicon_io/site.webmanifest Normal file
View file

@ -0,0 +1 @@
{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}

15
footer.js
View file

@ -45,7 +45,6 @@ class Footer extends HTMLElement {
customElements.define('footer-component', Footer);
// @license-end
// CSS for the hidden button
const style = document.createElement('style');
@ -59,10 +58,12 @@ style.textContent = `
border: none;
font-size: 24px;
cursor: pointer;
}
.footer-content:hover .secret-button {
display: block;
}
`;
}
.footer-content:hover .secret-button {
display: block;
}
`;
document.head.appendChild(style);
// @license-end

18
index.html
View file

@ -24,6 +24,24 @@
<script src="header.js" type="text/javascript" defer></script>
<script src="footer.js" type="text/javascript" defer></script>
<link rel="stylesheet" href="styles.css" />
<link
rel="apple-touch-icon"
sizes="180x180"
href="favicon_io/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="favicon_io/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="favicon_io/favicon-16x16.png"
/>
<link rel="manifest" href="favicon_io/site.webmanifest" />
<title>Interstellar Development</title>
</head>

18
secret/asteroidDestroyer/explenation.html
View file

@ -5,6 +5,24 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Game Landing Page</title>
<link rel="stylesheet" href="styles.css" />
<link
rel="apple-touch-icon"
sizes="180x180"
href="../../favicon_io/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="../../favicon_io/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="../../favicon_io/favicon-16x16.png"
/>
<link rel="manifest" href="../../favicon_io/site.webmanifest" />
</head>
<body>
<div class="landing-page">

18
secret/asteroidDestroyer/secret.html
View file

@ -5,6 +5,24 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Asteroid Shooter</title>
<link rel="stylesheet" href="style.css" />
<link
rel="apple-touch-icon"
sizes="180x180"
href="../../favicon_io/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="../../favicon_io/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="../../favicon_io/favicon-16x16.png"
/>
<link rel="manifest" href="../../favicon_io/site.webmanifest" />
</head>
<body>
<canvas id="gameCanvas"></canvas>

33
secret/endlessRunner/index.html
View file

@ -0,0 +1,33 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Endless runner</title>
<link
rel="apple-touch-icon"
sizes="180x180"
href="../../favicon_io/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="../../favicon_io/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="../../favicon_io/favicon-16x16.png"
/>
<link rel="manifest" href="../../favicon_io/site.webmanifest" />
</head>
<body>
<div class="game-container">
<canvas id="gameCanvas"></canvas>
<button id="restartBtn" onclick="restartGame()">Restart</button>
</div>
<script src="script.js"></script>
</body>
</html>

78
secret/endlessRunner/script.js
View file

@ -0,0 +1,78 @@
import { useEffect, useRef, useState } from "react";
export default function EndlessRunner() {
const canvasRef = useRef(null);
const [running, setRunning] = useState(true);
const player = { x: 50, y: 150, width: 20, height: 20, dy: 0 };
const gravity = 0.5;
let obstacles = [];
let score = 0;
useEffect(() => {
const canvas = canvasRef.current;
const ctx = canvas.getContext("2d");
canvas.width = window.innerWidth;
canvas.height = 300;
function update() {
if (!running) return;
ctx.clearRect(0, 0, canvas.width, canvas.height);
// Player physics
player.dy += gravity;
player.y += player.dy;
if (player.y > 150) {
player.y = 150;
player.dy = 0;
}
// Draw player
ctx.fillStyle = "blue";
ctx.fillRect(player.x, player.y, player.width, player.height);
// Obstacles
if (Math.random() < 0.02) {
obstacles.push({ x: canvas.width, y: 150, width: 20, height: 20 });
}
obstacles = obstacles.map(obstacle => ({ ...obstacle, x: obstacle.x - 5 }));
obstacles = obstacles.filter(obstacle => obstacle.x + obstacle.width > 0);
obstacles.forEach(obstacle => {
ctx.fillStyle = "red";
ctx.fillRect(obstacle.x, obstacle.y, obstacle.width, obstacle.height);
// Collision detection
if (
player.x < obstacle.x + obstacle.width &&
player.x + player.width > obstacle.x &&
player.y < obstacle.y + obstacle.height &&
player.y + player.height > obstacle.y
) {
setRunning(false);
}
});
// Score
score++;
ctx.fillStyle = "black";
ctx.fillText("Score: " + score, 10, 20);
requestAnimationFrame(update);
}
update();
}, [running]);
function jump() {
if (player.y >= 150) {
player.dy = -10;
}
}
return (
<div className="flex flex-col items-center">
<canvas ref={canvasRef} className="border" onClick={jump}></canvas>
{!running && <button onClick={() => window.location.reload()} className="mt-4 bg-blue-500 text-white px-4 py-2 rounded">Restart</button>}
</div>
);
}

34
secret/endlessRunner/styles.css
View file

@ -0,0 +1,34 @@
body {
margin: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
background-color: #f4f4f4;
}
.game-container {
position: relative;
text-align: center;
}
canvas {
border: 2px solid black;
background-color: white;
display: block;
}
#restartBtn {
margin-top: 10px;
padding: 10px 20px;
font-size: 16px;
background-color: #007bff;
color: white;
border: none;
cursor: pointer;
display: none;
}
#restartBtn:hover {
background-color: #0056b3;
}

18
secret/guessMyNumber/index.html
View file

@ -5,6 +5,24 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Guess My Number</title>
<link rel="stylesheet" href="styles.css" />
<link
rel="apple-touch-icon"
sizes="180x180"
href="../../favicon_io/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="../../favicon_io/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="../../favicon_io/favicon-16x16.png"
/>
<link rel="manifest" href="../../favicon_io/site.webmanifest" />
</head>
<body>
<div class="gameboy">

18
secret/index.html
View file

@ -5,6 +5,24 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Secret Game Collection</title>
<link rel="stylesheet" href="styles.css" />
<link
rel="apple-touch-icon"
sizes="180x180"
href="../favicon_io/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="../favicon_io/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="../favicon_io/favicon-16x16.png"
/>
<link rel="manifest" href="../favicon_io/site.webmanifest" />
</head>
<body>
<header>

76
secret/mineSweeper/index.html
View file

@ -1,30 +1,60 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Minesweeper</title>
<link rel="stylesheet" href="styles.css" />
<link
rel="apple-touch-icon"
sizes="180x180"
href="../../favicon_io/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="../../favicon_io/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="../../favicon_io/favicon-16x16.png"
/>
<link rel="manifest" href="../../favicon_io/site.webmanifest" />
</head>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Minesweeper</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<div id="settings">
<h1>Minesweeper</h1>
<label for="gridSize">Grid Size:</label>
<input
type="number"
id="gridSize"
min="6"
max="25"
value="9"
aria-label="Grid Size"
/>
<body>
<div id="settings">
<h1>Minesweeper</h1>
<label for="gridSize">Grid Size:</label>
<input type="number" id="gridSize" min="6" max="25" value="9" aria-label="Grid Size" />
<label for="bombs">Number of Bombs:</label>
<input
type="number"
id="bombs"
min="1"
max="300"
value="9"
aria-label="Number of Bombs"
/>
<label for="bombs">Number of Bombs:</label>
<input type="number" id="bombs" min="1" max="300" value="9" aria-label="Number of Bombs" />
<button id="startGame">Start Game</button>
</div>
<button id="startGame">Start Game</button>
</div>
<div class="container">
<canvas id="game"></canvas>
</div>
<div class="container">
<canvas id="game"></canvas>
</div>
<script src="script.js"></script>
</body>
</html>
<script src="script.js"></script>
</body>
</html>

18
secret/snake/index.html
View file

@ -5,6 +5,24 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Snake - Game</title>
<link rel="stylesheet" href="styles.css" />
<link
rel="apple-touch-icon"
sizes="180x180"
href="../../favicon_io/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="../../favicon_io/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="../../favicon_io/favicon-16x16.png"
/>
<link rel="manifest" href="../../favicon_io/site.webmanifest" />
</head>
<body>
<div class="gameboy">

18
webGames/index.html
View file

@ -5,6 +5,24 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Game Collection</title>
<link rel="stylesheet" href="styles.css" />
<link
rel="apple-touch-icon"
sizes="180x180"
href="../favicon_io/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="../favicon_io/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="../favicon_io/favicon-16x16.png"
/>
<link rel="manifest" href="../favicon_io/site.webmanifest" />
</head>
<body>
<header>