coditechOld · IbrahimJakmour · Feb 19, 2018 · Feb 20, 2018 · Feb 21, 2018 · Feb 23, 2018
diff --git a/Base1/Step_1.html b/Base1/Step_1.html
@@ -1,9 +1,16 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <title>Step 1</title>
-        <meta charset="UTF-8">
-    </head>
-    <body>
-    </body>
-</html>
+
+<head>
+    <title>Step 1</title>
+    <meta charset="UTF-8">
+</head>
+<script>
+    const name = "name";
+    alert(name);
+</script>
+
+<body>
+</body>
+
+</html>
diff --git a/Base1/Step_2.html b/Base1/Step_2.html
@@ -1,9 +1,19 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <title>Step 2</title>
-        <meta charset="UTF-8">
-    </head>
-    <body>
-    </body>
-</html>
+
+<head>
+    <title>Step 2</title>
+    <meta charset="UTF-8">
+</head>
+<script>
+    const name = "name";
+    const surname = "surname";
+    const city = "city";
+    alert("Name : " + name + "\n" + "Surname : " + surname + "\
+    n" + "City : " + city);
+</script>
+
+<body>
+</body>
+
+</html>
diff --git a/Base1/Step_3.html b/Base1/Step_3.html
@@ -1,9 +1,16 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <title>Step 3</title>
-        <meta charset="UTF-8">
-    </head>
-    <body>
-    </body>
-</html>
+
+<head>
+    <title>Step 3</title>
+    <meta charset="UTF-8">
+</head>
+<script>
+    const name = prompt("Please enter your name: ");
+    alert("Hello, " + name);
+</script>
+
+<body>
+</body>
+
+</html>
diff --git a/Base1/Step_4.html b/Base1/Step_4.html
@@ -1,15 +1,34 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <title>Step 4</title>
-        <meta charset="UTF-8">
-    </head>
-    <body>
-        <form>
-            <label for="name">name : </label><input type="text" name="name" id="name"/>
-            <label for="surname">surname : </label><input type="text" name="surname" id="surname"/>
-            <label for="city">city : </label><input type="text" name="city" id="city"/>
-            <button  name="validate" id="validate">Validate</button>
-        </form>
-    </body>
-</html>
+
+<head>
+    <title>Step 4</title>
+    <meta charset="UTF-8">
+
+</head>
+
+<body>
+
+    <form>
+        <label for="name">name : </label>
+        <input type="text" name="name" id="name" />
+        <label for="surname">surname : </label>
+        <input type="text" name="surname" id="surname" />
+        <label for="city">city : </label>
+        <input type="text" name="city" id="city" />
+        <button name="validate" id="validate">Validate</button>
+    </form>
+    <script>
+        var b = document.getElementById('validate');
+        b.addEventListener(`click`, print);
+
+        function print() {
+            var name = document.getElementById('name').value;
+            var surname = document.getElementById('surname').value;
+            var city = document.getElementById('city').value;
+            alert('Name : ' + name + '\n' + 'Surname : ' + surname + '\n' + 'city : ' + city);
+        }
+    </script>
+</body>
+
+</html>
diff --git a/Base1/Step_5.html b/Base1/Step_5.html
@@ -1,14 +1,34 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <title>Step 5</title>
-        <meta charset="UTF-8">
-    </head>
-    <body>
-        <form>
-            <label for="first_number">first number : </label><input type="text" id="first_number" name="first_number"/><br/>
-            <label for="second_number">second number : </label><input type="text" id="second_number" name="second_number"/><br/>
-            <button  id="validate" name ="validate">validate</button>
-        </form>
-    </body>
-</html>
+
+<head>
+    <title>Step 5</title>
+    <meta charset="UTF-8">
+</head>
+
+<body>
+    <form>
+        <label for="first_number">first number : </label>
+        <input type="text" id="first_number" name="first_number" />
+        <br/>
+        <label for="second_number">second number : </label>
+        <input type="text" id="second_number" name="second_number" />
+        <br/>
+        <button id="validate" name="validate">validate</button>
+    </form>
+    <script>
+        var b = document.getElementById("validate");
+
+        function calculate(first_number, second_number) {
+            var first_number = document.getElementById("first_number").value;
+            var second_number = document.getElementById("second_number").value;
+            var mult = (first_number * second_number);
+            document.write('the Multiplication of ' + first_number + ' and ' + second_number + ' is : ' + mult);
+            // event.preventDefault(); //to stop page from loading;
+        }
+
+        b.addEventListener("click", calculate);
+    </script>
+</body>
+
+</html>
diff --git a/Base1/Step_6.html b/Base1/Step_6.html
@@ -1,14 +1,22 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <title>Step 6</title>
-        <meta charset="UTF-8">
-    </head>
-    <body>
-        <form>
-            <label for="first_number">first number : </label><input type="text" id="first_number" name="first_number"/><br/>
-            <label for="second_number">second number : </label><input type="text" id="second_number" name="second_number"/><br/>
-            <button  id="validate" name ="validate">validate</button>
-        </form>
-    </body>
-</html>
+
+<head>
+    <title>Step 6</title>
+    <meta charset="UTF-8">
+</head>
+
+<body>
+    <form>
+        <label for="first_number">first number : </label>
+        <input type="text" id="first_number" name="first_number" />
+        <br/>
+        <label for="second_number">second number : </label>
+        <input type="text" id="second_number" name="second_number" />
+        <br/>
+        <button id="validate" name="validate">validate</button>
+    </form>
+    <script src="script6.js"></script>
+</body>
+
+</html>
diff --git a/Base1/Step_7.html b/Base1/Step_7.html
@@ -1,14 +1,21 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <title>Step 7</title>
-        <meta charset="UTF-8">
-    </head>
-    <body>
-        <form>
-            <label for="shoe_size">shoe size : </label><input type="text" id="shoe_size" name="shoe_size"/><br/>
-            <label for="year">Birth year : </label><input type="text" id="year" name="year"/><br/>
-            <button id="validate" name="validate">validate</button>
-        </form>
-    </body>
-</html>
+
+<head>
+    <title>Step 7</title>
+    <meta charset="UTF-8">
+</head>
+
+<body>
+    <form>
+        <label for="shoe_size">shoe size : </label>
+        <input type="text" id="shoe_size" name="shoe_size" />
+        <br/>
+        <label for="year">Birth year : </label>
+        <input type="text" id="year" name="year" />
+        <br/>
+        <button id="validate" name="validate">validate</button>
+    </form>
+</body>
+<script src="script7.js"></script>
+</html>
diff --git a/Base1/Step_8.html b/Base1/Step_8.html
@@ -1,13 +1,32 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <title>Step 8</title>
-        <meta charset="UTF-8">
-    </head>
-    <body>
-        <form>
-            <label for="age">your age : </label><input type="text" id="age" name="age"/><br/>
-            <button id="validate" name="validate">validate</button>
-        </form>
-    </body>
-</html>
+
+<head>
+    <title>Step 8</title>
+    <meta charset="UTF-8">
+</head>
+
+<body>
+    <form>
+        <label for="age">your age : </label>
+        <input type="text" id="age" name="age" />
+        <br/>
+        <button id="validate" name="validate">validate</button>
+    </form>
+    <script>
+        var b = document.getElementById('validate');
+
+        function validate() {
+
+            var age = document.getElementById('age').value;
+            if (age > 18) {
+                document.write('you are over 18');
+            } else {
+                document.write('you are under 18');
+            }
+        }
+        b.addEventListener('click', validate);
+    </script>
+</body>
+
+</html>
diff --git a/Base1/script6.js b/Base1/script6.js
@@ -0,0 +1,10 @@
+var b = document.getElementById("validate");
+
+function calculate(first_number, second_number) {
+    var first_number = document.getElementById("first_number").value;
+    var second_number = document.getElementById("second_number").value;
+    var rem = (first_number % second_number);
+    document.write("the remainder of " + first_number + " and " + second_number + " is : " + rem);
+    // event.preventDefault();
+}
+b.addEventListener("click", calculate);
diff --git a/Base1/script7.js b/Base1/script7.js
@@ -0,0 +1,10 @@
+var b = document.getElementById("validate");
+
+function calculate(shoe_size, year) {
+    var shoe_size = document.getElementById("shoe_size").value;
+    var year = document.getElementById("year").value;
+    var calc = ((((shoe_size * 2) + 5) * 50) - year) + 1766;
+    document.write("the result of shoe_size " + shoe_size + " and year " + year + " is : " + calc);
+    // event.preventDefault();
+}
+b.addEventListener("click", calculate);
diff --git a/Base2/step 1/index.html b/Base2/step 1/index.html
@@ -1,10 +1,21 @@
 <!DOCTYPE html>
 <html>
-  <head>
-    <meta charset="utf-8">
-    <title>Step 1</title>
-  </head>
-  <body>
-      <img src="images/image1.jpg" id="image1" />
-  </body>
+
+<head>
+  <meta charset="utf-8">
+  <title>Step 1</title>
+</head>
+
+<body>
+  <img src="images/image1.jpg" id="image1" />
+
+  <script>
+    function handler() {
+      this.src = 'images/image1_2.jpg';
+    }
+    var image = document.querySelector("#image1");
+    image.addEventListener('mouseover', handler);
+  </script>
+</body>
+
 </html>
diff --git a/Base2/step 2/index.html b/Base2/step 2/index.html
@@ -1,12 +1,26 @@
 <!DOCTYPE html>
 <html>
+
 <head>
   <meta charset="utf-8">
   <title>Step 2</title>
 </head>
+
 <body>
   <form>
-    <label for="name">Your name  : </label><input type="text" name="name" value="" id="name"/>
+    <label for="name">Your name : </label>
+    <input type="text" name="name" value="" id="name" />
   </form>
 </body>
-</html>
+<script>
+  var n = document.querySelector("#name");
+  n.addEventListener("blur", event);
+
+  console.log(name);
+
+  function event() {
+    window.prompt("thank you for participating!")
+  }
+</script>
+
+</html>