// JavaScript Document
var path ="../images/banner/"
var count=0;
var iconN=1;
var moveLeft = 520;
var currentID = "imgholder1" 
var imgID=0;
var linkArr = new Array();

$(document).ready(function(){
	//alert('loaded')
	//http://w3svc1273.staging2-sl.netstarter.com.au:81
			$.ajax({
			url: "/includes_templates/processmanagement/extract/media/photogallery/category.aspx?SiteItemId=326f4b95-df96-4192-b831-d3fbfb565431",
				success: function(data) {
					//alert($(data).find('TemporaryTable').text());
					var xml;
					if ($.browser.msie && typeof data == "string") {
						xml = new ActiveXObject("Microsoft.XMLDOM");
						xml.async = false;
						xml.loadXML(data);                
					} else {
						xml = data;
					}
					//dispalyData(xml);
					getImgGalXml(data)
				}
			});

		});
		
	function getImgGalXml(xml){
				var catID = $(xml).find('TemporaryTable:first-child').find('ChildId').text();
				$.ajax({
				url: "/includes_templates/processmanagement/extract/media/photogallery/images.aspx?SitemediacategoryId=" + catID,
				success: function(data) {
					//alert($(data).find('TemporaryTable').text());
					var xml;
					if ($.browser.msie && typeof data == "string") {
						xml = new ActiveXObject("Microsoft.XMLDOM");
						xml.async = false;
						xml.loadXML(data);                
					} else {
						xml = data;
					}
					createGal(data);
				}
			});

		
		}


function createGal(xml){
	//alert('hi'+xml);
	$(xml).find('TemporaryTable').each(function(){
						var pageLink =  $(this).find('URL').text();
						linkArr.push(pageLink);
		
		})
		var $icon1 = $('<a  href="'+linkArr[0]+'" class="linkimg"><div id="btn1"  class="btnIcon1"><br>About B&acute;nai B&acute;rith&nbsp;&nbsp;&nbsp;&nbsp;</div></a>');
		var $icon2 = $('<a  href="'+linkArr[1]+'" class="linkimg"><div id="btn2" class="btnIcon2"><br>Our Projects&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div></a>');
		var $icon3 = $('<a  href="'+linkArr[2]+'" class="linkimg"><div id="btn3" class="btnIcon3"><br>Our People&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div></a>');


		$('<ul id="headelUL"></ul>').appendTo('#headblock');
		$('<ul id="buttonNav"></ul>').appendTo('#buttons')
		$('<li></li>').html($icon1).appendTo('#buttonNav');
		$('<li ></li>').html($icon2).appendTo('#buttonNav');
		$('<li ></li>').html($icon3).appendTo('#buttonNav');

					$(xml).find('TemporaryTable').each(function(){
						imgID++;
						//alert($(this).find('LargeFileName').text())
						var url = $(this).find('LargeFileName').text();
						var $text =  '<div class="textContent">'+imgID+'</div>'
						
		var $img =  $('<div id="imgholder'+imgID+'"><div><img src="'+url+'" /></div>');
		//$('#imgholder'+k).append($link);

				$('<li id="imgblock'+imgID+'"></li>').html($img).appendTo('#headelUL');
				$('#imgholder'+imgID).fadeOut(1, function() {});
				$id = '#btn'+imgID
				$imgid = '#imgholder'+imgID;
				$($id).bind('mouseover',function(){
					switch($(this).attr('id')){
						case 'btn1':
						onbtnOver('#imgholder1','1')
						break;
						case 'btn2':
						onbtnOver('#imgholder2','2')
						break;
						case 'btn3':
						onbtnOver('#imgholder3','3')
						break;
						}
					//alert($(this).attr('id'))
					})

				$($id).bind('mouseout',function(){
					switch($(this).attr('id')){
						case 'btn1':
						mouseOut('1');
						break;
						case 'btn2':
						mouseOut('2');
						break;
						case 'btn3':
						mouseOut('3');
						break;
						}
					//alert($(this).attr('id'))
					})



					})




	$('#imgholder1').fadeIn('slow', function() {});
	
	/*for(var k=1; k<5; k++){
		//alert(k);
		var $text =  '<div class="textContent">this is text'+k+'</div>'
		var $img =  $('<img class="mainImg" src="images/'+k+'.jpg"  />' + $text);
				$('<li id="liItem'+k+'"></li>').html($img).appendTo('#headelUL');

		
		}*/
	}

				
function onbtnOver(id,id2){
	//alert($(this).attr('id'))
		if(currentID != id){
		$(id).fadeIn('slow',function(){})
		$(currentID).fadeOut('slow',function(){})
		currentID = id;
		}
		
		$('#btn'+id2).removeClass('btnIcon'+id2).addClass('btnIcon_hover_'+id2)
	
	}
function mouseOut(id){
	//alert('btnIcon'+id)
		$('#btn'+id).removeClass('btnIcon_hover_'+id).addClass('btnIcon'+id)
	
	
	}
