// -----------------------------------------------------------------------------------
//
//	Dhonishow v0.3
//	by Stanislav Müller
//	11/22/06
//
//	Licensed under the Creative Commons Attribution 2.5 License - http://creativecommons.org/licenses/by/2.5/
//
// -----------------------------------------------------------------------------------

document.write("<style type=\"text/css\" media=\"screen\">.dhonishow {display: none;}</style>");  // to avoid imageload flash

var Dhonishow = Class.create();
Dhonishow.prototype = {
	initialize: function(dhoniShowDiv) {		
		this.parentDiv = dhoniShowDiv;
		
		// customize for default ++++++++++//
		this.effect = 'appear';   // choose between 'blind', 'slide', 'appear'
		this.duration = 0.6;
		this.navigation_top = false;
		this.hidePaging = false;
		this.hideAlt = false;		
		this.targetOption = "self";
		// customize for default ----------//
		
		this.setOptions();
		this.setDependences();
	},
	
	setOptions: function(){
		var parent = this;
		var options = new Element.classNames(this.parentDiv).toString();
		
		if(/effect_(.*?)($| )/.test(options)){
			this.effect = options.match(/effect_(.*?)($| )/)[1];
		}
		
		if(/duration_(\d*?)($| )/.test(options)){
			var duration = options.match(/duration_(\d*?)($| )/)[1];
			if(duration[0] == '0') var duration = duration.replace(/^0/, "0.");
			this.duration = eval(duration);
		}
		
		this.queue = {
			position:'end', 
			scope: this.parentDiv.id
		};
		
		if(/navigation_top/.test(options)){
			this.navigation_top = true;
		}
		if(/hide_(.*?)($| )/.test(options)){
			options.match(/hide_(.*?)($| )/g).each(function(opt){
				var hideOption = opt.match(/hide_(.*?)($| )/)[1];
				if(/alt/.test(hideOption)) parent.hideAlt = true;
				if(/paging/.test(hideOption)) parent.hidePaging = true;
			});
		}
		if(/target_(.*?)($| )/.test(options)){
			options.match(/target_(.*?)($| )/g).each(function(opt){
				var targetOption = opt.match(/target_(.*?)($| )/)[1];
				if(/blank|self|parent|top/.test(targetOption)) parent.linkTarget = targetOption;
			});
		}		
	},
	
	setDependences: function(){
		var parent = this; // ugly ;) //
		this.dhonishowImages = [];		
		this.dhonishowCurrentImage = 0;

	
		var images = $A(this.parentDiv.getElementsByTagName('*'));		
		images.each(function(image){
			parent.dhonishowImages.push(image);
		});
		
		this.buildDom();
		this.viewport_dimensions = new Element.getDimensions(document.getElementsByClassName("dhonishow-image", this.parentDiv)[0]);
		
		
		this.next_button = document.getElementsByClassName("dhonishow-next-picture", this.parentDiv)[0];
		this.previous_button = document.getElementsByClassName("dhonishow-previous-picture", this.parentDiv)[0];
		
		this.updateNavigation();
		this.parentDiv.style.display = 'block';
		this.changeImage(this.dhonishowImages[0]);
		this.addObservers();
		this.updateNavigation();
	},
	
	buildDom: function(){
						
		this.buildUl = function(){
			var ul = document.createElement('ul');
			new Element.addClassName(ul, "dhonishow-image");
		
			this.dhonishowImages.each(function(el){
				var li = document.createElement('li');
				li.style.display="none";
				
				if(el.getAttribute('rel')){
					var a = document.createElement('a');
					a.href = el.getAttribute('rel');
					a.target = "_"+parent.targetOption;
					a.appendChild(el);
				}else{
					var a = el;
				}							
				li.appendChild(a);
				ul.appendChild(li);
			});
			return ul;
		}

		this.buildNavigation = function(){
			var navi = document.createElement('div');
			new Element.addClassName(navi, 'dhonishow-navi');
		
			var alt = document.createElement('p');
			new Element.addClassName(alt, "dhonishow-picture-alt");
			navi.appendChild(alt);
					
			var next_button = document.createElement('a');
			
			new Element.addClassName(next_button, 'dhonishow-next-picture');
			next_button.setAttribute('title', 'Next');
			navi.appendChild(next_button);
		
			var paging = document.createElement('p');		 
			new Element.addClassName(paging, 'paging');
			navi.appendChild(paging);
		
			var previous_button = document.createElement('a');
			new Element.addClassName(previous_button, 'dhonishow-previous-picture');
			previous_button.setAttribute('title', 'Previous');
			navi.appendChild(previous_button);
			
			return navi;
		}
		
		if(this.navigation_top){                  
			this.parentDiv.appendChild(this.buildNavigation());
			this.parentDiv.appendChild(this.buildUl());
		}else{
			this.parentDiv.appendChild(this.buildUl());
			this.parentDiv.appendChild(this.buildNavigation());
		}
		
/*		Generated HTML Code

			<div id="dhonishow">
				<ul id="dhonishow-image">
					<li><img src="#" /></li>
					...
				</ul>
				<div id="dhonishow-navi">
					<p id="dhonishow-picture-alt"></p>
					<a id="dhonishow-next-picture" title="Next">Next</a>
					<p id="paging"></p>
					<a id="dhonishow-previous-picture" title="previous">Previous</a>
				</div>
			</div>
*/
	},

	addObservers: function(){
		var parent = this;
		this.next_button.onclick = function(e){
			parent.nextImage();
		}
		this.previous_button.onclick = function(e){			
			parent.previousImage();		
		}
	},
	removeObservers: function(){
		this.next_button.onclick = function(){};
		this.previous_button.onclick = function(){};
	},
	nextImage: function(){
		this.updateNavigation();		
		this.changeImage(this.dhonishowImages[this.dhonishowCurrentImage++]);
		this.changeImage(this.dhonishowImages[this.dhonishowCurrentImage]);
		this.updateNavigation();
	},
		
	previousImage: function(){
		this.updateNavigation();
		this.changeImage(this.dhonishowImages[this.dhonishowCurrentImage--]);		
		this.changeImage(this.dhonishowImages[this.dhonishowCurrentImage]);
		this.updateNavigation();
	},
  giveParent: function(elm){
		if(elm.parentNode.nodeName == "A"){
			return elm.parentNode.parentNode;
		}else {
			return elm.parentNode;
		}
	},
	changeImage: function(image){		
		var parent = this;
		if(typeof(Effect) != "undefined"){
			return new Effect.toggle(this.giveParent(image), this.effect, {
				queue: this.queue,
				duration: this.duration,
				beforeStart: function(effect){
					parent.removeObservers();
				},
				afterFinish: function(effect){
					if(effect.options.to != 0){
						parent.addObservers();
					}
				}
			});
		}else{
			return new Element.toggle(this.giveParent(image));
		}
	},
	
	updateNavigation: function(){
		var parent = this;
		
		new Element.hide(this.previous_button);
		new Element.hide(this.next_button);
		
		var updateButton = function(){			
			if(parent.dhonishowCurrentImage != 0){
				new Element.show(parent.previous_button);
			}
			if(parent.dhonishowCurrentImage != (parent.dhonishowImages.length - 1)){
				new Element.show(parent.next_button);
			}
		}				
		var updatePaging = function(){
			new Element.update(
				document.getElementsByClassName('paging', parent.parentDiv)[0], 
				((parent.dhonishowCurrentImage+1)+" of "+(parent.dhonishowImages.length))  // Paging feel free to change
			);
		}
		var updateAlt = function(image){
			if(image.getAttribute('alt')){
				var description = image.getAttribute('alt');
			}else if(image.getAttribute('src')){
				var description = image.getAttribute('src').split('/').last();
			}else{
				var description = "";
			}
			new Element.update(document.getElementsByClassName('dhonishow-picture-alt', parent.parentDiv)[0], description);
		}
		
		if(this.hidePaging == false){ 
			updatePaging();		
		}
		
		updateButton();
		
		if(this.hideAlt == false){ 
			updateAlt(this.dhonishowImages[this.dhonishowCurrentImage]);		
		}

	}
}

var SearchDhonishow = Class.create();

SearchDhonishow.prototype = {
	initialize: function(){
	
		this.shows_number = 0;
		var parent = this;
		
		document.getElementsByClassName('dhonishow').each(function(show){
			if(show.id == ''){
				++parent.shows_number;
				show.id = 'dhonishow_'+parent.shows_number;
			}
			new Dhonishow(show);
		});
		return this.prototype;
	}	
}

Event.observe(window, 'load', function(){
	new SearchDhonishow(); 
});