Browse Source

done hw 0 js Omelchienko Hryhorii

unknown 3 years ago
parent
commit
ae2440f63b
3 changed files with 88 additions and 0 deletions
  1. 13 0
      html-css/css/styles.css
  2. 1 0
      html-css/index.html
  3. 74 0
      javascript/hw.js

+ 13 - 0
html-css/css/styles.css

@@ -0,0 +1,13 @@
+.warnPassed {
+    background-color: green;
+    font-size: 70px;
+    height: 100vh;
+    text-align: center;
+}
+
+.warnError {
+    background-color: red;
+    font-size: 70px;
+    height: 100vh;
+    text-align: center;
+}

+ 1 - 0
html-css/index.html

@@ -3,6 +3,7 @@
 	<head>
 		<meta charset="UTF-8" />
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<link rel="stylesheet" href="../html-css/css/styles.css" />
 		<title>Document-js</title>
 	</head>
 	<body></body>

+ 74 - 0
javascript/hw.js

@@ -0,0 +1,74 @@
+//ДЗ: Отладка, переменные
+//Обратите внимание на те или иные расчеты, нужные вам в обычной жизни.
+//Это может быть оплата за электричество, количество километров, пройденных за
+//месяц(если вы, например, ходите по одному и тому же маршруту каждый день),
+//количество батонов, кофе, масла, всего чего угодно и так далее.Так же можете
+//написать любую калькуляцию, нужную вам в работе.Представьте это в форме кода, подобного следующему:
+//Для создания минимального пользовательского интерфейса можете использовать prompt и alert
+//То есть, напишите калькуляцию, которая из входных данных подсчитывает результат,
+//с осмысленными названиями переменных и комментариями к ним и формулам, использованным в калькуляции.
+// var firstParameter = 5; //смысл переменной
+// var secondParameter = 10; //иной комментарий, поясняющий переменную
+// var somePartialResult = firstParameter * 5; //суть переменной и формулы
+// var someOtherPartialResult = secondParameter / 100500; //
+// var result = somePartialResult + someOtherPartialResult; //суть результата и переменной
+
+// const calcAverageSpeed = () => {
+// 	const rangeKm = +prompt(
+// 		'Write down a mount kilometers judge by your distention'
+// 	);
+// 	const stopsRest = +prompt('Write down time of stops in minutes');
+// 	const timeSpend = +prompt('Write how many minutes you spend on trip');
+// 	const speed = rangeKm / ((timeSpend - stopsRest) / 60);
+// 	return speed;
+// };
+// console.log(calcAverageSpeed());
+
+//CalcDebug
+//Поиграйтесь со значениями переменных, задайте иные входные значения, измените значения промежуточных,
+//используя Developer Tools.Отметьте для себя, как подобные хаки влияют на результат.
+
+// const calcDebugAverageSpeed = () => {
+// 	const rangeKm = +prompt(
+// 		'Write down a mount kilometers judge by your distention'
+// 	);
+// 	const stopsRest = +prompt('Write down time of stops in minutes');
+// 	const timeSpend = +prompt('Write how many minutes you spend on trip');
+// 	const speed = rangeKm / ((timeSpend - stopsRest) / 60);
+// 	return speed ? speed : 0;
+// 	//if we cancel prompt that will return null
+// 	// if wire down numbers that will return string '4' , '5'
+// 	//which we have to change with "+" before value from prompt to type Number
+// 	//it help to avoid problem with type of passed information ang easier to control user
+// };
+// console.log(calcDebugAverageSpeed());
+
+//Host
+//Выложите ваши наработки в git (репозиторий homework, папка js/01) и на хостинг
+//   http://gitlab.a-level.com.ua/Hryhorii/hw-js-0
+
+//Задание на синий пояс
+//Сделайте форму логина и пароля, которая по кнопке login будет сверять логин и пароль с ассоциативным массивом:
+//и отображать в случае успеха зеленый div с поздравлением или красный div с текстом ошибки.
+
+const credentials = {
+	login: 'admin',
+	password: 'qwerty',
+};
+
+const notifiactionHtml = document.createElement('div');
+document.body.append(notifiactionHtml);
+
+const logIn = () => {
+	const login = prompt('Write down your login');
+	const password = prompt('Write down your password');
+	if (credentials.login === login && credentials.password === password) {
+		notifiactionHtml.classList.add('warnPassed');
+		notifiactionHtml.textContent = 'Passed';
+	} else {
+		notifiactionHtml.classList.add('warnError');
+		notifiactionHtml.textContent = 'Error';
+	}
+};
+
+logIn();