3n+1 - Problem

Show / Hide code
        
<html>
  <head>
    <title>Quiz</title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <style>

      body {
        margin: 0;
        font-family: Arial, sans-serif;
      }

      h1 {
        width: 100%;
        font-size: 3em;
        background-color: #fec055;
        margin: 0;
        text-align: center;
        padding: 0.25em 0;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }

      h2 {
        font-size: 2.5em;
        margin: 0;
        padding: 0.25em 0;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }

      form {
        margin: 1em;
        font-size: 1.5em;
      }

      input,
      label {
        cursor: pointer;
      }

      input {
        font-size: 1.2em;
        cursor: text;
      }

      .submit {
        height: 2.5em;
        width: 8em;
        font-size: 2em;
        background-color: #fec055;
        border: 0;
        margin-top: 0.5em;
        text-align: center;
        position: absolute;
        left: 50%;
        margin-left: -4em;
        line-height: 2.5em;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }

      @media (max-width: 400px) {

        .submit {
          width: 100%;
          margin-left: 0;
          left: 0;
        }

        input[type="text"] {
          width: 100%;
        }

      }

    </style>

  </head>
  <body>
    <h1>3n+1 - Problem</h1>

    <?php

      $name = $_GET["name"];
      $zahl = $_GET["zahl"];

      if ($name == "") {
        echo "<h2>Gib einen gültigen Namen ein.</h2>";
      }

      if ($zahl == "") {
        echo "<h2>Gib eine gültige Zahl ein.</h2>";
      }

      if ($name != "" && $zahl != "") {

        $x = $zahl;

        $count = 0;

        while ($x != 1) {

          if ($x % 2 == 0) {
            $x = $x / 2;
          } else {
            $x = 3 * $x + 1;
          };

          $count = $count + 1;
        }

        echo "<h2>Hallo ".$name."</h2><br>";
        echo "<h2>Deine Zahl ist ".$zahl."</h2><br>";
        echo "<h2>Um zu 1 zu kommen, hat es ".$count." Schritte gebraucht.</h2>";
        echo "<br><hr><br>";

      }

    ?>

    <form action="index.php">
      <input type="text" name="name" placeholder="Name" value="<?php echo $name; ?>">
      <input type="number" name="zahl" min="1" max="99" placeholder="<?php echo rand(1, 99); ?>">
      <div class="submit">Absenden</div>
    </form>

    <script>
      var submit = document.querySelector(".submit");
      var form = document.querySelector("form");

      submit.addEventListener("click", function(){
        form.submit()
      });
    </script>
  </body>
</html>