HackYourFuture · spiropoulos94 · Jan 21, 2020
diff --git a/Week1/js-exercises/aboutMe/about_me.html b/Week1/js-exercises/aboutMe/about_me.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>About Me</title>
+    <link rel="stylesheet" type="text/css" href="C:\Users\Nikos Sp\Desktop\javascript2 week 1\aboutMe\styles.css">
+  </head>
+  <body>
+    <h1>About Me</h1>
+
+    <ul>
+      <li>Nickname: <span id="nickname"></span></li>
+      <li>Favorite food: <span id="fav-food"></span></li>
+      <li>Hometown: <span id="hometown"></span></li>
+    </ul>
+    <script src="C:\Users\Nikos Sp\Desktop\javascript2 week 1\aboutMe\index.js"></script>
+  </body>
+</html>
+
+
diff --git a/Week1/js-exercises/aboutMe/index.js b/Week1/js-exercises/aboutMe/index.js
@@ -0,0 +1,25 @@
+let body = document.querySelector("BODY");
+//document.getElementById("body").style.fontFamily = "Impact,Charcoal,sans-serif";
+
+body.style.fontFamily = "Arial, sans-serif";
+
+
+document.getElementById("nickname").textContent = "Kotsidas";
+document.getElementById("fav-food").textContent = "Pasta";
+document.getElementById("hometown").textContent = "Heraclion";
+
+let list = document.querySelectorAll("li")
+
+for (let i=0; i<list.length; i++){
+  list[i].classList.add("list-item")
+}
+
+let profImage = document.createElement("img")
+profImage.src = "http://i.imgur.com/TENxP.jpg"
+profImage.width = "150"
+
+document.body.appendChild(profImage)
+
+
+
+
diff --git a/Week1/js-exercises/aboutMe/styles.css b/Week1/js-exercises/aboutMe/styles.css
@@ -0,0 +1,7 @@
+body {
+    font-family: sans-serif;
+  }
+
+  .list-item {
+    color:red;
+  }
diff --git a/Week1/js-exercises/hijackLogo/hijackGoogleLogo.js b/Week1/js-exercises/hijackLogo/hijackGoogleLogo.js
@@ -0,0 +1,13 @@
+function hijackGoogleLogo() {
+    var logo = document.getElementById("hplogo");
+    logo.src = "https://www.hackyourfuture.dk/static/logo-dark.svg"
+    logo.srcset = "https://www.hackyourfuture.dk/static/logo-dark.svg";
+    logo.removeAttribute("onload");
+    logo.removeAttribute("data-iml");
+    logo.removeAttribute("data-atf");
+  }
+
+
+
+  hijackGoogleLogo();
+
diff --git a/Week1/js-exercises/showCurrentTime/showCurrentTime.js b/Week1/js-exercises/showCurrentTime/showCurrentTime.js
@@ -0,0 +1,16 @@
+function showCurrentTime() {
+    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(showCurrentTime, 500);
+  }
+  function checkTime(i) {
+    if (i < 10) {i = "0" + i};  // add zero in front of numbers < 10
+    return i;
+  }
+
diff --git a/Week1/js-exercises/showCurrentTime/styles.css b/Week1/js-exercises/showCurrentTime/styles.css
@@ -0,0 +1,18 @@
+body {
+    display: flex;
+    background-color:red;
+}
+
+#txt {
+    display:inline-block;
+    margin-left: 50vw;
+    margin-top: 50vh;
+    font-size:x-large;
+
+    border:darkred;
+    border-style: double;
+    background-color: white;
+
+}
+
+
diff --git a/Week1/js-exercises/showCurrentTime/time.html b/Week1/js-exercises/showCurrentTime/time.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <link rel="stylesheet" type="text/css" href="C:\Users\Nikos Sp\Desktop\javascript2 week 1\showCurrentTime\styles.css">
+<script src="C:\Users\Nikos Sp\Desktop\javascript2 week 1\showCurrentTime\showCurrentTime.js">
+
+</script>
+</head>
+
+<body onload="showCurrentTime()">
+
+<div id="txt"></div>
+
+
+</body>
+</html>
diff --git a/Week1/js-exercises/theBookList/app.js b/Week1/js-exercises/theBookList/app.js
@@ -0,0 +1,78 @@
+const books = [
+  {
+    title: "The Design of Everyday Things",
+    author: "Don Norman",
+    alreadyRead: false
+  },
+  {
+    title: "The Most Human Human",
+    author: "Brian Christian",
+    alreadyRead: true
+  }
+];
+
+//add classes :istItem to every li
+
+var linkOne = document.createElement("a");
+linkOne.classList.add("linkOne");
+
+linkOne.href = "https://i.ebayimg.com/images/g/kHYAAOSwn1FZtG6R/s-l300.jpg";
+var bookOneImage = document.createElement("img");
+bookOneImage.classList.add("bookOne");
+bookOneImage.src = "https://i.ebayimg.com/images/g/kHYAAOSwn1FZtG6R/s-l300.jpg";
+bookOneImage.width = "200";
+
+linkOne.innerHTML = bookOneImage;
+
+//document.body.appendChild(linkOne)
+
+//document.getElementsByClassName.read.
+
+console.log(linkOne); //ayto prepei na mpei mesa sto li
+console.log(bookOneImage);
+
+var bookTwoImage = document.createElement("img");
+bookTwoImage.src =
+  "https://images-na.ssl-images-amazon.com/images/I/41m1rQjm5tL._SX322_BO1,204,203,200_.jpg";
+bookTwoImage.width = "200";
+
+const bookCovers = [bookOneImage, bookTwoImage];
+
+var bookUL = document.createElement("UL");
+var bookULText = document.createTextNode("List of my favourite books");
+document.body.appendChild(bookULText);
+
+for (let i = 0; i < books.length; i++) {
+  var bookLi = document.createElement("li");
+  var bookTitle = document.createTextNode(
+    ` ${books[i].title} from ${books[i].author}`
+  );
+
+  document.body.appendChild(bookUL);
+  bookLi.appendChild(bookTitle);
+  bookUL.appendChild(bookLi);
+  bookLi.appendChild(bookCovers[i]);
+
+  if (books[i]["alreadyRead"]) {
+    bookLi.className += "readYes";
+  } else {
+    bookLi.className += "readNo";
+  }
+}
+
+var listItems = document.querySelectorAll("li");
+for (var i = 0; i < listItems.length; i++) {
+  listItems[i].classList.add("listItem");
+}
+
+for (let i = 0; i < listItems.length; i++) {
+  listItems[i].appendChild(linkOne);
+}
+
+for (let i = 0; i < listItems.length; i++) {
+  listItems[i].appendChild(linkOne);
+}
+
+console.log(listItems[0]);
+
+let test1 = document.getElementsByClassName("listItem");
diff --git a/Week1/js-exercises/theBookList/index.html b/Week1/js-exercises/theBookList/index.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+	<title>Parcel Sandbox</title>
+	<meta charset="UTF-8" />
+	<link rel="stylesheet" href="C:\Users\Nikos Sp\Desktop\javascript2 week 1\theBookList\style.css">
+
+</head>
+
+<body>
+	<script src="C:\Users\Nikos Sp\Desktop\javascript2 week 1\theBookList\app.js">
+	</script>
+
+
+	<div id="app"></div>
+	<p>elaelaelatest</p>
+
+
+</body>
+
+</html>
diff --git a/Week1/js-exercises/theBookList/style.css b/Week1/js-exercises/theBookList/style.css
@@ -0,0 +1,18 @@
+body {
+    font-family: sans-serif;
+
+  }
+
+
+  .readYes {background-color:green;}
+  .readNo {background-color: red;}
+
+
+  .booklist {
+    background-color:blueviolet
+  }
+
+  #testtesttest {
+    background-color:red;
+  }
+
diff --git a/Week1/js-exercises/theCatWalk/index.html b/Week1/js-exercises/theCatWalk/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>Cat Walk</title>
+  </head>
+  <body>
+
+      <script src="C:\Users\Nikos Sp\Desktop\javascript2 week 1\theCatWalk\jscode.js"></script>
+    <img style="position:absolute;" src="http://www.anniemation.com/clip_art/images/cat-walk.gif" />
+  </body>
+</html>
diff --git a/Week1/js-exercises/theCatWalk/jscode.js b/Week1/js-exercises/theCatWalk/jscode.js
@@ -0,0 +1,2 @@
+let image = document.querySelector("img")
+console.log(image)
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		let image = document.querySelector("img")
		console.log(image)