Web page coding help?

Bill Arnold

1974
Staff member
Messages
8,622
Location
Thomasville, GA
For you programming gurus out there:

For several years, I've been displaying my shop cam on my website during times I'm out here. Now, I would like to display two cams on the same page and have them refresh occasionally. I found some Java code a few years ago that worked well for one image but have not been able to figure out how to make it work for two images.

Here's the code I've been using:
<script>
var imgFresh = new Image();
var imgNow;
var imgSrc;

function errHandler()
{
defaultStatus = "Failed";
}

function loadHandler()
{
defaultStatus = "Loading ...";
document.images[imgSrc].src = imgNow;

}

function living(srcName,imgFile)
{
imgSrc = srcName;
var now = new Date() ; now = "?"+ now.getTime();
imgNow = imgFile + now;
imgFresh.src = imgNow;
imgFresh.onload=loadHandler;
imgFresh.onerror=errHandler;
setTimeout("living('" + srcName + "','" + imgFile + "')",5000);
}

</script>

I've tried duplicating portions of the script and using subscripts to differentiate them. What should I be doing to the script? Or, is there a better way to do what I want.

Thanks for your help.

PS: Yeah, yeah. I know this is a woodworking forum but there seem to be some sharp computer folks on here. :thumb:

By the way, the software I'm using to control the cameras and FTP the jpg files is iSpy.
 
Bill,

On the onload event of your body tag, it looks like you're calling

living("liveimg","shop_1.jpg");

Looks like you should be calling that twice, but on the second call you need to call the name for the name attribute in the second IMG tag. Currently both images have the same value ('liveimg') in the name. Change teh second one to something like 'liveimg2' and for the second parameter of the living() call, pass the image name that should show in that second IMG

living("liveimg","shop_1.jpg");living("liveimg2","shop_2.jpg");

Hope that makes sense...if not I'll try to explain more.
 
Body tag should read:

HTML:
<body vlink="#000080" bgcolor="#FFFFFF" alink="#000080" text="#000000" link="#000080" onload="living('liveimg','shop_1.jpg');living('liveimg2','shop_2.jpg');" bgproperties="FIXED">

second image should be:

HTML:
<img border="1" alt="Cam 2 Loading..." name="liveimg2" src="shop_2.jpg">
 
Last edited:
Darren,

Thanks for the code, but I'm still having an issue. The "onload" only seems to work with the last parameter called. Using the code as written, "image2" is the only one that changes. If I vary the code and place the "image1" function in the second position, then image1 changes as it should but image2 does not.
 
change the comma between the two javascript calls to a semicolon:

HTML:
living('liveimg','shop_1.jpg'),living('liveimg2','shop_2.jpg')

to

HTML:
living('liveimg','shop_1.jpg');living('liveimg2','shop_2.jpg')

Javascript uses semicolons to separate function calls.
 
Last edited:
Top