2 and 3 session solutions

Integrify-Finland · Jan 31, 2023 · 5a1a1f2 · 5a1a1f2
1 parent 648826e
commit 5a1a1f2
Show file tree

Hide file tree

Showing 6 changed files with 194 additions and 0 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+  "liveServer.settings.port": 5501
+}
diff --git a/session_2/function_base.js b/session_2/function_base.js
@@ -0,0 +1,35 @@
+function myFunction1(c, a, b) {
+  return a + b + c;
+}
+function myFunction2() {
+  return 'Hello world';
+}
+function myFunction3(a) {
+  return a;
+}
+
+myFunction1(1, 2, 3);
+myFunction2();
+myFunction3(1);
+
+const myFunction4 = () => {
+  return 'hello world';
+};
+const myFunction5 = (a) => {
+  return a;
+};
+const myFunction6 = (c, b, a) => {
+  return a + b + c;
+};
+
+function awesomeFunction(a, b) {
+  return a + b;
+}
+
+const awesomeFunction = (a, b) => a - b;
+
+awesomeFunction(1, 3);
+
+myFunction4();
+myFunction5('Hello world');
+myFunction6(10, 11, 12);
diff --git a/session_2/loops_solutions.js b/session_2/loops_solutions.js
@@ -52,6 +52,22 @@ console.log('There was', even, 'even numbers');
 
 /* 5. Make a program that asks numbers from the user, until user gives 0 and then program ends. In the end program prints out average of the numbers. */
 
+let input;
+let sum = 0;
+let count = 0;
+
+while (input != 0) {
+  input = Number(prompt('enter a number'));
+  if (input == 0) {
+    console.log('0 input');
+    break;
+  }
+  sum += input;
+  count++;
+}
+let average = sum / count;
+console.log(average);
+
 /* 6. Make a program that asks 25 numbers form the user. In the end program prints out average of the numbers. */
 
 /* 7. Make a program that ask first one number from the user. After that the program asks: ”Do you want to continue giving numbers?(y/n)”. If user answers y, the program continues to ask another number. If user answers n, program ends. In the end program prints out average of the numbers. */

diff --git a/session_3/index.html b/session_3/index.html
@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" href="style.css" />
+    <title>Calculators</title>
+  </head>
+  <body>
+    <h1>Calculators</h1>
+    <h2>Gasoline price</h2>
+    <p>
+      Make a program that asks the price of the gasoline and the amount of money
+      from the user. The program calculates how much gasoline the user gets with
+      the money. The result is displayed on to screen.
+    </p>
+    <ul>
+      <li>
+        If there are more than 10 litres, then the message on the screen: "good,
+        you can escape now"
+      </li>
+      <li>If less, it shows the message: "Ups, you have to stay here.</li>
+    </ul>
+
+    <form>
+      <div class="form_group">
+        <label for="price">Price</label>
+        <input type="number" id="price" />
+      </div>
+      <div class="form_group">
+        <label for="money">Money</label>
+        <input type="number" id="money" />
+      </div>
+      <button onclick="calcGasoline()">Calculate</button>
+    </form>
+
+    <p id="answer"></p>
+
+    <h2>Temperature conventer</h2>
+    <form>
+      <div class="form_group">
+        <label for="celsius">Celsius</label>
+        <input
+          type="number"
+          id="celsius"
+          oninput="tempConventer(this.id, this.value)"
+        />
+      </div>
+      <div class="form_group">
+        <label for="fahrenheit">Fahrenheit</label>
+        <input
+          type="number"
+          id="fahrenheit"
+          oninput="tempConventer(this.id, this.value)"
+        />
+      </div>
+      <div class="form_group">
+        <label for="kelvin">Kelvin</label>
+        <input
+          type="number"
+          id="kelvin"
+          oninput="tempConventer(this.id, this.value )"
+        />
+      </div>
+    </form>
+    <script src="main.js"></script>
+  </body>
+</html>
diff --git a/session_3/main.js b/session_3/main.js
@@ -0,0 +1,40 @@
+const calcGasoline = (e) => {
+  e.preventDefault();
+  const price = Number(document.getElementById('price').value);
+  const money = +document.querySelector('#money').value;
+  const answer = document.querySelector('#answer');
+
+  let text;
+
+  const amount = Math.floor(money / price);
+
+  if (amount >= 10) {
+    text = `You could get about ${amount} liters, good now you can go`;
+  } else {
+    text = `You could get about ${amount} liters. Sorry you have to stay :()`;
+  }
+
+  answer.textContent = text;
+  document.querySelector('#answer').textContent = 'something';
+};
+
+const tempConventer = (id, value) => {
+  const val = parseFloat(value);
+
+  const celInput = document.querySelector('#celsius');
+  const fahInput = document.querySelector('#fahrenheit');
+  const kelInput = document.querySelector('#kelvin');
+
+  if (id === 'celsius') {
+    fahInput.value = (val * 1.8 + 32).toFixed(2);
+    kelInput.value = (val + 273.15).toFixed(2);
+  }
+  if (id === 'fahrenheit') {
+    celInput.value = ((val - 32) / 1.8).toFixed(2);
+    kelInput.value = ((val - 32) / 1.8 + 273.15).toFixed(2);
+  }
+  if (id === 'kelvin') {
+    celInput.value = (val - 273.15).toFixed(2);
+    fahInput.value = ((val - 273.15) * 1.8 + 32).toFixed;
+  }
+};
diff --git a/session_3/style.css b/session_3/style.css
@@ -0,0 +1,31 @@
+body {
+  font-family: 'Trebuchet MS', sans-serif;
+}
+
+input,
+button {
+  font-family: inherit;
+  padding: 10px;
+  font-size: 14px;
+}
+
+button {
+  border: none;
+  background-color: chocolate;
+  color: white;
+  margin: 20px 0;
+  border-radius: 3px;
+}
+
+label {
+  display: inline-block;
+  width: 100px;
+}
+input {
+  display: inline-block;
+  width: 100px;
+}
+
+.form_group {
+  margin: 10px 0;
+}