// Doubly Circular Linked List borrowed from The If Works 
//http://blog.jcoglan.com/2007/07/23/writing-a-linked-list-in-javascript/
function LinkedList() {}
LinkedList.prototype = {
  length: 0,
  first: null,
  last: null
};
LinkedList.Circular = function() {};
LinkedList.Circular.prototype = new LinkedList();
LinkedList.Circular.prototype.append = function(node) {
  if (this.first === null) {
    node.prev = node;
    node.next = node;
    this.first = node;
    this.last = node;
  } else {
    node.prev = this.last;
    node.next = this.first;
    this.first.prev = node;
    this.last.next = node;
    this.last = node;
  }
  this.length++;
};
LinkedList.Circular.prototype.remove = function(node) {
  if (this.length > 1) {
    node.prev.next = node.next;
    node.next.prev = node.prev;
    if (node == this.first) { this.first = node.next; }
    if (node == this.last) { this.last = node.prev; }
  } else {
    this.first = null;
    this.last = null;
  }
  node.prev = null;
  node.next = null;
  this.length--;
};
LinkedList.Node = function(data) {
  this.prev = null; this.next = null;
  this.data = data;
};
// end LL def
dirURL = 'http://maxlandscape.com/images/plants2/';
function frame(index)
{
	this.width = 0;
	this.left = 0;
	this.img = new Image()	
	this.img.src = dirURL + arrayx[index][0];
	this.img.style.position = 'absolute';
	this.img.style.top = "0px";
	this.img.style.borderStyle = 'solid';
	this.img.style.borderWidth = '1px';
	this.img.style.borderColor = '#000000';
	
	if(arrayx[index][1] == 'v')
	{
		this.width = 120;
		this.img.style.height = '160px';
		this.img.style.width =  this.width +'px';
		this.img.style.marginTop = '6px';
	}
	else
	{
		this.width = 160;
		this.img.style.height = '120px';
		this.img.style.width = this.width +'px';
		this.img.style.marginTop = "22px";
	}
}
function pause(thing)
{
	setTimeout(function() {thing.run()}, 25);
}
function scroller()
{
	this.dirURL = 'http://maxlandscape.com/images/plants2/';
	this.elem = document.getElementById("strip");
	this.llist = new LinkedList.Circular();
	this.idx = 0;
	alert(arrayx.length);
	this.incIdx = function()
	{
		if(this.idx == (arrayx.length -1))
			this.idx = 0;
		else
			this.idx++;
	}
	this.init = function()
	{
		left = 0
		for(;this.idx < 30; this.idx++)
		{
			f = new frame(this.idx);
			f.left = left;
			f.img.style.left = left + "px";
			left = left + f.width +16;
			this.llist.append(new LinkedList.Node(f));
			this.elem.appendChild(f.img);
		}
	}
	this.pause = function()
	{
		setTimeout(function() {this.run()}, 25);
	}
	this.run = function()
	{
		for(node = this.llist.first; node != this. llist.last; node = node.next)
		{
			node.data.left -= 1;
			node.data.img.style.left = node.data.left + 'px';
		}
		node = this.llist.first;
		if((node.data.left + node.data.width + 16) < 0)
		{
			this.elem.removeChild(node.data.img)
			this.llist.remove(node);
			left = this.llist.last.data.left + this.llist.last.data.width + 16;
			f = new frame(this.idx);
			this.incIdx();
			f.left = left;
			f.img.style.left = left + "px";
			this.llist.append(new LinkedList.Node(f));
			this.elem.appendChild(f.img);
		}
		pause(this);
	}
}

window.onload = function()
{
	scroll = new scroller();
	scroll.init();
	scroll.run();
}