added php functionality and php source in main html

2025-12-02 12:26:29 +01:00 · 2025-12-02 12:26:29 +01:00 · f7736c9076
commit f7736c9076
parent 0199d7e056
2 changed files with 138 additions and 2 deletions
--- a/spacetaxi.html
+++ b/spacetaxi.html
@ -9,7 +9,7 @@
 </head>

 <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 id="logo">
                <p id="unternehmen">astroID</p>
--- a/spacetaxi.php
+++ b/spacetaxi.php
@ -1,5 +1,141 @@
 <?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>