Hw5

_mobile.scss

@@ -73,11 +73,11 @@
     font-size: 14px;
     line-height: 22px;
   }
-  .footer____game-1 {
+  .footer__game-1 {
     display: flex;
     flex-direction: column;
   }
-  .footer____game-2 {
+  .footer__game-2 {
     display: flex;
     flex-direction: column-reverse;
   }

hw4script.js

@@ -52,10 +52,28 @@
 // }
 // alert("Iterated " + num + " times!");
 // Exercise 6
-let day = 5;
-for (let day = 5; day <= 31; day += 7) {
-    // почему +=? почему +=7 не в фигурных скобках?
-  alert(
-    "Сегодня пятница, " + day + " -е число. Необходимо подготовить отчет.!"
-  );
+// let day = 5;
+// for (let day = 5; day <= 31; day += 7) {
+//   // почему +=? почему +=7 не в фигурных скобках???
+//   alert(
+//     "Сегодня пятница, " + day + " -е число. Необходимо подготовить отчет.!"
+//   );
+// }
+
+// Exercise 7
+// const obj = {
+//   Але: "ша",
+//   Гри: "ша",
+//   Ди: "ма",
+// };
+// for (const capital in obj) {
+//   alert(capital + "- это " + obj[capital]);
+// }
+const obj = {
+  Baby: "Boss",
+  Art: "Museum",
+  Assassin: "creed Brotherhood",
+};
+for (const game in obj) {
+  alert(game + "'S " + obj[game]);
 }

hw5script.js

@@ -0,0 +1,144 @@
+// // Exercise 1
+// const least = (a, b) => {
+//   if (a < b) {
+//     return a;
+//   } else {
+//     return b;
+//   }
+// };
+// console.log(least(4, 8));
+// console.log(least(6, 6));
+// // or
+// function min(a, b) {
+//   return a < b ? a : b;
+// }
+// console.log(min(4, 8));
+// Exercise 2
+// const evenNum = (a) => {
+//   if (a % 2 == 0) {
+//     return "Четное число";
+//   } else {
+//     return "Нечетное число";
+//   }
+//   // Как сделать с prompt?
+// };
+// alert(evenNum(7));
+//or
+
+// let number = prompt("Введите число");
+
+// if (number % 2 == 0) {
+//   function evenNum() {
+//     alert("Четное число");
+//   }
+// } else {
+//   function evenNum() {
+//     alert("Нечетное число");
+//   }
+// }
+// evenNum();
+// // or
+// function evenNum(a) {
+//   return a % 2 == 0 ? "Четное число" : "Нечетное число";
+// }
+// alert(evenNum(7));
+// // Exercise 3.2
+// const squareNum = (a) => {
+//   let result = a ** 2;
+//   return result;
+// };
+// console.log(squareNum(3));
+// // Exercise 3.1
+// let number = prompt("Введите число");
+// function squareNum(a) {
+//   return a ** 2;
+// }
+// alert(squareNum(Number));
+// // Exercise 4
+// let age = prompt("Сколько Вам лет?");
+// if (age < 0) {
+//   function printMessage() {
+//     alert("Вы ввели неправильное значение");
+//   }
+// } else if (age < 12) {
+//   function printMessage() {
+//     alert("Привет, друг!");
+//   }
+// } else {
+//   function printMessage() {
+//     alert("Добро пожаловать!");
+//   }
+// }
+// {
+// }
+// printMessage();
+// Exercise 5
+const mult = (a, b) => {
+  if (isNaN(a) || isNaN(b)) {
+    return "Одно или оба значения не являются числом";
+  }
+  let result = a * b;
+  return result;
+};
+alert(mult(prompt("Введите первое число"), prompt("Введите второе число")));
+
+// // Exercise 6
+const mult = (a) => {
+  if (isNaN(a)) {
+    return "Значение не является числом";
+  }
+  let result = a ** 3;
+  return result;
+};
+alert(mult(prompt("Введите первое число")));
+// // Exercise 7
+// function getСircleArea() {
+//   return this.radius ** 2 * Math.PI;
+// }
+// function getСirclePerimeter() {
+//   return this.radius * 2 * Math.PI;
+// }
+
+// const circle1 = {
+//   radius: 3,
+
+//   getArea: getСircleArea,
+//   getPerimeter: getСirclePerimeter,
+// };
+
+// const circle2 = {
+//   radius: 7,
+
+//   getArea: getСircleArea,
+//   getPerimeter: getСirclePerimeter,
+// };
+
+// alert(circle1.getArea());
+// alert(circle1.getPerimeter());
+// alert(circle2.getArea());
+// alert(circle2.getPerimeter());
+// Exercise 8
+const season = (a) => {
+  if (isNaN(a)) {
+    return "Вы ввели не число";
+  }
+  if (a === 12 || (a >= 1 && a <= 2)) {
+    // Ошибка в синтаксисе? Не видит число 12
+    return "Зима";
+  } else if (a >= 3 && a <= 5) {
+    return "Весна";
+  } else if (a >= 6 && a <= 8) {
+    return "Лето";
+  } else if (a >= 9 && a <= 11) {
+    return "Осень";
+  } else {
+    return "Такого месяца не существует";
+  }
+  {
+  }
+  {
+  }
+  {
+  }
+};
+alert(season(prompt("Введите номер месяца")));

index.html

@@ -41,17 +41,17 @@ <h1 class="top__title">
       </nav>
     </section>
     <section>
-      <footer class="footer center">
+      <footer class="footer">
         <div class="footer__content">
-          <div class="footer__game-1">
+          <div class="footer__game-1 center">
             <div class="footer__title">
               <h3 class="footer__heading">Времена года!</h3>
               <p class="footer__text">
                 Нажмите кнопку играть, введите номер месяца (от 1 до 12) и вы
                 узнаете к какому времени года он относится
               </p>
               <form class="footer__form" action="#">
-                <button class="footer__button">
+                <button onclick="printMessage();" class="footer__button">
                   <a class="button__text" href="#">Играть!</a>
                 </button>
               </form>
@@ -64,7 +64,7 @@ <h3 class="footer__heading">Времена года!</h3>
               />
             </div>
           </div>
-          <div class="footer__game-2">
+          <div class="footer__game-2 center">
             <div class="footer__drawing">
               <img
                 class="footer__image"
@@ -85,10 +85,25 @@ <h3 class="footer__heading">Запомни слова</h3>
               </form>
             </div>
           </div>
+          <div class="footer__game-3">
+            <div class="footer__title-3 center">
+              <h3 class="footer__heading">Игра в загадки</h3>
+              <p class="footer__text">
+                Компьютер загадывает загадку, вам необходимо ее угадать, если вы
+                дадите не правильный ответ, то компьютер даст вам подсказку. У
+                вас будет три попытки и две подсказки.
+              </p>
+              <form class="footer__form-3" action="#">
+                <button class="footer__button">
+                  <a class="button__text" href="#">Играть!</a>
+                </button>
+              </form>
+            </div>
+          </div>
         </div>
       </footer>
     </section>
 
-    <script src="hw4script.js"></script>
+    <script src="hw5script.js"></script>
   </body>
 </html>

style.css

@@ -128,6 +128,16 @@ body {
   padding-bottom: 233px;
   padding-top: 233px;
 }
+.footer__game-3 {
+  background-image: url(Images/background_for_games.jpg);
+  background-size: cover;
+  background-position: center;
+  background-repeat: no-repeat;
+  padding-bottom: 233px;
+  padding-top: 233px;
+  padding-left: calc(-50vw + 10%);
+  padding-right: calc(-50vw + 10%);
+}
 .footer__title {
   display: flex;
   flex-direction: column;
@@ -157,6 +167,10 @@ body {
   justify-content: center;
   align-self: flex-start;
 }
+.footer__form-3 {
+  display: flex;
+  justify-content: center;
+}
 
 .footer__button {
   width: 234px;
@@ -185,6 +199,14 @@ body {
   border-radius: 30px;
 }
 
+.footer__title-3 {
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  justify-content: space-between;
+  align-items: center;
+}
+
 @media (max-width: 767px) {
   .center {
     padding-left: 16px;
@@ -260,11 +282,11 @@ body {
     font-size: 14px;
     line-height: 22px;
   }
-  .footer____game-1 {
+  .footer__game-1 {
     display: flex;
     flex-direction: column;
   }
-  .footer____game-2 {
+  .footer__game-2 {
     display: flex;
     flex-direction: column-reverse;
   }

style.scss

@@ -112,6 +112,16 @@ body {
     padding-bottom: 233px;
     padding-top: 233px;
   }
+  &__game-3 {
+    background-image: url(Images/background_for_games.jpg);
+    background-size: cover;
+    background-position: center;
+    background-repeat: no-repeat;
+    padding-bottom: 233px;
+    padding-top: 233px;
+    padding-left: calc(-50vw + 10%);
+    padding-right: calc(-50vw + 10%);
+  }
   &__title {
     display: flex;
     flex-direction: column;
@@ -138,6 +148,10 @@ body {
   display: flex;
   justify-content: center;
   align-self: flex-start;
+  &-3 {
+    display: flex;
+    justify-content: center;
+  }
 }
 .footer__button {
   width: 234px;
@@ -161,5 +175,12 @@ body {
   background: #eb443f;
   border-radius: 30px;
 }
+.footer__title-3 {
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  justify-content: space-between;
+  align-items: center;
+}
 
 @import "mobile";