LiDa_Search/js/guimanagerNik.js

/**
 * 
 */


$(document).ready(function() {
	grammarconditions = 0
	sintconditions = 0
	filterconditions = 0

	let filterToEdit = "";

	const myEngine = new Comunica.QueryEngine();

	var queryFields = [];	// Contiene le intestazioni di colonna della tabella dei risultati

	const sparqlEndpoint = "https://hdnlab1.isti.cnr.it/fuseki/commediaontosintgra/query";
	const sparqlGenerator = sparqljs.Generator;

	var aggettivoJson = {
		"filtriaggettivo": {
			"Classe": ["1ª", "2ª"],
			"Genere": ["Femminile", "Maschile"],
			"Numero": ["Singolare", "Plurale"],
			"Con_oggetto_indiretto": ["Con oggetto indiretto"],
			"Tipo aggettivo": ["Tipo aggettivo", "Qualificativo", "Indefinito", "Interrogativo", "Esclamativo", "Numerale", "Dimostrativo", "Relativo", "Possessivo", "In locuzione"],
			"Grado": ["Grado", "Comparativo di maggioranza", "Comparativo di minoranza", "Comparativo di uguaglianza", "Superlativo relativo", "Superlativo assoluto"],
			"Tipo_di_Complemento": ["Tipo di Complemento", "Introdotto da A", "Introdotto da CON", "Introdotto da CONTRO", "Introdotto da DA", "Introdotto da DI", "Introdotto da IN",
				"Introdotto da PER", "Introdotto da SU", "Introdotto da TRA", "Introdotto da VERSO", "Introdotto da SOPRA",
				"Introdotto da SOTTO", "Introdotto da DINANZI", "Introdotto da prep.", "Oggetto ind.", "Ogg. indi. + compl. con DI", "Ogg. ind. pronom."],
			"Tipo_di_frase": ["Tipo di frase", "Con infinito retto da A", "Con infinito retto da DA", "Con infinito retto da DI", "Con infinito retto da PER",
				"Con infinito retto da SE", "Con subordinata all'indic.", "Con subordinata al cong.", "In locuzione imp.+infinito",
				"In locuzione imp.+che+indic.", "In locuzione imp.+che+cong.", "In locuzione imp.+se+indic.", "In locuzione imp.+se+cong.",
				"In locuzione imp.+come+indic.", "In locuzione imp.+quando+indic.", "In locuzione imp.+perché+cong.", "In locuzione imp.+a+infinito"]
		}
	}

	var pronomeJson = {
		"filtripronome": {
			"Classe_Persona": ["1ª", "2ª", "3ª"],
			"Genere": ["Femminile", "Maschile"],
			"Numero": ["Singolare", "Plurale"],
			"Tipo": ["Tipo", "Personale", "Riflessivo", "Interrogativo", "Esclamativo", "Dimostrativo", "Relativo", "Possessivo"],

			"Forma_Personali_Riflessivi": ["Forma (Personali/Riflessivi)", "Libero", "Libero in Composizione", "Proclitico", "Enclitico"],
			"Funzione_Personali": ["Funzione (Personali)", "Libero - soggetto", "Libero - soggetto impersonale", "Libero - complemento", "Libero - rafforzativo",
				"Clitico - accusativo", "Clitico - dativo", "Clitico - partitivo"],
			"Tipo_Riflessivi": ["Tipo (Riflessivi)", "Proprio", "Lessicalizzato", "Impersonale", "Passivo", "Reciproco"]
		}
	}
	var articoloJson = {

		"filtriarticolo": {

			"Genere": ["Femminile", "Maschile"],
			"Numero": ["Singolare", "Plurale"],
			"Tipo": ["Determinativo", "Indeterminativo"]

		}
	}

	var avverbioJson = {
		"filtriavverbio": {
			"Tipo": ["Tipo", "Al comparativo di maggioranza", "Al comparativo di minoranza",
				"Al superlativo assoluto", "Al superlativo relativo",
				"In Locuzione", "In Locuzione separato", "Proclitico", "Enclitico"]

		}

	}

	var preposizioneJson = {
		"filtripreposizione": {
			"Tipo_I": ["Propria", "Impropria"],
			"Tipo_preposizione": ["Tipo preposizione", "Semplice", "Articolata", "In locuzione", "In locuzione separata"],
			"Sintassi": ["Sintassi", "Soggettiva", "Oggettiva", "Dichiarativa", "Completiva obliqua", "Finale",
				"Causale", "Concessiva", "Consecutiva", "Temporale", "Modale", "Eccettuativa", "Esclusiva",
				"Limitativa", "Comparativa", "Avversativa"],
			"Complemento_(I)": ["Complemento (I)", "Di stato in luogo", "Di moto a luogo", "Di moto da luogo", "Di moto per luogo",
				"Di luogo", "Predicativo del soggetto", "Predicativo dell'oggetto", "Di distanza",
				"Di tempo determinato", "Di tempo continuato", "Di tempo", "Di termine", "Di vantaggio",
				"Di svantaggio", "Di specificazione", "Di modo", "Di mezzo", "Di compagnia",
				"Di unione", "Di allontanamento/separazione", "Di materia"],
			"Complemento_(II)": ["Complemento (II)", "di limitazione", "di qualità", "di causa", "di agente", "di causa efficiente", "di fine o scopo",
				"di paragone", "di argomento", "distributivo", "di sostituzione", "di estensione", "di rapporto",
				"di esclusione", "di peso", "di quantità", "di colpa", "di denominazione", "partitivo",
				"di abbondanza-privazione", "di origine-provenienza", "concessivo", "di effetto", "di pena",
				"simmetrico", "indiretto esperiente", "indiretto dativo", "indiretto oggetto", "indiretto possessore",
				"indiretto benefattivo"]


		}

	}

	var congiunzioneJson = {
		"filtricongiunzione": {

			"Tipo": ["Tipo", "Semplice", "Composta", "Locuzione", "Locuzione separata"],
			"Coo_sub": ["coordinativa", "subordinativa"],
			"Coord_tipo": ["Coord. tipo", "copulativa", "disgiuntiva", "avversativa", "esplicativa", "conclusiva", "correlativa"],
			"Subord_tipo": ["Subord. tipo", "soggettiva", "oggettiva", "dichiarativa", "completiva obliqua", "interrogativa",
				"finali", "causali", "concessiva", "consecutiva", "temporale", "modale",
				"eccettuativa", "comparativa", "condizionale", "esclusiva", "limitativa"]
		}
	}

	var onomasticacitazioneJson = {
		"filtrionomastica": {

			"Tipo": ["Tipo", "Nome proprio", "Nome proprio separato", "Titolo"]
		},

		"filtricitazione": {

			"Tipo": ["Tipo", "Latina", "Provenzale", "Francese", "Spagnola", "Ebraica", "Greca"]
		}
	}

	var categorie = {
		"pronomevolgare": "filtripronome",
		"aggettivovolgare": "filtriaggettivo",
		"articolovolgare": "filtriarticolo",
		"avverbiovolgare": "filtriavverbio",
		"preposizionevolgare": "filtripreposizione",
		"congiunzionevolgare": "filtricongiunzione",
		"onomasticavolgare": "filtrionomastica",
		"citazionevolgare": "filtricitazione"
	}

	var catGrammsenzaspec = ['all', 'interiezionevolgare']

	var subordinazioneJson = {
		"subordinazione": {
			"livello": ["Qualsiasi livello di subordinazione", "principale", "coordinata a una principale", "subordinata di I grado",
				"subordinata di II grado", "subordinata di III grado", "subordinata di IV grado", "subordinata di V grado",
				"subordinata di VI grado", "subordinata di VII grado", "coordinata a una subordinata di I grado",
				"coordinata a una subordinata di II grado", "coordinata a una subordinata di III grado",
				"coordinata a una subordinata di IV grado", "coordinata a una subordinata di V grado", "pseudo-coordinata",
				"parentetica", "coordinata a una parentetica"]


		}
	}

	var categorieJson = $.extend({}, pronomeJson, aggettivoJson, articoloJson, avverbioJson, preposizioneJson, congiunzioneJson, onomasticacitazioneJson);


	var condizioniFiltro = {}

	var clausolaVisibile = false  //contiene il valore true se una clausola è gia visibile e quindi non se ne può visualizzare una seconda
	var tipoClausola = ''

	$('.tabs__menu-item').on('click', function() {
		$(this).addClass('bg-white').addClass('red');
		$(this).siblings().removeClass('bg-white').removeClass('red');
	});

	/*
		Funzioni per visualizzare le clausole
	*/


	jQuery(document).delegate('a.add-record', 'click', function(e) {
		e.preventDefault();
		if (clausolaVisibile)
			return true;
		else {
			clausolaVisibile = true;
			tipoClausola = 'grammaticale'
		}
		showCategoriaGrammaticale();
	});

	jQuery(document).delegate('a.add-record-sint', 'click', function(e) {
		e.preventDefault();

		if (clausolaVisibile)
			return true;
		else {
			clausolaVisibile = true;
			tipoClausola = 'sintattica'
		}

		var content = jQuery('#tiposintattico >div'),
			size = jQuery('#condizioni >div').length + 1,
			element = null,
			element = content.clone();
		element.attr('id', 'ts-' + size);

		element.find('.remove-filter').attr('target', 'ts-' + size);
		element.find('.set-filter').attr('targetfilter', 'ts-' + size);
		element.appendTo('#condizioni');
		element.find('.sn').html(size);
		sintconditions = sintconditions + 1
		if (size == 1)
			jQuery('#grammarbutton').attr('style', "display:block;")
	});

	/** 
	SCELTA TIPO SINTATTICO  
	*/


	jQuery(document).delegate('select.synttype', 'change', function(e) {
		e.preventDefault();

		//alert(($(this).closest('div')).closest('div').attr('id'))
		//var pare=$(this).parents()[2];
		var sbs = ($(this).closest('div')).siblings()


		sbs.find(".set-filter").attr('style', 'display.block')

	})

	/** SCELTA FUNZIONE SINTATTICA  
	 */


	jQuery(document).delegate('select.syntfun', 'change', function(e) {
		e.preventDefault();

		//alert(($(this).closest('div')).closest('div').attr('id'))
		//var pare=$(this).parents()[2];
		var sbs = ($(this).closest('div')).siblings()


		sbs.find(".set-filter").attr('style', 'display.block')

	})

	/** 
    
	SCELTA CATEGORIA GRAMMATICALE 
	 
	*/
	jQuery(document).delegate('select.catgram', 'change', function(e) {
		e.preventDefault();

		var pare = $(this).parents()[2];
		var sbs = ($(this).closest('div')).siblings()


		sbs.find(".add-details").attr('style', 'display.block')
		sbs.find(".set-filter").attr('style', 'display.block')


		containerid = 'dettaglio_' + pare.id;//$(this).closest('div').attr('id')
		sbs.find(".add-details").attr('target', containerid)
		sbs.find(".set-filter").attr('target', containerid)

		//condizioniFiltro["Categoria Grammaticale"] = $(this).val();
		if ($(this).val() == 'verbovolgare') {

			var content = jQuery('#categoriaverbo >div'),
				size = jQuery('#dettaglifiltri').length + 1,
				element = null,
				element = content.clone();

		}
		if ($(this).val() == 'sostantivovolgare') {
			var content = jQuery('#categoriasostantivo >div'),
				size = jQuery('#dettaglifiltri').length + 1,
				element = null,
				element = content.clone();
		}



		if (Object.keys(categorie).includes($(this).val())) {

			var filtro = categorie[$(this).val()]

			var keys = Object.keys(categorieJson[filtro])
			for (key in keys) {

				var vals = categorieJson[filtro][keys[key]]
				if (vals.length == 2) {
					var element = $('<div />');
					element.attr('class', ' w-15 pa1 mr2');
					var rbfieldset = $('<fieldset />'),
						flexdiv1 = $('<div />'),
						flexdiv2 = $('<div />'),
						input1 = $('<input />'),
						input2 = $('<input />'),
						label1 = $('<label />'),
						label2 = $('<label />');

					rbfieldset.attr('id', keys[key]);
					rbfieldset.attr('class', 'bn');
					flexdiv1.attr('class', 'flex items-center mb2');
					flexdiv2.attr('class', 'flex items-center mb2');
					input1.attr('class', 'mr2 f6');
					input2.attr('class', 'mr2 f6');
					input1.attr('type', 'radio');
					input2.attr('type', 'radio');
					input1.attr('id', vals[0]);
					input2.attr('id', vals[1]);
					input1.attr('value', vals[0]);
					input2.attr('value', vals[1]);
					input1.attr('name', keys[key]);
					input2.attr('name', keys[key]);
					label1.attr('class', 'lh-copy');
					label2.attr('class', 'lh-copy');
					label1.attr('for', vals[0]);
					label2.attr('for', vals[1]);
					label1.append(vals[0]);
					label2.append(vals[1]);

					input1.appendTo(flexdiv1);
					input2.appendTo(flexdiv2);
					label1.appendTo(flexdiv1);
					label2.appendTo(flexdiv2);
					flexdiv1.appendTo(rbfieldset);
					flexdiv2.appendTo(rbfieldset);
					rbfieldset.appendTo(element);
					element.attr('style', 'display:block')
					element.appendTo('#dettaglifiltri');
				}
			}
			for (key in keys) {
				var vals = categorieJson[filtro][keys[key]]
				if (vals.length == 1) {
					var element = $('<div />');
					element.attr('class', ' w-15 pa1 mr2');
					var rbfieldset = $('<fieldset />'),
						flexdiv1 = $('<div />'),
						input1 = $('<input />'),
						label1 = $('<label />');
					rbfieldset.attr('id', keys[key]);
					rbfieldset.attr('class', 'bn');
					flexdiv1.attr('class', 'flex items-center mb2');
					input1.attr('class', 'mr2 f6');
					input1.attr('type', 'checkbox');
					input1.attr('id', vals[0]);
					input1.attr('value', vals[0]);
					input1.attr('name', keys[key]);
					label1.attr('class', 'lh-copy');
					label1.attr('for', vals[0]);
					label1.append(vals[0]);

					input1.appendTo(flexdiv1);
					label1.appendTo(flexdiv1);
					flexdiv1.appendTo(rbfieldset);
					rbfieldset.appendTo(element);
					element.attr('style', 'display:block')
					element.appendTo('#dettaglifiltri');
				}
			}

			for (key in keys) {
				var vals = categorieJson[filtro][keys[key]]
				if (vals.length > 2) {
					var element = $('<div />');
					element.attr('class', ' w-15 pa1 mr2');
					var select = $('<select class="w-100 db h2 f6 bg-near-white ba b--sliver gray"/>')
					select.attr('id', keys[key])
					select.attr('title', keys[key])
					select.attr('name', keys[key])
					for (val in vals) {
						//alert(vals[val])
						var seloption = $('<option />');
						seloption.attr('value', vals[val]);
						seloption.append(vals[val])
						seloption.appendTo(select)
					}
					select.appendTo(element)
					element.attr('style', 'display:block')

					element.appendTo('#dettaglifiltri');


				}

			}
		}


		if (element === undefined) {
			var test = jQuery('#' + containerid)
			sbs.find(".add-details").attr('style', 'display:block')
			sbs.find(".set-filter").attr('style', 'display:block')
			test.remove()
		}
		else {
			element.attr('style', "display: block;")
			//element.appendTo('#dettaglifiltri');


			var test = jQuery('#' + containerid)

			test.remove()


			element.appendTo('#dettaglifiltri');

			var container = jQuery('#dettaglifiltri');
			container.attr('id', containerid);
			var divdf = jQuery('#divdettaglifiltri >div'),
				detelement = null,
				detelement = divdf.clone();
			detelement.attr('id', 'dettaglifiltri')
			detelement.appendTo("#query")


			//element.find('.sn').html(size);
		}


	});



	jQuery(document).delegate('a.remove-filter', 'click', function(e) {

		e.preventDefault();

		var didConfirm = confirm("Sei sicuro di voler eliminare la clausola?");
		if (didConfirm == true) {

			var targetDiv = jQuery(this).attr('target');

			rmel = jQuery('#' + targetDiv)
			rmeldetail = jQuery('#' + 'dettaglio_' + targetDiv)
			jQuery(rmel).remove();
			jQuery(rmeldetail).remove();
			clausolaVisibile = false;
			return true;
		} else {
			return false;
		}
	});



	/**
	
	 Scrittura del filtro
	
	 */


	jQuery(document).delegate('a.set-filter', 'click', function(e) {
		e.preventDefault();

		var content = jQuery('#filtro'),
			size = jQuery('#filtri >div').length + 1,
			element = null,
			element = content.clone();
		if (size == 1) {
			filterconditions = 1;
			jQuery('#filtri').attr('style', "display:block;")
		}
		else
			filterconditions = filterconditions + 1;

		let filtroId = 'filtro-' + filterconditions;
		element.attr('id', filtroId);
		element.find('.delete-written-filter').attr('target', filtroId);
		element.find('.edit-written-filter').attr('target', filtroId);

		//trasformo il filtro espresso nella clausola in un oggetto JSON

		var condizioni = $("#filterform").serialize().split('&');
		//alert (condizioni)

		filtro = {}

		for (cond in condizioni) {

			liscond = condizioni[cond].split('=')
			if (liscond[1].trim() != '' & liscond[1].trim() != liscond[0].trim())
				filtro[liscond[0]] = liscond[1].replaceAll('%20', ' ')
		}


		//mostro il filtro nella GUI
		let tuttiFiltri = "";
		var keys = Object.keys(filtro)//condizioniFiltro)
		for (key in keys) {
			var dlclass = $('<dl class="flex mb0 pa0 f6 lh-title mv0" />'),
				dtclass = $('<dt class="flex mb0 pa0 b mainflabel" />'),
				ddclass = $('<dd class="flex mb0 pa0 ml0 gray mainfvalue"/>');
			tuttiFiltri = tuttiFiltri + filtro[[keys[key]]] + ", ";
		}
		//element.find('.listacondizioni').append(dlclass);
		let virgola = tuttiFiltri.lastIndexOf(',');
		tuttiFiltri = tuttiFiltri.substring(0, virgola);
		let txtAreaFiltri = '<textarea id = ' + 'textarea-' + filterconditions +
			' readonly style="resize:none" class="flex mb0 pb0 bg-washed-blue bn" rows="1" cols="20" name="usrtxt" wrap="hard">' +
			tuttiFiltri + "</textarea>"
		ddclass.append(txtAreaFiltri);
		dlclass.append(dtclass);
		dlclass.append(ddclass);
		element.find('.listacondizioni').append(dlclass);
		element.attr('style', 'display.block');
		element.appendTo('#filtri');

		if (size > 1) {
			element.find('.andorconditions').attr('style', 'display.block');
		}

		//$('a.remove-filter').trigger('click');
		var targetDiv = jQuery(this).attr('targetfilter');

		rmel = jQuery('#' + targetDiv)
		rmeldetail = jQuery('#' + 'dettaglio_' + targetDiv)
		jQuery(rmel).remove();
		jQuery(rmeldetail).remove();
		clausolaVisibile = false;

		//aggiungo il filtro a quelli esistenti nel json

		filtro['tipoClausola'] = tipoClausola
		var clausolaquery = $("#searchValue").val()
		filtro['query'] = clausolaquery.trim();

		// eventualmente le 2 seguenti non funzionano Nicola
		//		checkedField = $('#lemma_forma').val();
		//		filtro['lemma_forma'] = checkedField

		condizioniFiltro['filtro-' + filterconditions] = filtro



		return true;
	})


	/**
	
	 Modifica del filtro scritto
	
	 */


	jQuery(document).delegate('a.update-filter', 'click', function(e) {

		//alert('Update not yet implemented, in progress...' + filterToEdit)

		AggiornaFiltro(filterToEdit);
		return true


	}
	)

	jQuery(document).delegate('#grammarbutton', 'click', function(e) {

		var size = Object.keys(condizioniFiltro).length;
		if (size == 0) {
			var clausola = $("#searchValue").val()
			clausola = clausola.trim();
			if (clausola == "" || clausola == ' ') {
				return false
			}

			filtro = {};
			filtro['query'] = clausola
			condizioniFiltro['filtro-1'] = filtro;

		}

		//definizione struttura della query

		condizioniFiltro = espressioneLogica(condizioniFiltro);
		// fine definizione struttura

		spquery = buildSQ(condizioniFiltro)
		queryFields = [];
		for (var i in spquery.variables) {
			queryFields.push(spquery.variables[i].variable.value);
		}
		execMySparqlQuery(new sparqlGenerator().stringify(spquery));

		return true
	}
	)

	function espressioneLogica(condizioniLogiche) {
		//definizione struttura della query
		var EsprLogica = ""
		filters = $("[id^=filtro-]")
		term = "";
		filters.each(function(index, element) {
			var mx = $(this).find('#andor');
			if (index == 0) {
				EsprLogica += ''
				term = $(this).attr('id')
			}
			else {
				EsprLogica = "(" + mx.val() + " " + term + " " + $(this).attr('id') + ") "
				term = EsprLogica
			}
		});
		condizioniLogiche['EsprLogica'] = EsprLogica.split(" ")
		return condizioniLogiche;
	}

	async function execMySparqlQuery(spQuery) {
		$("#loader").show();
		//alert(new sparqlGenerator().stringify(spQuery));
		bindingsStream = await myEngine.queryBindings(spQuery, { sources: [{ type: 'sparql', value: sparqlEndpoint },], });

		$("#sparqlquery").val(spQuery);
		$("#copiaQuery").prop("disabled", false);
		var resultTablePart1a = '<table id="resultTable" class="table table-striped table-bordered responsive nowrap"><thead><tr>';
		var resultTablePart1 = '<table id="resultTable" class="table table-striped table-bordered"><thead><tr>';
		var resultTablePart2 = '<th scope="col">#</th>';
		var resultTablePart3 = '</tr></thead><tbody>';
		var resultTablePart4 = '';
		var resultTablePart5 = '</tbody></table>';
		var resultTable = '';
		var rowNum = 1;
		for (var i = 0; i < queryFields.length; i++) {
			resultTablePart2 = resultTablePart2 + '<th scope="col">' + queryFields[i] + '</th>';
		};
		var resultTable = resultTablePart1 + resultTablePart2 + resultTablePart3;
		$('#resultsId1').empty();
		$('#resultsId1').addClass("small pb-2")
		$("#risultatitesto").empty();
		$("#risultatitesto").append("[\n");
		bindingsStream.on('data', (binding) => {
			//console.log(binding.toString()); // Quick way to print bindings for testing
			//console.log(binding.has('sub')); // Will be true
			resultTablePart4 = '<tr><th scope="row" class="text-muted">' + rowNum++ + '</th>';
			for (var i = 0; i < queryFields.length; i++) {
				if (binding.get(queryFields[i]) != null) {
					val = binding.get(queryFields[i]).value
				} else {
					val = "na"
				}
				resultTablePart4 = resultTablePart4 + '<td class="text-muted">' + val + "</td>";
			};
			resultTable = resultTable + resultTablePart4 + '</tr>';
			$("#risultatitesto").append(binding.toString() + ",\n");
			$("#loader").hide();
			//console.log(binding.get('form').value);
			//console.log(binding.get('form').termType);
			//console.log(binding.get('pred').value);
			//console.log(binding.get('obj').value);
		});
		bindingsStream.on('end', () => {
			resultTable = resultTable + resultTablePart5;
			$("#resultsId1").append(resultTable);
			$("#risultatitesto").append("]");
			$("#copiaTesto").prop("disabled", false);
			$('#resultTable').DataTable({
				colReorder: true,
				language: {
					url: 'dataTables.it-IT.json'
				},
				//dom: 'Blfrtip',
				dom: "<'row'<'col-sm-12 col-md-6'l><'col-sm-6 col-md-3'f><'col-sm-6 col-md-3 text-right'B>>" + "<'row'<'col-sm-12'tr>>" + "<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>",
				buttons: ['copy', 'excel', 'print']
			});
			setTimeout(function() {
				buttonDiv = $("#resultsId1").find(".buttons-copy");
				$('<label class="input-group-text"><ion-icon name="copy"></ion-icon></label>').insertBefore(buttonDiv);
			}, 300);
		});
	}
	function AggiornaFiltro(filtroId) {

		var content = jQuery('#filtro'),
			element = null,
			element = content.clone();


		element.attr('id', filtroId);
		element.find('.delete-written-filter').attr('target', filtroId);
		element.find('.edit-written-filter').attr('target', filtroId);

		//trasformo il filtro espresso nella clausola in un oggetto JSON

		var condizioni = $("#filterform").serialize().split('&');

		filtro = {}

		for (cond in condizioni) {

			liscond = condizioni[cond].split('=')
			if (liscond[1].trim() != '' & liscond[1].trim() != liscond[0].trim())
				filtro[liscond[0]] = liscond[1].replaceAll('%20', ' ')
		}


		//mostro il filtro nella GUI
		let tuttiFiltri = "";
		var keys = Object.keys(filtro);
		for (key in keys) {
			tuttiFiltri = tuttiFiltri + filtro[[keys[key]]] + ", ";
		}
		let virgola = tuttiFiltri.lastIndexOf(',');
		tuttiFiltri = tuttiFiltri.substring(0, virgola);


		let filterNum = filtroId.substring(7);


		$('#textarea-' + filterNum).val(tuttiFiltri);



		if (filterNum != 1) {
			element.find('.andorconditions').attr('style', 'display.none');
		}



		// rimuovo la finestra filtro

		rmel = jQuery('#' + "cg-2")
		rmeldetail = jQuery('#' + 'dettaglio_' + "cg-2")
		jQuery(rmel).remove();
		jQuery(rmeldetail).remove();
		clausolaVisibile = false;

		//aggiungo il filtro a quelli esistenti nel json

		filtro['tipoClausola'] = tipoClausola
		condizioniFiltro[filtroId] = filtro


		return true;
	}
	/**
		
	 Il Filtro "scritto" viene eliminato
		
	 */

	jQuery(document).delegate('a.delete-written-filter', 'click', function(e) {

		e.preventDefault();
		var didConfirm = confirm("Sei sicuro di voler cancellare il filtro?");
		if (didConfirm == true) {

			var targetDiv = jQuery(this).attr('target'); // nome filtro

			rmel = jQuery('#' + targetDiv)
			rmeldetail = jQuery('#' + targetDiv)
			jQuery(rmel).remove();
			jQuery(rmeldetail).remove();
			// se c'è un solo filtro, mi assicuro che non sia visibile il dropbox and/or
			size = jQuery('#filtri >div').length

			//nasconde la condizione logica dal primo della lista dei filtri
			if (size > 0) {
				var filtriscr = jQuery('#filtri >div');
				filtriscr.first().find('.andorconditions').attr('style', 'display:none');
			} else { // eliminato l'ultimo filtro
				jQuery('#filtri').attr('style', "display:none;")
			}

			delete condizioniFiltro[targetDiv];
			return true;
		} else {
			return false;
		}
	});




	/**
		
	 Il Filtro "scritto" viene editato
		
	 */

	jQuery(document).delegate('a.edit-written-filter', 'click', function(e) {

		e.preventDefault();
		if (clausolaVisibile)
			return true;

		var thisfilter = jQuery(this).attr('target');
		tempfiltro = condizioniFiltro[thisfilter]
		tempfiltro['target'] = thisfilter

		filterToEdit = thisfilter;

		if (tempfiltro['tipoClausola'].trim() == 'grammaticale') {

			clausolaVisibile = true;
			tipoClausola = 'grammaticale'
			showCategoriaGrammaticale(tempfiltro, thisfilter)


		}
		if (tempfiltro['tipoClausola'].trim() == 'sintattica') {

			clausolaVisibile = true;
			tipoClausola = 'sintattica'
			showClausolaSintattica(tempfiltro, thisFilter)


		}

		return true;
		/*} else {
			return false;
		}*/
	});

	/**
	 *
	 *		Visualizza Categoria Grammaticale
	 */

	function showCategoriaGrammaticale(valoriFiltro = {}, filtroTarget = '') {


		var content = jQuery('#categoriagrammaticale >div'),
			size = jQuery('#condizioni >div').length + 1,
			element = null,
			element = content.clone();

		checkedField = $('input[name=lemma_forma]:checked', '#filterform').val();

		var radios = $(":radio");


		//$(":radio").prop("checked", false);
		$(":checkbox").prop("checked", false);
		//
		//		for (radio in radios) {
		//			if (radios[radio].val == checkedField) {
		//				radios[radio].checked = true;
		//			}
		//		}

		element.attr('id', 'cg-' + size);
		element.find('.remove-filter').attr('target', 'cg-' + size);
		element.find('.set-filter').attr('targetfilter', 'cg-' + size);
		element.appendTo('#condizioni');

		if (!jQuery.isEmptyObject(valoriFiltro)) { // sto facendo la modfica di un filtro

			$("#types").val(valoriFiltro['categoria']).trigger("change");
			var keys = Object.keys(valoriFiltro)//condizioniFiltro)
			for (key in keys) {
				myname = keys[key]
				myname = myname.replaceAll('%20', ' ')
				myval = valoriFiltro[keys[key]]

				var edelement = $("[name='" + myname + "'");
				var edeltype = edelement.attr('type')
				//alert(edeltype)
				if (edeltype !== undefined & (edeltype == 'radio' | edeltype == 'checkbox')) {
					$('[value="' + myval + '"]').prop('checked', true);
				}
				else {
					$("[name='" + myname + "'").val(myval)
				}



			}
			element.find('.update-filter').attr('targetfilter', filtroTarget);
			element.find(".set-filter").attr('style', 'display:none')
			element.find(".update-filter").attr('style', 'display:compact')

		}
		else { //sto creando una clausola grammaticale nuova, definisco il valore di default

			$("#types").val("verbovolgare").trigger("change");
		}
		valoriFiltro = {}
		element.find('.sn').html(size);
		grammarconditions = grammarconditions + 1

		if (size == 1)
			jQuery('#grammarbutton').attr('style', "display:block;")

	}

	/**
	 Visualizza Clausola Sintattica
		
	 */

	function showClausolaSintattica(valoriFiltro = {}, filtroTarget = '') {


		var content = jQuery('#tiposintattico >div'),
			size = jQuery('#condizioni >div').length + 1,
			element = null,
			element = content.clone();
		element.attr('id', 'ts-' + size);

		element.find('.remove-filter').attr('target', 'ts-' + size);
		element.find('.set-filter').attr('targetfilter', 'ts-' + size);
		element.appendTo('#condizioni');
		if (!jQuery.isEmptyObject(valoriFiltro)) { // sto facendo l'edit di un filtro

			$("#types").val(valoriFiltro['categoria']).trigger("change");
			var keys = Object.keys(valoriFiltro)//condizioniFiltro)
			for (key in keys) {
				myname = keys[key]
				myval = valoriFiltro[keys[key]]
				var edelement = $("[name='" + myname + "'");
				var edeltype = edelement.attr('type')
				//alert(edeltype)
				if (edeltype !== undefined & (edeltype == 'radio' | edeltype == 'checkbox')) {
					$('[value="' + myval + '"]').prop('checked', true);
				}
				else {
					$("[name='" + myname + "'").val(myval)
				}


			}
		}

		element.find('.sn').html(size);
		sintconditions = sintconditions + 1
		if (size == 1)
			jQuery('#grammarbutton').attr('style', "display:block;")
	}


	jQuery(document).delegate('a.add-details', 'click', function(e) {
		e.preventDefault();

		var targetDiv = jQuery(this).attr('target');

		rmel = jQuery('#' + targetDiv)
		var curstyle = rmel.attr('view')

		if (curstyle !== undefined && curstyle === 'y') {

			rmel.children().attr('style', 'display:none');
			rmel.attr('view', 'n')
		}
		else {
			rmel.attr('view', 'y')
			rmel.children().attr('style', 'display:block');
		}

		return true;


	});
	//Cesare
	$(function() {
		$("#filtri").sortable({
			//items: "div:(.ui-state-enabled)"
			cursor: 'move',
			update: function() {

				myfilters = $("[id^=filtro-]")

				$("[id^=filtro-]").each(function(index, element) {
					var mx = $(this).find('#andor');
					if (index == 0)
						mx.attr('style', "display:none;")
					else
						mx.attr('style', "display:block;")


					//console.log($( this ));
				});


			}
		});
	});

});