<?php
// Gribbity Grabbity that's not a battery
// RELEASE v1.2.0
session_start();
// require_once "./Resources/config.php";
// These vars will be grabbed from db eventually to enable faster modifications to the whole site.
// Technically just for experimentation with site design, but could be kept for production build.
// Primary content:
$primaryBG = "#020202"; // Very dark grey (nearly black)
$primaryC = "#ffffff"; // White
// Site stuff:
$siteName = "Ventus";
$logoSubtext = "Aerial environmental protection in seconds.";
// Other:
$adminURLC = "#f585ff"; // Admin URL color (set to pink)
$navBG = ""; // Nav bar background color (not implemented)
$navC = ""; // Nav bar text color (not implemented)
// For enforcing font usage, made into a variable for things where there isn't a quote left to use.
$montserrat = "font-family: 'Montserrat', sans-serif !important;";

// Footer content:
$ftBG = "#151515"; // Dark Grey
$ftBG2 = "#101010"; // Darker grey
$ftC = "#ffffff"; // White
$ftC2 = "#fefefe"; // Very light grey
// Footer link extensions
$liEXT = "dylanjhbuchanan"; // LinkedIn extension
$ghEXT = "BehemothNano"; // GitHub extension
?>
<!doctype html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <?php echo "<title>$siteName - Home</title>"; ?>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;1,100;1,200;1,300;1,400&display=swap" rel="stylesheet">
    <link href="./Resources/global.css" rel="stylesheet">
    <script defer type="text/javascript" src="./Resources/global.js"></script>
  </head>
  <?php
  echo "
  <body style='background-color: $primaryBG; color: $primaryC; $montserrat font-weight: 200;'>
  ";
  ?>
    <div id="contextOverlay" class="overlay" onclick="overlay('contactOverlay', 0)">
      <div class='d-flex justify-content-center overlayText'>
        <h2 class='ms-4' id='contact' style="font-family: 'Montserrat', sans-serif !important;">Contact Us:</h2>
      </div>
      <div class='wrapper d-flex justify-content-center overlayText'>
        <?php
          echo "
          <form action='./contact.php' method='post' style='$montserrat'>
            <div class='form-group ms-4'>
              <label for='msg'>Message:</label><br />
              <input type='text' name='msg' value=''>
              <br />
              <br />
              <label for='name'>Email:</label><br />
              <input type='text' name='name' value=''>
              ";
          if (isset($_SESSION['userID'])) {
            $authorID = $_SESSION['userID'];
            echo "
              <input type='hidden' name='authorID' value='$authorID'>
            ";
          }
          echo '
            </div>
          </form>
          ';
        ?>
      </div>
    </div>
    <?php
      if (isset($_SESSION["fatal"]) && $_SESSION["fatal"]) {
        if (isset($_SESSION['failureMSG'])) {
          $failureMSG = $_SESSION['failureMSG'];
        } else {
          $failureMSG = "An error occured. Please try again later.";
        }
        echo "
        <div class='alert alert-dismissible fade show' style='background-color: #ff6e7c; color: #96181e; $montserrat' role='alert'>
          $failureMSG
          <button type='button' class='btn-close' data-bs-dismiss='alert' aria-label='Close' style='$montserrat'></button>
        </div>
        <br />
        <br />
        ";
        $_SESSION["fatal"] = false;
        $_SESSION["failureMSG"] = "";
      }
      if (isset($_SESSION["oSuccess"]) && $_SESSION["oSuccess"]) {
        if (isset($_SESSION['successMSG'])) {
          $successMSG = $_SESSION['successMSG'];
        } else {
          $successMSG = "Operation successful.";
        }
        echo "
        <div class='alert alert-dismissible fade show' style='background-color: #abedbb; color: #5cb85c; $montserrat' role='alert'>
          $successMSG
          <button type='button' class='btn-close' data-bs-dismiss='alert' aria-label='Close' style='$montserrat'></button>
        </div>
        <br />
        <br />
        ";
        $_SESSION["oSuccess"] = false;
        $_SESSION["successMSG"] = "";
      }
    ?>
    <div style="text-align: center; font-family: 'Montserrat', sans-serif !important; font-size: 80px; font-weight: 300;">
      <?php
        echo "
        <p class='mtsrt' style='display: inline; $montserrat'>$siteName</p>
        <p class='mtsrt' style='font-size: 16px !important; $montserrat'>$logoSubtext</p>
        ";
      ?>
    </div>
    <nav class="navbar navbar-expand-lg" style="background-color: #101010; font-family: 'Montserrat', sans-serif !important;">
      <div class="container-fluid">
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarSupportedContent" style="font-family: 'Montserrat', sans-serif !important;">
          <ul class="navbar-nav me-auto mb-2 mb-lg-0">
            <li class="nav-item">
              <a class="nav-link navbar-brand" style="color: #ffffff;" aria-current="page" href="./home.php">Home</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" style="color: #ffffff;" href="./projects.php">My Work</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" style="color: #ffffff;" href="./news.php">News</a>
            </li>
          </ul>
          <li class="nav-item dropstart me-4" style="list-style: none;">
            <a class="nav-link" style="color: #ffffff;" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
              Menu
            </a>
            <ul class="dropdown-menu">
              <li><a class="dropdown-item" onclick="overlay('contactOverlay', 1)" style="font-family: 'Montserrat', sans-serif !important; font-weight: 200 !important;">Contact</a></li>
              <li><a class="dropdown-item" onclick="overlay('supportOverlay', 1)" style="font-family: 'Montserrat', sans-serif !important; font-weight: 200 !important;">Support</a></li>
              <li><a class="dropdown-item" href="./settings.php" style="font-family: 'Montserrat', sans-serif !important; font-weight: 200 !important;">Settings</a></li>
              <li><hr class="dropdown-divider"></li>
              <?php
                if (isset($_SESSION["loggedIn"]) && $_SESSION["loggedIn"]) {
                  if ($_SESSION["scope"] == "admin") {
                    echo "
                    <a class='dropdown-item' style='color:$adminURLC; $montserrat font-weight: 200 !important;' href='./Helpers/edit-announcements.php'>Edit Announcements</a>
                    <a class='dropdown-item' style='color:$adminURLC; $montserrat font-weight: 200 !important;' href='./Helpers/edit-quotes.php'>Edit Projects</a>
                    <div class='dropdown-divider'></div>
                    ";
                  }
                  echo "
                  <li><a class='dropdown-item text-secondary' style='$montserrat font-weight: 200 !important;' href='./reset.php'>Reset Password</a></li>
                  <li><a class='dropdown-item text-danger' style='$montserrat font-weight: 200 !important;' href='./logout.php'>Log Out</a></li>
                  ";
                } else {
                  echo "
                  <li><a class='dropdown-item text-secondary' style='$montserrat font-weight: 200 !important;' href='./login.php'>Log In</a></li>
                  <li><a class='dropdown-item text-primary' style='$montserrat font-weight: 200 !important;' href='./register.php'>Sign Up</a></li>
                  ";
                }
              ?>
            </ul>
          </li>
        </div>
      </div>
    </nav>
    <a href='./ventus-getting-started.php' target='_blank'><img src='./Images/Ocean5.jpeg' class='d-block w-100' alt='Ocean5.jpeg'></a>
        <p style='text-align: center !important; font-size: 60px !important; font-family: "Montserrat", sans-serif !important; font-weight: 200 !important;'>
          There isn't much left. We need to protect what we still have.
        </p>
    <div class="ms-4 me-4">
      <br />
      <br />
      <br />
      <br />
      <br />
      <br />
      <br />
      <br />
      <p class='ms-2 me-2' style='font-size: 52px !important; font-family: "Montserrat", sans-serif !important; font-weight: 300 !important; text-align: center;'>
        Introducing Ventus.
      </p>
      <p class='ms-2 me-2' style='font-size: 32px !important; font-weight: 100 !important; text-align: center;'>
        A lightweight, accessible, and modular drone-based aerial security system with real time person detection, Ventus allows the 
        usage of drones to secure environmentally sensitive areas with the help of machine learning and GPS Real Time Kinematics. 
      </p>
      <br />
      <br />
      <!-- <p>Image relevant to above example</p> -->
      <br />
      <br />
      <br />
      <br />
      <p class='ms-2 me-2' style='font-size: 52px !important; font-family: "Montserrat", sans-serif !important; font-weight: 300 !important; text-align: center;'>
        People. No longer part of the equation. 
      </p>
      <p class='ms-2 me-2' style='font-size: 32px !important; font-weight: 100 !important; text-align: center;'>
        Ventus eliminates the need to have park rangers or other authorities patrolling the protected area, which not only reduces 
        the risk of people being harmed while working, but also leaves the environment less disturbed. When a person or other 
        object of interest is found, its location is sent back without any need for an operator.
      </p>
      <br />
      <br />
      <!-- <p>Image relevant to above example</p> -->
      <br />
      <br />
      <br />
      <br />
      <p class='ms-2 me-2' style='font-size: 52px !important; font-family: "Montserrat", sans-serif !important; font-weight: 300 !important; text-align: center;'>
        Connectivity in Seconds.
      </p>
      <p class='ms-2 me-2' style='font-size: 32px !important; font-weight: 100 !important; text-align: center;'>
        Ventus utilizes a LoRa networking system to enable communication in the most remote environments. This eliminates the need 
        for a Cellular, WiFi, or other network to be present in the protected area, making deployment easier than ever.
      </p>
      <br />
      <br />
      <!-- <p>Image relevant to above example</p> -->
      <br />
      <br />
      <br />
      <br />
      <p class='ms-2 me-2' style='font-size: 52px !important; font-family: "Montserrat", sans-serif !important; font-weight: 300 !important; text-align: center;'>
        Modularity.
      </p>
      <p class='ms-2 me-2' style='font-size: 32px !important; font-weight: 100 !important; text-align: center;'>
        Ventus is built around a class system - a leader, a second in command, and followers. While it is recommended to use three 
        to five drones, you can use 2 at minimum, or a maximum of however many will connect to the primary drone.
      </p>
      <br />
      <br />
      <!-- <p>Image relevant to above example</p> -->
      <br />
      <br />
      <br />
      <br />
      <p class='ms-2 me-2' style='font-size: 52px !important; font-family: "Montserrat", sans-serif !important; font-weight: 300 !important; text-align: center;'>
        Division of Labor.
      </p>
      <p class='ms-2 me-2' style='font-size: 32px !important; font-weight: 100 !important; text-align: center;'>
        Ventus' class system allows for the usage of more powerful equipment in the sky. All classification is done on board 
        in real time, and distributing video capture, GPS, and classification allows for the usage of more advanced drones 
        while still adhereing to weight limits.
      </p>
      <br />
      <br />
      <br />
      <br />
      <br />
      <p class='ms-2 me-2' style='font-size: 52px !important; font-family: "Montserrat", sans-serif !important; font-weight: 300 !important; text-align: center;'>
        Open Source.
      </p>
      <p class='ms-2 me-2' style='font-size: 32px !important; font-weight: 100 !important; text-align: center;'>
        The goal of Ventus is to enable users to secure otherwise difficult to monitor areas to prevent the unwanted presense of 
        people in the area to make environmental protection a more accessible objective. By being an open source project, end users 
        can freely use and modify the software to perfectly suit their application, and by being free for usage in environmental protection,
        groups that previously didn't have the ability to properly secure an environmentally sensitive area now can.
      </p>
      <br />
      <br />
      <br />
      <br />
    </div>
    <div class="imgContainer">
      <img src="./Images/Ocean2.jpeg" alt="Download bg image" style="width:100%;">
      <div class="imgCtTxtCntr">
        <a style='font-size: 52px !important; font-family: "Montserrat", sans-serif !important; font-weight: 400 !important; text-align: center;' href='./ventus-getting-started.php' target='_blank'>
          Get Started
        </a>
      </div>
    </div>
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <div style="font-family: 'Montserrat', sans-serif; font-weight: 300;" class='ms-0 mt-0 me-0 mb-0'>
    <?php
      $contactOT = "contactOverlay";
      $contactOS = 1;
      echo "
      <!-- Page Footer -->
      <div style='background-color: $ftBG'>
        <div style='background-color: $ftBG2; color: $ftC2; text-align: center'; class='mb-0'>
          <p style='font-size: 30px; $montserrat font-weight 200 !important;' class='mt-4 mb-3'>Contact:</p>
          <p style='font-size: 18px; $montserrat font-weight 200 !important;'>contact@djhbuchanan.com</p>
          <a style='$montserrat font-weight 200 !important;' onclick='contactOverlay($contactOT, $contactOS)'>Or, send a message</a>
          <hr />
        </div>
        <nav class='navbar navbar-expand-lg mt-0 mb-0' style='background-color: $ftBG; $montserrat font-weight 200 !important;'>
          <div class='container-fluid'>
            <a style='$montserrat font-weight 200 !important;' class='navbar-brand' href='./home.php'>
              <!-- Logo icon: <img src='/path/logo.svg' alt='' width='30' height='24'> -->
              <p style='color: $ftC; $montserrat font-weight 200 !important;' class='ms-2 mt-1'>Logo</p>
            <a>
            <div class='navbar-nav'>
              <a class='nav-link' style='color: $ftC; $montserrat font-weight 200 !important;' href='./Extras/terms-of-service.php'>Terms of Service</a>
              <a class='nav-link' style='color: $ftC; $montserrat font-weight 200 !important;' href='./Extras/privacy-notice.php'>Privacy Notice</a>
              <a class='nav-link' style='color: $ftC; $montserrat font-weight 200 !important;' href='./Extras/accessibility.php'>Accessibility</a>
              <a class='nav-link' style='color: $ftC; $montserrat font-weight 200 !important;' href='./Extras/site-map.php'>Site Map</a>
              <a class='nav-link' style='color: $ftC; $montserrat font-weight 200 !important;' href='https://github.com/$ghEXT' target='_blank'>GitHub</a>
              <a class='nav-link' style='color: $ftC; $montserrat font-weight 200 !important;' href='https://www.linkedin.com/in/$liEXT' target='_blank'>LinkedIn</a>
            </div>
          </div>
        </nav>
      </div>
      <div style='background-color: $ftBG;'>
        <!-- Bottom Spacer -->
        <br />
      </div>
      ";
    ?>
    </div>
  </body>
</html>

<?php
  // mysqli_close($link);
?>