/traffic-light-server-status

My solution to the described exercise to monitor the status of URLs with traffic lights.

Primary LanguageJavaScript

Traffic Light Server Status

Description

In object-oriented JavaScript, and using HTML, CSS and preferably jQuery, create a traffic light object that achieves the following:

  • The object renders a traffic light on the web page, like the one shown above
  • Every 10 seconds the object checks a URL (e.g. "/status") and retrieves the HTTP status code of the response
  • If the status code is 200, the green light is illuminated and the red light is dimmed
  • If the status code is not 200 or there is a timeout or other error, the green light is dimmed and the red light is illuminated and set flashing
  • One can place multiple objects on the same page monitoring different URLs
  • The object should include a function for triggering fetching the URL, which can be executed via the JavaScript console or via a future button onclick handler.

Demo

In Chrome, temporarily enable cross-origin resource sharing.

Run