//** DD Drop Down Panel- (c) Dynamic Drive DHTML code library: http://www.dynamicdrive.com
//** Oct 21st, 08'- Script created
//** March 23rd, 09' v1.01- Arrow images now preloaded

function ddpanel(setting){
	setting.dir="up" //initial state of panel (up="contracted")

	if (setting.dir=="up"){ //if "up", output CSS to hide panel contents
		document.write('<style type="text/css">\n')
		document.write('#'+setting.ids[1]+'{height:' + parseInt(setting.stateconfig.initial) + 'px; overflow:hidden;}\n')
		document.write('#'+setting.ids[2]+'{height:' + parseInt(setting.stateconfig.initial) + 'px; overflow:hidden;}\n')
		document.write('</style>\n')
	}
	setting.stateconfig.initial=parseInt(setting.stateconfig.initial)
	this.setting=setting
	if (setting.pointerimage.enabled){ //preload images
		var img1=new Image(), img2=new Image()
		img1.src=setting.pointerimage.src[0]
		img2.src=setting.pointerimage.src[1]
	}
	var thispanel=this
	if (window.addEventListener) //if non IE browsers, initialize panel window.onload
		ddpanel.addEvent(window, function(e){thispanel.initpanel(setting)}, "load")
	else //else if IE, add 100 millisec after window.onload before initializing
		ddpanel.addEvent(window, function(e){setTimeout(function(){thispanel.initpanel(setting)}, 100)}, "load")
	ddpanel.addEvent(window, function(e){thispanel.uninit(setting)}, "unload")
}

ddpanel.events_array=[] //object array to contain events created by script

ddpanel.addEvent=function(target, functionref, tasktype){
	var evtmodel=target.addEventListener? "w3c" : "ie"
	var evtaction=evtmodel=="w3c"? "addEventListener" : "attachEvent"
	var i=this.events_array.push({ //store event info in ddpanel.events_array[] and return current event's index within array
		target: target,
		tasktype: (evtmodel=="ie"? "on" : "")+tasktype,
		listener: evtmodel=="ie"? function(){return functionref.call(target, window.event)} : functionref
	})-1
	target[evtaction](this.events_array[i].tasktype, this.events_array[i].listener, evtmodel=="w3c"? false : null)
}

ddpanel.removeEvent=function(target, functionref, tasktype){
	var evtmodel=target.removeEventListener? "w3c" : "ie"
	var evtaction=evtmodel=="w3c"? "removeEventListener" : "detachEvent"
	target[evtaction](tasktype, functionref, evtmodel=="w3c"? false : null)
}

ddpanel.addpointer=function(target, className, imagesrc){
	var pointer=document.createElement("img")
	pointer.src=imagesrc
	pointer.className=className
	pointer.style.borderWidth=0
	target.appendChild(pointer)
	return pointer
}

ddpanel.prototype={

togglepanel:function(dir){ //public function that toggles the panel's state. Optional dir parameter ("up" or "down") to explicitly set state.
	var setting=this.setting
	setting.dir=dir || ((setting.dir=="up")? "down" : "up")
	var pcontent=setting.pcontent, pmap=setting.pmap, dir=setting.dir
	pcontent._currentheight=(dir=="down")? pcontent._actualheight : setting.stateconfig.initial
	pcontent.style.height=pcontent._currentheight+"px"
 
	pmap._currentheight=(dir=="down")? pmap._actualheight : setting.stateconfig.initial
	pmap.style.height=pmap._currentheight+"px"
	
	if (dir=="up") {
		pmap.style.visibility="hidden";
	}
	else {
		pmap.style.visibility="visible";
	}
	
	if (setting.pointerimage.enabled){
		setting.arrow.src=setting.pointerimage.src[(setting.dir=="down")? 1 : 0]
		setting.arrow.style.visibility="visible"
	}
//	ddpanel.setCookie(setting.ids[0], setting.dir)
},

togglepanelplus:function(dir){ //public function that toggles the panel's state w/ animation. Optional dir parameter ("up" or "down") to explicitly set state.
	var setting=this.setting
	setting.dir=dir || ((setting.dir=="up")? "down" : "up")
	if (setting.pointerimage.enabled)
		setting.arrow.style.visibility="hidden"
	clearTimeout(setting.revealtimer)
	this.revealcontent()
},

revealcontent:function(){
	var setting=this.setting
	var pcontent=setting.pcontent, curH=pcontent._currentheight, maxH=pcontent._actualheight, minH=setting.stateconfig.initial, steps=setting.animate.steps, dir=setting.dir
	if (dir=="down" && curH<maxH || dir=="up" && curH>minH){
		var newH = curH + (Math.round((maxH-curH)/steps)+1) * (dir=="up"? -1 : 1)
		newH=(dir=="down")? Math.min(maxH, newH) : Math.max(minH, newH)
		pcontent.style.height=newH+"px"
		pcontent._currentheight=newH;
		
		if (dir=="up" && curH>minH){
			pcontent.style.visibility="hidden"
		}
		else {
			pcontent.style.visibility="visible"
		}
	}
	else{
		if (setting.pointerimage.enabled){
			setting.arrow.src=setting.pointerimage.src[(setting.dir=="down")? 1 : 0]
			setting.arrow.style.visibility="visible"
		}
		return
	}
	var thispanel=this
	setting.revealtimer=setTimeout(function(){thispanel.revealcontent()}, 10)
},

initpanel:function(){
	var setting=this.setting
	var pcontainer=setting.pcontainer=document.getElementById(setting.ids[0])
	var pcontent=setting.pcontent=document.getElementById(setting.ids[1])
	var pmap=setting.pmap=document.getElementById(setting.ids[2])
	var tdiv=setting.tdiv=document.getElementById(setting.ids[3])
	pcontent.style.overflow="scroll"
	pcontent._actualheight=pcontent.scrollHeight
	setTimeout(function(){pcontent._actualheight=pcontent.scrollHeight}, 100)
	pcontent.style.overflow="hidden"
	pcontent._currentheight=(setting.dir=="down")? pcontent._actualheight : setting.stateconfig.initial
	
	pmap.style.overflow="scroll"
	pmap._actualheight=pmap.scrollHeight
	setTimeout(function(){pmap._actualheight=pmap.scrollHeight}, 100)
	pmap.style.overflow="hidden"
	pmap._currentheight=(setting.dir=="down")? pmap._actualheight : setting.stateconfig.initial
	
	var thispanel=this
	ddpanel.addEvent(tdiv, function(e){ //assign click behavior when toggle DIV tab is clicked on
		if (setting.animate.enabled)
			thispanel.togglepanelplus()
		else
			thispanel.togglepanel()
		if (e.preventDefault) e.preventDefault()
		return false
	}, "click")
	if (setting.pointerimage.enabled){
		var pointer1=new Image(), pointer2=new Image()
		pointer1.src=setting.pointerimage.src[0]
		pointer2.src=setting.pointerimage.src[1]
		setting.arrow=ddpanel.addpointer(tdiv.getElementsByTagName("span")[0], "pointerimage", setting.pointerimage.src[setting.dir=="down"? 1:0])
	}
/*	if (setting.closepanelonclick.enabled){ //assign click behavior when panel content is clicked on (links within panel or elements with class "closepanel"
		ddpanel.addEvent(pcontent, function(e){
			var target=e.srcElement || e.target
			if (/(^|\s+)closepanel($|\s+)/.test(target.className) || target.tagName=="A" || (target.parentNode && target.parentNode.tagName=="A")){
				thispanel.togglepanel("up")
			}
		}, "click")
	}*/
},

uninit:function(){
	var setting=this.setting

	for (prop in setting){
		setting[prop]=null
	}
}
} //end of ddpanel object


//initialize instance of DD Drop Down Panel:

var defaultpanel=new ddpanel({
	ids: ["mappanel", "mappanelcontent", "mapcontent", "mappaneltab"], // id of main panel DIV, content DIV, and tab DIV
	stateconfig: {initial: "0", persiststate: true}, // initial: initial reveal amount in pixels (ie: 5px)
	animate: {enabled: true, steps: 5}, //steps: number of animation steps. Int between 1-20. Smaller=faster.
	pointerimage: {enabled: true, src: ["components/com_photomapgallery/assets/images/arrow-down.gif", "components/com_photomapgallery/assets/images/arrow-up.gif"]}
})



var QTabs = new Class({
    options:{
		flexHeight:false,
		def_tab:0,
		autoplay:0,
		scrolling:0,
		delay:3000,
		duration:500,
		transition:'Quad',
		easing:'easeInOut',
		onActive: function(container, idx){
			var content = this.tcontents[idx];
			var s = container.getSize();
			var cw = s.size.x;
			if(this.options.flexHeight) {
				s = content.getSize();
				container.setStyle('height', s.size.y + 'px');
			}
					
			var d = (this.curTab >= 0 ? this.options.duration : 1);
			var sdir = this.options.scrolling;
			if(sdir == 'a') {
				if(idx > this.curTab) {
					sdir = 'lr';
				} else {
					sdir = 'rl';
				}	
			}
			var lft = [0,0];
			switch(sdir) {
				case 'lr':
					lft = [-cw,0];
					break;
				case 'rl':
					lft = [cw,0];
					break;
			}
	              
			this.fxOn = true;
			if(this.options.transition == 'linear') {
				var t = Fx.Transitions[this.options.transition];
			} else {
				var t = Fx.Transitions[this.options.transition][this.options.easing];
			}
			content.effects({
				duration: d,
				transition: t
			}).start({
				top: [0,0],
				left: lft,
				opacity: [1,1]
			});
			this.fxEnd.delay(d, this);
			this.tabs[idx].addClass('open').removeClass('closed');
		},

		onBackground: function(tab, content){
			content.setStyle('display', 'none');
			tab.addClass('closed').removeClass('open');
		}
    },

    initialize: function(m_id, options){
        
        this.setOptions(options);
        this.tabs = $('qtabs-'+ m_id).getElements('li')
        this.container = $('current-'+ m_id);
        this.tcontents = this.container.getElements('div.qtcontent');
		
		for (var i = 0, l = this.tabs.length; i < l; i++){
            var tab = this.tabs[i];
            tab.addEvent('click', this.display.bind(this, i));
            tab.addEvent('mouseenter', this.mouseEnter.bind(this, i));
            tab.addEvent('mouseleave', this.mouseLeave.bind(this, i));
        }
		this.curTab = -1;
		this.display(this.options.def_tab);

    },

    display: function(i){
    	if(i < 0 || i >= this.tabs.length) { i=0; }
        if(this.curTab == i || this.fxOn) {return;}
        
        $clear(this.timer);
        for (var c = 0, l = this.tabs.length; c < l; c++){
            if (c != i) {
            	this.tabs[c].addClass('closed').removeClass('open');
            } 
            this.tcontents[c].setOpacity(0);
        }
        this.fireEvent('onActive', [this.container, i]);
        this.curTab = i;
    },
    mouseEnter: function(i){
    	this.tabs[i].addClass('hover');
    },
    mouseLeave: function(i){
    	this.tabs[i].removeClass('hover');
    },
    fxEnd: function() {
		this.fxOn = false;
		if(this.options.autoplay) {
			var i = this.curTab + 1;
			if(i >= this.tcontents.length) {
				i = 0;
			}
			this.timer = this.display.delay(this.options.delay, this, i);
		}
	}
});

QTabs.implement(new Events);
QTabs.implement(new Options);



function nrc(e) {
	if (document.all) {
		if (event.button == 2) {
			alert(msgmouse);
			return false;
		}
	}
	if (document.layers) {
		if (e.which == 3) {
			return false;
		}
	}
	document.oncontextmenu=new Function("return false");
}

function rcalert(e) {
	if (document.all) {
		if (event.button == 2) {
			alert(msgmouse);
			return false;
		}
	}
	if (document.layers) {
		if (e.which == 3) {
			alert(msgmouse);
			return false;
		}
	}
	document.oncontextmenu=new Function("alert(msgmouse);return false");
}

if (document.layers) {
  document.captureEvents(Event.MOUSEDOWN);
}
