function RovingImageDisplay(classid, scrollareaid, descriptionareaid) {
	this.classid = classid;
	this.scrollareaid = scrollareaid;
	this.descriptionareaid = descriptionareaid;
	this.position = 0;
	this.minx = 0;
	this.minpos = 0;
	this.timer = 0;
	this.numberofthumbs = 0;
	this.descriptions = new Array();

	// Methods
	this.makelarge = makelarge;
	this.left = left;
	this.right = right;
	this.imageObject = imageObject;
	this.imageDB = new Array();
	this.doAddImage = doAddImage;
	this.showAllImages = showAllImages;
	this.updateImages = updateImages;
	this.addDescription = addDescription;
	this.viewthumbs = viewthumbs;
}

function makelarge(camera, folder, message, time, longitude, latitude) {
	preload = new Image();
	preload.src = "/data/"+camera+"/"+folder+"/photo.jpg";
	$("mainimage").src = "/data/"+camera+"/"+folder+"/photo.jpg";
	$("message").innerHTML = message+" ("+time+")";
	var latlng = new google.maps.LatLng(latitude, longitude);
	marker.setPosition(latlng);
	marker.setTitle(message);
	map.panTo(latlng);
}
function left() {
	var x = 0;
	if (this.position < 0) {
		this.position = this.position+5;
		x = (this.position * 102);
	} else {
		x = 0;
		this.position = 1;
	}
	new Effect.Move(this.scrollareaid, { x: x, y: 0, transition: Effect.Transitions.sinoidal, mode: 'absolute' });
}
function right() {
	this.position = this.position-5;
	var x = (this.position * 102);
	if (x < this.minx) {
		x = this.minx;
		this.position = this.minpos;
	}
	new Effect.Move(this.scrollareaid, { x: x, y: 0, transition: Effect.Transitions.sinoidal, mode: 'absolute' });
}
 
function imageObject(camera, id, message, time, longitude, latitude) {
	this.camera = camera || "";
	this.id = id || 0;
	this.message = message || "";
	this.time = time || "";
	this.longitude = longitude || 0;
	this.latitude = latitude || 0;
}
 
var imageDB = new Array();
// Object;
function doAddImage(id, loadbig) {
	var atag = document.createElement("a");
	atag.href='javascript:'+this.classid+'.makelarge("'+this.imageDB[id].camera+'", "'+this.imageDB[id].id+'", "'+this.imageDB[id].message+'", "'+this.imageDB[id].time+'", "'+this.imageDB[id].longitude+'", "'+this.imageDB[id].latitude+'")';
	var img = document.createElement("img");
	img.src = "/data/"+this.imageDB[id].camera+"/"+this.imageDB[id].id+"/thumb.jpg";
	atag.appendChild(img);
//	$(this.scrollareaid).appendChild(atag);
	$(this.scrollareaid).insertBefore(atag, $(this.scrollareaid).firstChild);
	this.numberofthumbs += 1;
//	$(this.scrollareaid).style.width = 102*(this.imageDB.length)+"px";
	$(this.scrollareaid).style.width = 102*(this.numberofthumbs)+"px";
	if (loadbig) {
		this.makelarge(this.imageDB[id].id, this.imageDB[id].message, this.imageDB[id].time, this.imageDB[id].longitude, this.imageDB[id].latitude);
	}
}
 
function showAllImages() {
	var desc = "9999999999999999999999999999999999999";
	for (count = 0; count < this.imageDB.length; count++) {
//		this.doAddImage(count, false);
		if (desc != this.imageDB[count].message.toLowerCase().replace(" ", "")) {
			this.addDescription(count, true);
                        desc = this.imageDB[count].message.toLowerCase().replace(" ", "");
			this.descriptions[this.descriptions.length] = desc;
		}
	}
	this.minx = 0-((this.imageDB.length-5)*102);
	this.minpos = 0-(this.imageDB.length-5);
	this.viewthumbs(this.descriptions[this.descriptions.length-1]);
}

function viewthumbs(message) {
	this.numberofthumbs = 0;
	$(this.scrollareaid).style.width = "0px";
	$(this.scrollareaid).immerHTML = "";
	for(count=0; count < this.imageDB.length; count++) {
		if (this.imageDB[count].message.toLowerCase().replace(" ", "") == message.toLowerCase().replace(" ", "")) {
			this.doAddImage(count, false);
		}
	}
        this.minx = 0-((this.numberofthumbs-4)*102);
        this.minpos = 0-(this.numberofthumbs-4);
	this.position = 0;
	new Effect.Move(this.scrollareaid, { x: 0, y: 0, transition: Effect.Transitions.sinoidal, mode: 'absolute' });
}

function addDescription(id, select) {
//	var div = document.createElement("div");
        var atag = document.createElement("a");
        atag.href='javascript:'+this.classid+'.viewthumbs("'+this.imageDB[id].message+'")';
	atag.setAttribute("class", "descsel");
        atag.innerHTML = ""+this.imageDB[id].message;

//	div.appendChild(atag);
//$(this.descriptionareaid).appendChild(div);
        $(this.descriptionareaid).insertBefore(atag, $(this.descriptionareaid).firstChild);
//        if (select) {
//                this.makelarge(this.imageDB[id].id, this.imageDB[id].message, this.imageDB[id].time, this.imageDB[id].longitude, this.imageDB[id].latitude);
//        }
}

function updateImages() {
	var self = this;
        new Ajax.Request("http://rovingwebcam.ynil.com/latestimages.php", {
                method: 'get',
		parameters: "lastid="+this.imageDB[this.imageDB.length-1].id+"&camera="+this.cameraid+"&class="+this.classid,
                onSuccess: function(transport) {
			if(transport.headerJSON) {
				var res = transport.headerJSON;
				var desc = "9999999999999999999999999999999999999";
				for (count = 0; count < res.length; count++) {
					var id = self.imageDB.length;
					self.imageDB[id] = new this.imageObject(res[count].id, res[count].LM, res[count].DTO, res[count].Longitude, res[count].Latitude);
alert(desc);
					if (desc != res[count].LM) {
//						self.addDescription(id, true);
						desc = res[count].LM;
					}
				}
			}
                }
        });
}