/*
 * Ext JS Library 2.1
 * Copyright(c) 2006-2008, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */
var categories_slider;
var makes_slider;
var converted_subCategoryId
var slider1_1;
var slider1_2;
Ext.onReady(function(){

	Ext.BLANK_IMAGE_URL = '/js/ext-2.2/resources/images/default/s.gif';
	Ext.SSL_SECURE_URL = '/js/ext-2.2/resources/images/default/s.gif';

	categories_slider = new Ext.Slider({
        renderTo: 'basic-slider',
        width: 861,
        minValue: 0,
        maxValue: 100
    });


	if(document.getElementById("categories-content").offsetWidth < 949) {
		categories_slider.disable();
	}

	categories_slider.on('change',function() {
		document.getElementById("categories-content").style.left = "-"+(this.getValue()*(document.getElementById("categories-content").offsetWidth - 950)/100)+"px";
	})

	makes_slider = new Ext.Slider({
        renderTo: 'makes-slider',
        width: 461,
        minValue: 0,
        maxValue: 100
    });

	makes_slider.on('change',function() {
		if(document.getElementById("makes-content").offsetWidth > 550) {
			document.getElementById("makes-content").style.left = "-"+(this.getValue()*(document.getElementById("makes-content").offsetWidth - 550)/100)+"px";
		}
	})

});



function loadSubCategories(mainCategoryId, subCategoryId) {
   Ext.get("subcategories-list").load({
        url: "/app/catalog.do",
        scripts: true,
        params: {
				action: 'ShowSubCategories',
				mainCategoryId: mainCategoryId
				},
        text: document.getElementById("loading-small").innerHTML,
		callback: function (success) {
			if(success) {
				if(subCategoryId == '') {
					document.getElementById("range-container").innerHTML = "";
				}
				document.getElementById("subcategories").className = "transp100";
				if(subCategoryId != '') {
					converted_subCategoryId.setValue(subCategoryId);
				}
			}
		}
   });

}

function highlightCategoryIcon(categoryIcon) {
	var categoryIcons = document.getElementById('categories-content').getElementsByTagName('div');
	for(var i=0;i<categoryIcons.length;i++){
		categoryIcons[i].className = "category-nohighlight"
	}
	categoryIcon.className = "category-highlight";
}

function loadMakesByCategory(mainCategoryId) {
   document.getElementById("makes-content").style.paddingTop = "18px";
   document.getElementById("makes-content").style.width = "550px";
   Ext.get("makes-content").load({
        url: "/app/catalog.do",
        scripts: true,
        params: {
				action: 'ShowMakesByCategory',
				mainCategoryId: mainCategoryId
				},
        text: document.getElementById("loading").innerHTML,
		callback: function (success) {
			if(success) {
				document.getElementById("makes-content").style.paddingTop = "0px";
				document.getElementById("makes-content").style.width = "auto";
				document.getElementById("makes-content").style.left = "0px";
				document.getElementById("makes-bar").className = "transp100";
				document.getElementById("makes-slider").className = "transp100";
				makes_slider.setValue(0, true);
			}
		}
   });
}

function loadMakesBySubCategory(mainCategoryId, subCategoryId, makeId) {
	if(subCategoryId != null && subCategoryId != "") {
		document.getElementById("makes-content").style.paddingTop = "18px";
		document.getElementById("makes-content").style.width = "550px";
		var urlStart = "action=ShowMakesBySubCategory";
		urlStart += "&mainCategoryId="+mainCategoryId + "&subCategoryId="+subCategoryId + "&makeId="+makeId+"&sortingList=13&sortingList=5&minPrice=0&maxPrice=0";
		Ext.get("makes-content").load({
			url: "/app/catalog.do",
			scripts: true,
			params: urlStart,
			text: document.getElementById("loading").innerHTML,
			callback: function (success) {
				if(success) {
					document.getElementById("makes-content").style.paddingTop = "0px";
					document.getElementById("makes-content").style.width = "auto";
					document.getElementById("makes-content").style.left = "0px";
					document.getElementById("makes-bar").className = "transp100";
					document.getElementById("makes-slider").className = "transp100";
					makes_slider.setValue(0, true);

					if(makeId == '-1') {
						var makeIcons = document.getElementById('makes-content').getElementsByTagName('div');
						for(var i=0;i<makeIcons.length;i++){
							makeIcons[i].className = "make-nohighlight";
						}
						document.getElementById('make_all').className = "make-highlight";
					} else {
						highlightMakeIcon(document.getElementById('make'+makeId));
						if(document.getElementById("makes-content").offsetWidth > 550) {
							if( (document.getElementById('cellmake'+makeId).offsetLeft/document.getElementById("makes-content").offsetWidth)*100 > 80 ) {
									makes_slider.setValue(100, true);
							} else {
								makes_slider.setValue((document.getElementById('cellmake'+makeId).offsetLeft/document.getElementById("makes-content").offsetWidth)*100, true);
							}
						}
					}
				}
			}
		});
	}
}

function highlightMakeIcon(makeIcon) {
	var makeIcons = document.getElementById('makes-content').getElementsByTagName('div');
	for(var i=0;i<makeIcons.length;i++){
		makeIcons[i].className = "make-nohighlight"
	}
	makeIcon.className = "make-highlight";
}

function loadOffersByCategory(mainCategoryId) {
	document.getElementById("list").style.width = "930px";
	Ext.get("list").load({
		url: "/app/catalog.do",
		scripts: true,
		params: {
				action: 'ShowOffersByCategory',
				mainCategoryId: mainCategoryId
				},
		text: document.getElementById("loading").innerHTML,
		callback: function (success) {
			if(success) {
				//document.getElementById("list").style.width = "auto";
			}
		}
	});
}

function loadProductsBySubCategory(mainCategoryId, subCategoryId, makeId, minPrice, maxPrice, startIndex, endIndex) {
	if(subCategoryId != null && subCategoryId != "") {
		document.getElementById("list").style.width = "930px";
		var urlStart = "action=ShowProductsBySubCategory";
		urlStart += "&mainCategoryId="+mainCategoryId + "&subCategoryId="+subCategoryId + "&makeId="+makeId + "&sortingList=13&sortingList=5" + "&minPrice="+minPrice + "&maxPrice="+maxPrice + "&startIndex="+startIndex + "&endIndex="+endIndex;
		Ext.get("list").load({
			url: "/app/catalog.do",
			scripts: true,
			params: urlStart,
			text: document.getElementById("loading").innerHTML,
			callback: function (success) {
				if(success) {

				}
			}
		});
	}
}

function loadProductsByCategory(mainCategoryId, subCategories, makeId, minPrice, maxPrice, startIndex, endIndex) {
	if(subCategories != null) {
		document.getElementById("list").style.width = "930px";
		var urlStart = "action=ShowProductsByCategory";
		for (i=0; i < subCategories.length; i++) {
			urlStart += "&subCategoryId="+subCategories[i];
		}
		urlStart += "&mainCategoryId="+mainCategoryId + "&makeId="+makeId + "&sortingList=13&sortingList=5" + "&minPrice="+minPrice + "&maxPrice="+maxPrice + "&startIndex="+startIndex + "&endIndex="+endIndex;
		Ext.get("list").load({
			url: "/app/catalog.do",
			scripts: true,
			params: urlStart,
			nocache: true,
			text: document.getElementById("loading").innerHTML,
			callback: function (success) {
				if(success) {

				}
			}
		});
	}
}

function loadPriceRange(mainCategoryId, subCategoryId, makeId, minPrice, maxPrice, startIndex, endIndex) {
	if(subCategoryId != null && subCategoryId != "") {
		var urlStart = "action=ShowPriceRangeBySubCategory";
		urlStart += "&mainCategoryId="+mainCategoryId + "&subCategoryId="+subCategoryId + "&makeId="+makeId + "&sortingList=13&sortingList=5" + "&minPrice="+minPrice + "&maxPrice="+maxPrice + "&startIndex="+startIndex + "&endIndex="+endIndex;
		Ext.get("range-container").load({
			url: "/app/catalog.do",
			scripts: true,
			params: urlStart,
			text: document.getElementById("loading-small").innerHTML,
			callback: function (success) {
				if(success) {
					
				}
			}
		});
	}
}

function loadMakesByPriceRange(mainCategoryId, subCategoryId, makeId, minPrice, maxPrice, startIndex, endIndex) {
	if(subCategoryId != null && subCategoryId != "") {
		document.getElementById("makes-content").style.paddingTop = "18px";
		document.getElementById("makes-content").style.width = "550px";
		var urlStart = "action=ShowMakesByPriceRange";
		urlStart += "&mainCategoryId="+mainCategoryId + "&subCategoryId="+subCategoryId + "&makeId="+makeId + "&sortingList=13&sortingList=5" + "&minPrice="+minPrice + "&maxPrice="+maxPrice + "&startIndex="+startIndex + "&endIndex="+endIndex;
		Ext.get("makes-content").load({
			url: "/app/catalog.do",
			scripts: true,
			params: urlStart,
			text: document.getElementById("loading").innerHTML,
			callback: function (success) {
				if(success) {
					document.getElementById("makes-content").style.paddingTop = "0px";
					document.getElementById("makes-content").style.width = "auto";
					document.getElementById("makes-content").style.left = "0px";
					document.getElementById("makes-bar").className = "transp100";
					document.getElementById("makes-slider").className = "transp100";
					makes_slider.setValue(0, true);

					var makeIcons = document.getElementById('makes-content').getElementsByTagName('div');
					if(makeId == '-1') {
						for(var i=0;i<makeIcons.length;i++){
							makeIcons[i].className = "make-nohighlight";
						}
						document.getElementById('make_all').className = "make-highlight";
					}
				}
			}
		});
	}
}

function loadPage(url) {
		document.getElementById("panel").style.visibility = 'visible';
		document.getElementById("panel-container").style.height = document.body.offsetHeight + "px";
		window.scrollTo(0,0);
		Ext.get("content-container").load({
		url: url,
		scripts: true,
		text: document.getElementById("loading").innerHTML,
		nocache: true,
		callback: function (success) {
			if(success) {
				if(document.getElementById("panel-inside").offsetHeight + 60 > document.body.offsetHeight) {
					if(document.getElementById("body-holder").offsetHeight > document.getElementById("panel-inside").offsetHeight) {
						document.getElementById("panel-container").style.height = document.getElementById("body-holder").offsetHeight + 60 + "px";
					} else {
						document.getElementById("panel-container").style.height = document.getElementById("panel-inside").offsetHeight + 60 + "px";
					}
				} else {
					if(document.getElementById("body-holder").offsetHeight > document.body.offsetHeight) {
						document.getElementById("panel-container").style.height = document.getElementById("body-holder").offsetHeight + "px";
					} else {
						document.getElementById("panel-container").style.height = document.body.offsetHeight + "px";
					}
				}		
			}
		}
	});
}

function hidePanel() {
	document.getElementById("panel-container").style.height = "30px";
	document.getElementById("content-container").innerHTML = "";
	document.getElementById("panel").style.visibility = 'hidden';
}

function hideBigOffer() {
	Ext.get("rightbar-content").slideOut('l', 
		 { 
		 	duration: 0.5,
			useDisplay: true,
			callback: function (success) {
				document.getElementById("template").style.width = "1082px";
				document.getElementById("bigoffer-hide").style.display = "none";
				document.getElementById("bigoffer-show").style.display = "block";
			}
		 }
	);
	//document.getElementById("template").style.width = "1052px";
	//document.getElementById("bigoffer-content").style.display = "none";
}

function showBigOffer() {
	document.getElementById("template").style.width = "1250px";
	Ext.get("rightbar-content").slideIn('l', { duration: 0.5 });
	document.getElementById("bigoffer-show").style.display = "none";
	document.getElementById("bigoffer-hide").style.display = "block";
}

function replaceImage (imagePath, view) {
	document.images.productImage.src = imagePath;

	if(document.images.view1) {
		document.images.view1.src = "/images/common/view1-off.gif";
	}
	if(document.images.view2) {
		document.images.view2.src = "/images/common/view2-off.gif";
	}
	if(document.images.view3) {
		document.images.view3.src = "/images/common/view3-off.gif";
	}
	if(document.images.view4) {
		document.images.view4.src = "/images/common/view4-off.gif";
	}

	if(view == "view1") {
		document.images.view1.src = "/images/common/view1-on.gif";
	}
	if(view == "view2") {
		document.images.view2.src = "/images/common/view2-on.gif";
	}
	if(view == "view3") {
		document.images.view3.src = "/images/common/view3-on.gif";
	}
	if(view == "view4") {
		document.images.view4.src = "/images/common/view4-on.gif";
	}
}

function submitTAFForm () {
	var tafForm = new Ext.Updater("taf");
	tafForm.loadScripts = true;
	tafForm.disableCaching = true;
	tafForm.indicatorText = document.getElementById("loading-small").innerHTML;
	tafForm.formUpdate("tafForm");

}

function submitFormInCheckout (formName) {
	
	var checkoutForm = new Ext.Updater("content-container");
	checkoutForm.loadScripts = true;
	checkoutForm.disableCaching = true;
	checkoutForm.indicatorText = document.getElementById("loading").innerHTML;
	checkoutForm.formUpdate(formName);
	window.scrollTo(0,0);

}

function showHintInSearchFields() {
	if(document.getElementById("searchField").value == "") {
		document.getElementById("searchField").value = "Zoek hier uw product of merk";
		document.getElementById("searchField").style.color = "#999999";
		document.getElementById("searchField").style.fontSize = "10px";
	}
}

function hideHintInSearchFields() {
	if(document.getElementById("searchField").value == "Zoek hier uw product of merk") {
		document.getElementById("searchField").value = "";
		document.getElementById("searchField").style.color = "";
		document.getElementById("searchField").style.fontSize = "";
	}
}

function submitKeywordSearchForm () {
	hideHintInSearchFields();
	var searchForm = new Ext.Updater("list");
	searchForm.loadScripts = true;
	searchForm.disableCaching = true;
	searchForm.indicatorText = document.getElementById("loading").innerHTML;
	searchForm.formUpdate('searchForm');
}

function loadKeywordSearch (fullLink, pageNumber, pageSize) {
	document.getElementById("list").style.width = "930px";
	var urlStart = fullLink;
	urlStart += "&pageNumber="+pageNumber + "&pageSize="+pageSize;
	Ext.get("list").load({
		url: "/app/catalog.do",
		scripts: true,
		params: urlStart,
		text: document.getElementById("loading").innerHTML,
		callback: function (success) {
			if(success) {

			}
		}
	});
}

function loadSmallShoppingCart(url) {
		Ext.get("bigoffer-content").load({
		url: url,
		scripts: true,
		text: document.getElementById("loading-small").innerHTML,
		nocache: true,
		callback: function (success) {
			if(success) {		
			}
		}
	});
	document.getElementById("tnt-icon").style.display = "none";
	document.getElementById("cart-icon").style.display = "block";
}

function loadSubCategory(mainCategoryId, subCategoryId, makeId, minPrice, maxPrice, startIndex, endIndex) {
	highlightCategoryIcon(document.getElementById('category'+mainCategoryId));

	if( (document.getElementById('cell'+mainCategoryId).offsetLeft/document.getElementById("categories-content").offsetWidth)*100 > 90 ) {
		categories_slider.setValue(100, true);
	} else {
		categories_slider.setValue((document.getElementById('cell'+mainCategoryId).offsetLeft/document.getElementById("categories-content").offsetWidth)*100, true);
	}

	//setTimeout("alert("+mainCategoryId+")", 500);
	setTimeout("loadSubCategories("+mainCategoryId+", "+subCategoryId+")", 500);
	setTimeout("loadPriceRange("+mainCategoryId+", "+subCategoryId+", "+makeId+", '0', '0', '0', '19')", 1000);
	setTimeout("loadMakesBySubCategory("+mainCategoryId+", "+subCategoryId+", "+makeId+")", 1500);
	setTimeout("loadProductsBySubCategory("+mainCategoryId+", "+subCategoryId+", "+makeId+", "+minPrice+", "+maxPrice+", "+startIndex+", "+endIndex+")", 2000);
}

function loadMainOfferByCategory(mainCategoryId) {
		var urlStart = "action=ShowMainOfferByCategory";
		urlStart += "&mainCategoryId="+mainCategoryId;
		Ext.get("bigoffer-content").load({
			url: "/app/catalog.do",
			scripts: true,
			params: urlStart,
			text: document.getElementById("loading-small").innerHTML,
			nocache: true,
			callback: function (success) {
				if(success) {		
				}
			}
		});
}

function hideInitHint() {
	document.getElementById("init-hint").style.display = "none";
}

function showInitHint() {
	var arVersion = navigator.appVersion.split("MSIE")
	var version = parseFloat(arVersion[1])
	if ((version >= 5.5) && (document.body.filters)) {
		document.getElementById("init-hint").style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'/images/common/hint.png\', sizingMethod=\'crop\')";
	} else {
		document.getElementById("init-hint").style.background = "url(/images/common/hint.png) no-repeat";
	}
	document.getElementById("init-hint").style.display = "block";
}