var arrTeilnehmer = []

arrTeilnehmer[1] = '{"gewerk":"holz"}';
arrTeilnehmer[2] = '{"gewerk":"glas"}';
arrTeilnehmer[3] = '{"gewerk":"stein"}';
arrTeilnehmer[4] = '{"gewerk":"holz"}';
arrTeilnehmer[5] = '{"gewerk":"holz"}';
arrTeilnehmer[6] = '{"gewerk":"glas"}';
arrTeilnehmer[7] = '{"gewerk":"stein"}';

tileTpl = '<div class="tile" data-nr="<nr>"><div data-group="<gewerk>" class="tile-image"></div></div>';
var myFilter = "stein";

(function($)
{

	
	$(document).ready(function(){
		
	$body =  $("body");
	isTouch = probeTouchDevice();
	
	dummylink = $("#dummylink a");
	collTiles = $(".tile");
	
/*
		 mouseenter mouseleave
			if(ev == "mouseenter"){
				$(this).addClass("active") }
			else{
				//y$(this).removeClass("active")
			}
			
		
			
			
*/		

	collTiles.each(function(){
		
		//url = $(this).find(".tile-info a").attr("href");
		//$(this).find(".tile-cover").attr("href",url);
//		if(isTouch) return true;


		$(this).on("touchend",function(e){
			

			isActive = $(this).hasClass("active") 
			collTiles.removeClass("active")
			if(!isActive) {
				e.preventDefault()
				//e.stopPropagation()
				$(this).addClass("active")
				
			}	
		})


		


	
		
	});



	function probeTouchDevice() {
		
	  if (('ontouchstart' in window) 
		  
	   /*|| (navigator.maxTouchPoints > 0) ||
		 (navigator.msMaxTouchPoints > 0)*/
		 
		 
		 )
		 {
			$body.toggleClass("touchy") 
			return 1
			 
		 }
		 else{
			 return 0
			 
		 }
	}	



	var objTilesContainer = $('.tiles-container');
	if(objTilesContainer.length > 0){
		objTilesContainerAll = objTilesContainer.clone()
		
		// empty scene and create from data
/*
		objTilesContainer.html("")

		arrTeilnehmer.forEach(function(data,index){
			myJson = JSON.parse(data);
			myGewerk = myJson.gewerk;
			myTpl = tileTpl
			myTpl = myTpl.replace("<nr>",index)
			myTpl = myTpl.replace("<gewerk>",myGewerk)
			objTilesContainer.append(myTpl)
			
		});
*/

	objGewerkefilter =  $('.gewerkefilter');
	
	$filters = $('.gewerkefilter a');
	$filters.each(function(){
		
		$(this).on("click",function(){
		
		if( $(this).parent().hasClass("gewerkefilter-reset")){

			objTilesContainer.hide()
			objTilesContainer.html(objTilesContainerAll.html())
			objTilesContainer.fadeIn(2000)
			objGewerkefilter.removeAttr("filtered")
			$filters.removeClass("active").removeClass("inactive")
			
		}else{
			
			//$filters.addClass("inactive")
			$filters.removeClass("active")
			objTilesContainer.hide()
			objTilesContainer.html(objTilesContainerAll.html())
			objTilesContainer.fadeIn(1000)
			
			$(this).removeClass("inactive").addClass("active")
			f = $(this).attr("data-fid")
			filterBy(f)
			objGewerkefilter.attr("filtered",1)
			
		}
		
			
		})
		
		
		
	})
	objGewerkefilter.addClass("active")
	
	function filterBy(fid){
		//alert(fid)
		
		objTiles = objTilesContainer.find(".tile");
		hasTiles = objTiles.length;
		if(hasTiles==0) return true;
		arrFilters = fid.split(",")
		objTiles.attr("deleted",1)
		arrFilters.forEach(function(thisFilter,index){
			$keepTiles = objTilesContainer.find("[data-fid*="+thisFilter+"]").parent()
			$keepTiles.removeAttr("deleted")
			objTilesContainer.find("[deleted=1]").fadeOut(50)
		});			
		
	}



	
		//**// filter(s)
		
		if(myFilter!=""){
			
			objTiles = objTilesContainer.find(".tile");
			hasTiles = objTiles.length;
			if(hasTiles==0) return true;
			arrFilters = myFilter.split(",")
			objTiles.attr("deleted",0)
			arrFilters.forEach(function(thisFilter,index){
				$hideTiles = objTilesContainer.find("[data-group="+thisFilter+"]").parent()
				$hideTiles.removeAttr("deleted")
				$hideTiles.find(".tile-image").fadeOut(500)
			});	
			
			
			
			t1 = setTimeout(reorder,1000)
			
			function reorder(){
				
				objTilesVisibleCloned = objTilesContainer.find("[deleted=0]").clone();
				objTilesVisibleCloned.removeAttr("deleted")
				objTilesContainer.find("[deleted=0]").removeAttr("deleted");
				
				//objTiles.html("")
				
				objTiles.each(function(index){
					
					if(objTilesVisibleCloned.eq(index).length>0){
					oldnr = objTilesVisibleCloned.eq(index).attr("data-nr");
					
					$(this).html(objTilesVisibleCloned.eq(index).html())
					//objTilesContainer.find("[data-nr="+oldnr+"] .tile-image").fadeOut(250)
						
					}else{
						$(this).html("")
						
					}
					
					
				})

			
				
			}
		}
		
	
	
	

	}
	
	
	});	// document.ready
	
})(jQuery);