Начало наработок

2021-02-05 08:13:22 +03:00
commit 619966474d
7643 changed files with 609530 additions and 0 deletions
--- a/src/index.html
+++ b/src/index.html
@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html lang="en" class="h-100">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Example for kids</title>
+    <link rel="stylesheet" type="text/css" href="./style.css">
+</head>
+
+<body class="h-100">
+    <div class="container h-100">
+        <div class="row align-items-center h-100">
+            <div class="col">
+                <div class="StartPage d-none">
+                    <button class="btn btn-success" id="start-button" type="button">Старт</button>
+                </div>
+
+                <div class="GamePage d-none">
+
+                    <button class="btn btn-warning" id="check-button" type="button">Проверить</button>
+                </div>
+
+                <div class="ResultPage d-none">
+
+                    <button class="btn btn-primary" id="repeat-button" type="button">Еще раз</button>
+                </div>
+            </div>
+        </div>
+    </div>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet"
+        integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js"
+        integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW"
+        crossorigin="anonymous"></script>
+    <script src="./script.js"></script>
+</body>
+
+</html>
--- a/src/script.js
+++ b/src/script.js
@ -0,0 +1,55 @@
+const LOCAL_DATA_KEY = 'example-for-kids';
+const START_PAGE = 'StartPage';
+const GAME_PAGE = 'GamePage';
+const RESULT_PAGE = 'ResultPage';
+const NO_DISPLAY_CLASS = 'd-none';
+
+const MAX_NUMBER = 10;
+
+const store = {
+    page: START_PAGE,
+    examples: [],
+};
+
+const getRandomNumber = (maxNumber) => Math.round(Math.random() * maxNumber);
+const getFirstNumber = () => getRandomNumber(MAX_NUMBER);
+const getSecondNumber = (firstNumber) => getRandomNumber(MAX_NUMBER - firstNumber);
+const getSum = (first, second) => first + second;
+const getExample = () => {
+    const first = getFirstNumber();
+    const second = getSecondNumber(first);
+
+    return {
+        first,
+        second,
+        sum: getSum(first, second),
+    };
+};
+
+const getData = (defaultData) => {
+    try {
+        return JSON.parse(localStorage.getItem(LOCAL_DATA_KEY)) || defaultData;
+    } catch (e) {
+        return defaultData;
+    }
+};
+const setData = (data) => {
+    localStorage.setItem(LOCAL_DATA_KEY, JSON.stringify(data));
+};
+
+const startPage = document.querySelector(`.${START_PAGE}`);
+const gamePage = document.querySelector(`.${GAME_PAGE}`);
+const resultPage = document.querySelector(`.${RESULT_PAGE}`);
+
+const renderPage = () => {
+    [startPage, gamePage, resultPage].forEach(page => {
+        if (page.classList.contains(store.page)) {
+            page.classList.remove(NO_DISPLAY_CLASS);
+        } else {
+            page.classList.add(NO_DISPLAY_CLASS);
+        }
+    });
+};
+
+renderPage();
+
--- a/src/style.css
+++ b/src/style.css