// bytefx presentation page (C) Andrea Giammarchi
function getElementsByClass(etype, className){
	var	result = [],
		re = new RegExp("(^|\\s)" + className + "(\\s|$)"),
		elements = document.getElementsByTagName(etype),
		i = elements.length;
	while(i--) {
		if(re.test(elements[i].className))
			result.push(elements[i]);
	};
	result.reverse();
	return result;
};
if((window.opera && window.opera.version() > 7) || !/msie 5.0|msie 4/i.test(navigator.userAgent)) {
	bytefx.$event(window, "onload", function() {
		var	bg = "backgroundColor",
			section = getElementsByClass("DIV", "clear"),
			//footer = document.getElementById("footer"),
			footer = document.getElementById("footer"),
			menu = getElementsByClass("A", "menu"),
			api = getElementsByClass("DIV", "api"),
			//faq = document.getElementById("faq").getElementsByTagName("LI"),
			open = document.location.href.split("#"),
			h3 = null,
			lastview = null,
			lastscroll = null,
			element = null,
			index = 0,
			i = menu.length;
		while(i--) {
			bytefx.$event(menu[i], "onmouseover", function(){
                if (this.style.backgroundColor != '#dddddd') {
                    bytefx.color(this, bg, "#f5f5f5", "#999999", 5)
                }
                });
			bytefx.$event(menu[i], "onclick", function(){bytefx.color(this, bg, "#f5f5f5", "#999999", 5)});
			/*   */
            bytefx.$event(menu[i], "onmouseout", function(){
                //alert(this.style.backgroundColor);

    			if (navigator.appName.indexOf("Netscape")!=-1&&parseInt(navigator.appVersion)>=5) {
                    if (this.style.backgroundColor != 'rgb(221, 221, 221)') {
                        bytefx.color(this, bg, "#999999", "#f5f5f5", 5)
                    }
    			}
    			else if (navigator.appName.indexOf("Microsoft")!=-1&&parseInt(navigator.appVersion)>=4) {
                    if (this.style.backgroundColor != '#dddddd') {
                        bytefx.color(this, bg, "#999999", "#f5f5f5", 5)
                    }
    			}
            });
            
   menu[i].onclick = function(){
                //alert(this.href);

                // highlight me
                //function() {alert('aa');};
				function show() {
                    //bytefx.color(menu[i], bg, "#999999", "#999999", 5);
					bytefx.alpha(section, 0);
					section.className = "clear";
                    showImage();


					//bytefx.fade(section, 0, 100, 2, function(){bytefx.fade(footer, 0, 30, 4)});
					lastview = section;

                    // For IE, <DIV> <DIV> is direct children
                    // Firefox thinks the space is a text node, thus second div is 2nd child, not 1st child
                    childDIV = "";

                    if (section.firstChild.offsetHeight != undefined) {
                        childDIV =  section.firstChild;
                    }
                    else {
                        childDIV = section.childNodes[1];
                    }

                    //alert(childDIV.scrollHeight);
                    //alert(childDIV.offsetHeight);
                    //childDIV.offsetHeight


                    // this means scrollbar exists. had to hardcode the value
                    if (childDIV.scrollHeight>196){
                        // set to maximum height of 196
                        childDIV.style.height = "405px";
                        
                        // when text is a lot (that's why scrollbar is shown)
                        // set the big bg image to 30% opacity
                        //alert(1);
                        bytefx.fade(section, 0, 100, 2, function(){bytefx.fade(footer, 0, 100, 4,function(){bytefx.fade(footer, 100, 30, 2)})});
                        //bytefx.fade(section, 0, 100, 2, );
                        //bytefx.fade(section, 0, 100, 2, function(){bytefx.fade(footer, 0, 100, 4)});
                    }
                    else {
                        //Yeah
                        bytefx.fade(section, 0, 100, 2, function(){bytefx.fade(footer, 0, 100, 4)});
                    }
				};
				

				var	section = this.section, force = lastview !== null;
				if(lastview !== section) {
					if(force)
						bytefx.clear(lastview);  
					bytefx.fade(footer, (footer.style.opacity * 100 || 100), 0, 4, function(){
						if(force)
							bytefx.fade(lastview, (lastview.style.opacity * 100 || 100), 0, 4, function(){
								this.className = "hide";
								show();
							});
						else {
							show();
					    }
					});

				};

				// reset color of other menu
			    i = menu.length;
		        while(i--) {
                    menu[i].style.backgroundColor='#f5f5f5';
                }

                this.style.backgroundColor='#DDDDDD';
				this.blur();
				return false;
			};

			menu[i].section = section[i];
		};
		i = api.length;
		while(i--) {
			h3 = api[i].getElementsByTagName("H3");
			index = h3.length;
			while(index--) {
				bytefx.$event(h3.item(index), "onmouseover", function(){bytefx.color(this, bg, "#EFEFEF", "#FFF", 1)});
				bytefx.$event(h3.item(index), "onmouseout", function(){bytefx.color(this, bg, "#FFF", "#EFEFEF", 1)});
				bytefx.$event(h3.item(index), "onclick", function() {
					var	check = this.clicked;
					if(!this.div) {
						this.div = this.parentNode.getElementsByTagName("DIV").item(this.index);
						this.div.className = "";
						this.realheight = bytefx.$size(this.div).height;
						this.div.style.overflow = "hidden";
						this.div.style.height = "1px";
						this.div.className = "hide";
					};
					if(!check) {
						this.div.className = "";
						bytefx.size(this.div, {width:350, height:this.realheight}, 7);
					}
					else 
						bytefx.size(this.div, {width:350, height:1}, 24, function(){this.className = "hide"});
					this.clicked = !this.clicked;
					return false;
				});
				h3.item(index).index = index;
			}
		};
		/*
		i = faq.length;
		while(i--) {
			element = faq[i].getElementsByTagName("SPAN").item(0);
			element.referer = faq[i];
			element.style.cursor = "pointer";
			element.style.backgroundColor = "#EFEFEF";
			bytefx.$event(element, "onclick", function(){
				bytefx.scroll(this.referer, 5);
			});
		};
		*/
		if(open.length == 2) {
			api = ["introduction", "examples", "faq", "api", "download"];
			i = api.length;
			while(i--) {
				if(api[i] === open[1]) {
					menu[i].onclick();
					api = [];
					i = 0;
				}
			};
			if(api.length)
				menu[0].onclick();
		}
		else
			menu[0].onclick();
	});
	document.write('<style type="text/css" media="screen">.hide{display: none}</style>');
};