diff --git a/bjs/07_Number_and_string/index.html b/bjs/07_Number_and_string/index.html index 645e1c0f..13e8c25f 100644 --- a/bjs/07_Number_and_string/index.html +++ b/bjs/07_Number_and_string/index.html @@ -18,7 +18,63 @@
- + +
+
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+
+ +
+
+ +
+
+ +
+
+
diff --git a/bjs/07_Number_and_string/script.js b/bjs/07_Number_and_string/script.js index 4085abce..3ad0cc1b 100644 --- a/bjs/07_Number_and_string/script.js +++ b/bjs/07_Number_and_string/script.js @@ -1,8 +1,55 @@ let lastOperand = 0; let operation = null; +let buffer = null; + +let numbers = document.querySelectorAll('button[data-type="number"]'); +let operations = document.querySelectorAll('button[data-type="operation"]'); +let $calc = document.querySelector('button[data-type="calc"]') const inputWindow = document.getElementById('inputWindow'); +numbers.forEach( e => { + e.addEventListener('click', () => { + if (parseInt(inputWindow.value) === 0) + inputWindow.value = e.textContent; + else + inputWindow.value += e.textContent; + }) +}); + +operations.forEach( e => { + let action = e.dataset.action; + + e.addEventListener('click', () => { + lastOperand = parseFloat(inputWindow.value); + inputWindow.value = ''; + operation = action; + }) +}); + +$calc.addEventListener('click', () => { + let result = null; + + switch (operation) + { + case 'sum': + result = lastOperand + parseInt(inputWindow.value); + break; + case 'def': + result = lastOperand - parseInt(inputWindow.value); + break; + case 'prod': + result = lastOperand * parseInt(inputWindow.value); + break; + case 'div': + result = lastOperand / parseInt(inputWindow.value); + break; + } + + operation = null; + lastOperand = 0; + inputWindow.value = result; +}) document.getElementById('btn_clr').addEventListener('click', function () { lastOperand = 0; diff --git a/bjs/07_Number_and_string/style.css b/bjs/07_Number_and_string/style.css index 5257d402..5c2ef249 100644 --- a/bjs/07_Number_and_string/style.css +++ b/bjs/07_Number_and_string/style.css @@ -7,3 +7,13 @@ text-align: end; font-size: x-large; } + +.card-body { + display: flex; + flex-direction: column; + gap: 5px; +} + +.row { + gap: 5px; +} diff --git a/bjs/08_if_else/index.html b/bjs/08_if_else/index.html index ff5d71f1..ece668de 100644 --- a/bjs/08_if_else/index.html +++ b/bjs/08_if_else/index.html @@ -3,16 +3,15 @@ Угадайка - +
-
-
+
+
-
-
- +
+
+ - +
@@ -37,6 +36,48 @@

Вы загадали числ

+ + + + + + diff --git a/bjs/08_if_else/script.js b/bjs/08_if_else/script.js index d5a2e4a5..d314a2ae 100644 --- a/bjs/08_if_else/script.js +++ b/bjs/08_if_else/script.js @@ -1,46 +1,276 @@ -let minValue = parseInt(prompt('Минимальное знание числа для игры','0')); -let maxValue = parseInt(prompt('Максимальное знание числа для игры','100')); -alert(`Загадайте любое целое число от ${minValue} до ${maxValue}, а я его угадаю`); -let answerNumber = Math.floor((minValue + maxValue) / 2); -let orderNumber = 1; -let gameRun = true; - -const orderNumberField = document.getElementById('orderNumberField'); -const answerField = document.getElementById('answerField'); - -orderNumberField.innerText = orderNumber; -answerField.innerText = `Вы загадали число ${answerNumber }?`; - -document.getElementById('btnRetry').addEventListener('click', function () { - minValue = 0; - maxValue = 100; - orderNumber = 0; -}) - -document.getElementById('btnOver').addEventListener('click', function () { - if (gameRun){ - if (minValue === maxValue){ - const phraseRandom = Math.round( Math.random()); - const answerPhrase = (phraseRandom === 1) ? - `Вы загадали неправильное число!\n\u{1F914}` : - `Я сдаюсь..\n\u{1F92F}`; - - answerField.innerText = answerPhrase; - gameRun = false; - } else { - minValue = answerNumber + 1; - answerNumber = Math.floor((minValue + maxValue) / 2); - orderNumber++; - orderNumberField.innerText = orderNumber; - answerField.innerText = `Вы загадали число ${answerNumber }?`; +const game = { + run : false, + modals : { + first: null, + finish: null, + }, + + initedEvents: false, + + values : { + minValue: 0, + maxValue: 100, + answerNumber: 0, + orderNumber: 0, + }, + + ids: { + modalFirst : '#modalFirst', + modalFinish : '#modalFinish', + buttons : '.buttons-area', + answerField : '#answerField', + orderNumberField : '#orderNumberField', + gameContainer : '#gameContainer', + btnLess : '#btnLess', + btnEqual : '#btnEqual', + btnOver : '#btnOver', + btnRetry: '#btnRetry' + }, + + elements : { + modalFirst : null, + modalFinish : null, + buttons : null, + answerField : null, + orderNumberField : null, + gameContainer : null, + btnLess : null, + btnEqual : null, + btnOver : null, + btnRetry : null + }, + + errorPhrase : [ + `Вы загадали неправильное число!\n\u{1F914}`, + `Я сдаюсь..\n\u{1F92F}`, + `"Press F to pay respects"\n\u{1F44D}`, + `Моё уважение\n\u{1F4A9}`, + ], + successPhrase : [ + `Я всегда угадываю\n\u{1F60E}`, + `Это было легко\n\u{1F92F}`, + `Изи\n\u{1F9D0}`, + `Может что-то посложнее?\n\u{1F644}`, + ], + + answerPhrase : [ + `Вы загадали число {{answerNumber}}?`, + `Это же число {{answerNumber}}?`, + `Да это легко! Ты загадал {{answerNumber}}?`, + `Пффф, это {{answerNumber}}?`, + ], + + init: function () { + this.initValues(); + this.initElements(); + this.initModal(); + this.initEvents(); + + this.start(); + }, + + initValues: function () { + this.values.minValue = 0; + this.values.maxValue = 100; + this.values.answerNumber = 0; + this.values.orderNumber = 0; + }, + + initEvents: function () + { + if (this.initedEvents === false) { + this.elements.modalFirst.querySelector('#nextModalSecond').addEventListener('click', () => { + let minValue = this.elements.modalFirst.querySelector('#minValue').value; + let maxValue = this.elements.modalFirst.querySelector('#maxValue').value; + + this.values.minValue = this.parseMinValue(minValue); + this.values.maxValue = this.parseMaxValue(maxValue); + + this.modals.first.hide(); + + this.elements.modalFinish.querySelector('h1').textContent = 'Почти готово...'; + this.elements.modalFinish.querySelector('.modal-body').textContent = this.getModalSecondContent(); + this.modals.finish.show(); + }); + + this.elements.modalFinish.querySelector('#startGame').addEventListener('click', () => { + this.modals.finish.hide(); + this.initPlay(); + }); + + this.elements.btnEqual.addEventListener('click', () => { + if (this.run){ + this.elements.answerField.innerText = this.getSuccessPhrase(); + this.end(); + } + }) + + this.elements.btnOver.addEventListener('click', () => { + if (this.run) + { + if (this.values.minValue === this.values.maxValue || this.values.minValue > this.values.maxValue) { + this.elements.answerField.innerText = this.getErrorPhrase(); + this.end(); + } + else { + this.values.minValue = this.values.answerNumber + 1; + this.recalc(false); + } + } + }); + + this.elements.btnLess.addEventListener('click', () => { + if (this.run) + { + if (this.values.minValue === this.values.maxValue || this.values.minValue > this.values.maxValue) { + this.elements.answerField.innerText = this.getErrorPhrase(); + this.end(); + } + else { + this.values.maxValue = this.values.answerNumber - 1; + this.recalc(); + } + } + }); + + this.elements.btnRetry.addEventListener('click', () => { + this.init(); + }); + + this.initedEvents = true; + } + }, + + recalc: function (ceil = true) + { + let n = (this.values.minValue + this.values.maxValue) / 2; + this.values.answerNumber = ceil ? Math.ceil(n) : Math.floor(n); + this.values.orderNumber++; + this.elements.orderNumberField.innerText = this.values.orderNumber; + this.elements.answerField.innerText = this.getAnswerText(this.numberToWords(this.values.answerNumber)); + }, + + start: function () + { + this.elements.gameContainer.style.display = 'none'; + this.modals.first.show(); + }, + + end: function () + { + this.run = false; + }, + + initElements: function () + { + for (let e in this.ids) + { + this.elements[e] = document.querySelector(this.ids[e]); } - } -}) -document.getElementById('btnEqual').addEventListener('click', function () { - if (gameRun){ - answerField.innerText = `Я всегда угадываю\n\u{1F60E}` - gameRun = false; + this.elements.modalFirst.querySelector('#minValue').value = ''; + this.elements.modalFirst.querySelector('#maxValue').value = ''; + }, + + initModal: function () + { + let options = { + backdrop: false + } + this.modals.first = new bootstrap.Modal(this.elements.modalFirst, options); + this.modals.finish = new bootstrap.Modal(this.elements.modalFinish, options); + }, + + initPlay: function () + { + this.values.answerNumber = Math.floor((this.values.minValue + this.values.maxValue) / 2); + this.values.orderNumber = 1; + this.elements.orderNumberField.innerText = this.values.orderNumber; + this.elements.answerField.innerText = this.getAnswerText(this.values.answerNumber); + this.elements.gameContainer.style.display = ''; + this.run = true; + }, + + parseMinValue: function (value) + { + value = parseInt(value); + value = isNaN(value) ? 0 : value; + return (value <= -1000 ? -999 : value); + }, + + parseMaxValue: function (value) + { + value = parseInt(value); + value = isNaN(value) ? 100 : value; + return (value >= 1000 ? 999 : value); + }, + + numberToWords: function (number) + { + let arrNumbers = [ + ['','один','два','три','четыре','пять','шесть','семь','восемь','девять'], + ['десять','одиннадцать','двенадцать','тринадцать','четырнадцать','пятнадцать','шестнадцать','семнадцать','восемнадцать','девятнадцать'], + ['','','двадцать','тридцать','сорок','пятьдесят','шестьдесят','семьдесят','восемьдесят','девяносто'], + ['','сто','двести','триста','четыреста','пятьсот','шестьсот','семьсот','восемьсот','девятьсот'], + ], + sNumberTransform = '', + sNumber = '', + isNeg = false; + + if (number === 0) return '0'; + if (number < 0) isNeg = true; + number = Math.abs(number); + + if (number < 10) { + sNumberTransform = arrNumbers[0][number]; + } + + if (number >= 10 && number < 20) { + sNumberTransform = arrNumbers[1][number % 10]; + } + + if (number >= 20 && number <=99) { + sNumberTransform = arrNumbers[2][Math.floor(number / 10)] + ' ' + arrNumbers[0][number % 10]; + } + + if (number > 100 && number <= 999) { + sNumberTransform = arrNumbers[3][Math.floor(number / 100)] + ' '; + sNumberTransform += (number % 100 >= 10 && number % 100 < 20) ? arrNumbers[1][number % 100 % 10] : arrNumbers[2][Math.floor(number / 10) % 10] + ' ' + arrNumbers[0][number % 10]; + } + + if (number === 100) { + sNumberTransform = arrNumbers[3][2]; + } + + sNumberTransform = (isNeg ? 'минус ':'') + sNumberTransform.trim(); + sNumberTransform = sNumberTransform.replace(' ',' '); + + return sNumberTransform.length < 20 ? sNumberTransform : isNeg ? (-1) * number : number; + }, + + getModalSecondContent: function () + { + return `Загадайте любое целое число от ${this.values.minValue} до ${this.values.maxValue}, а я его угадаю`; + }, + + getAnswerText: function (number) + { + let index = Math.round(Math.random() * (this.answerPhrase.length - 1)); + return this.answerPhrase[index].replace('{{answerNumber}}', number); + }, + + getSuccessPhrase: function () + { + let index = Math.round(Math.random() * (this.successPhrase.length - 1)); + return this.successPhrase[index]; + }, + + getErrorPhrase: function () + { + let index = Math.round(Math.random() * (this.errorPhrase.length - 1)); + return this.errorPhrase[index]; } -}) +} + +document.addEventListener('DOMContentLoaded', () => game.init()) diff --git a/bjs/08_if_else/style.css b/bjs/08_if_else/style.css index f8d7aec7..458e0828 100644 --- a/bjs/08_if_else/style.css +++ b/bjs/08_if_else/style.css @@ -1,4 +1,17 @@ .game-card { height: 100vh; font-family: 'Open Sans', monospace; + justify-content: center; +} + +button#btnRetry { + max-width: 150px; + width: 100%; + background-color: #b1b1b1; + color: black; + text-decoration: none; +} + +button#btnRetry:hover { + background-color: #918f8f; } diff --git a/bjs/10_function_object/index.html b/bjs/10_function_object/index.html index 9852f4cd..d1cf2715 100644 --- a/bjs/10_function_object/index.html +++ b/bjs/10_function_object/index.html @@ -3,15 +3,14 @@ Генератор случайных пользователей - +
-
+

Окно результатов генерации

@@ -20,15 +19,21 @@

Генерация фамилии

-

Имя: Иван

+

Генерация имени

+

Генерация отчества

+

- Генерация пола - , - Генерация года рождения + Генерация пола, + Генерация профессии, + Генерация даты рождения

+
+ + +
diff --git a/bjs/10_function_object/init.js b/bjs/10_function_object/init.js index 84f4db29..51e3aab8 100644 --- a/bjs/10_function_object/init.js +++ b/bjs/10_function_object/init.js @@ -1,7 +1,35 @@ +let firstNameNode = document.querySelector('#firstNameOutput'), + surnameNode = document.querySelector('#surnameOutput'), + lastNameNode = document.querySelector('#lastNameOutput'), + genderNode = document.querySelector('#genderOutput'), + professionNode = document.querySelector('#professionOutput'), + birthDateNode = document.querySelector('#birthDateOutput'), + firstNameDefaultText = firstNameNode.innerText, + surnameDefaultText = surnameNode.innerText, + lastNameDefaultText = lastNameNode.innerText, + genderDefaultText = genderNode.innerText, + professionDefaultText = professionNode.innerText, + birthDateDefaultText = birthDateNode.innerText; -window.onload = function() -{ +function init() { const initPerson = personGenerator.getPerson(); - document.getElementById('firstNameOutput').innerText = initPerson.firstName; -}; + firstNameNode.innerText = initPerson.firstName; + surnameNode.innerText = initPerson.surname; + lastNameNode.innerText = initPerson.lastName; + genderNode.innerText = initPerson.gender; + professionNode.innerText = initPerson.profession; + birthDateNode.innerText = initPerson.birthDate + ' ' + initPerson.birthMonth + ' ' + initPerson.birthYear + ' года рождения'; +} + +function clearPerson() { + firstNameNode.innerText = firstNameDefaultText; + surnameNode.innerText = surnameDefaultText; + lastNameNode.innerText = lastNameDefaultText; + genderNode.innerText = genderDefaultText; + professionNode.innerText = professionDefaultText; + birthDateNode.innerText = birthDateDefaultText; +} +window.onload = function() { + init(); +}; diff --git a/bjs/10_function_object/personGenerator.js b/bjs/10_function_object/personGenerator.js index 1aabfe9b..82cad666 100644 --- a/bjs/10_function_object/personGenerator.js +++ b/bjs/10_function_object/personGenerator.js @@ -35,6 +35,65 @@ const personGenerator = { "id_10": "Андрей" } }`, + firstNameFemaleJson: `{ + "count": 11, + "list": { + "id_1": "Инна", + "id_2": "Александра", + "id_3": "Дарья", + "id_4": "Марина", + "id_5": "Татьяна", + "id_6": "Виктория", + "id_7": "Анна", + "id_8": "Екатерина", + "id_9": "Валентина", + "id_10": "Анастасия", + "id_11": "Ольга" + } + }`, + maleProfession: `{ + "count": 8, + "list": { + "id_1": "слесарь", + "id_2": "шахтёр", + "id_3": "солдат", + "id_4": "водитель", + "id_5": "учитель", + "id_6": "писатель", + "id_7": "менеджер по туризму", + "id_8": "программист" + } + }`, + femaleProfession: `{ + "count": 8, + "list": { + "id_1": "секретарь", + "id_2": "няня", + "id_3": "лифтёр", + "id_4": "вахтёр", + "id_5": "учитель", + "id_6": "писатель", + "id_7": "менеджер по туризму", + "id_8": "программист" + } + }`, + month: `{ + "count": 12, + "list": { + "id_1": "января", + "id_2": "февраля", + "id_3": "марта", + "id_4": "апреля", + "id_5": "мая", + "id_6": "июня", + "id_7": "июля", + "id_8": "августа", + "id_9": "сентября", + "id_10": "октября", + "id_11": "ноября", + "id_12": "декабря" + } + }`, GENDER_MALE: 'Мужчина', GENDER_FEMALE: 'Женщина', @@ -48,23 +107,79 @@ const personGenerator = { }, randomFirstName: function() { + return this.isMale ? this.randomValue(this.firstNameMaleJson) : this.randomValue(this.firstNameFemaleJson); + }, - return this.randomValue(this.firstNameMaleJson); + randomSurname: function() { + return this.isMale ? this.randomValue(this.surnameJson) : this.randomValue(this.surnameJson) + 'а'; }, + randomLastName: function() { + let maleName = this.randomValue(this.firstNameMaleJson), + isMale = this.isMale, + root = maleName; + + if (["а", "я"].indexOf(maleName.substr(maleName.length-1,1)) !== -1) { + root = maleName.substring(0, maleName.length-1); + if (isMale) { + return root += "ич"; + } else { + if (maleName.substr(maleName.length-2,1) === "т") { + return root += "ична"; + } else { + return root += "инична"; + } + } + } else if (maleName.substr(maleName.length-1,1) === "й") { + root = maleName.substring(0, maleName.length-1); + if (isMale) { + return root += "евич"; + } else { + return root += "евна"; + } + } else { + if (isMale) { + return root += "ович"; + } else { + return root += "овна"; + } + } + }, - randomSurname: function() { + randomProfession: function () { + return this.isMale ? this.randomValue(this.maleProfession) : this.randomValue(this.femaleProfession); + }, - return this.randomValue(this.surnameJson); + randomDate: function () { + let month = this.person.birthMonth, + minDate = 1, + maxDate = 31; + if (month === 'февраля') maxDate = 28; + else if (['апреля', 'июня', 'сентября', 'ноября'].indexOf(month) !== -1) maxDate = 30; + + return this.randomIntNumber(maxDate, minDate); }, + randomGender: function () { + this.isMale = this.randomIntNumber(); //1 - Мужчина, 0 - Женщина + return this.isMale ? this.GENDER_MALE : this.GENDER_FEMALE; + }, + getPerson: function () { this.person = {}; - // this.person.gender = this.randomGender(); + this.person.gender = this.randomGender(); this.person.firstName = this.randomFirstName(); + this.person.surname = this.randomSurname(); + this.person.lastName = this.randomLastName(); + this.person.profession = this.randomProfession(); + + this.person.birthYear = this.randomIntNumber(2023, 1950); + this.person.birthMonth = this.randomValue(this.month); + this.person.birthDate = this.randomDate(); + return this.person; } }; diff --git a/bjs/10_function_object/style.css b/bjs/10_function_object/style.css new file mode 100644 index 00000000..be17ae51 --- /dev/null +++ b/bjs/10_function_object/style.css @@ -0,0 +1,14 @@ +.container { + height: 100vh; + display: flex; + align-items: center; + justify-content: center; +} + +.game-card { + max-width: 500px; + width: 100%; +} +.card-header { + background-color: #d7d7d7; +}