CodeYourFuture · DenizAri · Aug 3, 2020
diff --git a/Week-3/Homework/mandatory/1-alarmclock/alarmclock.js b/Week-3/Homework/mandatory/1-alarmclock/alarmclock.js
@@ -1,4 +1,45 @@
-function setAlarm() {}
+
+function setAlarm() {
+  //Selectors
+  let inputValue=document.getElementById("alarmSet"); 
+  let timer=inputValue.value;
+  let timeRemaining=document.querySelector("#timeRemaining");  
+
+
+  let stopButton=document.querySelector("#stop");
+  //eventListener
+
+
+ let clock =setInterval(countDown,1000);
+
+function countDown(){
+
+
+if (timer<0){
+  inputValue.value="";
+  playAlarm();
+}
+else {
+  if (timer>=10){
+    timeRemaining.textContent=`time Remaining: 00:${timer}`;
+    timer--;
+
+  }
+  else{
+    timeRemaining.textContent=`time Remaining: 00:0${timer}`;
+    timer--;
+  }
+}
+}
+
+stopButton.addEventListener("click", () => {
+clearInterval(clock);
+pauseAlarm();
+});
+
+
+
+}
 
 // DO NOT EDIT BELOW HERE
 

diff --git a/Week-3/Homework/mandatory/1-alarmclock/index.html b/Week-3/Homework/mandatory/1-alarmclock/index.html
@@ -2,7 +2,7 @@
 <html>
   <head>
     <title>Alarm Clock</title>
-    <script src="alarmclock.js"></script>
+    <script defer src="alarmclock.js"></script>
     <link
       rel="stylesheet"
       href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"

diff --git a/Week-3/Homework/mandatory/2-quotegenerator/index.html b/Week-3/Homework/mandatory/2-quotegenerator/index.html
@@ -2,7 +2,7 @@
 <html>
   <head>
     <title>Quote Generator</title>
-    <script src="quotes.js"></script>
+    <script  defer src="quotes.js"></script>
     <link
       rel="stylesheet"
       href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
@@ -13,5 +13,14 @@
   </head>
   <body>
     <!-- Write your HTML in here -->
+<div>
+  <h1 id="myH1">
+test quote </h1>
+<p id="myP"> test autor</p>
+<button id="myButton">
+  Next Quote
+</button>
+</div>
+
   </body>
 </html>
diff --git a/Week-3/Homework/mandatory/2-quotegenerator/quotes.js b/Week-3/Homework/mandatory/2-quotegenerator/quotes.js
@@ -1,3 +1,14 @@
+
+let h1E1=document.getElementById("myH1");
+let pE1=document.getElementById("myP");
+let buttonE1=document.getElementById("myButton");
+
+buttonE1.addEventListener("click", () => {
+  const number = Math.floor(Math.random()* quotes.length);
+  h1E1.textContent = quotes[number].quote;
+  pE1.textContent= quotes[number].author;
+
+});
 // DO NOT EDIT BELOW HERE
 
 // A function which will return one item, at

diff --git a/Week-3/Homework/mandatory/3-slideshow/images/cat1.jpg b/Week-3/Homework/mandatory/3-slideshow/images/cat1.jpg
diff --git a/Week-3/Homework/mandatory/3-slideshow/images/cat2.jpg b/Week-3/Homework/mandatory/3-slideshow/images/cat2.jpg
diff --git a/Week-3/Homework/mandatory/3-slideshow/images/cat3.jpg b/Week-3/Homework/mandatory/3-slideshow/images/cat3.jpg
diff --git a/Week-3/Homework/mandatory/3-slideshow/images/cat4.jpg b/Week-3/Homework/mandatory/3-slideshow/images/cat4.jpg
diff --git a/Week-3/Homework/mandatory/3-slideshow/index.html b/Week-3/Homework/mandatory/3-slideshow/index.html
@@ -2,7 +2,7 @@
 <html>
   <head>
     <title>Slideshow</title>
-    <script src="slideshow.js"></script>
+    <script defer src="slideshow.js"></script>
     <link
       rel="stylesheet"
       href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
@@ -12,6 +12,13 @@
     <link rel="stylesheet" href="style.css" />
   </head>
   <body>
-    <!-- Write your HTML in here -->
+    <div id="imgSlider">
+      <img id= "images" src="images/cat1.jpg" width="400px" height ="400px">
+<button id ="autoRev">Auto Reverse</button>
+<button id= "back">Back</button>
+<button id= "stop">Stop</button>
+<button id = "forward">Forward</button>
+<button id = "autoFor">Auto Forward</button>
+    </div>
   </body>
 </html>
diff --git a/Week-3/Homework/mandatory/3-slideshow/slideshow.js b/Week-3/Homework/mandatory/3-slideshow/slideshow.js
@@ -1 +1,27 @@
-// Write your code here
+let catIndex1 = 4;
+let catIndex2 = 0;
+let catRevCount = 4;
+let catForCount = 0;
+let catReverse;
+let catForward;
+let catArray = ["images/cat1.jpg", "images/cat2.jpg", "images/cat3.jpg", "images/cat4.jpg"];
+let autoRev = document.getElementById("autoRev");
+autoRev.addEventListener("click", function () {
+    catReverse = setInterval(() => {
+        document.getElementById("images").src = catArray[catIndex1];  
+        catIndex1--;  
+        if(catIndex1 === catArray.length-4) {
+            catIndex1 = 4;
+        }
+    }, 2000);
+})
+let autoFor = document.getElementById("autoFor");
+autoFor.addEventListener("click", function () {
+    catForward = setInterval(() => {
+        document.getElementById("images").src = catArray[catIndex2];
+        catIndex2++;
+        if (catIndex2 === 4) {
+            catIndex2 = 0;
+        }
+    }, 2000);
+})