var GRL = {
	graphicsDir: './',
	dimmingOpacity: 0.5,
	dimmingDuration: 50,
	dimmingInnerHTML: '',
	faders : [],
	container : document.body,
	container_loader : 'loader',
	
	
	// declare internal properties
	ie : (document.all && !window.opera),
	safari : /Safari/.test(navigator.userAgent),
	geckoMac : /Macintosh.+rv:1\.[0-8].+Gecko/.test(navigator.userAgent),
	
	$ : function (id) {
		return document.getElementById(id);
	},
	
	ieVersion : function () {
		var arr = navigator.appVersion.split("MSIE");
		return arr[1] ? parseFloat(arr[1]) : null;
	},
	
	
	
	createElement : function (tag, attribs, styles, parent, nopad) {
		var el = document.createElement(tag);
		if (attribs) GRL.setAttribs(el, attribs);
		if (nopad) GRL.setStyles(el, {padding: 0, border: 'none', margin: 0});
		if (styles) GRL.setStyles(el, styles);
		if (parent) parent.appendChild(el);	
		return el;
	},

	setAttribs : function (el, attribs) {
		for (var x in attribs) el[x] = attribs[x];
	},

	setStyles : function (el, styles) {
		for (var x in styles) {
			if (GRL.ie && x == 'opacity') {
				if (styles[x] > 0.99) el.style.removeAttribute('filter');
				else el.style.filter = 'alpha(opacity='+ (styles[x] * 100) +')';
			}
			else el.style[x] = styles[x];
		}
	},
	
	
	
	getExpander : function (el, expOnly) {
		return GRL.undim();
	},
	
	


	getPosition : function(el)	{
		var p = { x: el.offsetLeft, y: el.offsetTop };
		while (el.offsetParent)	{
			el = el.offsetParent;
			p.x += el.offsetLeft;
			p.y += el.offsetTop;
			if (el != document.body && el != document.documentElement) {
				p.x -= el.scrollLeft;
				p.y -= el.scrollTop;
			}
		}
		return p;
	},
	getPageSize : function () {
		var d = document, w = window, iebody = d.compatMode && d.compatMode != 'BackCompat' 
			? d.documentElement : d.body;	
		
		
		var b = d.body;
		var xScroll = (w.innerWidth && w.scrollMaxX) 
				? w.innerWidth + w.scrollMaxX : Math.max(b.scrollWidth, b.offsetWidth),
			yScroll = (w.innerHeight && window.scrollMaxY) 
				? w.innerHeight + w.scrollMaxY : Math.max(b.scrollHeight, b.offsetHeight),
			pageWidth = GRL.ie ? iebody.scrollWidth :
				(d.documentElement.clientWidth || self.innerWidth),
	      	pageHeight = GRL.ie ? Math.max(iebody.scrollHeight, iebody.clientHeight) : 
				(d.documentElement.clientHeight || self.innerHeight);
		
		var width = GRL.ie ? iebody.clientWidth : 
				(d.documentElement.clientWidth || self.innerWidth),
			height = GRL.ie ? iebody.clientHeight : self.innerHeight;
		
		return {
			pageWidth: Math.max(pageWidth, xScroll),
			pageHeight: Math.max(pageHeight, yScroll),
			width: width,
			height: height,		
			scrollLeft: GRL.ie ? iebody.scrollLeft : pageXOffset,
			scrollTop: GRL.ie ? iebody.scrollTop : pageYOffset
		}
	},
	
	alerting : function () {
		//GRL.dimmer.style.top = 
		if (GRL.container_loader) {
			var page = GRL.getPageSize();
			//GRL.dimmer.innerHTML = '<div style="background:green;">'+ page.scrollTop +'</div>';
			//$(GRL.container_loader).style.top = page.scrollTop;
			var obgecti = document.getElementById(GRL.container_loader);
			obgecti.innerHTML = GRL.dimmingInnerHTML;
			obgecti.style.marginTop = page.scrollTop;
		}
	},
	
	
	
	dim : function() {
		if (!GRL.dimmer) {
			GRL.dimmer = GRL.createElement ('div', 
				{ 
					className: 'dimming_',
					owner: ''//,
					//onclick: function() {GRL.close();}
				}, 
				{
					position: 'absolute',
					left: 0, 
					top: 0, 
					width: '100%', 
					zIndex: 1000,
					background: 'black',
					direction: 'ltr'
				}, document.body, true);
			GRL.addEventListener(window, 'resize', GRL.setDimmerSize);
			
		}
		
		GRL.addEventListener(window, 'scroll', GRL.alerting);
		GRL.dimmer.innerHTML = this.dimmingInnerHTML;
		GRL.dimmer.style.display = '';
		GRL.setDimmerSize();
		GRL.alerting();
		if (GRL.geckoMac && GRL.dimmingGeckoFix) 
			GRL.dimmer.style.background = 'url('+ GRL.graphicsDir + 'geckodimmer.png)';		
		else
			GRL.fade(GRL.dimmer, 0, GRL.dimmingOpacity, GRL.dimmingDuration);
		this.doShowHide('hidden');
	},
	undim : function(key) {
		if (!GRL.dimmer) return;
		if (typeof key != 'undefined') GRL.dimmer.owner = GRL.dimmer.owner.replace('|'+ key, '');
		
		if (
			(typeof key != 'undefined' && GRL.dimmer.owner != '')
			|| (GRL.upcoming && GRL.getParam(GRL.upcoming, 'dimmingOpacity'))
		) return;
		if (GRL.geckoMac && GRL.dimmingGeckoFix) 
			GRL.dimmer.style.background = 'none';
		else GRL.fade(GRL.dimmer, GRL.dimmingOpacity, 0, GRL.dimmingDuration, function() {
			GRL.setStyles(GRL.dimmer, { display: 'none', width: 0, height: 0 });
		});
		this.doShowHide('visible');
	},
	setDimmerSize : function(exp) {
		if (!GRL.dimmer) return;
		var page = GRL.getPageSize();
		var h = (GRL.ie && exp && exp.wrapper) ? 
			parseInt(exp.wrapper.style.top) + parseInt(exp.wrapper.style.height)+ (exp.outline ? exp.outline.offset : 0) : 0; 
		GRL.setStyles(GRL.dimmer, { 
			width: page.pageWidth +'px', 
			height: Math.max(page.pageHeight, h) +'px'
		});
	},
	
	
	
	addEventListener : function (el, event, func) {
		try {
			el.addEventListener(event, func, false);
		} catch (e) {
			try {
				el.detachEvent('on'+ event, func);
				el.attachEvent('on'+ event, func);
			} catch (e) {
				el['on'+ event] = func;
			}
		} 
	},
	

	fade : function (el, o, oFinal, dur, fn, i, dir) {
		if (typeof i == 'undefined') { // new fader
			if (typeof dur != 'number') dur = 250;
			if (dur < 25) { // instant
				GRL.setStyles( el, { opacity: oFinal	});
				return;
			}
			i = GRL.faders.length;
			dir = oFinal > o ? 1 : -1;
			var step = (25 / (dur - dur % 25)) * Math.abs(o - oFinal);
		}
		o = parseFloat(o);
		var skip = (el.fade === 0 || el.fade === false || (el.fade == 2 && GRL.ie));
		el.style.visibility = ((skip ? oFinal : o) <= 0) ? 'hidden' : 'visible';
		if (skip || o < 0 || (dir == 1 && o > oFinal)) {
			if (fn) fn();
			return;
		}
		if (el.fading && el.fading.i != i) {
			clearTimeout(GRL.faders[el.fading.i]);
			o = el.fading.o;
		}
		el.fading = {i: i, o: o, step: (step || el.fading.step)};
		el.style.visibility = (o <= 0) ? 'hidden' : 'visible';
		GRL.setStyles(el, { opacity: o });
		GRL.faders[i] = setTimeout(function() {
			GRL.fade(el, o + el.fading.step * dir, oFinal, null, fn, i, dir);
		}, 25);
	},
	
	close : function(el) {
		var exp = GRL.getExpander(el);
		if (exp) exp.close();
		return false;
	},
	
	
	
	// on end move and resize
	doShowHide : function(visibility) {
		GRL.hideSelects = (GRL.ie && GRL.ieVersion() < 7);
		GRL.hideIframes = ((window.opera && navigator.appVersion < 9) || navigator.vendor == 'KDE' || (GRL.ie && GRL.ieVersion() < 5.5));
		
		if (GRL.hideSelects) this.showHideElements('SELECT', visibility);
		if (GRL.hideIframes) this.showHideElements('IFRAME', visibility);
		if (GRL.geckoMac) this.showHideElements('*', visibility);
	},
	showHideElements : function (tagName, visibility) {
		var els = document.getElementsByTagName(tagName);
		var prop = tagName == '*' ? 'overflow' : 'visibility';
		for (var i = 0; i < els.length; i++) {
			if (prop == 'visibility' || (document.defaultView.getComputedStyle(els[i], "").getPropertyValue('overflow') == 'auto' || els[i].getAttribute('hidden-by') != null)) {
				var hiddenBy = els[i].getAttribute('hidden-by');
				if (visibility == 'visible' && hiddenBy) {
					hiddenBy = hiddenBy.replace('['+ this.key +']', '');
					els[i].setAttribute('hidden-by', hiddenBy);
					if (!hiddenBy) els[i].style[prop] = els[i].origProp;
				} else if (visibility == 'hidden') { // hide if behind
					var elPos = GRL.getPosition(els[i]);
					elPos.w = els[i].offsetWidth;
					elPos.h = els[i].offsetHeight;
					if (!this.dimmingOpacity) { // hide all if dimming
						var clearsX = (elPos.x + elPos.w < this.x.get('opos') 
							|| elPos.x > this.x.get('opos') + this.x.get('osize'));
						var clearsY = (elPos.y + elPos.h < this.y.get('opos') 
							|| elPos.y > this.y.get('opos') + this.y.get('osize'));
					}
					
					if (!clearsX && !clearsY) { // element falls behind image
						if (!hiddenBy) {
							els[i].setAttribute('hidden-by', '['+ this.key +']');
							els[i].origProp = els[i].style[prop];
							els[i].style[prop] = 'hidden';
						} else if (!hiddenBy.match('['+ this.key +']')) {
							els[i].setAttribute('hidden-by', hiddenBy);
						}
					}
					
				}
			}
		}
	}
	
	
}
