Sunspot Home

Objective
Save pictures from a webcam every few minutes to build up timelapse slideshow

The Blassic basic program

This uses wget in a shell to grab the webcam picture and save it to the ramdisk
It then uses uploadpics.sh to send the jpegs to the folder /wessex/Slideshow_eype on the sunspot website

#! /usr/sbin/blassic

' blassic /var/www/wessex/save-raw-pics.bas

x=0
x$ = STR$(x)
cycle = 1
SHELL "mkdir /var/www/ramdisk/Slideshow_eype"
SHELL "mkdir /var/www/ramdisk/Slideshow_swanage"
SHELL "mkdir /var/www/ramdisk/Slideshow_goldencap"
SHELL "mkdir /var/www/ramdisk/Slideshow_burtonbradstock"

LABEL StartAgain
x = x + 1
x$ = STR$(x)
pic_name$ = "eype"
pic_url$ = "http://hecam.ath.cx:8095/axis-cgi/jpg/image.cgi?%20width="
GOSUB CreateSlideshow

pic_name$ = "swanage"
pic_url$ = "http://www.corbens.co.uk/webcam/upload_00001.jpg"
GOSUB CreateSlideshow

pic_name$ = "goldencap"
pic_url$ = "http://www.360panoramas.co.uk/webcam/images/webcam00.jpg"
GOSUB CreateSlideshow

pic_name$ = "burtonbradstock"
pic_url$ = "http://81.149.197.166:8095/axis-cgi/jpg/image.cgi"
GOSUB CreateSlideshow

PAUSE 120000

IF x = 10 THEN x = 0 : cycle = cycle + 1
PRINT "cycle = ", cycle, " x = ", x$
'IF cycle = 5 THEN SYSTEM
GOTO StartAgain

LABEL CreateSlideshow
PRINT "x = ", x$, "cycle = ", cycle
cam_folder$ = "Slideshow_" + pic_name$
PRINT cam_folder$
local_save_pic_file$ = "/var/www/ramdisk/" + cam_folder$ + "/" + pic_name$ + x$ + ".jpg"
PRINT local_save_pic_file$
wget$ = "wget -t 2 -O "+ local_save_pic_file$ + " " + pic_url$
PRINT "wget is ", wget$ 'only try twice

SHELL wget$
SHELL "./uploadpics.sh "+local_save_pic_file$+" "+cam_folder$
SHELL "rm "+local_save_pic_file$

RETURN

SYSTEM

 

This linux bash script uses ncftp to upload the files

uploadpics.sh

#/bin/bash
# /var/www/wessex/uploadpic.sh filename.jpg foldername
# will send filename.jpg to sunspot folder foldername

echo "bash is sending "$1" to sunspot folder /wessex/"$2
FTPU="sunspot" # ftp login name
FTPP="nottherealone" # ftp password
FTPS="ftp.sunspot.co.uk" # remote ftp server
FTPF="/www.sunspot.co.uk/public_html/wessex/"$2 # remote ftp server directory for $FTPU & $FTPP
LOCALD=$1

ncftpput -m -u $FTPU -p $FTPP $FTPS $FTPF $LOCALD

 

An example of a webpage to display the list of jpegs uses javascript to build a slideshow to give a timelapse movie

<html>
<head>
<title>Eype Webcam Slide Show</title>
<script language="JavaScript">
<!--
var interval = 200;
var random_display = 0;
var image_dir = ""
var ImageNum = 0;
imageArray = new Array();
imageArray[ImageNum++] = new imageItem(image_dir + "eype1.jpg");
imageArray[ImageNum++] = new imageItem(image_dir + "eype2.jpg");
imageArray[ImageNum++] = new imageItem(image_dir + "eype3.jpg");
imageArray[ImageNum++] = new imageItem(image_dir + "eype4.jpg");
imageArray[ImageNum++] = new imageItem(image_dir + "eype5.jpg");
imageArray[ImageNum++] = new imageItem(image_dir + "eype6.jpg");
imageArray[ImageNum++] = new imageItem(image_dir + "eype7.jpg");
imageArray[ImageNum++] = new imageItem(image_dir + "eype8.jpg");
imageArray[ImageNum++] = new imageItem(image_dir + "eype9.jpg");
imageArray[ImageNum++] = new imageItem(image_dir + "eype10.jpg");

var number_of_image = imageArray.length;

function imageItem(image_location) {
this.image_item = new Image();
this.image_item.src = image_location;
}

function get_ImageItemLocation(imageObj) {
return(imageObj.image_item.src)
}

function randNum(x, y) {
var range = y - x + 1;
return Math.floor(Math.random() * range) + x;
}

function getNextImage() {
if (random_display) {
ImageNum = randNum(0, number_of_image-1);
}
else {
ImageNum = (ImageNum+1) % number_of_image;
}
var new_image = get_ImageItemLocation(imageArray[ImageNum]);
return(new_image);
}

function getPrevImage() {
ImageNum = (ImageNum-1) % number_of_image;
var new_image = get_ImageItemLocation(imageArray[ImageNum]);
return(new_image);
}

function prevImage(place) {
var new_image = getPrevImage();
document[place].src = new_image;
}

function rotateImage(place) {
var new_image = getNextImage();
document[place].src = new_image;
var recur_call = "rotateImage('"+place+"')";
timerID = setTimeout(recur_call, interval);
}

// -->
</script>
</head>
<body bgcolor="#ffffff" onLoad="rotateImage('rImage')">
<table border=0 cellpadding=4 cellspacing=0>
<tr>
<td class="td" align=center><font face="verdana, helvetica" size=1><b>Eype - last 20 minutes in 2 seconds </b></font>
</td>
</tr>
<tr>
<td class="td" align=center><img name="rImage" src="eype1.jpg" width=640 height=360 border=1>
</td>
</tr>
</table>
</body>
</html>

thanks to http://www.webmonkey.com/2010/02/make_a_javascript_slideshow/

Comments? email me