oazaSrdceWeb / index.php
index.php
Raw
<?php

/**
 * @file index.php
 * @brief Hlavní stránka webu Oáza Srdce.
 *
 * Tento skript:
 *  - Zobrazuje úvodní stránku s informacemi o ubytování, stravování a nadcházejících událostech.
 *  - Načítá a zobrazuje fotografie z databáze.
 *  - Zobrazuje kalendář nadcházejících akcí.
 *  - Obsahuje univerzální navigační menu a patičku s kontaktními informacemi.
 */
?>
<!DOCTYPE html>
<html lang="cs">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <meta name="description" content="V hotelu celoročně zajišťujeme zázemí pro pořádání společenských a firemních akcí, seminářů, sportovních soustředění, dětských pobytů a také ozdravných pobytů.">
  <title>Oaza srdce</title>
  <link
    href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"
    rel="stylesheet" />
  <link rel="stylesheet" href="css/main-2.css" />
  <link rel="icon" href="media/logo-oaza2.png" type="image/x-icon" />
  <meta name="description" content="V hotelu celoročně zajišťujeme zázemí pro pořádání společenských a firemních akcí, seminářů, sportovních soustředění, dětských pobytů a také ozdravných pobytů.">
  <meta name="google-site-verification" content="a56Ms0Omqf0P43FUgjXRQdSFbRYoQbN7OPcX2Iy0OOc" />
</head>

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-FB7MMZ9KBB"></script>
<script>
  window.dataLayer = window.dataLayer || [];

  function gtag() {
    dataLayer.push(arguments);
  }
  gtag('js', new Date());

  gtag('config', 'G-FB7MMZ9KBB');
</script>

<nav>
  <div class="container" id="home">
    <div class="row"></div>
    <div class="row navLinks text-center">
      <div class="col-12 col-md-2 col-lg-2 link mt-3">
        <a href="domů"> Domů </a>
      </div>
      <div class="col-12 col-md-2 col-lg-2 link expandable mt-3">
        <a href="#akce">Akce</a>
        <div class="submenu">
          <a href="semináře">Semináře</a>
          <a href="rekreace">Ozdravné pobyty</a>
          <a href="dětské-pobyty">Dětské pobyty</a>
          <a href="firemní">Firemní</a>
          <a href="ostatní">Ostatní</a>
        </div>
      </div>
      <div class="col-12 col-md-2 col-lg-2 text-center">
        <a href=""><img src="media/logo-oaza2.png" alt="Oaza Srdce logo" width="80px" height="80px" /></a>
      </div>
      <div class="col-12 col-md-2 col-lg-2 link expandable mt-3">
        <a href="fotogalerie">Fotogalerie</a>
        <div class="submenu">
          <a href="blog#tipy-na-výlety">Tipy na výlety</a>
          <a href="blog">Aktuality</a>
        </div>
      </div>
      <div class="col-12 col-md-1 col-lg-1 link expandable mt-3">
        <a href="ceník">Ceník</a>
        <div class="submenu">
          <a href="platební-podmínky">Platební&nbsp;podmínky</a>
        </div>
      </div>
      <div class="col-12 col-md-2 col-lg-2 link expandable mt-3">
        <a href="domů#kontakt">Kontakt</a>
        <div class="submenu">
          <a href="gdpr">Zpracování&nbsp;údajů</a>
          <a href="openPositions.php">Kariéra</a>
        </div>
      </div>
    </div>
  </div>
</nav>

<body>
  <?php
  include 'modal.php'; ///< Načtení modálního okna
  ?>
  <section class="slideShow">
    <?php
    include 'db_connection.php'; ///< Připojení k databázi
    //Načtení nastavené úvodní fotky z databáze
    $sql = "SELECT * FROM mainphoto WHERE ismain = 1";
    $result = $conn->query($sql);
    if ($result->num_rows > 0) {
      while ($row = $result->fetch_assoc()) {
        echo '<img src="' . $row["photo_link"] . '" alt="" class="photo1" />';
      }
    }
    ?>
    <img src="media/line.png" alt="" class="photo2" />
  </section>
  <section class="events" id="akce">
    <div class="heading3">Akce</div>
    <img src="media/wave1.png" alt="" class="bg2 smallGone hideSmTablet" />
    <div class="container boxes">
      <div class="row">
        <div class="col-md-3 col-12 col-lg-3 smallGone hideTablet"></div>
        <div class="col-md-2 col-12 col-lg-2 biggerGone showTablet"></div>
        <div class="col-md-3 col-12 col-lg-3 text-center hideTablet">
          <a href="semináře"><img src="media/2.png" alt="Semináře Bradlo" class="img1" /></a>
        </div>
        <div class="col-md-3 col-12 col-lg-3 text-center hideTablet">
          <a href="rekreace"><img src="media/3.png" alt="Rekreační pobyty Bradlo" class="img2" /></a>
        </div>
        <div class="col-md-4 col-12 col-lg-3 text-center biggerGone showTablet ">
          <a href="semináře"><img src="media/2.png" alt="Semináře Oáza Srdce" class="img1" /></a>
        </div>
        <div class="col-md-4 col-12 col-lg-3 text-center biggerGone showTablet">
          <a href="rekreace"><img src="media/3.png" alt="Rekreační pobyty Oáza Srdce" class="img2" /></a>
        </div>
        <div class="col-md-3 col-lg-3 smallGone hideTablet"></div>

      </div>
      <div class="spacer2 smallGone hideSmTablet"></div>
      <div class="row">
        <div class="col-md-4 col-lg-4 col-12 text-center editSize">
          <a href="dětské-pobyty"><img src="media/4.png" alt="Dětské pobyty Oáza Srdce" class="img2" /></a>
        </div>
        <div class="col-md-4 col-lg-4 col-12 text-center editSize">
          <a href="firemní"><img src="media/5.png" alt="Firemní akce Oáza Srdce" class="img1" /></a>
        </div>
        <div class="col-md-4 col-lg-4 col-12 text-center editSize">
          <a href="ostatní"><img src="media/6.png" alt="Horní Bradlo akce" class="img1" /></a>
        </div>
      </div>
      <div class="spacer smallGone"></div>
      <div class="spacer50 biggerGone smallShow"></div>
    </div>
  </section>
  <section class="rooms smallGone">
    <div class="heading2">Ubytování</div>
    <div class="container">
      <div class="row">
        <div class="col-4 position-relative">
          <img src="media/roomleft.png" alt="Oáza Srdce pokoj1" class="leftRoom" />
          <img src="media/smallWave1.png" alt="" class="smallWave" />
          <p class="smallName">I.kategorie</p>
          <p class="hoverText1">
            Pokoj je vybaven:
            <br class="mb-1" />
            - lůžka
            <br />
            - vlastní koupelna
            <br />
            - WC
            <br />
            - TV
            <br />
            - Wi-Fi
            <br />
            - sedací nábytek
            <br />
            - noční stolky + lampičky
            <br />
            - el. zásuvky
          </p>
        </div>
        <div class="col-4 position-relative">
          <img src="media/roomcenter.png" alt="Oáza Srdce pokoj2" class="centerRoom" />
          <img src="media/smallWavecenter.png" alt="" class="smallWave2" />
          <p class="smallName">II.kategorie</p>
          <p class="hoverText2">
            Pokoj je vybaven:
            <br class="mb-1" />
            - lůžka
            <br />
            - vlastní koupelna
            <br />
            - WC
            <br />
            - TV
            <br />
            - Wi-Fi
            <br />
            - sedací nábytek
            <br />
            - noční stolky + lampičky
            <br />
            - el. zásuvky
          </p>
        </div>
        <div class="col-4 position-relative">
          <img src="media/roomright.png" alt="Oáza Srdce pokoj podkroví" class="rightRoom" />
          <img src="media/smallWaveright.png" alt="" class="smallWave3" />
          <p class="smallName">Původní podkrovní</p>
          <p class="hoverText3">
            Pokoj je vybaven:
            <br class="mb-1" />
            - lůžka
            <br />
            - vlastní koupelna
            <br />
            - TV
            <br />
            - Wi-Fi
            <br />
            - sedací nábytek
            <br />
            - noční stolky + lampičky
            <br />
            - el. zásuvky
          </p>
        </div>
      </div>
    </div>
    <div class="spacer"></div>
  </section>
  <!-- Mobilní verze -->
  <section class="rooms smallShow biggerGone">
    <div class="heading2">Ubytování</div>
    <div class="container">
      <div class="row">
        <div class="col-4 position-relative">
          <img src="media/roomleft.png" alt="Oáza Srdce pokoj1" class="centerRoom" />
          <img src="media/smallWave1.png" alt="" class="smallWave2" />
          <p class="smallName">I.kategorie</p>
          <p class="hoverText1">
            Pokoj je vybaven:
            <br class="mb-1" />
            - lůžka
            <br />
            - vlastní koupelna
            <br />
            - WC
            <br />
            - TV
            <br />
            - Wi-Fi
            <br />
            - sedací nábytek
            <br />
            - noční stolky + lampičky
            <br />
            - el. zásuvky
          </p>
        </div>
        <div class="col-4 position-relative">
          <img src="media/roomcenter.png" alt="Oáza Srdce pokoj2" class="centerRoom" />
          <img src="media/smallWavecenter.png" alt="" class="smallWave2" />
          <p class="smallName">II.kategorie</p>
          <p class="hoverText2">
            Pokoj je vybaven:
            <br class="mb-1" />
            - lůžka
            <br />
            - vlastní koupelna
            <br />
            - WC
            <br />
            - TV
            <br />
            - Wi-Fi
            <br />
            - sedací nábytek
            <br />
            - noční stolky + lampičky
            <br />
            - el. zásuvky
          </p>
        </div>
        <div class="col-4 position-relative">
          <img src="media/roomright.png" alt="Oáza Srdce pokoj podkroví" class="centerRoom" />
          <img src="media/smallWaveright.png" alt="" class="smallWave2" />
          <p class="smallName">Původní podkrovní</p>
          <p class="hoverText3">
            Pokoj je vybaven:
            <br class="mb-1" />
            - lůžka
            <br />
            - vlastní koupelna
            <br />
            - TV
            <br />
            - Wi-Fi
            <br />
            - sedací nábytek
            <br />
            - noční stolky + lampičky
            <br />
            - el. zásuvky
          </p>
        </div>
      </div>
    </div>
    <div class="spacer smallGone"></div>
    <div class="spacer2 biggerGone smallShow"></div>
  </section>
  <section class="food smallShow biggerGone">
    <div class="heading3">Stravování</div>
    <div class="container">
      <div class="row foodBar">
        <div class="col-6 foodBtn left" id="vegetarian">
          <h4>Vegetariánská</h4>
        </div>
        <div class="col-6 foodBtn side" id="vegan">
          <h4>Veganská</h4>
        </div>
        <div class="col-4 foodBtn center" id="raw">
          <h4>Živá / Raw</h4>
        </div>
        <div class="col-4 foodBtn side" id="combi">
          <h4>Živá / Combi</h4>
        </div>
        <div class="col-4 foodBtn right" id="meat">
          <h4>Domací masitá</h4>
        </div>
        <div class="col-1"></div>
      </div>
      <div class="spacer2"></div>
      <div class="row foodBoxes">
        <div class="col-md-4 col-lg-4 col-12">
          <h3>Snídaně</h3>
          <div class="foodBox text-center">
            <h5>Vegetariánská</h5>
            <p>170,-</p>
          </div>
        </div>
        <div class="col-md-4 col-lg-4 col-12">
          <h3>Oběd</h3>
          <div class="foodBox text-center">
            <h5>Vegetariánská</h5>
            <p>220,-</p>
          </div>
        </div>
        <div class="col-md-4 col-lg-4 col-12">
          <h3>Večeře</h3>
          <div class="foodBox text-center">
            <h5>Vegetariánská</h5>
            <p>200,-</p>
          </div>
        </div>
      </div>
    </div>
    <div class="spacer"></div>
  </section>
  <!-- Konec mobilní verze -->
  <section class="food smallGone">
    <div class="heading3">Stravování</div>
    <div class="container">
      <div class="row foodBar">
        <div class="col-1 hideSmTablet"></div>
        <div class="col-2 foodBtnMain left" id="vegetarian">
          <h4>Vegetariánská</h4>
        </div>
        <div class="col-2 foodBtnMain side" id="vegan">
          <h4>Veganská</h4>
        </div>
        <div class="col-2 foodBtnMain center" id="raw">
          <h4>Živá / Raw</h4>
        </div>
        <div class="col-2 foodBtnMain side" id="combi">
          <h4>Živá / Combi</h4>
        </div>
        <div class="col-2 foodBtnMain right" id="meat">
          <h4>Domací masitá</h4>
        </div>
        <div class="col-1 hideSmTablet"></div>
      </div>
      <div class="spacer2"></div>
      <div class="row foodBoxesMain">
        <div class="col-4">
          <h3>Snídaně</h3>
          <div class="foodBoxMain text-center">
            <img src="media/logo-oaza.png" alt="" />
            <div class="spacer3"></div>
            <h5>Vegetariánská</h5>
            <p>170,-</p>
          </div>
        </div>
        <div class="col-4">
          <h3>Oběd</h3>
          <div class="foodBoxMain text-center">
            <img src="media/logo-oaza.png" alt="" />
            <div class="spacer3"></div>
            <h5>Vegetariánská</h5>
            <p>220,-</p>
          </div>
        </div>
        <div class="col-4">
          <h3>Večeře</h3>
          <div class="foodBoxMain text-center">
            <img src="media/logo-oaza.png" alt="" />
            <div class="spacer3"></div>
            <h5>Vegetariánská</h5>
            <p>200,-</p>
          </div>
        </div>
      </div>
    </div>
    <div class="spacer smallGone hideSmTablet"></div>
  </section>
  <section class="upcoming">
    <img src="media/lineWave.png" alt="" />
    <div class="spacer-height smallGone hideSmTablet hideTablet"></div>
    <div class="spacer biggerGone smallGone showTablet showSmTablet"></div>
    <div class="spacer4 biggerGone smallShow "></div>
    <div class="spacer50 biggerGone showTablet  smallShow"></div>
    <div class="heading2" id="modalPlace">Nadcházející události</div>
    <div class="spacer4"></div>
    <div class="container">
      <div class="row">
        <div class="col-md-8 col-lg-8 col-12 text-center calendar">
          <h3>Kalendář</h3>
          <?php
          // Načtení a zobrazení kalendáře s událostmi z databáze
          include 'Calendar.php'; ///< Třída s kalendářem
          include 'db_connection.php';  ///< Připojení k databázi
          Calendar::handleAjaxRequest($conn); ///< Zpracování AJAX požadavků bez refreshe stránky
          $calendar = new Calendar();
          $calendar->load_events_from_db($conn);
          echo $calendar;
          ?>
        </div>
        <div class="col-md-4 col-lg-4 col-12 text-center">
          <div class="spacer50 biggerGone smallShow"></div>
          <h3>Výpis nejbližších akcí</h3>
          <div class="container eventBox">
            <div class="row">
              <div class="col-12">
                <div class="spacer50">
                </div>
                <div class="spacer3"></div>
                <div class="spacer3"></div>

              </div>
              <?php
              include 'db_connection.php';  ///< Připojení k databázi
              $conn->set_charset("utf8mb4");
              // Načtení nejbližších 5 událostí z databáze
              $sql = "SELECT * FROM lectors, events WHERE events.lector_id = lectors.id AND events.timefrom >= CURDATE() ORDER BY events.timefrom ASC LIMIT 5";
              $result = $conn->query($sql);
              $dateToday = date('Y-m-d');
              $events = [];
              if ($result->num_rows > 0) {
                while ($row = $result->fetch_assoc()) {
                  $events[] = $row;
                }
              }
              ?>
              <?php
              if (!empty($events)) {
                foreach ($events as $row) {
                  if (strtotime($dateToday) <= strtotime($row["timefrom"])) {
                    echo '<div class="event-card p-2 medailonek-link" data-url="?lectorId=' . $row["lector_id"] . '&eventId=' . $row["id"] . '#modalPlace">';
                    echo '  <div class="d-flex">';
                    echo '    <div class="eventTime">';
                    echo '      <p class="date-time m-0">' . date('d-m-Y', strtotime($row["timefrom"])) . '</p>';
                    echo '      <p class="date-time m-0">' . date('d-m-Y', strtotime($row["timeto"])) . '</p>';
                    echo '    </div>';
                    echo '    <div>';
                    echo '      <p class="event-title m-0">' . $row["heading"] . '</p>';
                    echo '      <p class="event-details m-0">';
                    echo '        <span class="organizer">' . $row["name"] . '</span>';
                    echo '        <span class="eventContact">' . ($row["tel"] ? $row["tel"] : $row["email"]) . '</span>';
                    echo '      </p>';
                    echo '    </div>';
                    echo '  </div>';
                    echo '</div>';
                  }
                }
              }
              ?>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="spacer-medium showSmTablet smallGone"></div>
  </section>
  <section class="newInfo">
    <div class="heading3">Aktuality</div>
    <div class="spacer4"></div>
    <div class="container">
      <div class="row">
        <?php
        include 'db_connection.php'; ///< Připojení k databázi
        $conn->set_charset("utf8mb4");
        // Načtení nejnovějších 3 aktualit z databáze
        $sql = "SELECT * FROM aktuality ORDER BY date DESC LIMIT 3";
        $result = $conn->query($sql);

        if ($result->num_rows > 0) {
          while ($row = $result->fetch_assoc()) {
            echo '<a href="aktuality.php?id=' . $row["id"] . '" class="card-link">';
            echo '  <div class="col-4 card text-center">';
            echo '    <img src="' . $row["photo"] . '" alt="" />';
            echo '    <h4>' . $row["name"] . '</h4>';
            echo '    <p>' . $row["date"] . '</p>';
            echo '    <p>' . $row["preview"] . '</p>';
            echo '  </div>';
            echo '</a>';
          }
        }
        ?>
      </div>
    </div>
    <div class="spacer4 smallGone"></div>
  </section>
  <section class="contact">
    <div class="spacer smallGone"></div>
    <div class="spacer4 smallGone"></div>
    <div class="container contactTop text-center" id="kontakt">
      <div class="row">
        <div class="col-md-4 col-lg-4 col-12 smallGone hideSmTablet"><img src="media/waveLeft.png" alt="" /></div>
        <div class="col-md-4 col-lg-4 col-12">
          <div class="heading2 mt-5">Kontakt</div>
        </div>
        <div class="col-md-4 col-lg-4 col-12 smallGone hideSmTablet"><img src="media/waveRight.png" alt="" /></div>
      </div>
    </div>
    <div class="spacer4"></div>
    <div class="container contactBott text-center">
      <div class="row" id="center">
        <div class="col-md-4 col-lg-4 col-12">
          <div class="contactBox mb-2">
            <h4>Email</h4>
            <p>vrsovskabrana@email.cz</p>
          </div>
        </div>
        <div class="col-md-4 col-lg-4 col-12">
          <div class="contactBox mb-2">
            <h4>Adresa</h4>
            <p>Vršov 19, Horní Bradlo</p>
          </div>
        </div>
        <div class="col-md-4 col-lg-4 col-12">
          <div class="contactBox mb-2">
            <h4>Telefon</h4>
            <p>+420 606 892 843<br>+420 724 229 719</p>
          </div>
        </div>
        <div class="col-12 smallGone hideSmTablet">
          <div class="spacer50 "></div>
        </div>
        <div class="col-md-2 col-lg-2"></div>
        <div class="col-md-4 col-lg-4 col-12">
          <div class="contactBox mb-2">
            <h4>Jednatelka společnosti</h4>
            <p>
              Jana Plačeková<br />+420 606 094 301<br />placekova@oazasrdce.cz<br />
            </p>
          </div>
        </div>
        <div class="col-md-4 col-lg-4 col-12">
          <div class="contactBox mb-2">
            <h4 class="mt-4">Provozovatel</h4>
            <p>
              Vršovská Brána s.r.o.<br />Vršov 19<br />Horní Bradlo 539 53<br />IČO: 62024451, DIČ: CZ62024451
            </p>
          </div>
        </div>
        <div class="col-md-2 col-lg-2"></div>
      </div>
    </div>
    <div class="spacer smallShow "></div>
    <div class="spacer50 smallGone"></div>
  </section>
  <div id="cookieConsent" class="cookie-consent">
    <div class="container">
      <div class="row">
        <div class="col-12">
          <p>Soubory cookies používáme k zajištění správného fungování a bezpečnosti našich webových stránek a pomáhají nám nabídnout vám nejlepší možnou uživatelskou zkušenost.</p>
        </div>
        <div class="col-12 text-right">
          <button id="acceptCookies" class="btn btn-primary">Přijmout vše</button>
          <button id="onlyCookies" class="btn btn-secondary">Pouze nezbytné</button>
          <button id="declineCookies" class="btn btn-secondary">Odmítnout</button>
        </div>
      </div>
    </div>
  </div>
  <!-- Plovoucí odkaz na facebook profil-->
  <a href="https://www.facebook.com/profile.php?id=61579580219281"
    target="_blank"
    title="Sledujte nás na Facebooku"
    style="position: fixed;
              right: 25px;
              top: 30%;
              width: 50px;
              height: 50px;
              background: rgba(61, 143, 213, 0.95);
              backdrop-filter: blur(10px);
              border-radius: 12px;
              display: flex;
              align-items: center;
              justify-content: center;
              transition: all 0.3s ease;
              z-index: 1000;
              text-decoration: none;
              border: 2px solid rgba(255,255,255,0.2);
              box-shadow: 0 4px 15px rgba(61,143,213,0.3);"
    onmouseover="this.style.background='rgba(61, 143, 213, 1)'; 
                    this.style.transform='translateX(-5px)'; 
                    this.style.boxShadow='0 6px 20px rgba(61,143,213,0.4)';"
    onmouseout="this.style.background='rgba(61, 143, 213, 0.85)'; 
                   this.style.transform='translateX(0)'; 
                   this.style.boxShadow='0 4px 15px rgba(61,143,213,0.3)';">
    <svg viewBox="0 0 24 24" style="fill: white; width: 24px; height: 24px;">
      <path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z" />
    </svg>
  </a>
  <footer>
    <div class="container">
      <div class="row text-center">
        <div class="col-4 mt-2">
          <p>+420 606 892 843</p>
        </div>
        <div class="col-4 mt-2"><a href="">©Oáza Srdce</a></div>
        <div class="col-4 mt-2"><a href="gdpr">GDPR</a></div>
      </div>
    </div>
  </footer>
  <script src="main.v-2.js"></script>
  <script>
    // Otevření modálního okna při načtení stránky, pokud jsou v URL parametry
    function closeModal(modalId) {
      document.getElementById(modalId).style.display = 'none';
      document.querySelector('.modal-backdrop').remove();
      window.history.pushState({}, document.title, window.location.pathname);
    }
  </script>
  <script>
    // Zpracování souhlasu s cookies
    document.addEventListener('DOMContentLoaded', function() {
      const cookieConsent = document.getElementById('cookieConsent');
      const acceptCookies = document.getElementById('acceptCookies');
      const onlyCookies = document.getElementById('onlyCookies');
      const declineCookies = document.getElementById('declineCookies');
      const consentValue = localStorage.getItem('cookieConsent');

      // Zobrazení banneru, pokud uživatel ještě nevyjádřil svůj názor
      if (!consentValue) {
        cookieConsent.style.display = 'block';
      }

      // Funkce pro zpracování volby uživatele
      function handleCookieConsent(choice) {
        localStorage.setItem('cookieConsent', choice);
        cookieConsent.style.display = 'none';
        console.log('Cookie consent has been set to:', choice);
      }

      // Event listenery pro tlačítka
      acceptCookies.addEventListener('click', function() {
        handleCookieConsent('accepted');
      });

      onlyCookies.addEventListener('click', function() {
        handleCookieConsent('onlyNecessary');
      });

      declineCookies.addEventListener('click', function() {
        handleCookieConsent('declined');
      });
    });
  </script>
</body>

</html>