From c06454682f6efe1c35ceacc27b9ebaadbfe49a9e Mon Sep 17 00:00:00 2001 From: Samira Date: Mon, 25 Nov 2024 10:07:03 +0100 Subject: [PATCH 1/2] update change --- .../1-traffic-light/traffic-light-1.js | 19 +++-------- .../1-traffic-light/traffic-light-2.js | 32 +++++++------------ 2 files changed, 16 insertions(+), 35 deletions(-) diff --git a/Week1/prep-exercises/1-traffic-light/traffic-light-1.js b/Week1/prep-exercises/1-traffic-light/traffic-light-1.js index f1d9169..982af8a 100644 --- a/Week1/prep-exercises/1-traffic-light/traffic-light-1.js +++ b/Week1/prep-exercises/1-traffic-light/traffic-light-1.js @@ -11,21 +11,12 @@ let rotations = 0; while (rotations < 2) { const currentState = trafficLight.state; console.log("The traffic light is on", currentState); - - // TODO - // if the color is green, turn it orange - // if the color is orange, turn it red - // if the color is red, add 1 to rotations and turn it green } -/** - * The output should be: +if (currentState === "green") { trafficLight.state = "orange"; -The traffic light is on green -The traffic light is on orange -The traffic light is on red -The traffic light is on green -The traffic light is on orange -The traffic light is on red +} else if (currentState === "orange") { trafficLight.state = "red"; -*/ + } else if (currentState === "red") { trafficLight.state = "green"; + rotations++; + } \ No newline at end of file diff --git a/Week1/prep-exercises/1-traffic-light/traffic-light-2.js b/Week1/prep-exercises/1-traffic-light/traffic-light-2.js index 8c6ba95..5429fbf 100644 --- a/Week1/prep-exercises/1-traffic-light/traffic-light-2.js +++ b/Week1/prep-exercises/1-traffic-light/traffic-light-2.js @@ -1,9 +1,5 @@ "use strict"; -/** - * The `possibleStates` property define the states (in this case: colours) - * in which the traffic light can be. - * The `stateIndex` property indicates which of the possible states is current. - */ + const trafficLight = { possibleStates: ["green", "orange", "red"], stateIndex: 0, @@ -14,20 +10,14 @@ while (cycle < 2) { const currentState = trafficLight.possibleStates[trafficLight.stateIndex]; console.log("The traffic light is on", currentState); - // TODO - // if the color is green, turn it orange - // if the color is orange, turn it red - // if the color is red, add 1 to cycles and turn it green -} - -/** - * The output should be: - -The traffic light is on green -The traffic light is on orange -The traffic light is on red -The traffic light is on green -The traffic light is on orange -The traffic light is on red + if (currentState === "green") + { trafficLight.stateIndex = 1; + } else if (currentState === "orange") + { trafficLight.stateIndex = 2 ; -*/ + } else if (currentState === "red") { + trafficLight.stateIndex = 0; + + cycle++; + } + } \ No newline at end of file From 0877a5a4a7a63ff0dd70f1097946e4edf4050a78 Mon Sep 17 00:00:00 2001 From: Samira Date: Tue, 26 Nov 2024 11:27:48 +0100 Subject: [PATCH 2/2] samira week1 js --- .../1-traffic-light/traffic-light-1.js | 26 +++++----- .../1-traffic-light/traffic-light-2.js | 48 ++++++++++++------- 2 files changed, 46 insertions(+), 28 deletions(-) diff --git a/Week1/prep-exercises/1-traffic-light/traffic-light-1.js b/Week1/prep-exercises/1-traffic-light/traffic-light-1.js index 982af8a..0882b12 100644 --- a/Week1/prep-exercises/1-traffic-light/traffic-light-1.js +++ b/Week1/prep-exercises/1-traffic-light/traffic-light-1.js @@ -3,20 +3,24 @@ * The `state` property says what the traffic light's state (i.e. colour) is at * that moment. */ + const trafficLight = { - state: "green", + state : "green", }; - -let rotations = 0; -while (rotations < 2) { +let rotation = 0; +while (rotation < 2) { const currentState = trafficLight.state; - console.log("The traffic light is on", currentState); -} + console.log('The traffic light is on' , currentState); -if (currentState === "green") { trafficLight.state = "orange"; +if ( currentState === "green") { + trafficLight.state ="orange"; -} else if (currentState === "orange") { trafficLight.state = "red"; +} +else if (currentState === "orange") { + trafficLight.state = "red"; - } else if (currentState === "red") { trafficLight.state = "green"; - rotations++; - } \ No newline at end of file +} +else if (currentState === "red" ) { + trafficLight.state = "green"; + rotation++; +}} \ No newline at end of file diff --git a/Week1/prep-exercises/1-traffic-light/traffic-light-2.js b/Week1/prep-exercises/1-traffic-light/traffic-light-2.js index 5429fbf..4e9cc6c 100644 --- a/Week1/prep-exercises/1-traffic-light/traffic-light-2.js +++ b/Week1/prep-exercises/1-traffic-light/traffic-light-2.js @@ -1,23 +1,37 @@ "use strict"; -const trafficLight = { - possibleStates: ["green", "orange", "red"], - stateIndex: 0, +const trafficlight = { + possibleStates : [ "green", "orange", "red"], + stateIndex :0, }; - let cycle = 0; -while (cycle < 2) { - const currentState = trafficLight.possibleStates[trafficLight.stateIndex]; - console.log("The traffic light is on", currentState); +function updateTrafficLight() { + const currentState = trafficlight.possibleStates[trafficlight.stateIndex]; + const trafficLightElement = document.getElementById("traffic-light"); + trafficLightElement.textContent = `The traffic light is on ${currentState}`; + trafficLightElement.className = ""; + trafficLightElement.classList.add(currentState); + + if (currentState === "green") { + trafficlight.stateIndex = 1; + + } + else if(currentState === "orange") { + trafficlight.stateIndex = 2; + + } + else if(currentState === "red") { + trafficlight.stateIndex = 0; + cycle++; + } + + if (cycle < 3) { + setTimeout(updateTrafficLight, 1000); - if (currentState === "green") - { trafficLight.stateIndex = 1; - } else if (currentState === "orange") - { trafficLight.stateIndex = 2 ; + } + else { + trafficLightElement.textContent = "Traffic light simulation compeleted." ; + } +} - } else if (currentState === "red") { - trafficLight.stateIndex = 0; - - cycle++; - } - } \ No newline at end of file +updateTrafficLight(); \ No newline at end of file