camill/spacetaxi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added php functionality and php source in main html

Browse Source
This commit is contained in:
camill 2025-12-02 12:26:29 +01:00
parent 0199d7e056
commit f7736c9076
2 changed files with 138 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
spacetaxi.html
View File

@ -9,7 +9,7 @@
</head> </head>
<body> <body>
<form method="post" action="http://info.mi.hs-offenburg.de/~tom/formGetPost.php"> <form method="post" action="spacetaxi.php">
<div class="zelle" id="account"> <div class="zelle" id="account">
<div id="logo"> <div id="logo">
<p id="unternehmen">astroID</p> <p id="unternehmen">astroID</p>

136
spacetaxi.php
View File

@ -1,5 +1,141 @@
<?php <?php
$username = htmlspecialchars($_GET["username"]);
$rocket = $_GET["spaceship"];
switch($rocket)
{
case "rocket1": $rocket = "Ariane 5 ECA"; break;
case "rocket2": $rocket = "Saturn V"; break;
case "rocket3": $rocket = "Langer Marsch 5"; break;
}
?> ?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>SpaceTaxi Quittung</title>
<style>
body {
display: flex;
align-content: center;
background-color: black;
color: white;
overflow: hidden;
font-weight: bold;
font-size: 350%;
}
span {
color: goldenrod;
}
.plane {
/* Für möglichst symmetrisch, muss left proportional zu width sein*/
height: 50vw;
width: 60vw;
bottom: 0;
left: 20vw;
/*Erstellt eine Ebene mit einem Neigungsgrad von 20*/
transform: perspective(250px) rotateX(20deg);
transform-origin: 50% 100%;
text-align: center;
position: absolute;
}
.plane:after {
bottom: 60%;
left: 0;
right: 0;
top: 0;
content: ' ';
position: absolute;
}
.content {
/* 60 Sekunden Animation, die in 3 Sekunden eingeblendet wird */
animation: scroll 60s linear 3s;
position: absolute;
top: 100%;
}
@keyframes scroll {
0% {
top: 100%;
}
100% {
top: -150%;
}
}
particle {
border-radius: 50%;
left: 0;
pointer-events: none;
position: fixed;
top: 0;
opacity: 0;
}
</style>
<script>
document.addEventListener('DOMContentLoaded', init);
function init() {
create_star_field(100);
}
function create_star_field(n) {
for (let i = 0; i < n; i++) {
create_star();
}
}
function create_star() {
const x = Math.floor(Math.random() * window.innerWidth);
const y = Math.floor(Math.random() * window.innerHeight);
const star = document.createElement('particle');
document.body.appendChild(star);
star.style.position = 'absolute';
star.style.opacity = '1';
star.style.zIndex = '-1';
const size = Math.round(Math.random() * 5);
star.style.height = `${size}px`;
star.style.width = `${size}px`;
star.style.background = '#ffffff';
star.style.left = `${x}px`;
star.style.top = `${y}px`;
}
</script>
</head>
<body>
<div class="plane">
<div class="content">
<p>Der Astronaut <span><?php echo $username;?></span> reiste durch die Galaxies und kämpfte für das Gute.</p>
<p>Mit seinem Raumschiff, die <span><?php echo $rocket;?></span>, befreite er ganze <span>5 Planeten</span> von dem Bösen.</p>
<p>Ausgestattet mit <span>Schwebepizza</span>, <span>PV-Panel</span>, <span>Rover</span> und einer mutigen Crew, flog er ganze <span>5 Jahre</span> durch das All.</p>
<p>Mit dem Kopfgeld der Bösen, von ingesamt <span>5M Dollarn</span>, finanzierte er sich seine Heldensreise.</p>
<p>Auf ein neues Abenteuer, <span>username</span>!</p>
</div>
</div>
</body>
</html>