(function(){

	/*
	 * image slide show.
	 */
	var SlideShow = function() {
		this.init.apply(this, arguments);
	};
	SlideShow.prototype = {
		images: [],	// image elements.
		prev_nav: null,	// prev nav element.
		next_nav: null,	// next nav element.
		current_index: 0,	// index counter.
		is_auto_slide: true,	// auto slide flag.
		interval_id: null,	// for auto slide.

		// initialize.
		init: function(id){
			// get elements.
			var container = document.getElementById(id);
			this.images = container.getElementsByTagName('li');
			this.prev_nav = container.getElementsByTagName('a')[0];
			this.next_nav = container.getElementsByTagName('a')[1];

			var _self = this;

			// set nav handler.
			this.prev_nav.onclick = function(){
				_self.is_auto_slide = false;
				_self.prev();
				return false;
			};
			this.next_nav.onclick = function(){
				_self.is_auto_slide = false;
				_self.next();
				return false;
			};

			// show first image.
			this.show(0);

			// set timer.
			this.interval_id = setInterval(function(){
				if (_self.is_auto_slide === false) {
					clearInterval(_self.interval_id);
				}
				else {
					_self.next();
				}
			}, 2500);

		},

		// show index image.
		show: function(index) {
			var slider_count = this.images.length;

			// set slide index.
			if (index < 0) {
				this.current_index = slider_count - 1;
			}
			else if (index >= slider_count) {
				this.current_index = 0;
				// stop auto slide.
				if (this.is_auto_slide === true) {
					clearInterval(this.interval_id);
				}
			}
			else {
				this.current_index = index;
			}

			// show or hide images.
			for (var i = 0; i < slider_count; i++) {
				this.images[i].style.display = (this.current_index === i) ? 'block' : 'none';
			}
		},

		// show prev image.
		prev: function(){
			this.show(this.current_index - 1);
		},

		// show next image.
		next: function(){
			this.show(this.current_index + 1);
		}
	};

	/*
	 * event listener.
	 */
	function observe(target, type, listener) {
		if (target.addEventListener) {
			target.addEventListener(type, listener, false);
		}
		else if (target.attachEvent) {
			target.attachEvent('on'+ type, function(){
				listener.call(target, window.event);
			});
		}
		else {
			target['on'+ type] = function(e) {
				listener.call(target, e || window.event);
			}
		}
	}

	// onload.
	observe(window, 'load', function(){
		new SlideShow('image_slide');
	});

})();