// global variables
var li = null;
var h2 = null;
var IE = /*@cc_on!@*/false;

// eventhandler for domonload
var onDOMload=function() {
  if(arguments.callee.done) return;
  arguments.callee.done=true;
  if(_timer) clearInterval(_timer);
  
	// add functions that should run on dom load
	productListing()
};

/*@cc_on
@if (@_win32 || @_win64)
if(document.getElementById){
    document.write("<script id=\"ieScriptLoad\" defer src=\"//:\"><\/script>");
    document.getElementById("ieScriptLoad").onreadystatechange=function(){if(this.readyState=="complete"){onDOMload()}};
}
@end @*/
if(document.addEventListener){document.addEventListener("DOMContentLoaded",onDOMload,false)};
if(/KHTML|WebKit|iCab/i.test(navigator.userAgent)){var _timer=setInterval(function(){if(/loaded|complete/.test(document.readyState)){onDOMload()}},10)}
window.onload=onDOMload;


// shortcut for get elemeny by id
var $ = function(elm) { return document.getElementById(elm); }

var getElementsByClassName = function(oElm, strTagName, strClassName){
	if (oElm.getElementsByClassName) {
		return oElm.getElementsByClassName(strClassName);
	} else {
		var arrElements=(strTagName == '*' && oElm.all)? oElm.all : oElm.getElementsByTagName(strTagName);
		var arrReturnElements=new Array();
		strClassName=strClassName.replace(/\-/g, '\\-');
		var oRegExp = new RegExp('(^|\\s)' + strClassName + '(\\s|$)');
		var oElement;
		for(var i=0, il=arrElements.length; i<il; i++){
			oElement=arrElements[i];
			if(oRegExp.test(oElement.className)){
				arrReturnElements.push(oElement);
			}
		}
		return (arrReturnElements)
	}
};


// eventhandler for adding events to objects
function addEvent(obj, type, fn){
	if (obj.addEventListener){
		obj.addEventListener(type, fn, false);
		EventCache.add(obj, type, fn);
	}else if(obj.attachEvent){
		obj["e"+type+fn] = fn;
		obj[type+fn]=function(){obj["e"+type+fn](window.event);}
		obj.attachEvent("on"+type, obj[type+fn]);
		EventCache.add(obj, type, fn);
	}else{
		obj["on"+type]=obj["e"+type+fn];
	}
}
var EventCache = function(){
	var listEvents=[];
	return {
		listEvents: listEvents,
		add: function(node, sEventName, fHandler){
			listEvents.push(arguments);
		},
		flush: function(){
			var i, item;
			for(i = listEvents.length - 1; i >= 0; i = i - 1){
				item=listEvents[i];
				if(item[0].removeEventListener){item[0].removeEventListener(item[1], item[2], item[3]);};
				if(item[1].substring(0, 2) != "on"){item[1] = "on" + item[1];};
				if(item[0].detachEvent){item[0].detachEvent(item[1], item[2]);};
				item[0][item[1]] = null;
			};
		}
	};
}();


// check if object has a function event attached
var hasFunctionEvent = function(obj,eventhandler){
	if(!obj.attributes) return false;
	var n = obj.attributes.length;
	for(var x=0; x<n; x++){
		var strEvent = 'e'+ eventhandler +'function';
		if(obj.attributes[x].nodeName.indexOf(strEvent) != -1){
			return (obj.attributes[x].value?true:false);
		}
	}
};

var productInfoTxt = '<p>F&ouml;r musen &ouml;ver en bild f&ouml;r mer info om produkten.</p>';

var productListing = function() {
    var pl = $('productlisting');
    if (pl != null) {
	    var p = $('productlisting').getElementsByTagName('p');
	
	    for (var i=0, il=p.length; i<il; i++) {
		    li = p[i].parentNode;
		    h2 = li.getElementsByTagName('h2')[0];
		    li.style.cursor = 'pointer';
		    h2.style.display = 'none';
		    addEvent(li, 'mouseover', product.Show);
		    addEvent(li, 'mouseout', product.Hide);
		    p[i].style.display = 'none';
		    if (p[i].className == 'thumb') p[i].style.display = 'block';
	    }
	    
	    var productInfoDiv = document.createElement('div');
		var divId = document.createAttribute('id');
			divId.nodeValue = 'productinfo';
			productInfoDiv.setAttributeNode(divId);
			insertAfter(productInfoDiv, pl);
	}
}

var product = {
	Show: function() {
		var content = $('content');
		var productListing = $('productlisting');
		var section = $('section');
		var li = this;
		var p = li.getElementsByTagName('p');
		var smallImg = li.getElementsByTagName('img')[1];
		var pInfo = $('p-info');
		
		for (var i=0, il=p.length; i<il; i++) {
			if (p[i].className == 'thumb') p[i].style.display = 'block';
		}
		
		var productInfo = $('productinfo');
			productInfo.innerHTML = '<img src=\"' + smallImg.src + '\" alt=\"\" /><div>' + p[1].innerHTML + '</div>';
			
			//pInfo.style.display = 'none';
			//productListing.style.marginBottom = '27px';
			
			//if (IE) productListing.style.marginBottom = '0';
			//if (typeof(document.body.style.maxHeight) == 'undefined') productListing.style.paddingBottom = '34px';
			
		productInfo.style.display = 'block';
		section.style.display = 'none';
		content.insertBefore(productInfo, productListing);
	},
	Hide: function() {
		var section = $('section');
		var productListing = $('productlisting');
		var productInfo = $('productinfo');
		var li = this;
		var p = li.getElementsByTagName('p');
		var pInfo = $('p-info');
		
		for (var i=0, il=p.length; i<il; i++) {
			p[i].style.display = 'none';
			if (p[i].className == 'thumb') p[i].style.display = 'block';
		}
			
			pInfo.style.display = 'block';
			productListing.style.paddingBottom = '0';
			productInfo.style.display = 'none';
			section.style.display = 'block';
	}
}

// insert content directly after given element
function insertAfter(newElement,targetElement) {

	var parent = targetElement.parentNode; // look for target element's parent
	
	if(parent.lastchild == targetElement) { // if the parents last child is the target element
		parent.appendChild(newElement); // add the new element after the target element
	} else {
		parent.insertBefore(newElement, targetElement.nextSibling); // the target has siblings, insert the new element between the target and it's next sibling
	}
}