# Stap 6, oranje flash ***Het oranje licht gaat nu automatisch aan en uit. De functie van kunnen klikken op oranje is nu overbodig. Deze functie gaan we nu wijzigen. Aan het eind van deze stap gaat het oranje licht knipperen en gaan de andere lichten uit. *** Als we op het oranje licht klikken dan zal die aan gaan, maar we hebben het algoritme al zo verandert dat het oranje licht vanzelf aan gaat als we het licht op rood willen zetten. Wat we gaan doen is dat we het stoplicht 'uit' gaan zetten als we op het oranje licht klikken. Welke stappen gaan we doen? 1. We gaan een style maken die het oranje licht laat knipperen. 2. We maken een nieuwe functie en die noemen we switchOff(). Deze functie voegt de nieuwe stijl toe aan het oranje licht en zet het groene en rode licht uit. ### Flash stijl In de style sectie plaatsen we twee nieuwe stijlen: ```CSS .lamp-flash { animation: flash 1s infinite; } @keyframes flash { 0%, 100% { background-color: darkgray; } /* Light off (dark gray color) */ 50% { background-color: orange; } /* Light on (orange color) */ } ``` Als we nu de stijl lamp-flash toevoegen aan het oranje licht dan zal hij gaan knipperen. ### Functie In de nieuwe functie switchOff() zetten we het oranje licht op knipperen. ```JavaScript function switchOff() { document.getElementById("orange").classList.add('lamp-flash'); } ``` ### Functie aanroepen Als je op het oranje licht klikt dan moet je in plaats van `switchLight('red')` nu `switchOff()` aanroepen. Pas dit aan. ### Testen Als je nu op het oranje licht drukt dan gaat het oranje licht knipperen. Nice, maar er zijn nog wel een paar stappen die niet goed werken. Dat gaan we nu oplossen. ### Oranje dan andere lichten uit. Pas de *switchOff*() aan en zet de andere lichten uit. Kijk in de bestaande code hoe je de lichten uitschakelt en plaats deze code in de *switchOff* functie. Vergeet niet de *glow* ook uit te zetten! En dan moet je de flash ook nog weer uit zetten. Dat doe je met deze code: ```JavaScript document.getElementById("orange").classList.remove('lamp-flash'); ``` Op het moment dat het stop licht uit staat (dus oranje knippert) dan kan je deze weer aan zetten door op het rode of groene licht te klikken. Bedenk nu zelf waar je de code moet zetten om het stoplichte weer aan te zetten. ### Tekst aanpassen Als het oranje licht knippert moet de tekst onderaan het stoplicht veranderen naar '-' ### Testen Test of alles werkt aan de hand van volgende tabel.
Status Klikt op Resultaat Tekst Werkt?
Alles uit (begin) rood rood aan, rest uit. -
rood aan groen groen aan, rest uit STOP
groen aan rood oranje aan 1 sec, dan rood aan, rest uit. GO
rood of groen aan oranje alles uit en oranje gaat knipperen-
oranje knippert rood rood aan, rest uit STOP
oranje knippert groen groen aan, rest uit GO
\-