window.addEvent('domready', function(){
	/*
	 * Okay this is how it works:
	 * no javascript: the page listens to the querysting and works with page refreshes
	 * 
	 * javasript: the links in the alphabet bar get hijaxed and to make bookmarking possible
	 * we work with the hash. 
	 * 
	 * In the rare case that a user has a different querystring and hash the hash overrules the 
	 * querystring on page load.. so if q=A#B... the 'A' locatiosn are loaded from the server
	 * initially but get overwritten bij an ajaxcall with the 'B' locations... This usecase is
	 * only feasible when somebody mixes javascript and nonjavascript sessions and bookmarks
	 * at the same time.... which is pretty unlikely..
	 * 
	 */
	var container = document.getElementById("aToZresults");
    $$("#alphabetBar a").addEvent("click",function(event){
		loadStore(this.getAttribute("href").substr(this.getAttribute("href").indexOf("#")+1));
		return false
	})
	function loadStore(index){
		container.style.height = container.offsetHeight + "px";//fix the height to avoid scrolling due to short page body
        container.innerHTML = '<img src="'+karw.pathStaticData+'images/loader.gif" class="loading" />';
        new Request({
                url: karw.context+'/store/stores_by_letter',
                method: 'get',
                data:{q:index},
                onSuccess:function(responseText, responseXML){
                    container.innerHTML = responseText;
                    container.style.height = "auto";
					document.location.hash = index;
                 },
                onFailure:function(){
                     container.innerHTML =  "<span class='error'>fout: informatie niet beschikbaar</span>";
                 }
        }).send();
    }
	var locHash = location.hash.substr(1);
	var locSearch = location.search.indexOf("q=")>-1?location.search.substr(location.search.indexOf("q=")+2,1):"";
	if(locHash!="" && locHash!=locSearch){
		loadStore(locHash);
	}
});