// JavaScript Document
browseDiv = {
    currentDiv: 1,
    project: "project1",
    transitionSpeed: "slow",
    containerId: "#images",
		//post_file: 'typo3conf/ext/ce_studioolympia/media/post.php',	// Post Handler
		post_file: 'index.php',	// Post Handler
	  wait_note:'<div class="loading"><img src="fileadmin/templates/gfx/loading.jpg" /></div>', // wait message
		zero_note: 'Sorry, No items match the options'	// no item message
  };
  
  browseDiv.init = function(project){
  this.project = project;
  this.loadItems(0);
	
	//$("#current_div").html('<img src="fileadmin/templates/gfx/'+browseDiv.currentDiv+'.jpg" />'); // nummer aktuelles div
	$("#current_div").html(''+browseDiv.currentDiv+''); // nummer aktuelles div

	this.first();
  };
  
  browseDiv.go = function(number){
  $("#images div#img_" + this.currentDiv + "").fadeOut("slow"); 
	if(this.currentDiv+number <= imgsTotal.length && this.currentDiv+number > 0){
		this.currentDiv = this.currentDiv+number;
	}else{
    //hier dann zum naechsten projekt wechseln
    num = this.project.substr(7); //nummer des akteullen projekts
    next = parseInt(num)+parseInt(number);
    //alert(totalNumberOfProjects);
    //alert(num);
    if(next < totalNumberOfProjects && next >= 0){
      this.project = 'project'+next;
      this.currentDiv = 1;
      $("#text").fadeOut("slow");
      this.loadItems(0);
    }
  }
	
	//$(this.containerId).fadeOut(this.transitionSpeed, function(){
	  $("#images div#img_" + this.currentDiv + "").fadeIn("slow"); 
		//$(browseDiv.containerId).html(imgsTotal[browseDiv.currentDiv-1]).fadeIn(this.transitionSpeed);
		//$("#current_div").html('<img src="fileadmin/templates/gfx/'+browseDiv.currentDiv+'.jpg" />'); // nummer aktuelles div
		$("#current_div").html(''+browseDiv.currentDiv+'');
//	});
  };
  
  browseDiv.first = function(){
    $("#images div#img_" + this.currentDiv + "").fadeIn("slow"); 
  };
  
  browseDiv.last = function(){
	 this.go(slides.length-this.currentDiv);
  }
  
  // load items based on selected parent
	browseDiv.loadItems = function(parent){			 
	 $(this.containerId).html(this.wait_note);
	 category = $("#category").html();
	 pid = $("#pid").html();
   
	 $.post(this.post_file, { eID: 'tx_cestudioolympia_pi1', project: this.project, category: category, pid: pid},
   function(data){
			var imgs = "";
			//alert(data.length);
			if(data.length){
		//	 size = data.length++;
				for(i=0;i<data.length;i++) {
				  
				 // alert(number);
					imgs += '<div id="img_' + data[i].id + '"><img src="uploads/tx_cestudioolympia/' + data[i].name + '" /></div>';
				}
				text = '<p><span class="head">'+data[0].headline+'</span><br />'+data[0].description+'</p>';
			}
			else{imgs ='<div id="">'+zero_note+'</div>';}
			
			$(browseDiv.containerId).html(imgs);
			$("#text").html(text).fadeIn("slow");
			$("#images > div").hide();
			$(".project-bg").css("background","#f3f3f4");
			imgsTotal = $(browseDiv.containerId).children(); 
	    $("#all_div").html('' +imgsTotal.length+ ''); // zaehler
	    //$("#all_div").html('<img src="fileadmin/templates/gfx/' +imgsTotal.length+ '.jpg" />'); // zaehler
	    $("#images div#img_" + browseDiv.currentDiv + "").fadeIn("slow");
	}
	,'json');
	}
  
  
  $(document).ready(function(){
    /*********** projekt-detail ansicht *****/
    //browseDiv.init();
    $("#browse").hide();
    category = $("#category").html();
    pid = $("#pid").html();
    $.post(this.post_file, { eID: 'tx_cestudioolympia_pi1', category: category, pid: pid},
					function(data){
							var lis = "";
							var imgs = "";
							//alert(data.length);
						  totalNumberOfProjects = data.length;
							if(data.length){
								for(i=0;i<data.length;i++) {
								  number = parseInt(data[i].id)+parseInt(1);
								  //alert(String(number).length);
								  if(String(number).length > 1){
								    number = number;
                  }else{
                    number = '0'+number;
                  }

									lis += '<li id="project' + data[i].id + '"><span class="number">' + number + '</span> <a href=""><span class="client">' + data[i].client + ' </span>' + data[i].projectname + '</a>  </li>';
								  imgs += '<div id="d_project' + data[i].id + '"><img src="uploads/tx_cestudioolympia/' + data[i].teaser_img + '" /></div>';
                }
							}
							else{lis ='<li id="">keine Projekte in dieser Kategorie</li>';}
							
							lis = '<li class="special_li">SELECTED WORK</li> '+lis;
							$("#projects").html(lis);
							$("#p_preview").html(imgs);
							
							//alle div ausblenden
              $("#p_preview > div").hide();  
              //rollover effekt, aus und einblenden
              $('#projects > li').hover(function(){
                var project = $(this).attr('id');
                $("#p_preview div").hide();
                $("#p_preview div#d_" + project + "").fadeIn("slow");    
              },
              function(){$("#p_preview div").fadeOut("slow");}
              );
    
              /*********** bei click wecheseln auf projekt-detail ansicht *****/
              $('#projects a').click(function() {
                $("#projects").fadeOut("slow");    
               // var href = $(this).attr('href');
                var project = $(this).parent().attr('id');
                
                //browse initialisieren
                browseDiv.init(project);
                $("#browse").fadeIn("slow"); 
                //window.location.href = href+"&project="+project;
                // return confirm('You are going to visit: ' + this.href);
                return false;
              });
						}
					,'json');
					
    
    
    
  });