/*-----------------------------------------------------------------*
 | LOADER                                                          |
 *-----------------------------------------------------------------*/

var Loader = function() {
	/*
	setList(list)
	getList()
	setIndex(index)
	getIndex()
	getCurrent()
	start()
	pause()
	resume()
	stop()
	isLoading()
	
	@complete
	*/
	
	var _this;
	var _list;
	var _index;
	var _offset;
	var _loadindex;
	var _loadoffset;
	var _forward;
	var _loading;
	var _timer;
	
    {
		_this = this;
		_index = 0;
		_offset = 0;
		_loadindex = _index;
		_loadoffset = _offset;
		_forward = true;
		_loading = false;
	}
	
	_this.setList = function(list) {
		_this.stop();
		_list = list;
	};
	
	_this.getList = function() {
		return _list;
	};
	
	_this.setIndex = function(index) {
		_index = index;
		_offset = 0;
		if(_list && _index > _list.length/2) _forward = false;
		else _forward = true;
	};
	
	_this.getIndex = function() {
		return _loadindex;
	};
	
	_this.start = function() {
		if(_list) {
			if(_loading) _this.stop();
			_loading = true;
			process();
		}
	};
	
	_this.pause = function() {
		if(_timer) {
			clearTimeout(_timer);
			_timer = null;
		}
		if(_list) {
			var item = _list[_index];
			if(item.obj) item.obj.unbind("error load", loadHandler);
		}
		_loading = false;
	};
	
	_this.resume = _this.start;
	
	_this.stop = function() {
		if(_loading) {
			_this.pause();
			_this.setIndex(0);
		}
	};
	
	_this.isLoading = function() {
		return _loading;
	};
	
	function process() {
		_loadindex = _index;
		_loadoffset = _offset;
		var item = _list[_loadindex];
		if(item.obj) {
			next();
		}
		else {
			item["~obj"] = $("<img></img>").one("error load", loadHandler);
			item["~obj"].attr("src", "/"+item.galleryImage);
		}
	}
	
	function loadHandler(event) {
		var item = _list[_loadindex];
		if(event.type.match(/load/i)) item.obj = item["~obj"];
		delete item["~obj"];
		$(_this).triggerHandler("complete", [_loadindex]);
		_timer = setTimeout(next, 50);
	}
	
	function next() {
		_timer = null;
		if(_index == _loadindex && _offset == _loadoffset) {
			_offset++;
			if(_offset < _list.length) {
				if(_forward) {
					if(_offset >= _list.length-_index) {
						_index--;
					}
					else {
						_index += _offset;
						_forward = !_forward;
					}
				}
				else {
					if(_offset > _index) {
						_index++;
					}
					else {
						_index -= _offset;
						_forward = !_forward;
					}
				}
				process();
			}
			else {
				_this.stop();
			}
		}
		else {
			process();
		}
	}
};

/*-----------------------------------------------------------------*
 | SOUND                                                           |
 *-----------------------------------------------------------------*/

var Sound = function() {
	/*
	obj
	type
	
	load(url)
	play(volume, loop)
	setIndex(index)
	getIndex()
	play(volume, loop)
	pause()
	resume()
	stop()
	close()
	isPlaying()
	isPaused()
	setVolume(value)
	seek(value)
	
	@progress
	*/
	
	var CANPLAYTYPES = {
		mp3: {mimes: ["audio/mpeg; codecs='mp3'", "audio/mpeg", "audio/mp3", "audio/MPA", "audio/mpa-robust"], match: /probably/i},
		m4a: {mimes: ["audio/mp4; codecs='mp4a.40.2'", "audio/aac", "audio/x-m4a", "audio/MP4A-LATM", "audio/mpeg4-generic"], match: /probably/i},
		ogg: {mimes: ["audio/ogg; codecs='vorbis'", "audio/ogg"], match: /maybe/i}
    };
	
	var _this;
	var _sound;
	var _loop;
    var _isplaying;
	var _timer;
    
    {
		_this = this;
		var valid = false;
        try {
            _this.obj = $("<audio></audio>");
			_sound = _this.obj.get(0);
			if(_sound.canPlayType) {
				var obj;
				for(var type in CANPLAYTYPES) {
					obj = CANPLAYTYPES[type];
					var i = obj.mimes.length;
					while(i-- && !valid) valid = valid || !!_sound.canPlayType(obj.mimes[i]).match(obj.match);
					if(valid) {
						_this.type = type;
						break;
					}
				}
			}
        }
        catch(error) {
        }
		if(valid) {
			_this.obj.bind("progress", progressHandler).bind("error ended", endedHandler);
		}
		else {
			_this.obj = null;
		}
		_isplaying = false;
    }
    
	_this.load = function(url) {
		if(_this.obj) {
			stopTimer();
			_timer = setInterval(timerHandler, 50);
			_sound.src = "/"+url;
			//_sound.load();
		}
	};
	
    _this.play = function(loop) {
		if(_this.obj && _sound.src) {
			_loop = !!loop;
			if(!_isplaying) _sound.load();
			_isplaying = true;
			_sound.play();
		}
    };
	
	_this.pause = function() {
		if(_isplaying) _sound.pause();
	};
	
	_this.resume = function() {
		if(_isplaying) _sound.play();
	};
    
    _this.stop = function() {
		if(_isplaying) {
			_sound.currentTime = 0;
			_sound.pause();
			_isplaying = false;
		}
    };
	
	_this.close = function() {
		if(_this.obj) {
			_this.stop();
			stopTimer();
			_this.obj.unbind("ended", endedHandler);
			_this.obj = null;
		}
	};
    
    _this.isPlaying = function() {
        return _isplaying;
    };
	
	_this.isPaused = function() {
        if(_this.obj) return _sound.paused;
		else return true;
    };
	
	_this.setVolume = function(value) {
		if(_this.obj) _sound.volume = value;
	};
	
	_this.seek = function(value) {
		if(_sound.duration > 0) _sound.currentTime = _sound.duration*value;
	}
    
	function stopTimer() {
		if(_timer) {
			clearInterval(_timer);
			_timer = null;
		}
	}
    
	function timerHandler(event) {
		if(_sound.networkState == HTMLMediaElement.NETWORK_LOADING) {
			if(_sound.duration > 0) $(_this).triggerHandler("progress");
		}
		else {
			stopTimer();
		}
	}
	
	function progressHandler(event) {
		stopTimer();
		$(_this).triggerHandler("progress");
    }
	
    function endedHandler(event) {
        if(_loop) _this.resume();
		else _this.stop();
    }
};

/*-----------------------------------------------------------------*
 | MOVIE                                                           |
 *-----------------------------------------------------------------*/

var Movie = function() {
	/*
	obj
	type
	
	load(url)
	play(volume, loop)
	setIndex(index)
	getIndex()
	play(volume, loop)
	pause()
	resume()
	stop()
	close()
	isPlaying()
	isPaused()
	setVolume(value)
	seek(value)
	
	@progress
	*/
	
	var CANPLAYTYPES = {
		mp4: {mimes: ["video/mp4; codecs='avc1.42E01E, mp4a.40.2'", "video/mp4"], match: /probably/i},
		ogg: {mimes: ["video/ogg; codecs='theora, vorbis'", "video/ogg"], match: /maybe/i},
		webm: {mimes: ["video/webm; codecs='vp8, vorbis'", "video/webm"], match: /maybe/i}
	};
	
	var _this;
	var _movie;
	var _loop;
    var _isplaying;
	var _timer;
    
	{
		_this = this;
		var valid = false;
        try {
            _this.obj = $("<video></video>");
			_movie = _this.obj.get(0);
			if(_movie.canPlayType) {
				var probably = /probably/i;
				var obj;
				for(var type in CANPLAYTYPES) {
					obj = CANPLAYTYPES[type];
					var i = obj.mimes.length;
					while(i-- && !valid) valid = valid || !!_movie.canPlayType(obj.mimes[i]).match(obj.match);
					if(valid) {
						_this.type = type;
						break;
					}
				}
			}
        }
        catch(error) {
        }
		if(valid) {
			_this.obj.bind("progress", progressHandler).bind("error ended", endedHandler);
		}
		else {
			_this.obj = null;
		}
		_isplaying = false;
    }
	
	_this.load = function(url) {
		if(_this.obj) {
			stopTimer();
			_timer = setInterval(timerHandler, 50);
			_movie.src = "/"+url;
			_movie.load();
		}
	};
	
    _this.play = function(loop) {
		if(_this.obj && _movie.src) {
			_loop = !!loop;
			if(!_isplaying) _movie.load();
			_isplaying = true;
			_movie.play();
		}
    };
	
	_this.pause = function() {
		if(_isplaying) _movie.pause();
	};
	
	_this.resume = function() {
		if(_isplaying) _movie.play();
	};
    
    _this.stop = function() {
		if(_isplaying) {
			_movie.currentTime = 0;
			_movie.pause();
			_isplaying = false;
		}
    };
	
	_this.close = function() {
		if(_this.obj) {
			_this.stop();
			stopTimer();
			_this.obj.unbind("ended", endedHandler);
			_this.obj = null;
		}
	};
    
    _this.isPlaying = function() {
        return _isplaying;
    };
	
	_this.isPaused = function() {
        if(_this.obj) return _movie.paused;
		else return true;
    };
	
	_this.setVolume = function(value) {
		if(_this.obj) _movie.volume = value;
	};
	
	_this.seek = function(value) {
		if(_movie.duration > 0) _movie.currentTime = _movie.duration*value;
	}
	
	function stopTimer() {
		if(_timer) {
			clearInterval(_timer);
			_timer = null;
		}
	}
    
	function timerHandler(event) {
		if(_movie.networkState == HTMLMediaElement.NETWORK_LOADING) {
			if(_movie.duration > 0) $(_this).triggerHandler("progress");
		}
		else {
			stopTimer();
		}
	}
	
	function progressHandler(event) {
		stopTimer();
		$(_this).triggerHandler("progress");
    }
    
    function endedHandler(event) {
        if(_loop) _this.resume();
		else {
			_this.stop();
			closeOverlay();
		}
    }
};

/*-----------------------------------------------------------------*
 | THUMBSTRIP                                                      |
 *-----------------------------------------------------------------*/

var ThumbStrip = function(gallery, length, fgcolor) {
	/*
	obj
	
	clear()	
	scrollTo(value, force)
	getContainerAt(index)
	
	@update
	@click
	*/
	
	var _this;
	var _gallery;
	var _length;
	var _width;
	var _strip;
	var _list;
	var _scroll;
	var _index;
	var _containerindex;
	var _border;
	
	{
		_this = this;
		_gallery = gallery;
		_length = length;
		_list = new Array();
		_this.obj = $("<div></div>").css({position: "absolute", top: "10px", left: "50%", height: "75px", overflow: "hidden", scroll: "0"});
		_strip = $("<div></div>").css("position", "absolute").appendTo(_this.obj);
		_scroll = 0;
		_index = 0;
		_containerindex = 0;
		_border = $("<div></div>").css({position: "relative", padding: "71px 71px 0 0", border: "2px solid "+fgcolor.opaque, opacity: fgcolor.opacity});
		galleryResizeHandler();
		$(_gallery).bind("resize", galleryResizeHandler).bind("change", galleryChangeHandler);
	}
		
	_this.clear = function() {
		_strip.children().empty();
	};
		
	_this.scrollTo = function(value, force) {
		_scroll = value;
		var index = Math.floor(_scroll);
		if(index != _index || force) {
			var steps = index-_index;
			_index = index;
			_containerindex = _index%_list.length;
			if(_containerindex < 0) _containerindex += _list.length;
			var i = _list.length;
			var ci = _containerindex-1;
			if(ci < 0) ci += _list.length;
			var container;
			var x = (i-1)*85;
			if(steps > 0) {
				var limit = _list.length-steps;
				while(i--) {
					container = _list[ci].css("left", x+"px");
					if(i >= limit) {
						container.get(0).index = _index+i;
						$(_this).triggerHandler("update", [container.empty()]);
					}
					if(--ci < 0) ci += _list.length;
					x -= 85;
				}
			}
			else {
				while(i--) {
					container = _list[ci].css("left", x+"px");
					if(i < -steps) {
						container.get(0).index = _index+i;
						$(_this).triggerHandler("update", [container.empty()]);
					}
					if(--ci < 0) ci += _list.length;
					x -= 85;
				}
			}
		}
		var offset = _index-_scroll;
		_strip.css("left", (offset*85)+"px");
	};
	
	_this.getContainerAt = function(index) {
		if(index >= _index && index < _index+_list.length) {
			index = index-_index+_containerindex;
			if(index >= _list.length) index -= _list.length;
			return _list[index];
		}
		else {
			return null;
		}
	};
	
	function updateContainers() {
		var length = Math.ceil(_width/85)+1;
		if(length != _list.length) {
			var containers = _list;
			_list = new Array(length);
			var iscr = _containerindex;
			_containerindex = _index%length;
			if(_containerindex < 0) _containerindex += length;
			var idst = _containerindex;
			var i;
			if(length > containers.length) {
				i = containers.length;
				while(i--) {
					_list[idst] = containers[iscr];
					if(++iscr >= containers.length) iscr -= containers.length;
					if(++idst >= length) idst -= length;
				}
				i = length-containers.length;
				var x = containers.length*85;
				while(i--) {
					var container = $("<div></div>").css({position: "absolute", left: x+"px", width: "75px", height: "75px", overflow: "hidden", cursor: "pointer"}).click(clickHandler).appendTo(_strip);
					container.get(0).index = _index+length-i-1;
					_list[idst] = container;
					$(_this).triggerHandler("update", [container.empty()]);
					if(++idst >= length) idst -= length;
					x += 85;
				}
			}
			else {
				i = length;
				while(i--) {
					_list[idst] = containers[iscr];
					if(++iscr >= containers.length) iscr -= containers.length;
					if(++idst >= length) idst -= length;
				}
				i = containers.length-length;
				while(i--) {
					containers[iscr].unbind("click", clickHandler).remove();
					if(++iscr >= containers.length) iscr -= containers.length;
				}
			}
		}
	}
	
	function galleryResizeHandler(event) {
		var thumbs = Math.min(Math.max(Math.floor((_gallery.getWidth()-34)/85), 0), _length);
		_width = Math.max(thumbs*85-10, 0);
		_this.obj.css({width: _width+"px", marginLeft: Math.floor(-_width/2)+"px"});
		updateContainers();
		if(_this.scrollTo) {
			var containers = _list.length-1;
			var dst = Math.max(Math.min(_gallery.getIndex()-Math.floor(containers/2), _length-containers), 0);
			_this.obj.css("scroll", dst);
			_this.scrollTo(dst, true);
		}
	}
	
	function galleryChangeHandler(event, index, list) {
		var container = _this.getContainerAt(index);
		if(container) container.append(_border);
		var containers = _list.length-1;
		var dst = Math.max(Math.min(index-Math.floor((containers-1)/2), list.length-containers), 0);
		if(dst != _index) {
			if(_this.obj.css("display").match(/none/i)) {
				_this.obj.css("scroll", dst);
				_this.scrollTo(dst);
			}
			else {
				_this.obj.animate({scroll: dst}, {duration: 500, step: scrollStep});
			}
		}
	}
	
	function scrollStep(value) {
		_this.scrollTo(value);
	}
	
	function clickHandler(event) {
		$(_this).triggerHandler("click", [$(this)]);
	}
};

/*-----------------------------------------------------------------*
 | NAVIGATIONBOX                                                   |
 *-----------------------------------------------------------------*/

var NavigationBox = function(gallery, bgcolor, fgcolor, skin, thumbstrip) {
	/*
	obj
	*/
	
	var _this;
	var _gallery;
	var _center;
	var _label;
	var _left;
	var _right;
	var _thumbstrip;
	var _openwidth;
	var _openclose;
	var _state;
	
    {
		_this = this;
		_gallery = gallery;
		gallery = $(_gallery);
		_thumbstrip = thumbstrip;
		_this.obj = $("<div></div>").css({position: "relative", top: "5px", width: "84px", margin: "0 auto", fontSize:"1px", lineHeight: "1px"});
		var box = $("<div></div>").css({cssText: "height: auto !important; height: 1px;", position: "relative", textAlign: "left"});
		var corner = $("<div></div>").css({position: "absolute", width: "5px", height: "5px", background: "url('"+skin+"') no-repeat"});
		var tl = corner.clone().css({top: "0", left: "0", backgroundPosition: "-81px -152px"});
		var tr = corner.clone().css({top: "0", right: "0", backgroundPosition: "-86px -152px"});
		var bl = corner.clone().css({bottom: "0", left: "0", backgroundPosition: "-92px -152px"});
		var br = corner.css({bottom: "0", right: "0", backgroundPosition: "-97px -152px"});
		var tc = $("<div></div>").css({height: "5px", margin: "0 5px"}).cssbgc(bgcolor);
		_center = $("<div></div>").css({width: "100%", height: "12px"}).cssbgc(bgcolor);
		var bc = tc.clone();
		_label = $("<div></div>").css({position: "absolute", left: "50%", top: "50%", width: "50px", height: "12px", margin: "-6px 0 0 -25px", overflow: "hidden", textAlign: "center", fontFamily: "Arial, sans-serif", color: fgcolor.opaque, fontSize:"12px", lineHeight: "12px", opacity: fgcolor.opacity});
		box.append(tl).append(tr).append(tc).append(_center).append(bc).append(bl).append(br).append(_label);
		if(_thumbstrip) {
			_thumbstrip.obj.css({display: "none"}).appendTo(box);
			_openclose = $("<div></div>").css({width: "60px", height: "8px", margin: "0 auto", background: "url('"+skin+"') no-repeat", cursor: "pointer"}).hover(elementOverHandler, elementOutHandler).click(openCloseClickHandler);
			closeCompleteHandler();
			galleryResizeHandler();
			_this.obj.append(_openclose)
			gallery.bind("resize", galleryResizeHandler);
		}
		var arrow = $("<div></div>").css({position: "absolute", top: "50%", width: "10px", height: "10px", marginTop: "-5px", background: "url('"+skin+"') no-repeat", opacity: "0.5"});
		var hoverinfo = {x: -61, y: -135, hx: -70, hy: -135};
		_left = arrow.clone().css({left: "2px", backgroundPosition: hoverinfo.x+"px "+hoverinfo.y+"px"});
		_left.get(0).hoverinfo = hoverinfo;
		hoverinfo = {x: -61, y: -146, hx: -70, hy: -146};
		_right = arrow.css({right: "2px", backgroundPosition: hoverinfo.x+"px "+hoverinfo.y+"px"});
		_right.get(0).hoverinfo = hoverinfo;
		box.append(_left).append(_right).prependTo(_this.obj);
		gallery.bind("change", galleryChangeHandler);
	}
	
	function elementOverHandler(event) {
		var element = $(this);
		var hoverinfo = element.get(0).hoverinfo;
		element.css("background-position", hoverinfo.hx+"px "+hoverinfo.hy+"px");
	}
	
	function elementOutHandler(event) {
		var element = $(this);
		var hoverinfo = element.get(0).hoverinfo;
		element.css("background-position", hoverinfo.x+"px "+hoverinfo.y+"px");
	}
	
	function leftClickHandler(event) {
		_gallery.previous();
	}
	
	function rightClickHandler(event) {
		_gallery.next();
	}
	
	function openCloseClickHandler(event) {
		if(_state == 0) {
			_label.css("display", "none");
			_this.obj.animate({width: _openwidth+"px"}, 500);
			_center.animate({height: "85px"}, 500, openCompleteHandler);
		}
		else {
			_thumbstrip.obj.css("display", "none");
			_this.obj.animate({width: "84px"}, 500);
			_center.animate({height: "12px"}, 500, closeCompleteHandler);
		}
	}
	
	function openCompleteHandler() {
		_state = 1;
		var hoverinfo = {x: 0, y: -140, hx: 0, hy: -149};
		_openclose.get(0).hoverinfo = hoverinfo;
		_openclose.css("background-position", hoverinfo.x+"px "+hoverinfo.y+"px");
		_thumbstrip.obj.css("display", "block");
	}
	
	function closeCompleteHandler() {
		_state = 0;
		var hoverinfo = {x: 0, y: -122, hx: 0, hy: -131};
		_openclose.get(0).hoverinfo = hoverinfo;
		_openclose.css("background-position", hoverinfo.x+"px "+hoverinfo.y+"px");
		_label.css("display", "block");
	}
	
	function galleryResizeHandler(event) {
		_this.obj.stop(true, true);
		_center.stop(true, true);
		var stripwidth = parseInt(_thumbstrip.obj.css("width"));
		var maxwidth = _gallery.getWidth()-44;
		_openwidth = 34;
		if(stripwidth > maxwidth*0.75) _openwidth += maxwidth;
		else _openwidth += stripwidth;
		if(_state == 1) _this.obj.css("width", _openwidth+"px");
	}
	
	function galleryChangeHandler(event, index, list) {
		_label.html((index+1)+"/"+list.length);
		if(index > 0) {
			if(_left.css("opacity") != "1") _left.css({opacity: "1", cursor: "pointer"}).hover(elementOverHandler, elementOutHandler).click(leftClickHandler);
		}
		else {
			if(_left.css("opacity") != "0.5") _left.css({backgroundPosition: "-61px -135px", opacity: "0.5", cursor: "auto"}).unbind("mouseenter", elementOverHandler).unbind("mouseleave", elementOutHandler).unbind("click", leftClickHandler);
		}
		if(index < list.length-1) {
			if(_right.css("opacity") != "1") _right.css({opacity: "1", cursor: "pointer"}).hover(elementOverHandler, elementOutHandler).click(rightClickHandler);
		}
		else {
			if(_right.css("opacity") != "0.5") _right.css({backgroundPosition: "-61px -146px", opacity: "0.5", cursor: "auto"}).unbind("mouseenter", elementOverHandler).unbind("mouseleave", elementOutHandler).unbind("click", rightClickHandler);
		}
	}
};

/*-----------------------------------------------------------------*
 | VOLUMECONTROL                                                   |
 *-----------------------------------------------------------------*/

var VolumeControl = function(upcolor, overcolor) {
	/*
	obj
	
	@change
	*/
	
	var _this;
	var _upcolor;
	var _overcolor;
	var _bars;
	var _value;
	var _over;
	
    {
		_this = this;
		_upcolor = upcolor;
		_overcolor = overcolor;
		_this.obj = $("<div></div>").css({width: "28px", height: "12px", fontSize: "1px", lineHeight: "1px", cursor: "pointer"});
		var bar = $("<div></div>").css({"float": "left", width: "3px", height: "12px", marginLeft: "2px"}).cssbgc(upcolor);
		_bars = [bar.clone().css("marginLeft", "0"), bar.clone(), bar.clone(), bar.clone(), bar.clone(), bar];
		_value = 1;
		_over = 0;
		for(var i = 0; i < _bars.length; i++) _this.obj.append(_bars[i]);
		_this.obj.mousemove(overHandler).mouseleave(outHandler).click(clickHandler);
	}
	
	_this.getValue = function() {
		return _value;
	};
	
	function overHandler(event) {
		var w = Math.round((event.pageX-_this.obj.offset().left)*6/28);
		var i;
		if(w < _over) {
			for(i = _over-1; i >= w; i--) _bars[i].cssbgc(_upcolor);
		}
		else if(w > _over) {
			for(i = _over; i < w; i++) _bars[i].cssbgc(_overcolor);
		}
		_over = w;
	}
	
	function outHandler(event) {
		for(i = _over-1; i >= 0; i--) _bars[i].cssbgc(_upcolor);
		_over = 0;
	}
	
	function clickHandler(event) {
		var v = _value*6;
		var w = Math.round((event.pageX-_this.obj.offset().left)*6/28);
		var i;
		if(w < v) {
			for(i = v-1; i >= w; i--) _bars[i].css("opacity", "0.5");
			_value = w/6;
			$(_this).triggerHandler("change", _value);
		}
		else if(w > v) {
			for(i = v; i < w; i++) _bars[i].css("opacity", "1");
			_value = w/6;
			$(_this).triggerHandler("change", _value);
		}
	}
};

/*-----------------------------------------------------------------*
 | TUBE                                                            |
 *-----------------------------------------------------------------*/

var Tube = function(upcolor, overcolor) {
	/*
	obj
	*/
	
	var _this;
	var _loadvalue;
	var _loadinner;
	var _loadbar;
	var _playvalue;
	var _playinner;
	var _playbar;
	var _mouseoverx;
	
	{
		_this = this;
		_this.obj = $("<div></div>").css({height: "6px", overflow: "hidden", fontSize:"1px", lineHeight: "1px", cursor: "pointer"});
		var bar = $("<div></div>").css({position: "absolute", width: "100%", height: "6px", overflow: "hidden", opacity: "0.5"});
		var inner = $("<div></div>").css({width: "200%", marginLeft: "-100%"});
		var box = $("<div></div>").css({"float": "left", width: "50%", height: "6px"});
		box.clone().cssbgc(overcolor).appendTo(inner);
		box.cssbgc(upcolor).appendTo(inner);
		_loadvalue = 0;
		_loadinner = inner.clone(true);
		_loadbar = bar.clone().append(_loadinner).appendTo(_this.obj).css("width", (_loadvalue*100)+"%");
		_playvalue = 0;
		_playinner = inner;
		_playbar = bar.append(_playinner).appendTo(_this.obj).css("width", (_playvalue*100)+"%");
		var border = $("<div></div>").css({position: "relative", padding: "4px 0 0 0", border: "1px solid "+upcolor.opaque, opacity: upcolor.opacity}).appendTo(_this.obj);
		_mouseoverx = 0;
		_this.obj.mousemove(overHandler).mouseleave(outHandler);
	}
	
	_this.setLoadValue = function(value) {
		_loadvalue = value;
		_loadbar.css("width", (_loadvalue*100)+"%");
		if(_mouseoverx) _this.obj.mousemove();
	};
	
	_this.getLoadValue = function() {
		return _loadvalue;
	};
	
	_this.setPlayValue = function(value) {
		_playvalue = value;
		_playbar.css("width", (_playvalue*100)+"%");
		if(_mouseoverx) _this.obj.mousemove();
	};
	
	_this.getPlayValue = function() {
		return _playvalue;
	};
	
	function overHandler(event) {
		if(event.pageX) _mouseoverx = event.pageX-_this.obj.offset().left;
		var width = _this.obj.width();
		var w = _mouseoverx*100/width;
		if(_loadvalue > 0) _loadinner.css("margin-left", Math.min(Math.round(w/_loadvalue-100), 0)+"%");
		if(_playvalue > 0)_playinner.css("margin-left", Math.min(Math.round(w/_playvalue-100), 0)+"%");
	}
	
	function outHandler(event) {
		_loadinner.css("margin-left", "-100%");
		_playinner.css("margin-left", "-100%");
		_mouseoverx = 0;
	}
};

/*-----------------------------------------------------------------*
 | TOOLBOX                                                         |
 *-----------------------------------------------------------------*/

var ToolBox = function(gallery, movie, sound, bgcolor, fgcolor, overcolor, skin) {
	/*
	obj
	bigplay
	*/
	
	var _this;
	var _gallery;
	var _movie;
	var _sound;
	var _fullscreen;
	var _hide;
	var _normal;
	var _stage;
	var _timer;
	var _bars;
	var _textbox;
	var _supo;
	var _tblabel;
	var _playpause;
	var _tube;
	var _mblabel;
	var _state;
	var _current;
	
    {
		_this = this;
		_gallery = gallery;
		_movie = movie;
		_sound = sound;
		_this.obj = $("<div></div>").css({position: "absolute", left: "0", bottom: "5px", width: "100%", textAlign: "left"});
		var button = $("<div></div>").css({position: "absolute", bottom: "0", width: "26px", height: "26px", background: "url('"+skin+"') no-repeat", cursor: "pointer"});
		var hoverinfo = {x: -61, y: -81, hx: -88, hy: -81};
		_fullscreen = button.clone().css({right: "5px", backgroundPosition: hoverinfo.x+"px "+hoverinfo.y+"px"}).hover(elementOverHandler, elementOutHandler).click(fullscreenClickHandler).appendTo(_this.obj);
		_fullscreen.get(0).hoverinfo = hoverinfo;
		var hidecolor = _gallery.obj.css("background-color");
		if(!hidecolor || hidecolor.match(/(transparent|rgba\(.*,\s*0\s*\))/i)) hidecolor = "#ffffff";
		_hide = $("<div></div>").css({position: "absolute", backgroundColor: hidecolor, zIndex: "1000"});
		var bar = $("<div></div>").css({cssText: "height: auto !important; height: 26px;", position: "relative", margin: "0 36px 0 5px", display: "none"});
		_bars = [bar.appendTo(_this.obj), bar.clone().appendTo(_this.obj)];
		hoverinfo = {x: -61, y: -54, hx: -88, hy: -54};
		var download = button.clone().css({right: "0", backgroundPosition: hoverinfo.x+"px "+hoverinfo.y+"px"}).hover(elementOverHandler, elementOutHandler).click(downloadClickHandler).appendTo(bar);
		download.get(0).hoverinfo = hoverinfo;
		_textbox = $("<div></div>").css({cssText: "height: auto !important; height: 1px;", position: "relative", marginRight: "31px", fontSize:"1px", lineHeight: "1px"});
		var corner = $("<div></div>").css({position: "absolute", width: "5px", height: "5px", background: "url('"+skin+"') no-repeat"});
		var tl = corner.clone().css({top: "0", left: "0", backgroundPosition: "-81px -152px"});
		var tr = corner.clone().css({top: "0", right: "0", backgroundPosition: "-86px -152px"});
		var bl = corner.clone().css({bottom: "0", left: "0", backgroundPosition: "-92px -152px"});
		var br = corner.css({bottom: "0", right: "0", backgroundPosition: "-97px -152px"});
		var tc = $("<div></div>").css({height: "5px", margin: "0 5px"}).cssbgc(bgcolor);
		var c = $("<div></div>").css({width: "100%", height: "16px"}).cssbgc(bgcolor);
		var bc = tc.clone();
		var tbc = c.clone().css({height: "auto"});
		_tblabel = $("<div></div>").css({minHeight: "16px", position: "relative", margin: "0 5px", fontFamily: "Arial, sans-serif", color: fgcolor.opaque, fontSize:"12px", lineHeight: "16px", opacity: fgcolor.opacity}).appendTo(tbc);
		_textbox.append(tl.clone()).append(tr.clone()).append(tc.clone()).append(tbc).append(bc.clone()).append(bl.clone()).append(br.clone()).appendTo(bar);
		_supo = $.support.opacity;
		bar = _bars[1];
		hoverinfo = {x: -61, y: 0, hx: -88, hy: 0};
		_playpause = button.css({left: "0", backgroundPosition: hoverinfo.x+"px "+hoverinfo.y+"px"}).hover(elementOverHandler, elementOutHandler).click(playpauseClickHandler).appendTo(bar);
		_playpause.get(0).hoverinfo = hoverinfo;
		var volume = new VolumeControl(fgcolor, overcolor);
		volume.obj.css({position: "absolute", top: "50%", right: "5px", marginTop: "-6px"});
		$(volume).bind("change", volumeChangeHandler);
		_mblabel = $("<div></div>").css({position: "absolute", top: "50%", right: "38px", width: "70px", height: "12px", marginTop: "-6px", overflow: "hidden", textAlign: "center", fontFamily: "Arial, sans-serif", color: fgcolor.opaque, fontSize:"12px", lineHeight: "12px", opacity: fgcolor.opacity});
		_tube = new Tube(fgcolor, overcolor);
		_tube.obj.css({position: "relative", top: "5px", margin: "0 113px 0 5px"}).click(tubeClickHandler);
		c.append(volume.obj).append(_mblabel).append(_tube.obj);
		var mediabox = $("<div></div>").css({cssText: "height: auto !important; height: 1px;", position: "relative", marginLeft: "31px", fontSize:"1px", lineHeight: "1px"});
		mediabox.append(tl).append(tr).append(tc).append(c).append(bc).append(bl).append(br).appendTo(bar);
		_state = -1;
		hoverinfo = {x: 0, y: 0, hx: 0, hy: -61};
		_this.bigplay = $("<div></div>").css({position: "absolute", left: "50%", top: "50%", width: "60px", height: "60px", margin: "-30px 0 0 -30px", background: "url('"+skin+"') no-repeat "+hoverinfo.x+"px "+hoverinfo.y+"px", cursor: "pointer", display: "none"}).hover(elementOverHandler, elementOutHandler).click(playpauseClickHandler);
		_this.bigplay.get(0).hoverinfo = hoverinfo;
		$(_gallery).bind("change", galleryChangeHandler);
		if(_movie.obj) {
			$(_movie).bind("progress", mediaLoadValueHandler);
			_movie.obj.bind("timeupdate", mediaPlayValueHandler).bind("play", mediaPlayHandler).bind("error pause", mediaPauseHandler);
		}
		if(_sound.obj) {
			$(_sound).bind("progress", mediaLoadValueHandler);
			_sound.obj.bind("timeupdate", mediaPlayValueHandler).bind("play", mediaPlayHandler).bind("error pause", mediaPauseHandler);
		}
	}
	
	function elementOverHandler(event) {
		var element = $(this);
		var hoverinfo = element.get(0).hoverinfo;
		element.css("background-position", hoverinfo.hx+"px "+hoverinfo.hy+"px");
	}
	
	function elementOutHandler(event) {
		var element = $(this);
		var hoverinfo = element.get(0).hoverinfo;
		element.css("background-position", hoverinfo.x+"px "+hoverinfo.y+"px");
	}
	
	function fullscreenClickHandler(event) {
		var w = $(window);
		var html = $("html");
		var body = $("body");
		var hoverinfo;
		if(_normal != null) {
			w.unbind("resize scroll", windowResizeScrollHandler);
			clearTimeout(_timer);
			_gallery.obj.appendTo(_normal.parent).css(_normal.gallery);
			_hide.remove();
			html.css(_normal.html);
			body.css(_normal.body);
			_normal = null;
			hoverinfo = {x: -61, y: -81, hx: -88, hy: -81};
		}
		else {
			_normal = {
				html: {width: "", height: ""},
				body: {width: "", height: "", overflow: body.css("overflow") || ""},
				gallery: {position: _gallery.obj.css("position"), left: _gallery.obj.css("left") || "", top: _gallery.obj.css("top") || "", width: _gallery.getWidth()+"px", height: _gallery.getHeight()+"px", margin: _gallery.obj.css("margin") || "", zIndex: _gallery.obj.css("z-index") || ""},
				parent: _gallery.obj.parent()
			};
			html.css({width: "100%", height: "100%"});
			body.css({width: "100%", height: "100%", overflow: "hidden"}).append(_hide);
			setStage();
			_gallery.obj.css({position: "absolute", left: "0", top: "0", margin: "0", zIndex: "1001"}).appendTo(body);
			timerCompleteHandler();
			w.bind("resize scroll", windowResizeScrollHandler);
			hoverinfo = {x: -61, y: -108, hx: -88, hy: -108};
		}
		_fullscreen.get(0).hoverinfo = hoverinfo;
		_fullscreen.css("background-position", hoverinfo.x+"px "+hoverinfo.y+"px");
	}
	
	function setStage() {
		var w = $(window);
		_stage = {left: w.scrollLeft()+"px", top: w.scrollTop()+"px", width: (window.innerWidth || w.width())+"px", height: (window.innerHeight || w.height())+"px"};
		_hide.css(_stage);
	}
	
	function windowResizeScrollHandler(event) {
		setStage();
		clearTimeout(_timer);
		_timer = setTimeout(timerCompleteHandler, 500);
	}
	
	function timerCompleteHandler() {
		_gallery.obj.css(_stage);
	}
	
	function downloadClickHandler(event) {
		window.location.href = _current.downloadUrl;
	}
	
	function playpauseClickHandler(event) {
		if(_current.audio) {
			if(!_sound.obj.attr("src") || _sound.obj.attr("src").indexOf(_current.audio) < 0) {
				_sound.load(_current.audio);
				_sound.play();
			}
			else if(_sound.isPaused()) {
				_sound.play();
			}
			else {
				_sound.pause();
			}
		}
		else {
			if(!_movie.obj.attr("src") || _movie.obj.attr("src").indexOf(_current.video) < 0) {
				_movie.load(_current.video);
				_movie.play();
			}
			else if(_movie.isPaused()) {
				_movie.play();
			}
			else {
				_movie.pause();
			}
		}
	}
	
	function tubeClickHandler(event) {
		var value = (event.pageX-_tube.obj.offset().left)/_tube.obj.width();
		if(_current.audio) _audio.seek(value);
		else _movie.seek(value);
	}
	
	function volumeChangeHandler(event, value) {
		_sound.setVolume(value);
		_movie.setVolume(value);
	}
	
	function galleryChangeHandler(event, index, list) {
		if(_current) {
			if(_state == 1) {
				if(_current.audio) _sound.stop();
				else _movie.stop();
			}
		}
		_current = list[index];
		var bar;
		if(_current.audio && _audio.obj || _current.video && _movie.obj) {
			if(_state == 0) _bars[0].css("display", "none");
			_state = 1;
			_tube.setPlayValue(0);
			_tube.setLoadValue(0);
			_mblabel.html("00:00/00:00");
			bar = _bars[1].css("display", "block");
			_this.bigplay.css("display", "block");
		}
		else {
			if(_state != 0) {
				if(_state == 1) {
					_this.bigplay.css("display", "none");
					_bars[1].css("display", "none");
				}
				_state = 0;
				if(_supo) _textbox.css("opacity", "0");
				else _textbox.css("display", "none");
			}
			bar = _bars[0].css("display", "block");
			if(_current.caption && _current.caption.length > 0) {
				_tblabel.html(_current.caption);
				if(_supo) {
					if(_textbox.stop(true, true).css("opacity") != "1") _textbox.animate({opacity: "1"}, 500);
				}
				else {
					_textbox.css("display", "block");
				}
			}
			else {
				_tblabel.empty();
				if(_supo) {
					if(_textbox.stop(true, true).css("opacity") != "0") _textbox.animate({opacity: "0"}, 500);
				}
				else {
					_textbox.css("display", "none");
				}
			}
		}
	}
	
	function fomatTime(time) {
		var s = Math.round(time);
		var m = Math.floor(s/60);
		s -= m*60;
		if(m < 10) m = "0"+m;
		if(s < 10) s = "0"+s;
		return m+":"+s;
	}
	
	function mediaLoadValueHandler(event) {
		var media = this.obj.get(0);
		if(media.duration > 0 && media.buffered.length > 0) {
			_tube.setLoadValue(media.buffered.end(0)/media.duration);
			_mblabel.html(fomatTime(media.currentTime)+"/"+fomatTime(media.duration));
		}
	}
	
	function mediaPlayValueHandler(event) {
		var media = this;
		if(media.duration > 0) {
			_tube.setPlayValue(media.currentTime/media.duration);
			_mblabel.html(fomatTime(media.currentTime)+"/"+fomatTime(media.duration));
		}
	}
	
	function mediaPlayHandler(event) {
		var hoverinfo = {x: -61, y: -27, hx: -88, hy: -27};
		_playpause.get(0).hoverinfo = hoverinfo;
		_playpause.css("background-position", hoverinfo.x+"px "+hoverinfo.y+"px");
		_this.bigplay.css("display", "none");
	}
	
	function mediaPauseHandler(event) {
		var hoverinfo = {x: -61, y: 0, hx: -88, hy: 0};
		_playpause.get(0).hoverinfo = hoverinfo;
		_playpause.css("background-position", hoverinfo.x+"px "+hoverinfo.y+"px");
		if(_state == 1) _this.bigplay.css("display", "block");
	}
};

/*-----------------------------------------------------------------*
 | THUMBBOX                                                        |
 *-----------------------------------------------------------------*/

var ThumbBox = function(gallery, bgcolor, skin, thumbstrip) {
	/*
	obj
	*/
	
	var _this;
	var _gallery;
	var _left;
	var _right;
	var _thumbstrip;
	
    {
		_this = this;
		_gallery = gallery;
		_thumbstrip = thumbstrip;
		var arrow = $("<div></div>").css({position: "absolute", top: "50%", width: "10px", height: "10px", marginTop: "-5px", fontSize:"1px", lineHeight: "1px", background: "url('"+skin+"') no-repeat", opacity: "0.5"});
		var hoverinfo = {x: -61, y: -135, hx: -70, hy: -135};
		_left = arrow.clone().css({left: "2px", backgroundPosition: hoverinfo.x+"px "+hoverinfo.y+"px"});
		_left.get(0).hoverinfo = hoverinfo;
		hoverinfo = {x: -61, y: -146, hx: -70, hy: -146};
		_right = arrow.css({right: "2px", backgroundPosition: hoverinfo.x+"px "+hoverinfo.y+"px"});
		_right.get(0).hoverinfo = hoverinfo;
		_this.obj = $("<div></div>").css({position: "absolute", left: "0", bottom: "0", width: "100%", height: "95px", textAlign: "left"}).cssbgc(bgcolor).append(_thumbstrip.obj).append(_left).append(_right);
		$(_gallery).bind("change", galleryChangeHandler);
	}
	
	function elementOverHandler(event) {
		var element = $(this);
		var hoverinfo = element.get(0).hoverinfo;
		element.css("background-position", hoverinfo.hx+"px "+hoverinfo.hy+"px");
	}
	
	function elementOutHandler(event) {
		var element = $(this);
		var hoverinfo = element.get(0).hoverinfo;
		element.css("background-position", hoverinfo.x+"px "+hoverinfo.y+"px");
	}
	
	function leftClickHandler(event) {
		_gallery.previous();
	}
	
	function rightClickHandler(event) {
		_gallery.next();
	}
	
	function galleryChangeHandler(event, index, list) {
		if(index > 0) {
			if(_left.css("opacity") != "1") _left.css({opacity: "1", cursor: "pointer"}).hover(elementOverHandler, elementOutHandler).click(leftClickHandler);
		}
		else {
			if(_left.css("opacity") != "0.5") _left.css({backgroundPosition: "-61px -135px", opacity: "0.5", cursor: "auto"}).unbind("mouseenter", elementOverHandler).unbind("mouseleave", elementOutHandler).unbind("click", leftClickHandler);
		}
		if(index < list.length-1) {
			if(_right.css("opacity") != "1") _right.css({opacity: "1", cursor: "pointer"}).hover(elementOverHandler, elementOutHandler).click(rightClickHandler);
		}
		else {
			if(_right.css("opacity") != "0.5") _right.css({backgroundPosition: "-61px -146px", opacity: "0.5", cursor: "auto"}).unbind("mouseenter", elementOverHandler).unbind("mouseleave", elementOutHandler).unbind("click", rightClickHandler);
		}
	}
};

/*-----------------------------------------------------------------*
 | GALLERY                                                         |
 *-----------------------------------------------------------------*/

var Gallery = function(id, width, height, bgcolor, fgcolor, overcolor, skin, outalpha, fixedthumbs, siteaccess, ids, galleryname) {
	/*
	obj
	
	setIndex(value)
	getIndex()
	previous()
	next()
	getMovie()
	getSound()
	
	@change
	@resize
	*/
	
	var _this;
	var _width;
	var _height;
	var _stageheight;
	var _bgcolor;
	var _fgcolor;
	var _overcolor;
	var _skin;
	var _supo;
	var _outalpha;
	var _fixedthumbs;
	var _loader;
	var _images;
	var _movie;
	var _sound;
	var _controls;
	var _timer;
	var _thumbstrip;
	var _index;
	
    {
		if(!$.fn["~css"]) {
			$.fn["~css"] = $.fn.css;
			$.fn.css = function(key, value) {
				var obj = $(this);
				var result = obj["~css"](key, value);
				if(typeof(key) == "object" || value) obj.triggerHandler("css", [key, value]);
				return result;
			};
		}
		
		try {
			$.support.rgba = !!$("<div></div>").css("background-color", "rgba(0, 0, 0, 0)");
		}
		catch(error) {
			$.support.rgba = false;
		}
		$.fn.cssbgc = function(color) {
			var obj = $(this);
			if($.support.rgba) obj.css({backgroundColor: color.rgba});
			else obj.css({backgroundColor: "transparent", filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr="+color.hex+", endColorstr="+color.hex+")"});
			return obj;
		};
		
		_this = this;
		_width = width;
		_height = height;
		_stageheight = _height;
		_this.obj = $("#"+id).empty().css({width: width+"px", height: height+"px"});
		var position = _this.obj.css("position");
		if(!position || !position.match(/absolute/i)) _this.obj.css("position", "relative");
		_bgcolor = transformColor(bgcolor);
		_fgcolor = transformColor(fgcolor);
		_overcolor = transformColor(overcolor);
		_skin = skin;
		_supo = $.support.opacity;
		if(_supo) _outalpha = outalpha;
		else if(outalpha < 0.5) _outalpha = "none";
		else _outalpha = "block";
		_fixedthumbs = fixedthumbs;
		$.getJSON(siteaccess+"/em_amfphp/ajax/[["+ids+"],\""+galleryname+"\"]/Extension_Em_Amfphp_Classes_Lib_Services/getMediaGalleryElements", ajaxCompleteHandler);
	}
	
	function ajaxCompleteHandler(result) {
		if(result && result.length > 0) {
			_movie = new Movie();
			_sound = new Sound();
			
			var list = new Array();
			var item;
			var obj;
			for(var i = 0; i < result.length; i++) {
				item = result[i];
				if(item.file) {
					delete item.file;
				}
				else if(item.audio) {
					if(_sound.type != "mp3") delete item.audio;
				}
				else if(item.videos) {
					obj = item.videos[_movie.type];
					if(obj) {
						item.video = obj.file;
						item.galleryImage = obj.galleryImage || "";
					}
					delete item.videos;
				}
				else if(item.audios) {
					obj = item.audios[_sound.type];
					if(obj) item.audio = obj;
					delete item.audios;
				}
				if(item.galleryImage && item.galleryImage.length > 0 || item.video && item.video.length > 0) list.push(item);
			}
			
			if(list.length > 0) {
				_loader = new Loader();
				$(_loader).bind("complete", imageLoadCompleteHandler);
				_loader.setList(list);
				
				var length = _loader.getList().length;
				var many = (length > 1);
				_fixedthumbs = (_fixedthumbs && many);
				_images = $("<div></div>").css({position: "absolute", width: "100%", WebkitUserSelect: "none", MozUserSelect: "none"}).select(preventSelectHandler).appendTo(_this.obj);
				if(_movie.obj) _movie.obj.css({position: "absolute", display: "none"}).bind("loadedmetadata", movieMetadataHandler).bind("play", moviePlayHandler).appendTo(_this.obj);
				
				_controls = $("<div></div>").css({position: "absolute", width: "100%", textAlign: "center", WebkitUserSelect: "none", MozUserSelect: "none"}).select(preventSelectHandler);
				resizeHandler();
				if(many) {
					_thumbstrip = new ThumbStrip(_this, length, _fgcolor);
					$(_thumbstrip).bind("update", thumbUpdateHandler).bind("click", thumbClickHandler);
					var navigation;
					if(_fixedthumbs) {
						navigation = new NavigationBox(_this, _bgcolor, _fgcolor, _skin);
						var thumbbox = new ThumbBox(_this, _bgcolor, _skin, _thumbstrip);
						thumbbox.obj.css({WebkitUserSelect: "none", MozUserSelect: "none"}).select(preventSelectHandler).appendTo(_this.obj);
					}
					else {
						navigation = new NavigationBox(_this, _bgcolor, _fgcolor, _skin, _thumbstrip);
					}
					_controls.append(navigation.obj);
				}
				var toolbox = new ToolBox(_this, _movie, _sound, _bgcolor, _fgcolor, _overcolor, _skin);
				_controls.append(toolbox.bigplay).append(toolbox.obj).appendTo(_this.obj);
				
				_this.obj.bind("css", cssHandler).bind("mousemove click", mouseActionHandler);
				$(_this).bind("resize", resizeHandler);
				
				_index = 0;
				_loader.start();
			}
		}
	}
	
	_this.getWidth = function() {
		return _width;
	}
	
	_this.getHeight = function() {
		return _height;
	}
	
	_this.setIndex = function(value) {
		mouseActionHandler();
		var list = _loader.getList();
		if(list && value >= 0 && value < list.length) {
			_index = value;
			var item = list[_index];
			if(item.obj) {
				if(_movie.obj) {
					var display;
					if(item.galleryImage.length > 0) {
						display = "none";
					}
					else {
						display = "block";
						_movie.load(item.video);
					}
					_movie.obj.css("display", display);
				}
				_images.children().stop();
				$(_this).triggerHandler("change", [_index, list]);
				scaleMedia(item.obj.get(0));
				item.obj.css("opacity", "0").appendTo(_images).animate({opacity: "1"}, 1000);
				var prevall = item.obj.prevAll();
				if(prevall.length > 0) prevall.animate({opacity: "0"}, 1000, fadeOutCompleteHandler);
			}
			else {
				_loader.setIndex(_index);
			}
		}
	};
	
	_this.getIndex = function() {
		return _index;
	};
	
	_this.previous = function() {
		_this.setIndex(_index-1);
	};
	
	_this.next = function() {
		_this.setIndex(_index+1);
	};
	
	function transformColor(color) {
		var c = parseInt(color, 16);
		var a = (c>>24&0xff)/0xff;
		var r = c>>16&0xff;
		var g = c>>8&0xff;
		var b = c&0xff;
		var o = (c&0xffffff).toString(16);
		o = "000000".substr(0, 6-o.length)+o;
		return {
			hex: "#"+color,
			rgba: "rgba("+r+", "+g+", "+b+", "+a+")",
			opaque: "#"+o,
			opacity: a
		};
	}
	
	function cssHandler(event, key, value) {
		if(typeof(key) == "object") {
			for(var name in key) {
				if(name.match(/(width|height)/i)) {
					$(_this).triggerHandler("resize");
					break;
				}
			}
		}
		else if(typeof(key) == "string") {
			if(key.match(/(width|height)/i)) $(_this).triggerHandler("resize");
		}
	}
	
	function resizeHandler(event) {
		_width = _this.obj.width() || _width;
		_height = _this.obj.height() || _height;
		_stageheight = _height;
		if(_fixedthumbs) _stageheight -= 95;
		_images.css({height: _stageheight+"px"}).children().each(scaleAllMedia);
		if(_movie.obj) scaleMedia(_movie.obj.get(0));
		_controls.css({height: _stageheight+"px"});
	}
	
	function scaleAllMedia(index, element) {
		scaleMedia(element);
	}
	
	function scaleMedia(media) {
		var width;
		var height;
		if(media.videoWidth && media.videoHeight) {
			width = media.videoWidth;
			height = media.videoHeight;
		}
		else {
			width = media.width;
			height = media.height;
		}
		if(width && height) {
			var scale = Math.min(_width/width, _stageheight/height);
			var width = Math.floor(width*scale);
			var height = Math.floor(height*scale);
			var left = Math.floor((_width-width)/2);
			var top = Math.floor((_stageheight-height)/2);
			$(media).css({left: left+"px", top: top+"px", width: width+"px", height: height+"px"});
		}
	}
	
	function movieMetadataHandler(event) {
		scaleMedia(this);
	}
	
	function moviePlayHandler(event) {
		_movie.obj.css("display", "block");
	}
	
	function mouseActionHandler(event) {
		clearTimeout(_timer);
		_controls.stop();
		if(_supo) _controls.css("opacity", "1");
		else _controls.css("display", "block");
		_timer = setTimeout(timerCompleteHandler, 2000);
	}
	
	function timerCompleteHandler() {
		if(_supo) _controls.animate({opacity: _outalpha}, 500);
		else _controls.css("display", _outalpha);
	}
	
	function preventSelectHandler(event) {
		return false;
	}
	
	function imageLoadCompleteHandler(event, index) {
		var item = _loader.getList()[index];
		if(!item.obj) item.obj = $("<div></div>");
		item.obj.css({position: "absolute", MsInterpolationMode: "bicubic"});
		if(_thumbstrip) {
			var thumb = item.obj.clone();
			var image = item.obj.get(0);
			var scale = Math.max(75/image.width, 75/image.height);
			var width = Math.floor(image.width*scale);
			var height = Math.floor(image.height*scale);
			var left = Math.floor((75-width)/2);
			var top = Math.floor((75-height)/2);
			thumb.css({left: left+"px", top: top+"px", width: width+"px", height: height+"px"});
			if(item.audio || item.video) {
				var icon = $("<div></div>").css({position: "absolute", left: "54px", top: "54px", width: "16px", height: "16px", background: "url('"+_skin+"') no-repeat"});
				if(item.audio) icon.css("backgroundPosition", "-81px -135px");
				else icon.css("backgroundPosition", "-98px -135px");
				thumb = $("<div></div>").append(thumb).append(icon);
			}
			item.thumb = thumb;
			var container = _thumbstrip.getContainerAt(index);
			if(container) container.prepend(item.thumb);
		}
		if(index == _index) _this.setIndex(_index);
	}
	
	function thumbUpdateHandler(event, container) {
		var index = container.get(0).index;
		if(index >= 0 && index < _loader.getList().length) {
			var item = _loader.getList()[index];
			if(item.thumb) container.prepend(item.thumb);
			else _loader.setIndex(index);
		}
	}
	
	function thumbClickHandler(event, container) {
		var index = container.get(0).index;
		if(index != _index) _this.setIndex(index); 
	}
	
	function fadeOutCompleteHandler() {
		$(this).remove();
	}
};