$(document).ready(function() {
			
	$(".combobox_images_v2").hide();
	$(".combobox_files_v2").hide();
	
	// for each <select> concerned :
	// we have to create his own viewport (images of selected options)
	$(".combobox_images_v2").each(function(i, selected){
			createThumbs_v2( this.getAttribute("id") , "image" );
	});
	
	$(".combobox_files_v2").each(function(i, selected){
			createThumbs_v2( this.getAttribute("id") , "file" );
	});
	
	
	

});
	
	
function createThumbs_v2(element_id , thumbType) {
	
		var element = $("#"+element_id);
		
		element.parents().filter('.form_field').append("<div class='viewport' id='viewport_" + element_id + "'></div>");
		
		refreshThumbs_v2(element_id , thumbType);
		
}

function refreshThumbs_v2(element_id , thumbType) {
		
		// refresh ajax viewport from textarea json string
		var element = $("#"+element_id);
		
		var filter = $("#"+element_id).attr('title');
		var path = $("#"+element_id).attr('path');
		var thumbs = "";
		var ids = ""
			
		ids = /*encodeURIComponent*/(element.html());
		if (path==undefined) path = "";
		var urlEncoded = "/manager/gallery/index/displaylayout/popup_gallery/element/" + element_id + "/filter/" + encodeURIComponent(filter) + "/path/"+ encodeURIComponent(path)+"/type/"+thumbType+"/v/2" ;
		var link = "<a href=\"javascript://\" onclick=\"window.open( '"+urlEncoded+"','gallery','menubar=no, status=no, scrollbars=yes, menubar=no, location=no, width=910, height=600');\" class=\"file_uploader\"><img src='themes/caritas/images/upload_field_.jpg' style='margin-bottom:10px;' /></a>";
		

		$.post("manager/gallery/ajaxfilepreviewv2/type/"+thumbType+"/element/"+element_id, {'ids':ids}, function(data){
				$("#"+element_id).parent().parent().children(".images_thumbs").remove();
				$("#"+element_id).parents().filter('.form_field').children().filter('.viewport').html(link);
				$("#"+element_id).parent().parent().append(data);
		});
		 
}

function removeImage_v2_old(obj, id, element_id) {
	
	//alert(obj);
	//alert(id);
	//alert(element_id);
	
	json = eval($('#'+element_id).html());
	//alert(json[id].file_id);
	// old fashion remove from table
	// copy part1
	json2 = new Array();
	json3 = new Array();
	for(var j=0;j<=id-1;j++) {
		json2[j] = json[j];
	}
	// copy part2 (if needed)
	if (id != json.length-1) {
		//alert(parseInt(id)+1);
		for (var k = parseInt(id)+1; k < json.length; k++) {
			//alert(k);
			json2[parseInt(k)-1] = json[k];
		}
	}
	$('#'+element_id).html(JSON.stringify(json2));
	
	
	obj.parent().remove();

}
function removeImage_v2(obj, element_id) {
	
	id = obj.parent().parent().attr('rel');
	
	//alert(id)
	
	json = eval($('#'+element_id).html());
	//alert(json[id].file_id);
	// old fashion remove from table
	// copy part1
	json2 = new Array();
	json3 = new Array();
	for(var j=0;j<=id-1;j++) {
		json2[j] = json[j];
	}
	// copy part2 (if needed)
	if (id != json.length-1) {
		//alert(parseInt(id)+1);
		for (var k = parseInt(id)+1; k < json.length; k++) {
			//alert(k);
			json2[parseInt(k)-1] = json[k];
		}
	}
	$('#'+element_id).html(JSON.stringify(json2));
	
	obj.parent().parent().remove();
	
	$("#"+element_id).parent().parent().children(".images_thumbs").children(".image_thumb").each(function() {
		//alert($(this).attr('rel'));
		if ( parseInt($(this).attr('rel'))>id ) {
			$(this).attr('rel',parseInt($(this).attr('rel'))-1)
		}
	});


}

function changeImage_v2(obj, id, element_id){
	alert(id);
	json = eval($('#'+element_id).html());
	json[id].file_name = obj.attr('value');
	$('#'+element_id).html(JSON.stringify(json));
	
}
/*
function refreshJson(thumbs_container, element) {
	json = []
	$(thumbs_container+" .image_thumb input").each(function(i) {
		//alert( i + " : " + $(this).attr('value') + " : " + $(this).attr('rel') + element)
		var image = {
			"file_id" : $(this).attr('rel'),
			"file_name" : $(this).attr('value'),
			"selected" : $(this).parent().hasClass("ui-selected")
		}
		json[i] = image;
		
		// on en profite pour changer les rel du parent
		$(this).parent().attr('rel',i);
	})
	$('#'+element).html(JSON.stringify(json));

}*/