function getPageSize(){
		
		var xScroll, yScroll;
		
		if (window.innerHeight && window.scrollMaxY) {
			xScroll = document.body.scrollWidth;
			yScroll = window.innerHeight + window.scrollMaxY;
		} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
			xScroll = document.body.scrollWidth;
			yScroll = document.body.scrollHeight;
		} else if (document.documentElement && document.documentElement.scrollHeight > document.documentElement.offsetHeight){ // Explorer 6 strict mode
			xScroll = document.documentElement.scrollWidth;
			yScroll = document.documentElement.scrollHeight;
		} else { // Explorer Mac...would also work in Mozilla and Safari
			xScroll = document.body.offsetWidth;
			yScroll = document.body.offsetHeight;
		}
		
		var windowWidth, windowHeight;
		if (self.innerHeight) { // all except Explorer
			windowWidth = self.innerWidth;
			windowHeight = self.innerHeight;
		} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
			windowWidth = document.documentElement.clientWidth;
			windowHeight = document.documentElement.clientHeight;
		} else if (document.body) { // other Explorers
			windowWidth = document.body.clientWidth;
			windowHeight = document.body.clientHeight;
		}
		
		// for small pages with total height less then height of the viewport
		if(yScroll < windowHeight){
			pageHeight = windowHeight;
		} else {
			pageHeight = yScroll;
		}
		
		// for small pages with total width less then width of the viewport
		if(xScroll < windowWidth){
			pageWidth = windowWidth;
		} else {
			pageWidth = xScroll;
		}
		
		
		arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight)
		return arrayPageSize;
	}
sfHover = function() {
	var sfEls = document.getElementById("menuIcons").getElementsByTagName("LI");
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover";
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
		}
	}
	
	var ssfEls = document.getElementById("btnActies").getElementsByTagName("DIV");
	for (var i=0; i<ssfEls.length; i++) {
		ssfEls[i].onmouseover=function() {
			this.className+=" sfhover";
		}
		ssfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
		}
	}

}
if (window.attachEvent) window.attachEvent("onload", sfHover);

subHover = function() {
	var sfEls = document.getElementById("menuItems").getElementsByTagName("LI");
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover";
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
		}
	}
}

if (window.attachEvent) window.attachEvent("onload", subHover);


copyToClipBoard = function (field)
{
	var tempval=document.getElementById(field)
	tempval.focus();
	tempval.select();
	if (tempval.createTextRange) {
	    var range = tempval.createTextRange();
	    if (range && BodyLoaded==1)
	      range.execCommand('Copy');
	  } else {
	    var flashcopier = 'flashcopier';
	    if(!document.getElementById(flashcopier)) {
	      var divholder = document.createElement('div');
	      divholder.id = flashcopier;
	      document.body.appendChild(divholder);
	    }
	    document.getElementById(flashcopier).innerHTML = '';
	    var divinfo = '<embed src="http://stage.pepsi.nl/javascript/_clipboard.swf" FlashVars="clipboard='+encodeURIComponent(tempval.value)+'" width="0" height="0" type="application/x-shockwave-flash"></embed>';
	    document.getElementById(flashcopier).innerHTML = divinfo;
	  }

}

Ext.onReady(function() { 
	resizeId = 0;
	risizeState=[];
	risizeState[resizeId]=true;
	window.onresize =null;
	footerState='expanded';
	sliderState='collapsed';
	extend = ['shareText','widgetsTop'];
	lastMessageID=0;
	footerPosition='bottom';
	
	var lb = Ext.ux.Lightbox;
	lb.registerUrl("a.youtubeLink", 928, 581);
	lb.registerUrl("a.popupLink", 928, 581);
	
	widgetState=[];
	widgetBusy=false;
	
	
	widgetExtend = function(el)
	{
		if(widgetBusy==false)
		{
			widgetBusy=true;
			ele = Ext.fly('widget-'+el);
			img = document.getElementById("img-"+el);
			curH = ele.getHeight()
			
			if(isNaN(widgetState[el]))
			{
				widgetState[el] = curH;
			}
			
			if(curH >= widgetState[el])
			{
				ch = 15-curH;
				img.src = '/images/layout/ICON_greenplus.png'; 
			} else {
				ch = widgetState[el] -15;
				img.src = '/images/layout/ICON_greenminus.png'; 
			}
			
			ele.animate({
	    		height: {by: ch}
	    	},.4, function(){widgetBusy=false;}, 'easeOut', 'run');
		}
	}
	
	resizeSlider = function(d, ch)
	{
//		ele = Ext.fly('middleSlider');
//		
//		if(sliderState=='collapsed')
//		{
//			ch= 1 + ch;
//			sliderState = 'expanded';
//			ele.insertHtml('beforeEnd','<iframe id="iframe" name="iframe" src="" frameborder="0" border="0" style="height: 100%; width: 100%; border:0; margin:0; padding:0;"></iframe>');
//		}else {
//			ch= 1 - ele.getHeight();
//			sliderState = 'collapsed';
//			Ext.fly('iframe').remove();
//		}
//		ele.animate({
//	    	height: {by: ch, unit:'px'}
//	    },d, null, 'easeOut', 'run');
		
	}
	
	divExtend = function(el, dir, nh, oh, dur)
	{
		ele = Ext.fly(el);
		if(extend[el] !='extended' && extend[el] !='normal') {extend[el] ='normal';}
		
		if(extend[el] =='normal')
		{
			extend[el] ='extended';
		} else {
			nh=oh;
			extend[el] ='normal';
		}
		if(dir=='width')
		{
			ele.animate({
				    		width: {to: nh, from: ele.getWidth()}
				    	},dur, null, 'easeOut', 'run');
			
			
		} else if(dir=='height')
		{
			ele.animate({
	    		width: {to: nh, from: ele.getWidth()}
	    	},dur, null, 'easeOut', 'run');
			
		} 
	}
	
	boxScroll = function(el, dir, distance)
	{
			ele = Ext.fly(el);
			if(dir=='down')
			{
				ScrolV = distance;
			} else if(dir=='up')
			{
				ScrolV = 0-distance;
			} else {
				ScrolV = 0;
			}
			
			if(dir=='left')
			{
				ScrolH = distance;
			} else if(dir=='right')
			{
				ScrolH = 0-distance;
			} else {
				ScrolH = 0;
			}
			ele.animate( 
					{
				    	scroll: {by: [ScrolH,ScrolV]}
				    },0.8, null, 'easeOut', 'scroll'    );
			

	}
	
	loadItem = function (type, item){
		
		/*if(sliderState=='collapsed')
		{
			openItem();
		}
		
		if(type=='hyves')
		{
			color='#01d4ff';
		} else if (type=='facebook')
		{
			color='#3B5998';
		} else if (type=='paintball')
		{
			color='#005EA8';
		} else if (type=='youtube')
		{
			color='#fff';
		} else {
			color='none';
		}
		
		Ext.fly('sliderTopFill').setStyle('background',color);
		if(navigator.appName == "Microsoft Internet Explorer")
		{
			Ext.fly('iframe').remove();
			Ext.fly('middleSlider').insertHtml('beforeEnd','<iframe id="iframe" name="iframe" src="" frameborder="0" border="0" style="height: 100%; width: 100%; border:0; margin:0; padding:0;"></iframe>');
			window.frames['iframe'].document.location.href = item
		} else {
			var iframe = document.getElementById("iframe");
			iframe.src = item; 
		}*/
		
		window.open(item,type);
	}
	
	loadMessages = function(data,el) {
		
		Ext.get(el).remove();
		Ext.get("messageBox").insertHtml("afterBegin",'<ul id="boxItems"></ul>');
		messagesbox = Ext.get(el);
		first=true;
		
		if(first==true)
		{
			if(data['lastID'] >= 1 && data['lastID'] >=lastMessageID)
			{
				lastMessageID = data['lastID'];
			}
			first=false;
		}
		
		var highlite = true;
		var highliteCSS = null;
		var i = 0;
		for (var key in data)
		{
				if(data[key]['screen_name'] != 'undefined' && data[key]['content'] != 'undefined'  && key !='count' && key !='remove' && key !='indexOf' && key !='undefined' && key !='lastID')
				{
					if(data[key]['source'] =='hyves' || data[key]['source'] =='facebook' || data[key]['source'] =='twitter')
					{
						i=i+1;
						var epoch = data[key]['timestamp'] * 1000;
						var postdate=new Date(epoch);
						var today = new Date();
						
						today2 = today.getTime();
						postdate2 = postdate.getTime(); 
						
						diff = Math.round((today2-postdate2)/1000);
						var m_names = new Array("januari", "februari", "maart", 
								"april", "mei", "juni", "july", "augustus", "september", 
								"oktober", "november", "december");
	
						if(diff <60){
							dates ="Een minuut geleden";
						} else if(diff < 3600) {
							dates = Math.round(diff/60) + " minuten geleden";
						} else if(diff < 86400){
							dates = Math.round(diff/3600) + " uren geleden";
						} else { 
							mins = postdate.getMinutes();
							if(mins<10){
								mins = '0'+mins;
							}
							dates = " op " + postdate.getDate() + " " + m_names[postdate.getMonth()] + ", " + postdate.getHours() + ":" + mins;
						}
						
						if(highlite) {
							highliteCSS = ' highlite';
							highlite = false;
						}
						else {
							highliteCSS = '';
							highlite = true;
						}
						if(data[key]['content'].length > 180)
						{
		
							hover = "<div id='hover-"+i+"' class='fullMessage'>" +
							"<div class='mgs_content' id='message-"+i+"'><img src='"+data[key]['img_location']+"' class='msg_profile' /> <img class='overlay_icon_hover' src='/images/" + data[key]['source'] + "_overlay.png'>"+data[key]['content'] + 
							"<br /><div class='itemsFooter'>" +
								"<a onClick=\"loadItem('"+data[key]['source']+"','" + data[key]['url'] + "')\" href='#' >" + data[key]['screen_name'] + "</a> " +
								dates +
							"</div>"+ "</div></div>";
							text = data[key]['content'].substr(0,180)+"...";
						} else {
							hover = "<div id='hover-"+i+"' class='fullMessage'>" +
							"<div class='mgs_content' id='message-"+i+"'><img height='70' src='"+data[key]['img_location']+"' class='msg_profile' /> <img class='overlay_icon_hover' src='/images/" + data[key]['source'] + "_overlay.png'>"+data[key]['content'] + 
							"<br /><div class='itemsFooter'>" +
								"<a onClick=\"loadItem('"+data[key]['source']+"','" + data[key]['url'] + "')\" href='#' >" + data[key]['screen_name'] + "</a> " +
								dates +
							"</div>"+ "</div></div>";
							text = data[key]['content'];
						}
						
						html ="<li id='limsg-"+i+"' class='items"+data[key]['source']+highliteCSS+"'>"+hover +  
						text + 
							"<div class='itemsFooter'>" +
								"<a onClick=\"loadItem('"+data[key]['source']+"','" + data[key]['url'] + "')\" href='#' >" + data[key]['screen_name'] + "</a> " +
								dates +
							"</div>"+ 
						"</li>";
						messagesbox.insertHtml('afterBegin',html);
						hvrH = Ext.get("message-"+i).getHeight();
						if(hvrH < 75)
						{
							hvrH = 75;
							Ext.get("message-"+i).setStyle('height', '75px');
						}
						newHeight = Ext.get("hover-"+i).getHeight();
						
						Ext.get("limsg-"+i).addListener("mouseover", function(evt, el, o){
									elid = ""+el.id+"";
									elids = elid.split("-");
									//alert(elids[0]);
									if(elids[0]=='message')
									{
										tempH = Ext.get(el).getHeight();  
										if(tempH < 85)
										{
											tempH = 85;
										}
										
										this.addClass("sfhover_msg");
										this.setStyle('height',tempH+'px');
									}
						});
						
						Ext.get("hover-"+i).on("mouseout", function(evt, el, ol){this.removeClass("sfhover_msg");  this.setStyle('height','auto');});
						Ext.get("limsg-"+i).on("mouseleave", function(evt, el, ol){this.removeClass("sfhover_msg");  this.setStyle('height','auto');});
						
					} 
				} 
		}
	} 
	
	parseMessages = function(response, opts) {
	      var obj = Ext.decode(response.responseText);
	      loadMessages(obj,'boxItems');
	}
	
	parseProfiles = function(response, opts) {
	      var obj = Ext.decode(response.responseText);
	      loadProfiles(obj);
	}
	
	
	loadProfiles = function(data) {
		profilebox = Ext.get('profilesItemsBox');
		for (var key in data)
		{
				if(data[key]['screen_name'] != 'undefined' && data[key]['img_location'] != 'undefined' && data[key]['img_location'] != ''  && key !='count' && key !='remove' && key !='indexOf' && key !='undefined')
				{
					if(data[key]['source'] =='twitter' || data[key]['source'] =='hyves' || data[key]['source'] =='facebook')
					{
						html ="<div class='profiles"+data[key]['source']+"'><a onClick=\"loadItem('"+data[key]['source']+"','" + data[key]['url'] + "')\" href='#' ><img src='" + data[key]['img_location'] + "'>" +
								"<img class='overlay_icon' src='/images/" + data[key]['source'] + "_overlay.png'><img src='/images/profile_overlay_"+footerType+".png'></a></div>";
					
						profilebox.insertHtml('afterBegin',html);
					}
				}
		}
	}
	
	
	
	fillSlider = function(minus) {
		
//		if(sliderState=='expanded')
//		{
//			sizes = getPageSize();
//			sliderheight = (sizes[3] - 57 - minus);
//			
//		} else {
//			sliderheight=1;
//		}
//		
//		Ext.fly('middleSlider').setHeight(sliderheight,false);
	}
	
	fillFlash = function() {
		flashHeight = getPageSize();
		if(footerPosition=='top')
		{
			Ext.fly('middleFlash').setHeight(flashHeight[3],false);
			Ext.fly('rootContainer').setHeight(flashHeight[3],false);
			flashHeight = getPageSize();
			nh = flashHeight[1];
		} else {
			nh = flashHeight[3];
		}

		Ext.fly('middleFlash').setHeight(nh,false);
		Ext.fly('rootContainer').setHeight(nh,false);
	}
	
	setInterval("message_fetcher();",60000);
	
});