15. April 2013 17:25by jphellemons
We have several IP camera’s in the building for security purposes. They all have internal IP addresses and can be viewed separately with their own web interface which is Chinese by default and does not remember the language setting.
It refreshes the url by adding a new random number to the image source:
new Date().getTime() + Math.random();
This inspired me to make an overview webpage of all the webcams in our LAN.
Since it might be accessed through a mobile device, I have used the responsive version of the twitter bootstrap. For the small source and the caching of browsers, I have used the jQuery library and the twitter one from CDN’s.
I have used jQuery 1.9.1 and bootstrap 2.3.1 and that is all there is. Please let me know if you have any suggestions to make it even better. For demo purposes I have not changed the logins of the Wanscams and used the factory settings.
You can fork this code on GitHub. or view the code of the single HTML page on this url: https://github.com/jphellemons/WebcamMonitor/blob/master/index.html