var xmlFile;
        var numberOfTumbs = 5;
        var currentTumb = numberOfTumbs;
        var itemTumbs=new Array(); 
        var page;
        var mamtakId=0;
        var postId=0;
        var themeId="red";
        var themeStyle="#ed1b31";
		var helpArrow = "";
         
        function setPage()    
        {   
           setFromXml(0)
           page = $("#mainPart").html();
		   Gobj = $('#iconsLine1');
	 
       }
       
	   function mouseoverArrow(obj)
	   {		
				helpArrow = $(obj).attr("src");
				$(obj).attr("src",$(obj).attr("src").replace("On.","Off."));	
	   }
	   function mouseOffArrow(obj)
	   {
				$(obj).attr("src",helpArrow);
	   }
       var iconsLineTitle = "";
		function topIconsMouseOver(obj)
		{
			iconsLineTitle = $("#iconsLineTitle").text();
			$("#iconsLineTitle").text($(obj).attr('alt'));
			
			if(iconsLineTitle)
                $("#leftarrow").attr("src",$("#leftarrow").attr("src").replace("On.","Off."));
            else
                $("#leftarrow").attr("src",$("#leftarrow").attr("src").replace("Off.","On."));
            
            if(currentTumb >= itemTumbs.length)
                $("#righttarrow").attr("src",$("#righttarrow").attr("src").replace("On.","Off."));
            else
                $("#righttarrow").attr("src",$("#righttarrow").attr("src").replace("Off.","On."));
            
		}
	   	function topIconsMouseOut(obj)
		{
		 
			$("#iconsLineTitle").text(iconsLineTitle);
		}
	   
       function setFromXml(defaultVal)
       {
            var firstElement = 0;
            $.ajax({
		        type: "GET",
		        url: "Data.xml?rand=" + Math.random(),
		        dataType: "xml",
		        success: function(xml) 
		        {
		            xmlFile = xml;
		            setPageFromXml(xml);
		           
		            if(defaultVal > 0)
		                setItemFromXml(defaultVal);
		            else
		                setItemFromXml($(xml).find('items item:first id').text());  
			    }
			});
        }
        
        function setPageFromXml(xml)
        {
        $(xml).find('information').each(function(){
         
                mamtakId=$(this).find("number").text();
                postId=$(this).find("postId").text();
                themeId=$(this).find("theme").text();
                themeStyle=$(this).find("themeStyle").text();
                      document.title="Matak - explore web candy number "+  $(this).find("number").text();
            });
                 $("#rightSection").append("<img title='Click on the images'  id=\"li_logo\" src=\"/images/in-logo-" + themeId+   ".png\" >");
              $("#mamtak_img_id").append("<img title='Mamtak #'"+mamtakId+"  id=\"li_logo"+mamtakId+"\" src=\"/images/" + mamtakId+   ".png\" >");
      
         
            $(xml).find('items item').each(function(){
                $("#rightSection").append("<p><img width='100' height='70' id=\"li" + $(this).find('id').text() + "\" src=\"" + $(this).find('image_url').text() + "\" onclick=\"setItemFromXml(" + $(this).find('id').text() + ");\" /><span style=\"padding-bottom:10px;background-image:url(../images/" + $(this).find('type').text() + "-big.png);\" onclick=\"setItemFromXml(" + $(this).find('id').text() + ");\">&nbsp;</span></p>");
            });
                        
    
          //  document.body.style.scrollbarFaceColor = themeId;
     
            $("#rightSection p img").hover(function(){ $(this).attr("style", "padding:3px;border-width:3px;border-color: "+themeStyle+";")}, 
                                           function(){if($(this).attr("selected") != "on") $(this).attr("style", "border-color: None;")}); 
            
            $("#rightSection p span").hover(function(){ $(this).parent().find('img').attr("style", "padding:3px;border-width:3px;border-color: "+themeStyle+";")}, 
                                           function(){if($(this).parent().find('img').attr("selected") != "on") $(this).parent().find('img').attr("style", "border-color: None;")}); 
        
	     		
        }

        function setItemFromXml(itemId)
        {     
        
			$("#li" + itemId).parent().parent().find("p img").each(function(){
					$(this).attr("style","border:none")
					$(this).attr("selected","off");
			});
			$("#li" + itemId).attr("style","padding:3px;border: solid 3px "+themeStyle+"");
			$("#li" + itemId).attr("selected","on");
			$("#mainPart").html(page);
            $("#itemTopId").html(mamtakId);		
			currentTumb = numberOfTumbs;    
            itemTumbs = new Array();                                
	        $(xmlFile).find('items').each(function(){
			         
                $(this).find('item[num=' + itemId + ']').each(function(){
                    //alert($(this).find('type').text());
                     var source=   $(this).find('source').text();
                     
					var imageUrl = $(this).find('image_url').text();
                    $("#mainImageImg").attr("src","/images/" + $(this).find('type').text() + "-big.png");
                    $("#mainImage").attr("style","background:url('/images/spacer.gif') no-repeat;width:120px;height:90px;");
                     $("#mainImagelink").attr("src",imageUrl);
                     $("#mainImagelink").attr("style","top: 0px; left: 0px;width:120px;height:90px;");
                     
                    $("#mainImage").click(function() {window.open(source);});
                    $("#lnkMainImage").click(function() {window.open(source);});
					
					$("#mainPartBigLogo").attr("src","/images/" + $(this).find('type').text() + "-big.png?3");
                    $("#textDescription").html($(this).find('description').text());
                    $("#titleText").html($(this).find('title').text());
					$("#tblViews").html($(this).find('Views').text());
                     $(this).find('images').each(function(i,n){
                        $(this).find('url').each(function(){
                            itemTumbs[itemTumbs.length] = $(this).text();
						});    
                    });
                 });
            });
            
            var html = "";
             for(var i=0;i<itemTumbs.length;i++)
                html += "<img onclick=\"pop(this)\" src=\"" + itemTumbs[i] + "\" alt=\"" + itemTumbs[i] + "\" larg=\"" + itemTumbs[i] + "\"  \>";
            
            
        }
      
 

	    function pop(e)
	    {
	     
	        //The HTML of the popup
			
			var img = new Image(); 
			img.src = $(e).attr("larg");

			$("#fd").html("<img style='width:100%' src=\"" + $(e).attr("larg") + "\" />");
            $("#fd").dialog({ title: 'Full size image',modal: true ,width: img.width + 30  });
            $("#fd").dialog('open');
       }
        
		function change(obj)
        {
			change(obj,"Done!!!")
		}
        function change(obj,txt)
        {
        
            //$.post('http://www.google.co.il/',{param2:"v1",param2:"v2"}, function(r){$("#"+obj).html(r);});
            $("#"+obj).html(txt);
        }
        function OpenTopic() {
           window.open("http://www.facebook.com/pages/Mamtak/110322609004960?v=app_2373072738#!/topic.php?uid=110322609004960&topic="+postId);
           
           }
           function changeContent(obj, Url) {
            
        
            iconsLineTitle = $(obj).attr('alt');
            $("#iconsLineSubTitle").text(iconsLineTitle);
					$(obj).parent().find("img").each(function(){$(this).attr("style","border-color: #ffffff;");})
			$(obj).attr("style","border-color: #fff;border-bottom-color:"+themeStyle+";");

 
			Url += "?rand=" + Math.random() + "&id=" + mamtakId;
		 
			var html = "<iframe FRAMEBORDER='0' src ='" + Url + "&url="+document.URL+"' width='100%' height='320' style='position:relative;top:0px; '>";
		 	if ("Share" == $(obj).attr('alt')) {
			    
		 	 var name=$(obj).attr('alt')+"div";
			 $("#"+name).dialog({ title: $(obj).attr('alt'), modal: true, width: 400 });
			$("#"+name).dialog('open');
			   
			}
			else {
 
			    $("#fd").html(html);
			    
			 $("#fd").dialog({ title: $(obj).attr('alt'), modal: true, width: 400 });
			 $("#fd").dialog('open');

			}
	    }

               
         function OverchangeContent(obj,Url,Over)
        {
           
            $("#iconsLineSubTitle").text("Choose one");
        	$(obj).parent().find("img").each(function(){$(this).attr("style","border-color: #ffffff;");})
			if(Over)
			{
			      iconsLineTitle = $(obj).attr('name');
            $("#iconsLineSubTitle").text(iconsLineTitle);
        
			 $(obj).attr("style","border-color: #fff;border-bottom-color:"+themeStyle+";");
			 }
        }
         
        
        function flipOverFlow(targetItem,buttonItem,moreText,lessText)
        {
		    if($("#"+targetItem).attr("style") == "" || $("#"+targetItem).attr("style") == undefined || $("#"+targetItem).attr("style").indexOf("hidden",0) > 0)
            {
                $("#"+targetItem).attr("style", "overflow:visible; height:auto;");
                $("#"+buttonItem).text(lessText);
             }
            else
            {
                $("#"+targetItem).attr("style", "overflow:hidden;");
                $("#"+buttonItem).text(moreText);
           }
        }