Reload Webcam Images by Port Number

Hi everyone, first time-long time, so be gentle. :)

When users log into our warehouse website, they can view specific webcams as designated by their account permissions. Each webcam FTPs one image every second to a predetermined image directory and has a different image name based on its port (ex. "80021.jpg", "80022.jpg", etc.)

Using a PHP recordset, I'm loading one camera image at a time, based on permissions, and that's working great. But using Javascript I want to refresh the images every 2 seconds without refreshing the page.

My problem is I need to tell the Javascript newImage function (see below) what the image is called (ex. "80021.jpg", "80022.jpg", etc.) based on the PHP recordset.

(Javascript to reload the image:)
<script type="text/javascript">
function newImage(){
      if(document.images){
            document.images['camImage'].src =**CAMERA-SPECIFIC IMAGE NAME HERE??** +  '.jpg?' + Date.parse(new Date().toString());
      }
      setTimeout(newImage,5000);
}
</script>

(Image call in the html body:)
<img name="camImage" src="<? echo $aCams[$iCount]['iPortNumber']?>.jpg" />

Admittedly this kinda thing is new to me, so if I need to bark up another tree, let me know.
IgniteWebAsked:
Who is Participating?
 
Michel PlungjanIT ExpertCommented:
<script type="text/javascript">
function newImage(){
  if (!document.images) return; // no need to stay
  var src = document.images['camImage'].src;
  document.images['camImage'].src = src.substring(0,src.lastIndexOf('.jpg'))+ '.jpg?' + new Date().getTime();
  setTimeout('newImage()',5000);
}
</script>
0
 
Michel PlungjanIT ExpertCommented:
or better
<script type="text/javascript">
function newImage(){
  var src = document.images['camImage'].src;
  document.images['camImage'].src = src.substring(0,src.lastIndexOf('.jpg'))+ '.jpg?' + new Date().getTime();
}
window.onload=function() {
  if (document.images) setInterval('newImage()',5000);
}
</script>

Open in new window

0
 
IgniteWebAuthor Commented:
Thanks for your expertise. much appreciated!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.