<?php
$host = "blueris.beget.tech";
$username = "blueris_base";
$password = "Qwer123.";
$database = "blueris_base";
$mysql = new mysqli($host, $username, $password, $database);


if($mysql->connect_error){
    die("Ошибка подключения". $mysql->connect_error);
}
?>

<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./styles/style.css">
    <title>Методический центр "Технология"</title>
   
</head>
<body>

    <header class="header">
        <div class="header-logo">
            <img src="img/лого.png" alt="Логотип методического центра">
        </div>
        <div class="header-info">
            <h1 class="header-tech">ТЕХНОЛОГИЯ</h1>
            <div class="header-center">
                | Методический центр 
            </div>
            <div class="header-location">
                 г. Нижний Новгород, пр. Кирова, 12
            </div>
            <div class="header-phone">
                | +7 (831) 291-50-25
            </div>
        </div>
        <?php 
        session_start();
        if(isset($_COOKIE['id']))
        {
            echo 
            '<div class="loginBut">   
            <a href = "Account.php"><button>Личный аккаунт</button></a>
            </div>';
        }
        else
        {
            echo 
            '<div class="loginBut">   
            <a href = "formLogin.php"><button>Войти</button></a>
            </div>';
        }
        ?>
        <div class="header-nav">          
            <button>Меню</button>
            <ul>
                <li><a href="index.php">Главная</a></li>
                <li><a href="about.php">О нас</a></li>
                <li><a href="videos.php">Видео пособия</a></li>
                <li><a href="obychenie.php">Обучение</a></li>
                <li><a href="contacts.php">Контакты</a></li>
                <li><a href="questions.php">Вопросы</a></li>
            </ul>
        </div>
    </header>


    <main>
    <div class="container">
        <h2>Популярные курсы</h2>
       
        <?php
  $result =  mysqli_query($mysql, "SELECT * FROM `service`");    
?>

  <div class="course">
  <?php  
  While($rivews = mysqli_fetch_assoc($result)){
    ?>
      <div class="sevices-container" id="a">
    <div class="course-info"> 

    <h3 class="course-title"><?php echo $rivews['name'];  ?></h3>
    <img src= <?php echo $rivews['image']; ?> class="course-image">
        <p class="course-description">   <?php echo $rivews['description'];?> </p>
        <p class="course-price">Цена: <?php echo $rivews['price'];?> рублей</p><br>
        <a href="obychenie.php" class="course-button">Подробнее</a> 
        </div>
        
   <?php  
  }
   ?>
  </div>
   </div>

        <div class="reviews">
            <h3>Отзывы</h3>
            <div class="review-item">
            <?php
  $result =  mysqli_query($mysql, "SELECT * FROM `review`");    
?>
  <div class="comments-container" id="b">
  <?php  
  While($rivews = mysqli_fetch_assoc($result)){
    ?>
   <div class="com"><div class="krug"> </div><p class="text_in_com">Пользователь: <?php echo $rivews['name'];?> | Отзыв: <?php echo $rivews['review'];?> | Оценка: <?php echo $rivews['rating'];?></p></div>
   
   
   <?php  
  }
   ?>
    </div> 
            </div>


            <button class="buy-button">Оставить отзыв</button>
        </div>

        <div class="map">
            <h3>Наш адрес</h3>
            <iframe src="https://yandex.ru/map-widget/v1/?um=constructor%3Aa6f01873507308da8343b7fdec711541180e0c9cc02357752b7b63e49fc11b33&amp;source=constructor" width="100%" height="400" frameborder="0"></iframe>
        </div>

    <div class="buy-form">
        <div class="close-form" onclick="closeForm()">
            <img src="img/крестик.png" alt="Закрыть">
        </div>
        <h2>Оставить отзыв</h2>
        <form action="review.php" method="POST">
            <input type="text" name="name" id="name" placeholder="Имя" required>
            <textarea name="review" id="review" placeholder="Ваш отзыв" required></textarea>
            <p>Поставьте нам оценку: </p>
        <div class="rating-area">        
            <input type="radio" id="star-5" name="rating" value="5">
            <label for="star-5" title="Оценка «5»"></label>	
            <input type="radio" id="star-4" name="rating" value="4">
            <label for="star-4" title="Оценка «4»"></label>    
            <input type="radio" id="star-3" name="rating" value="3">
            <label for="star-3" title="Оценка «3»"></label>  
            <input type="radio" id="star-2" name="rating" value="2">
            <label for="star-2" title="Оценка «2»"></label>    
            <input type="radio" id="star-1" name="rating" value="1">
            <label for="star-1" title="Оценка «1»"></label>
        </div>
            <button type="submit" onclick="validateForm()">Отправить</button>
            
        </form>
    </div>
    <script>
        const buyButtons = document.querySelectorAll('.buy-button');
        const buyForm = document.querySelector('.buy-form');

        buyButtons.forEach(button => {
            button.addEventListener('click', () => {
                buyForm.style.display = 'block';
            });
        });

        function closeForm() {
            buyForm.style.display = 'none';
        }

        function validateForm() {
            const phoneInput = document.getElementById('phone');
            const phone = phoneInput.value.trim();

            // Проверяем, начинается ли номер с 7, 8 или +7
            if (!/^(7|8|\+7)/.test(phone)) {
                alert('Номер телефона должен начинаться с 7, 8 или +7.');
                phoneInput.focus();
                return false; // Предотвращаем отправку формы
            }

            // Проверяем, состоит ли номер из 10 или 11 цифр
            if (!/^\d{10,11}$/.test(phone)) {
                alert('Номер телефона должен состоять из 10 или 11 цифр.');
                phoneInput.focus();
                return false; // Предотвращаем отправку формы
            }

            // Если телефон валиден, отправляем форму
            alert('Заявка отправлена!');
            closeForm();
            return true; // Разрешаем отправку формы
        }
    </script>
</main>
    <footer class="footer">
        <p>© 2024 Методический центр "Технология"</p>
    </footer>
</body>
</html>