var Gallery = new Class({
    initialize: function(){
	this.header = $$(".header");
	if(this.header){
	    this.header.setStyle("visibility","hidden");
	}
	this.showbackground();
	this.createcontent();
	this.imageindex = 0;
	this.currentimage = "";
    },
    showbackground: function(){
	var toppos = window.getScroll().y + 10;
	this.bgdiv = new Element('div', {
	    'class': 'gallery',
	    'styles': {
		"width": "95%",
		"top": toppos+"px"
	    },
	    'events': {
		/*'click': function(){
		    this.exit();
		}.bind(this)*/
	    }
	});
	this.bgdiv.inject(window.document.body);
    },
    createcontent: function(){
	//1. close div
	this.closediv = new Element('div',{
	    'class': 'gallerylink'
	});
	this.closebutton = new Element('a', {
	    'html': 'Close',
	    'href':'javascript:;',
	    "events": {
		'click': function(){
		    this.exit();
		}.bind(this)
	    }
	});
	this.closebutton.inject(this.closediv);
	this.closediv.inject(this.bgdiv);
	//2. image div
	this.imagediv = new Element('div');
	this.image = new Element('img');
	this.image.inject(this.imagediv);
	this.imagediv.inject(this.bgdiv);
	//3. page div
	this.pagediv = new Element('div', {
	    "class": "gallerylink hide"
	});
	this.pagediv.inject(this.bgdiv);
	this.pageprev = new Element("a", {
	    "html": "<<",
	    "href": "javascript:;",
	    "events":{
		"click": function(){
		    this.prev();
		}.bind(this)
	    }
	});
	this.pageprev.inject(this.pagediv);
	this.pagediv.appendText("  ");
	this.pagenext = new Element("a", {
	    "html": ">>",
	    "href": "javascript:;",
	    "events":{
		"click": function(){
		    this.next();
		}.bind(this)
	    }
	});
	this.pagenext.inject(this.pagediv);
	//4. close at bottom
	this.btclosediv = new Element('div',{
	    'class': 'gallerylink'
	});
	this.btclosebutton = new Element('a', {
	    'html': 'Close',
	    'href':'javascript:;',
	    "events": {
		'click': function(){
		    this.exit();
		}.bind(this)
	    }
	});
	this.btclosebutton.inject(this.btclosediv);
	this.btclosediv.inject(this.bgdiv);
    },
    setdata: function(data){
	this.data = data;
	if(this.data.length>1){
	    this.pagediv.removeClass("hide");
	}
    },
    show: function(){
	this.imageindex = this.data.indexOf(this.currentimage);
        if(this.imageindex==-1){
          this.imageindex = 0;
        }
	this.updateimage();
	this.syncpagecontrol();
    },
    prev: function(){
	this.imageindex--;
	if(this.imageindex<0){
	    this.imageindex = 0;
	}
	this.updateimage();
	this.syncpagecontrol();
    },
    next: function(){
	this.imageindex++;
	if(this.imageindex>=this.data.length){
	    this.imageindex = this.data.length - 1;
	}
	this.updateimage();
	this.syncpagecontrol();
    },
    updateimage: function(){
	var loader = function(){
	    this.image.src = "/images/loader2.gif";
	};
	loader.delay(0, this);
	//cache image
	var imageToBeCached = new Image();
        imageToBeCached.src = this.data[this.imageindex];
	// load the images, already cached
	this.image.src = this.data[this.imageindex];
    },
    syncpagecontrol: function(){
	// prev
	if(this.imageindex==0){
	    this.pageprev.addClass("hide");
	}else{
	    this.pageprev.removeClass("hide");
	}
	// next
	if(this.imageindex==this.data.length-1){
	    this.pagenext.addClass("hide");
	}else{
	    this.pagenext.removeClass("hide");
	}
    },
    exit: function(){
	if(this.header){
	    this.header.setStyle("visibility","");
	}
	this.bgdiv.destroy();
    }


});		


var ProgressBar = new Class({
    initialize: function(containerid){
	this.container = $(containerid);
	var size = this.container.getSize();
	this.width = size.x;
	this.container.set("html",'<div id="progressbar" class="progressbar"></div><div class="progresstext" id="progresstext">0%</div>');
	this.bar = $("progressbar");

	var cor = this.container.getCoordinates();
	this.text = $("progresstext");
	this.text.setStyles({"width": cor.width,
			     "height": cor.height,
			     "top": cor.top,
			     "left": cor.left
			    });
    },
    setProgress: function(percentage){
	var barwidth = this.width * percentage;
	this.bar.tween("width", barwidth);
	
	var progresstext = (percentage*100).round()+"%";
	this.text.set("text", progresstext);	
    }
});


function showimage(src){
    var g = new Gallery();
    g.setdata([src]);
    g.currentimage = src;
    g.show();
}

function showgallery(id, image){
    var g = new Gallery();
    g.currentimage = image;

    var request = new Request({
	url: "ajaxhandler.php?command=getgallerycontent&id="+id+"&v="+getv(),
	onSuccess: function(text){
	    var imagelist = eval(text);
	    this.setdata(imagelist);
	    this.show();
	}.bind(g)
    });
    request.get();
}
    
function getv(){
    return new Date().getTime();
}

function getselectedvalue(list){
    return list.options[list.selectedIndex].text;
}

function loadcontent(domid, url){
    $(domid).set("html", '<div class="centeralign"><img src="images/loader2.gif" /></div>');
    $(domid).load(url);
}

function postcontent(domid, url, postcontent){
    $(domid).set("html", '<div class="centeralign"><img src="images/loader2.gif" /></div>');
    var req = new Request.HTML({method:"post", url: url, data: postcontent, update: domid});
    req.send();
}