This forum has moved to a new location and is in read-only mode. Please visit talk.octobercms.com to access the new location.

  1. Forum
  2. FormTools Support
  3. Webcam Page
CianH
CianH

Hi All,

I'm new to using OctoberCMS but loving it so far! I'm developing a new site for my sailing club and we need to have a page auto refresh ever 20 second or so to reload a image that is uplaoded by one of our webcams. is there a simple way of doing this?

So far i have the onStart() function that grabs the file and outputs it to {{this.page.webcam}} this all works great as seen here: http://basc.site/webcam but how would i get the page to then auto reload? is it possible with Ajax?

alxy
alxy
Moderator

This is some basic JavaSript you will need here:

setTimeout(function(){
   $.request('onLoadImage', {
    update: { image-partial: '.img-container' }
   });
}, 20000);

With the update directive you can update a partial (in your case, you should update the image). It is also possible to push content updates directly from the handler method:

CianH
CianH

Thanks for that i added it and made the changes i need to but still not working, is the right? 


title = "Webcam"
url = "/webcam"
layout = "default"
is_hidden = 0
==

function onStart(){
    $dir = "../webcam-images";
  $files = scandir($dir, 1);
  $last_file = $files[1];
  $this->page["webcam"] = $last_file;

}

==

setTimeout(function(){
   $.request('onLoadImage', {
    update: { image-partial: '.webcam' }
   });
}, 20000);


 class="webcam" id="webcam" data-request="onLoadImage"> src="/webcam-images/{{this.page.webcam}}" class="fr-dii fr-draggable webcam" id="webcam" style="width: 800px;"/>

Ive removed the tags so they will display in the code box

Last updated

1-3 of 3

You cannot edit posts or make replies: the forum has moved to talk.octobercms.com.