+
+
+
+
\ No newline at end of file
diff --git a/Week1/exercise/w1/index.js b/Week1/exercise/w1/index.js
index fcea7032e..82ce9b59c 100644
--- a/Week1/exercise/w1/index.js
+++ b/Week1/exercise/w1/index.js
@@ -1,50 +1,77 @@
-console.log('Hack your future Belgium!');
-
-// EXERCISE 1
-
-// 1a: create a function called "changeHeader", put a console.log() inside this function to test
-
-// 1d: add an event listener to the "Change header" button
-// and call the "changeHeader" function when clicked ( you should see your console.log() )
-
-// 1b: inside this function: select the header element and assign that to a variable called "header"
-
-// 1c: change the inner html of the header element to your name
-
-
-// ====================================== //
-
-
-// EXERCISE 2
-
-// 2a: create a function called "changeImage", put a console.log() inside this function to test
-
-// 1b: add an event listener to the "Change image" button and call the "changeImage" function when clicked
-
-// inside this function:
-
-// 2c: select the "imageInput" element and assign to a variable called "imageInputValue"
-
-// 2d: select the image element and assign to a variable called "imageToChange"
-
-// 2e: to change the image: assign the imageInputValue to the image src
-
-
-// ====================================== //
-
-
-// Exercise 3:
-
-// 3a: select "add todo" button & add click event listener to execute addTodo() function on click event
-
-// 3b: define addTodo() function, in this function:
-
-// 3c: get todoList element
-
-// 3d: get todoInput element & log todoInput value
-
-// 3e: create a
element
-
-// 3f: set created
element innerHtml to todoInput value
-
-// 3g: add
element to todoList
+// EXERCISE 1
+
+// 1a: create a function called "changeHeader", put a console.log() inside this function to test
+
+// 1d: add an event listener to the "Change header" button
+// and call the "changeHeader" function when clicked ( you should see your console.log() )
+
+// 1b: inside this function: select the header element and assign that to a variable called "header"
+
+// 1c: change the inner html of the header element to your name
+
+// // EXERCISE 1 code:
+
+console.log('Hack your future Belgium!');
+function changeHeader() {
+ console.log('Test if works or not');
+ header.innerHTML = 'Harun';
+}
+const header = document.querySelector('h1');
+header.addEventListener('click', changeHeader);
+document.getElementById('changeHeaderButton').addEventListener('click', changeHeader);
+
+// ====================================== //
+
+// EXERCISE 2
+
+// 2a: create a function called "changeImage", put a console.log() inside this function to test
+
+// 1b: add an event listener to the "Change image" button and call the "changeImage" function when clicked
+
+// inside this function:
+
+// 2c: select the "imageInput" element and assign to a variable called "imageInputValue"
+
+// 2d: select the image element and assign to a variable called "imageToChange"
+
+// 2e: to change the image: assign the imageInputValue to the image src
+
+//// EXERCISE 2 code:
+
+function changeImage() {
+ console.log('test function work');
+
+ const imageInputValue = document.querySelector('#imageInput').value;
+ const imageToChange = document.querySelector('img');
+ imageToChange.src = imageInputValue;
+}
+document.getElementById('btn-changeImage').addEventListener('click', changeImage);
+
+// ====================================== //
+
+// Exercise 3:
+
+// 3a: select "add todo" button & add click event listener to execute addTodo() function on click event
+
+// 3b: define addTodo() function, in this function:
+
+// 3c: get todoList element
+
+// 3d: get todoInput element & log todoInput value
+
+// 3e: create a
element
+
+// 3f: set created
element innerHtml to todoInput value
+
+// 3g: add
element to todoList
+
+// Exercise 3 code:
+
+document.getElementById('btn-addTodo').addEventListener('click', addTodo);
+function addTodo() {
+ const list = document.getElementById('todoList');
+ let input = document.getElementById('todoInput');
+ let x = document.createElement('LI');
+ x.innerHTML = input.value;
+ list.appendChild(x);
+}
diff --git a/Week1/homework/app.js b/Week1/homework/app.js
index a9b5f75d8..89548b9d4 100644
--- a/Week1/homework/app.js
+++ b/Week1/homework/app.js
@@ -1,11 +1,217 @@
'use strict';
{
+ //creating an array that contain strings of book names
const bookTitles = [
- // Replace with your own book titles
- 'harry_potter_chamber_secrets',
+ 'the_mystery_on_the_mountain_parbat',
+ 'de_peetvader',
+ 'hunger_games_1',
+ 'hunger_games_mockingjay',
+ 'miserables',
+ 'improbable',
+ 'duc_man',
+ 'under_ocean',
+ 'da_vinci_code',
+ '5th_horseman',
];
- // Replace with your own code
- console.log(bookTitles);
+ /*
+ //creatin' a function that generates an ul with li elements in a loop
+ function createUl(bookTitles) {
+ var division = document.createElement('div');
+ division.setAttribute('id', 'bookList');
+ var titleHeader = document.createElement('h1');
+ titleHeader.appendChild(document.createTextNode('The List of The Books'));
+ division.appendChild(titleHeader);
+
+ var ul = document.createElement('ul');
+ for (let i = 0; i < bookTitles.length; i++) {
+ var li = document.createElement('li');
+ var text = document.createElement('p');
+ text.appendChild(document.createTextNode(bookTitles[i]));
+ li.appendChild(text);
+ li.setAttribute('id', 'book_' + bookTitles[i]);
+ ul.appendChild(li);
+ }
+ division.appendChild(ul);
+ return division;
+ }
+ document.body.appendChild(createUl(bookTitles));
+ */
+
+ //making an object containing book information and including nested objects
+ let bookInfos = {};
+ for (let i = 0; i < bookTitles.length; i++) {
+ let j = bookTitles[i];
+
+ if (i === 0) {
+ bookInfos[j] = {
+ title: 'The Mystery on the mountain Parbat',
+ language: 'Turks',
+ author: 'Gulten Dayıoglu',
+ };
+ } else if (i === 1) {
+ bookInfos[j] = {
+ title: 'De Peetvader',
+ language: 'Dutch',
+ author: 'Mario Puzo',
+ };
+ } else if (i === 2) {
+ bookInfos[j] = {
+ title: 'Hunger Games 1',
+ language: 'English',
+ author: 'Suzanne Collins',
+ };
+ } else if (i === 3) {
+ bookInfos[j] = {
+ title: 'Hunger Games Mockingjay',
+ language: 'English',
+ author: 'Suzanne Collins',
+ };
+ } else if (i === 4) {
+ bookInfos[j] = {
+ title: 'Miserables',
+ language: 'English',
+ author: 'Victor Hugo',
+ };
+ } else if (i === 5) {
+ bookInfos[j] = {
+ title: 'Improbable',
+ language: 'English',
+ author: 'Adam Fawer',
+ };
+ } else if (i === 6) {
+ bookInfos[j] = {
+ title: 'Duc Man',
+ language: 'English',
+ author: 'Viollet Le Duc',
+ };
+ } else if (i === 7) {
+ bookInfos[j] = {
+ title: 'Under Ocean',
+ language: 'English',
+ author: 'Jules Verne',
+ };
+ } else if (i === 8) {
+ bookInfos[j] = {
+ title: 'Da Vinci Code',
+ language: 'Turkish',
+ author: 'Dan Brown',
+ };
+ } else if (i === 9) {
+ bookInfos[j] = {
+ title: '5th Horseman',
+ language: 'English',
+ author: 'James Patterson, Maxine Paetro',
+ };
+ }
+ }
+ console.log(bookInfos);
+
+ /*
+ //making another function using the object to write information about book to html body div using related element
+ function createObjectElements(bookInfos) {
+ var div = document.createElement('div');
+ div.setAttribute('id', 'bookInfo');
+ var titleHeader2 = document.createElement('h1');
+ titleHeader2.appendChild(document.createTextNode('Information about The Books'));
+ div.appendChild(titleHeader2);
+ for (let i = 0; i < 10; i++) {
+ var sec = document.createElement('section');
+ sec.setAttribute('class', 'bookInfoItem');
+ var header = document.createElement('h2');
+ header.appendChild(
+ document.createTextNode('The title of the book is ' + bookInfos[bookTitles[i]].title),
+ );
+ sec.appendChild(header);
+
+ var p = document.createElement('p');
+ p.appendChild(
+ document.createTextNode('The language of the book is ' + bookInfos[bookTitles[i]].language),
+ );
+ sec.appendChild(p);
+
+ var p2 = document.createElement('p');
+ p2.appendChild(
+ document.createTextNode('The author of the book is ' + bookInfos[bookTitles[i]].author),
+ );
+ sec.appendChild(p2);
+ div.appendChild(sec);
+ }
+ return div;
+ }
+ document.body.appendChild(createObjectElements(bookInfos));
+ */
+
+ const imgObject = {
+ the_mystery_on_the_mountain_parbat: './img/parbat.jpg',
+ de_peetvader: './img/peetvader.jpg',
+ hunger_games_1: './img/hunger games 1.jpg',
+ hunger_games_mockingjay: './img/hunger_games_mockingjay.jpg',
+ miserables: './img/miserables.jpg',
+ improbable: './img/improbable.jpg',
+ duc_man: './img/duc_man.jpg',
+ under_ocean: './img/under_ocean.jpg',
+ da_vinci_code: './img/da_vinci_code.jpg',
+ '5th_horseman': './img/5th_horseman.jpg',
+ };
+ //Looping over imgObject to get the keys(book names)
+ var objectKeys = Object.keys(imgObject);
+
+ //combining the functions
+ function createObjectElements(bookInfos) {
+ var div = document.createElement('div');
+ div.setAttribute('id', 'bookInfo');
+ var titleHeader = document.createElement('h1');
+ titleHeader.appendChild(document.createTextNode('Information about The Books'));
+ div.appendChild(titleHeader);
+
+ var ul = document.createElement('ul');
+
+ for (let i = 0; i < bookTitles.length; i++) {
+ var li = document.createElement('li');
+ li.setAttribute('id', 'book_' + bookTitles[i]);
+
+ var header = document.createElement('h2');
+ header.appendChild(document.createTextNode(bookInfos[bookTitles[i]].title));
+ li.appendChild(header);
+
+ var p = document.createElement('p');
+ p.appendChild(
+ document.createTextNode(
+ 'The language of the book is: ' + bookInfos[bookTitles[i]].language,
+ ),
+ );
+ li.appendChild(p);
+
+ var p2 = document.createElement('p');
+ p2.appendChild(
+ document.createTextNode('The author of the book is: ' + bookInfos[bookTitles[i]].author),
+ );
+ li.appendChild(p2);
+
+ var imgs = document.createElement('img');
+ imgs.src = imgObject[objectKeys[i]];
+ imgs.alt = objectKeys[i];
+ li.appendChild(imgs);
+ ul.appendChild(li);
+ }
+ div.appendChild(ul);
+ return div;
+ }
+ document.body.appendChild(createObjectElements(bookInfos));
+
+ //making an object containing paths to the related images
+
+ //writing a function to add img sources to li items
+ /*function imgAssingToLi() {
+ for (let j in objectKeys) {
+ var imgs = document.createElement('img');
+ imgs.src = imgObject[objectKeys[j]];
+ imgs.alt = objectKeys[j];
+ document.getElementById('book_' + bookTitles[j]).appendChild(imgs);
+ }
+ return;
+ }
+ imgAssingToLi();*/
}
diff --git a/Week1/homework/background.jpeg b/Week1/homework/background.jpeg
new file mode 100644
index 000000000..75a0dd9c5
Binary files /dev/null and b/Week1/homework/background.jpeg differ
diff --git a/Week1/homework/img/5th_horseman.jpg b/Week1/homework/img/5th_horseman.jpg
new file mode 100644
index 000000000..fc44bfccc
Binary files /dev/null and b/Week1/homework/img/5th_horseman.jpg differ
diff --git a/Week1/homework/img/da_vinci_code.jpg b/Week1/homework/img/da_vinci_code.jpg
new file mode 100644
index 000000000..563a49203
Binary files /dev/null and b/Week1/homework/img/da_vinci_code.jpg differ
diff --git a/Week1/homework/img/duc_man.jpg b/Week1/homework/img/duc_man.jpg
new file mode 100644
index 000000000..0bf990b8e
Binary files /dev/null and b/Week1/homework/img/duc_man.jpg differ
diff --git a/Week1/homework/img/hunger games 1.jpg b/Week1/homework/img/hunger games 1.jpg
new file mode 100644
index 000000000..7c7649857
Binary files /dev/null and b/Week1/homework/img/hunger games 1.jpg differ
diff --git a/Week1/homework/img/hunger_games_mockingjay.jpg b/Week1/homework/img/hunger_games_mockingjay.jpg
new file mode 100644
index 000000000..69cb98679
Binary files /dev/null and b/Week1/homework/img/hunger_games_mockingjay.jpg differ
diff --git a/Week1/homework/img/improbable.jpg b/Week1/homework/img/improbable.jpg
new file mode 100644
index 000000000..ed5fbe16d
Binary files /dev/null and b/Week1/homework/img/improbable.jpg differ
diff --git a/Week1/homework/img/miserables.jpg b/Week1/homework/img/miserables.jpg
new file mode 100644
index 000000000..44a2c740c
Binary files /dev/null and b/Week1/homework/img/miserables.jpg differ
diff --git a/Week1/homework/img/parbat.jpg b/Week1/homework/img/parbat.jpg
new file mode 100644
index 000000000..a7e3835ad
Binary files /dev/null and b/Week1/homework/img/parbat.jpg differ
diff --git a/Week1/homework/img/peetvader.jpg b/Week1/homework/img/peetvader.jpg
new file mode 100644
index 000000000..53c21a9a1
Binary files /dev/null and b/Week1/homework/img/peetvader.jpg differ
diff --git a/Week1/homework/img/under_ocean.jpg b/Week1/homework/img/under_ocean.jpg
new file mode 100644
index 000000000..717b99863
Binary files /dev/null and b/Week1/homework/img/under_ocean.jpg differ
diff --git a/Week1/homework/index.html b/Week1/homework/index.html
index b22147cd1..df9960a60 100644
--- a/Week1/homework/index.html
+++ b/Week1/homework/index.html
@@ -1 +1,14 @@
-
\ No newline at end of file
+
+
+
+
+
+
+
+ homework week 1_js2
+
+
+
+
+
+
diff --git a/Week1/homework/style.css b/Week1/homework/style.css
index bab13ec23..a9efce3b8 100644
--- a/Week1/homework/style.css
+++ b/Week1/homework/style.css
@@ -1 +1,84 @@
-/* add your styling here */
\ No newline at end of file
+/* add your styling here */
+
+body {
+ font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
+ background-image: url('background.jpeg');
+ background-color: #cccccc;
+}
+/* changing the color the the h1's */
+h1 {
+ color: rgb(119, 119, 238);
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
+ 'Open Sans', 'Helvetica Neue', sans-serif;
+ background: none;
+ position: relative;
+ width: 100%;
+ top: 0%;
+ grid-column: 1 / -1;
+ padding-bottom: 1em;
+ text-align: center;
+ text-transform: capitalize;
+}
+
+h2 {
+ text-transform: capitalize;
+ color: white;
+}
+/* styling ul to be grid */
+ul {
+ position: relative;
+ display: grid;
+ grid-gap: 1em;
+ grid-template-columns: auto auto;
+ background-color: rgb(118, 212, 109);
+ padding: 2em;
+ margin: 3em;
+}
+
+/* styling li's */
+ul li {
+ background-color: rgba(255, 255, 255, 0.8);
+ box-shadow: 0.5rem 1rem 2rem 1rem red;
+ flex-basis: 60%;
+ height: 550px;
+ background-color: orangered;
+ border: 0.2em solid red;
+ margin: 2rem;
+ padding: 2em;
+ font-size: large;
+ text-align: center;
+ grid-gap: 5px;
+ box-sizing: border-box;
+ border-radius: 1.5%;
+}
+/* styling li text's so that they would be down of the images */
+ul li p {
+ font-size: large;
+ text-align: center;
+ text-transform: capitalize;
+ position: relative;
+ z-index: 999;
+ margin: 0 auto;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ padding-bottom: 2rem;
+ text-align: center;
+ color: greenyellow;
+ font-weight: bolder;
+}
+/* styling images to make them fit in the grid */
+img {
+ background: none;
+ position: relative;
+ display: flex;
+ margin-left: auto;
+ margin-right: auto;
+ margin-top: auto;
+ margin-bottom: 2em;
+ max-height: 60%;
+ width: 60%;
+ padding-top: 1rem;
+ padding-bottom: 2rem;
+}
diff --git a/Week2/class exercise array/index.html b/Week2/class exercise array/index.html
new file mode 100644
index 000000000..0d71ecc04
--- /dev/null
+++ b/Week2/class exercise array/index.html
@@ -0,0 +1,13 @@
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
diff --git a/Week2/class exercise array/index.js b/Week2/class exercise array/index.js
new file mode 100644
index 000000000..c6142efca
--- /dev/null
+++ b/Week2/class exercise array/index.js
@@ -0,0 +1,93 @@
+//JS function to return first element, and pass a number as parameter
+const arrayMine = [
+ 'paramater_is_study',
+ 1,
+ 'time',
+ 'great op',
+ 'good work',
+ 1,
+ 2,
+ 2341,
+ 'parameter',
+ 'time',
+];
+console.log(arrayMine);
+
+var n = window.prompt('Please enter first how many numbers you want to log');
+var num1 = parseInt(n);
+
+function nthItem(array, num1) {
+ var arrayX = [];
+ for (let i = 0; i < num1; i++) {
+ arrayX.push(array[i]);
+ }
+ return arrayX;
+}
+console.log(nthItem(arrayMine, n));
+
+//a function which accepts a number as input and insert dashes btw each two even number:
+function evenNumbers() {
+ var number = window.prompt('Please enter a number');
+ const string = number.toString();
+ const result = [string[0]];
+ for (let i = 0; i < string.length; i++) {
+ if (string[i - 1] % 2 === 0 && string[i] % 2 === 0) {
+ result.push('-', string[i]);
+ } else if (string[i - 1] % 2 === 1 && string[i] % 2 === 0) {
+ result.push(string[i]);
+ } else if (string[i - 1] % 2 === 0 && string[i] % 2 === 1) {
+ result.push('-', string[i]);
+ } else if (string[i - 1] % 2 === 1 && string[i] % 2 === 1) {
+ result.push(string[i]);
+ }
+ }
+ console.log(result.join(''));
+}
+evenNumbers();
+
+//finding the most frequent item of an array
+function findMostFrequent(array) {
+ var map = {};
+ var mostFrequentElement = array[0];
+ for (var i = 0; i < array.length; i++) {
+ if (!map[array[i]]) {
+ map[array[i]] = 1;
+ } else {
+ ++map[array[i]];
+ if (map[array[i]] > map[mostFrequentElement]) {
+ mostFrequentElement = array[i];
+ console.log('The most frequent element of the array is: ' + mostFrequentElement);
+ } else if (map[array[i]] === map[mostFrequentElement]) {
+ console.log('The array has more than one most frequent elements');
+ console.log(
+ 'The most frequent elements of the array are: ' + mostFrequentElement + ', ' + array[i],
+ );
+ }
+ }
+ }
+}
+
+findMostFrequent(arrayMine);
+
+//function accepting a string as input and swapping the case of each character
+function swapCase() {
+ var str = window.prompt('Please enter something');
+
+ //first we define the alphabet and check the letters according to that
+ var upperCases = 'ABCÇDEFGHIİJKLMNOÖPQRSTUÜVWXYZ';
+ var lowerCases = 'abcçdefghıijklmnoöpqrstuüvwxyz';
+
+ //we will check each letter according to upper and lower case and transform it:
+ var result = [];
+ for (var x = 0; x < str.length; x++) {
+ if (upperCases.indexOf(str[x]) !== -1) {
+ result.push(str[x].toLowerCase());
+ } else if (lowerCases.indexOf(str[x]) !== -1) {
+ result.push(str[x].toUpperCase());
+ } else {
+ result.push(str[x]);
+ }
+ }
+ console.log(result.join(''));
+}
+swapCase();
diff --git a/Week2/class exercise json/index.html b/Week2/class exercise json/index.html
new file mode 100644
index 000000000..08fbd5ac4
--- /dev/null
+++ b/Week2/class exercise json/index.html
@@ -0,0 +1,15 @@
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
+
diff --git a/Week2/class exercise json/index.js b/Week2/class exercise json/index.js
new file mode 100644
index 000000000..e9a24dd4c
--- /dev/null
+++ b/Week2/class exercise json/index.js
@@ -0,0 +1,76 @@
+//JS program for getting the length of an object
+var myObj = {};
+myObj['full'] = 'Galatasaray';
+myObj['short'] = 'GS';
+myObj['league'] = 'Super League';
+myObj['position'] = 1;
+Object.size = function(obj) {
+ var size = 0,
+ key;
+ for (key in obj) {
+ if (obj.hasOwnProperty(key)) size++;
+ }
+ return size;
+};
+
+var size = Object.size(myObj);
+console.log('The length of the object is: ' + size);
+
+//js function to check if object contains given prop
+var x = window.prompt('Please enter a property to check if it exist in the object');
+Object.check = function(obj, x) {
+ for (let key in obj) {
+ if (x === obj.hasOwnProperty(key)) console.log('This is a property of object');
+ else console.log("This property doesn't exist in this object");
+ }
+};
+Object.check(myObj);
+
+//js program to create clock, console the seconds to html
+function countTime() {
+ var today = new Date();
+ var h = today.getHours();
+ var m = today.getMinutes();
+ var s = today.getSeconds();
+ m = checkTime(m);
+ s = checkTime(s);
+ document.getElementById('txt').innerHTML = h + ':' + m + ':' + s;
+ var t = setTimeout(countTime, 500);
+}
+function checkTime(i) {
+ if (i < 10) {
+ i = '0' + i;
+ } // add zero in front of numbers < 10
+ return i;
+}
+
+//js program to create clock, console the seconds
+function my_Clock() {
+ this.cur_date = new Date();
+ this.hours = this.cur_date.getHours();
+ this.minutes = this.cur_date.getMinutes();
+ this.seconds = this.cur_date.getSeconds();
+}
+my_Clock.prototype.run = function() {
+ setInterval(this.update.bind(this), 1000);
+};
+my_Clock.prototype.update = function() {
+ this.updateTime(1);
+ console.log(this.hours + ':' + this.minutes + ':' + this.seconds);
+};
+my_Clock.prototype.updateTime = function(secs) {
+ this.seconds += secs;
+ if (this.seconds >= 60) {
+ this.minutes++;
+ this.seconds = 0;
+ }
+ if (this.minutes >= 60) {
+ this.hours++;
+ this.minutes = 0;
+ }
+ if (this.hours >= 24) {
+ this.hours = 0;
+ }
+};
+var clock = new my_Clock();
+clock.run();
diff --git a/Week2/homework/index.html b/Week2/homework/index.html
new file mode 100644
index 000000000..ce6448a5a
--- /dev/null
+++ b/Week2/homework/index.html
@@ -0,0 +1,14 @@
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
-