Gary,
I don't think you need anything to protect it if you use the plastic visor/cover as shown in the pic below. I previously had mine mounted on the back of my house, totally exposed to the wind and weather.
When I moved it under the front porch overhang I removed the visor.
If you have bandwidth to spare you could offer both streaming and single shots. Another alternative is to post a single shot that refreshes every 5 seconds for 2 minutes or so (only the pic refreshes, not the entire page). Here is how to do so.
First, use notepad to create a Javascript file on your web server named imagecounter.js containing the following:
var camImage = 'http://[IPaddress:port#]/__live.jpg?&&&';
var refreshIntervalSeconds = 5;
var secondsLeft = refreshIntervalSeconds;
var reloadCount = 24;
function startCount() {
if (reloadCount < 1) {
document.webCam.timer.value = "-----";
return;
} else {
startClock();
}
}
function startClock() {
if (secondsLeft > 0) {
if (secondsLeft < 10) {
document.webCam.timer.value = '0' + secondsLeft;
} else {
document.webCam.timer.value = secondsLeft;
}
secondsLeft = secondsLeft - 1
timerID = setTimeout('startClock()', 1000);
} else {
date = new Date();
imageNumber = date.getTime();
document.webCamImage.src = camImage + '?' + imageNumber;
secondsLeft = refreshIntervalSeconds;
reloadCount = reloadCount - 1;
startCount();
}
}In your html page somewhere before the cam image you have to add a few things. First, call the above code by adding a line:
<script type="text/javascript" src="imagecounter.js"></script>Then you need to add a 'onload' statement to an existing image so the timer starts when the page is loaded. I add it to a new.gif just before the cam image, as you can see in the code below. At the location where you want the cam image and countdown timer, create a form to contain your cam image.
<img onload="startClock()" src="new.gif">
<form name="webCam" action="#">
Image below will refresh every 5 seconds for two minutes - Auto-refresh in: <input type="text" name="timer" size="2"> seconds.
<img src="http://[IPaddress:port#]/__live.jpg?&&&" name="webCamImage" alt="Refreshes every 5 seconds..." title="Refreshes every 5 seconds..." width="640" height="480" border="0">
</form>
Obviously replace the ip address with your cam address, or any image file reference, and change the width and height if needed. The form name must match the name used in the .js file for the document, so either don't change it or change both.
You can change the refresh interval and the total time before it stops refreshing by modifying the var refreshIntervalSeconds = 5;
and the var reloadCount = 24; Note that 24 indicates that it does 24 refreshes at 5 seconds totalling 5*24=120 seconds total time. For 3 minutes, set it to 36.
This will work for any image that changes, either on disk or one that can be refreshed from a camera or other source. Just change the image reference in both the .js file and in the form reference.
So now we want to see it work on your site. You have a really nice clean look and it needs a cam image. Post a link!
