Welcome to the Traffic Light Controller project! This project is a simulation of a traffic light system using HTML, CSS, and JavaScript. It's a great way to understand how traffic lights work and how we can control them programmatically.
The project consists of a traffic light and a controller pole, both of which contain three lights: red, yellow, and green.
When you press one of the color buttons on the controller pole, the corresponding light on the traffic light will glow brightly, while the other two lights will fade. This simulates the behavior of a real-world traffic light, where only one light is on at a time.
In addition to the color buttons, there is also a reset button. Clicking this button will reset the traffic light to its initial state, where all the lights are slightly faded. This represents a state where the traffic light is not active.
- Select a color: Choose a color from the controller pole by clicking on the red, yellow, or green button. The corresponding light on the traffic light will glow.
- Reset the system: If you want to reset the traffic light to its initial state, click the reset button. All the lights on the traffic light will return to their slightly faded appearance.
This project is a basic simulation of a traffic light system. In the future, we could add more features, such as:
- Automatic switching: Instead of manually clicking the buttons, the lights could change automatically every few seconds, just like real traffic lights.
- Pedestrian crossing: We could add a pedestrian crossing light and button to the system.
- Synchronization: If we had multiple traffic lights, we could synchronize them to ensure smooth traffic flow.
Contributions are welcome! If you have ideas for improvements or bug fixes, feel free to make a pull request.