From c51380e42e595427925e6cb95e5f3a93531b9fdd Mon Sep 17 00:00:00 2001 From: nicola Date: Sun, 22 Jan 2023 17:38:22 +0100 Subject: [PATCH] Aggiunto funzione popover al testo --- css/browsingldc.css | 43 +- js/cesareBrowse.js | 1256 +++++++++++++++++++++++-------------------- 2 files changed, 699 insertions(+), 600 deletions(-) diff --git a/css/browsingldc.css b/css/browsingldc.css index 57d1755..44f223d 100644 --- a/css/browsingldc.css +++ b/css/browsingldc.css @@ -89,18 +89,37 @@ Minimap .minimap__content { position:absolute; - top: 0; - - left: 0; - - width:100%; - - height: 100%; - - z-index: -1; - - transform-origin: 0 0; - + top: 0; + left: 0; + width:100%; + height: 100%; + z-index: -1; + transform-origin: 0 0; border: 1px solid white; } +/* on mouseOver classes */ + +.Nik_dropdown { + position: relative; + display: inline-block; +} + +.Nik_dropdown-content { + display: none; + position: absolute; + top: -60px; + left: 50px; + background-color: rgb(252, 252, 252); + min-width: 270px; + box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); + padding: 8px 8px; + color:red; + font-size: 10; + z-index: 1; + float: top; +} + +.Nik_dropdown:hover .Nik_dropdown-content { + display: block; +} diff --git a/js/cesareBrowse.js b/js/cesareBrowse.js index 43af8df..58f002d 100644 --- a/js/cesareBrowse.js +++ b/js/cesareBrowse.js @@ -5,594 +5,6 @@ $(document).ready(function() { - const cantobadgeclass = 'badge badge-outline-info badge-pill' - - const sparqlGenerator = sparqljs.Generator; - const myEngine = new Comunica.QueryEngine(); - const sparqlEndpoint = "https://hdnlab1.isti.cnr.it/fuseki/commediaontosintgra/query"; - - var shownSentenceList = new Set() - - var currentMinimap = '' - var listarisultati = []; - var resultSentences = new Set() - var minimapScrolling = false; - var displayId = 'displaycanto' - var minimapTopPos; - var purgatorioLoaded = false; - var paradisoLoaded = false; - - //used in minimap - // - let minimap = document.createElement('div'); - let minimapSize = document.createElement('div'); - let viewer = document.createElement('div'); - let minimapContent = document.createElement('iframe'); - let realScale; - let mappedElement = ''; - - resetResult=function(){ - //console.log('clean result') - cleanSearchResult() - esprlogica = [] - } - - hideMinimap(); - createAllDivCanti() - const start = performance.now(); - showCantica('Inferno') - showCantica('Purgatorio') - showCantica('Paradiso') - $("#InfernoCanto_1").attr('style', 'display:block') - drawMinimap("InfernoCanto_1") - const end = performance.now(); - console.log(`Load cantiche time: ${end - start} ms`); - - - - $("[data-cg]").hover(function() { - var details=getHoverContent($(this).data("cg")) - var index = details.indexOf(","); - var sentencetype= $(this).attr('class'); - - var categoria = ""; - if (index != -1){ - categoria = details.substring(0,index); - details = details.substring(index+1); - }else{ - categoria = details; - details = ""; - } - $(this).popover({title: categoria, content: details+"
Periodo
", html:true, placement: "top", - trigger: "click"}).on("hidden.bs.popover", function(e) { - sentenceId=$(this).attr('class').split(' ')[0].replace('$',''); - resetSentenceStructure(sentenceId) - shownSentenceList.delete(sentenceId) - }); - }); - /* - jQuery(document).delegate('#cantica2', 'click', function(e) { - e.preventDefault(); - - if (!purgatorioLoaded){ - showCantica('Purgatorio') - purgatorioLoaded = true; - } - - }); - jQuery(document).delegate('#cantica3', 'click', function(e) { - e.preventDefault(); - - if (!paradisoLoaded){ - showCantica('Paradiso') - paradisoLoaded = true; - } - - }); - */ - - jQuery(document).delegate('#sentence', 'click', function(e) { - e.preventDefault(); - sentenceId=$(this).attr('class').split(' ')[0].replace('$','') - console.log(sentenceId) - if (shownSentenceList.has(sentenceId)){ - resetSentenceStructure(sentenceId) - shownSentenceList.delete(sentenceId) - } - else{ - showSentenceStructure (sentenceId) - shownSentenceList.add(sentenceId) - } - - }); - - var mmih = 0 - var mmiw = 0 - - - $("#" + displayId).scroll(function() { - if (minimapScrolling) { - minimapScrolling = false - console.log('no scroll') - } - else { - console.log('yes scrolling') - console.log("viewer top pos before: " + $('#minimapviewer').offset().top) - trackScrollCanto() - console.log("viewer top pos after: " + $('#minimapviewer').offset().top) - } - }); - - - - jQuery(document).delegate('.navig-canto', 'click', function(e) { - $('.canto').each(function() { - $(this).attr("style", 'display:none'); - }); - // Crea id per la div che contiene il canto - $("#" + $(this).attr('name').replace(" ", "_")).attr('style', 'display:block') - manageMiniMap(this); - - }); - - function manageMiniMap(divElem) { - mmiw = $("#" + displayId).innerWidth(); - mmih = $("#" + displayId).innerHeight(); - drawMinimap($(divElem).attr('name').replace(" ", "_")) - } - - //Query - - jQuery(document).delegate('#searchcomm, #searchcomm2', 'click', function(e) { - e.preventDefault(); - manageQuery() - }); - - - //Reset - - jQuery(document).delegate('#cleanresult', 'click', function(e) { - console.log('clean') - cleanSearchResult() - esprlogica = [] - $('#queryText').val("") - - }); - - //Utility functions - - function getHoverContent(categ){ - //console.log('Categoria '+categ) - if(categ.includes('^')){ - categs=categ.split('^') - mycat=[] - for (cat of categs){ - mycat.push(cat[0]) - } - console.log(mycat.join('-')) - return categoriegrammaticali[mycat.join('-')] - } - if (categ[0]=='v'){ - return parserVerbi.parse(categ).split(',').filter(prop => prop.length > 0).join() - } - if(categ[0]=='s'){ - return parserSostantivi.parse(categ).split(',').filter(prop => prop.length > 0).join() - } - if(categ[0]=='e'){ - return parserPreposizioni.parse(categ).split(',').filter(prop => prop.length > 0).join() - } - if(categ[0]=='b'){ - return parserAvverbi.parse(categ).split(',').filter(prop => prop.length > 0).join() - } - if(categ[0]=='p'){ - return parserPronomi.parse(categ).split(',').filter(prop => prop.length > 0).join() - } - if(categ[0]=='a'){ - return parserAggettivi.parse(categ).split(',').filter(prop => prop.length > 0).join() - } - if(categ[0]=='r'){ - return parserArticolo.parse(categ).split(',').filter(prop => prop.length > 0).join() - } - if (categ[0] == 'f') { - return parserCitazione.parse(categ).split(',').filter(prop => prop.length > 0).join(); - } - if (categ[0] == 'n') { - return parserOnomastica.parse(categ).split(',').filter(prop => prop.length > 0).join(); - } - if (categ[0] == 'c') { - return parserCongiunzione.parse(categ).split(',').filter(prop => prop.length > 0).join(); - } - return categoriegrammaticali[categ[0]] - } - - function drawMinimap(name){ - - showMinimap(name) - currentMinimap = name; - - //mmviewer diventa draggable - var minimapTopPos = $('#minimapviewer').offset().top - console.log("top viewer init " + minimapTopPos) - - $('#minimapviewer').draggable({ - axis: "y", - containment: $('#displayminimap'), - scroll: false, - start: function(event, ui) { minimapScrolling = true; }, - stop: function(event, ui) { minimapScrolling = false; }, - drag: function(event, ui) { - - minimapScrolling = true; - trackScrollViewer(ui.offset.top - minimapTopPos); - console.log(ui); - } - }); - } - - function cleanSearchResult() { - for (forma of listarisultati) { - idforma = '#' + forma - $(idforma).removeClass("font-weight-bold mark ") - } - $(".badge").remove(); - listarisultati = [] - resultSentences=new Set() - if (currentMinimap != '') - showMinimap(currentMinimap) - } - - - function manageQuery(){ - cleanSearchResult() - esprlogica = [] - jsonQuery=getJsonQuery() - console.log("got json query") - if(jsonQuery['QueryAvanzata']==0 && jsonQuery['Clausola0']['queryText']==''){ - alert('Digitare una stringa da cercare') - return - } - jsonQuery = buildSQ(jsonQuery) - - myquery = new sparqlGenerator().stringify(jsonQuery) - console.log(myquery) - executeQuerySearch(myquery) - } - - //manage sentence and clauses - - function showSentenceStructure(sentence) { - - sid = '.' + sentence.toString() - //console.log(sid) - $(sid).addClass('font-italic') - - $(sid).each(function(){ - //console.log($(this).attr('class')) - if ($(this).attr('class').includes(' Ma ')){ - $(this).addClass("text-primary font-weight-normal") - } - if ($(this).attr('class').includes(' Su ')){ - $(this).addClass("text-info font-weight-normal") - } - if ($(this).attr('class').includes(' Co ')){ - $(this).addClass("text-warning font-weight-normal") - } - if ($(this).attr('class').includes(' Pc ')){ - $(this).addClass("text-success font-weight-normal") - } - if ($(this).attr('class').includes(' Pa ')){ - $(this).addClass("text-secondary font-weight-normal") - } - }) - - } - - function resetSentenceStructure(sentence) { - $(" ." + sentence).removeClass('text-info font-weight-normal') - $(" ." + sentence).removeClass('text-primary font-weight-normal') - $(" ." + sentence).removeClass('text-secondary font-weight-normal') - $(" ." + sentence).removeClass('text-warning font-weight-normal') - $(" ." + sentence).removeClass('text-success font-weight-normal') - $(" ." + sentence).removeClass('font-italic') - } - - //minimap management - - - function showMinimap(element) { - mmplace = document.getElementById('displayminimap') - minimap.className = 'minimap__container' - minimapSize.className = 'minimap__size' - viewer.className = 'minimap__viewer' - viewer.id = 'minimapviewer' - minimapContent.className = 'minimap__content' - minimap.append(minimapSize, viewer, minimapContent); - - mmplace.appendChild(minimap) - - let html = document.getElementById(element).outerHTML//innerHTML - if (html == null | html == '') - return; - - let iFrameDoc = minimapContent.contentWindow.document; - var cssLinkb = document.createElement("link"); - cssLinkb.href = "https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css"; - cssLinkb.rel = "stylesheet"; - cssLinkb.type = "text/css"; - - var cssLinkscroll = document.createElement("link"); - cssLinkscroll.href = "./css/browsingldc.css"; - cssLinkscroll.rel = "stylesheet"; - cssLinkscroll.type = "text/css"; - - iFrameDoc.open(); - iFrameDoc.write(html); - iFrameDoc.close(); - - iFrameDoc.head.appendChild(cssLinkb); - iFrameDoc.head.appendChild(cssLinkscroll); - mappedElement = element - - getDimensionsDiv() - - window.addEventListener('scroll', trackScroll) - window.addEventListener('resize', getDimensionsDiv) - } - - - - - function getInnerHeight(elm) { - var computed = getComputedStyle(elm), - padding = parseInt(computed.paddingTop) + parseInt(computed.paddingBottom); - - return elm.clientHeight - padding - } - - function getDimensionsDiv() { - var cantoplace = document.getElementById(displayId) - var elementplace = document.getElementById(mappedElement) - - var bodyWidth = elementplace.clientWidth; - var bodyRatio = elementplace.clientHeight / bodyWidth; - - let winRatio = getInnerHeight(cantoplace) / (cantoplace.clientWidth); - - //minimap.style.width='15%'; - minimap.style.width = '100%'; - - realScale = minimap.clientWidth / bodyWidth; - - minimapSize.style.paddingTop = `${bodyRatio * 100}%` - viewer.style.paddingTop = `${winRatio * 100}%`; - minimapContent.style.transform = `scale(${realScale})`; - minimapContent.style.width = `${(100 / realScale)}%`; - minimapContent.style.height = `${(100 / realScale)}%`; - //minimapContent.style.height=`100%`; - minimapContent.style.float = 'right'; - } - - function trackScroll() { - //console.log(window.scrollY) - viewer.style.transform = `translateY(${window.scrollY * realScale}px)` - } - function trackScrollCanto() { - console.log('cantoscrollT*realscale ' + document.getElementById(displayId).scrollTop * realScale + ' top: ' + document.getElementById(displayId).scrollTop) - viewer.style.transform = `translateY(${document.getElementById(displayId).scrollTop * realScale}px)` - } - function trackScrollViewer(toppos) { - console.log('scrollMMView top*1/realScale: ' + toppos * (1 / realScale) + ' top pos: ' + toppos) - did = document.getElementById(displayId) - - did.scrollTop = (toppos * (1 / realScale)) - } - - function hideMinimap() { - $('.canto').each(function() { - $(this).attr("style", 'display:none'); - }); - $(".minimap__container").remove(); - currentMinimap = '' - } - - //Cantica management functions - - function showCantica(cantica) { - //var listaCanti = new Set() - var setVersi = new Set() - var containerForme = formeprima - var idcantica=1; - if (cantica == 'Paradiso'){ - containerForme = formeterza - idcantica=3 - } - - if (cantica == 'Purgatorio'){ - containerForme = formeseconda - idcantica=2 - } - - const endlc = performance.now(); - console.log(`Load `+cantica+` time: ${endlc - start} ms`); - var elverso, formaItem - for (var cmpItem of containerForme) { - - formaItem = cmpItem.split("_") - var sentenceid=idcantica+"_"+formaItem[1]+"_s_"+formaItem[5] - //createDivVerso(cantica, num, canto, forma, catgram, pos) - if (! setVersi.has(cantica + "_" + formaItem[3] + "_" + 'Canto_' + formaItem[1])){ - elverso=createDivVerso(cantica, formaItem[3], 'Canto_' + formaItem[1], formaItem[0], formaItem[4], formaItem[2], sentenceid,formaItem[6]) - setVersi.add(cantica+ "_" + formaItem[3] + "_" + 'Canto_' + formaItem[1]) - } - else{ - createSpanFormeNew(cantica, 'Canto_' + formaItem[1], formaItem[3], formaItem[0], formaItem[4], formaItem[2], sentenceid,formaItem[6],elverso) - } - - } - return - } - - - function createSpanFormeNew(cantica, canto, numverso, forma, catgramm, pos, sentenceid, clausefunct, elementoverso) { - var spanoccorrenza = $('') - spanoccorrenza.attr('id', pos) - spanoccorrenza.attr('data-cg', catgramm) - spanoccorrenza.attr('class', sentenceid+" "+clausefunct) - - //if (listarisultati.length > 0 && listarisultati.includes(spanoccorrenza.attr('id'))) - // spanoccorrenza.attr('class', "font-weight-bold mark ") - spanoccorrenza.append(forma+" ") - - spanoccorrenza.appendTo(elementoverso) - - } - - function createDivVerso(cantica, num, canto, forma, catgram, pos, sentenceid, clausefunct) { - - var elementoverso = $('

') - - elementoverso.append(num + ". ") - elementoverso.attr("style", "line-height: 0.5em") - - elementoverso.attr('class', 'f6 text-secondary text-nowrap font-weight-lighter '+cantica+' '+canto) - - elementoverso.attr('id', cantica + "_" + canto + "_" + num) - - var spanoccorrenza = $('') - - spanoccorrenza.attr('id', pos) - spanoccorrenza.attr('data-cg', catgram) - spanoccorrenza.attr('class', sentenceid+" "+clausefunct) - - spanoccorrenza.append(forma+" ") - spanoccorrenza.appendTo(elementoverso) - - elementoverso.appendTo('#' + cantica + canto) - return elementoverso - - } - - - function createAllDivCanti() { - cantiche=["Inferno", "Purgatorio","Paradiso"] - for (cantica of cantiche){ - for (var i=1; i<35; i++){ - if(i==34 && cantica!=="Inferno"){ - continue - } - canto= "Canto "+i - var divcanto = $('

') - var titolocanto = $('

') - titolocanto.append(cantica + ", " + canto) - divcanto.attr('class', 'canto') - divcanto.attr('style', 'display:none') - divcanto.attr('id', (cantica + canto).replace(" ", "_")) - titolocanto.appendTo(divcanto) - divcanto.appendTo(' .blog-main') - } - } - } - - //execute query - - async function executeQuerySearch(query) { - seachbBindingsStream = await myEngine.queryBindings(query, { sources: [{ type: 'sparql', value: sparqlEndpoint },], }); - //console.log(query) - alert(query) - try { - var result = new Set() - var resultClauses = new Set() - - var resultsInCantica = [] - var resultsInCanto = [] - seachbBindingsStream.on('data', (binding) => { - //cantica - cantica = binding.get('Cantica').value; - - //canto - canto = binding.get('Canto').value; - - //numero del verso - numverso = binding.get('NumeroVerso').value; - //posizione del frammento - pos = binding.get('pos').value; - //regione della clausola - var clfrom=binding.get('clfr').value; - var clto=binding.get('clto').value; - var cltype=binding.get('clatype').value - //id del periodo - var sentenceid=binding.get('sentence').value.replace('http://dantenetwork.it/data/commedia/','') - //console.log(sentenceid) - - if (!result.has(pos)){ - result.add(pos) - resultsInCantica.push(cantica); - resultsInCanto.push(cantica + canto) - } - resultClauses.add(cantica + "_" + canto.replace(" ", "_") + "_" + numverso + "-" +clfrom+'_'+clto+"-"+cltype) - resultSentences.add(sentenceid) - - }); - seachbBindingsStream.on('end', () => { - console.log('start rendering...') - listarisultati = Array.from(result) - - cantiche = ["Inferno", "Purgatorio", "Paradiso"] - - - console.log('periodi end...') - - //evidenzia risultati - for (ris of listarisultati) { - idris = '#' + ris - //$(idris).attr('class', "font-weight-bold mark ") - $(idris).addClass("font-weight-bold mark ") - - } - //aggiunge badge con totale risultati accanto alle cantiche - i = 0 - for (cantica of cantiche) { - i += 1 - let count = resultsInCantica.reduce((n, x) => n + (x === cantica), 0); - if (count>0){ - var spanbadgecantica = $(''); - spanbadgecantica.attr('class', 'badge badge-primary badge-pill ml-1'); - spanbadgecantica.append(count) - spanbadgecantica.appendTo($('#cantica' + i)) - } - } - //aggiunge badge con totale risultati accanto ai canti - console.log('results end...') - for (cantica of cantiche) { - for (k of Array(35).keys()) { - if (k == 0) - continue - let count = resultsInCanto.reduce((n, x) => n + (x === cantica + 'Canto ' + k), 0); - if (count>0){ - var spanbadge = $(''); - spanbadge.attr('class', cantobadgeclass); - spanbadge.append(count) - //$("[name='nameofobject']") - spanbadge.appendTo($('[name="' + cantica + 'Canto ' + k + '"]')) - //spanbadge.insertAfter($('[name="'+cantica+'Canto '+k+'"]')) - } - } - } - console.log('badge end...') - - //aggiorna minimap - if (currentMinimap != '') { - showMinimap(currentMinimap) - } - - }); - } - catch (err) { - console.log(err.message); - }; - - }; /* * REGOLE DI PARSING PER VISUALIZZAZIONE CATEGORIE GRAMMATICALI @@ -1063,4 +475,672 @@ var parserCitazione = peg.generate(citazione); var parserOnomastica = peg.generate(onomastica); var parserCongiunzione = peg.generate(congiunzione); + + + + + + + const cantobadgeclass = 'badge badge-outline-info badge-pill' + + const sparqlGenerator = sparqljs.Generator; + const myEngine = new Comunica.QueryEngine(); + const sparqlEndpoint = "https://hdnlab1.isti.cnr.it/fuseki/commediaontosintgra/query"; + + var shownSentenceList = new Set() + + var currentMinimap = '' + var listarisultati = []; + var resultSentences = new Set() + var minimapScrolling = false; + var displayId = 'displaycanto' + var minimapTopPos; + var purgatorioLoaded = false; + var paradisoLoaded = false; + + //used in minimap + // + let minimap = document.createElement('div'); + let minimapSize = document.createElement('div'); + let viewer = document.createElement('div'); + let minimapContent = document.createElement('iframe'); + let realScale; + let mappedElement = ''; + + resetResult=function(){ + //console.log('clean result') + cleanSearchResult() + esprlogica = [] + } + + hideMinimap(); + createAllDivCanti() + const start = performance.now(); + showCantica('Inferno') + showCantica('Purgatorio') + showCantica('Paradiso') + $("#InfernoCanto_1").attr('style', 'display:block') + drawMinimap("InfernoCanto_1") + const end = performance.now(); + console.log(`Load cantiche time: ${end - start} ms`); + + + + $("[data-cg]").hover(function() { + var details=getHoverContent($(this).data("cg")) + var index = details.indexOf(","); + var sentencetype= $(this).attr('class'); + + var categoria = ""; + if (index != -1){ + categoria = details.substring(0,index); + details = details.substring(index+1); + }else{ + categoria = details; + details = ""; + } + $(this).popover({title: categoria, content: details+"
Periodo
", html:true, placement: "top", + trigger: "click"}).on("hidden.bs.popover", function(e) { + sentenceId=$(this).attr('class').split(' ')[0].replace('$',''); + resetSentenceStructure(sentenceId) + shownSentenceList.delete(sentenceId) + }); + }); + /* + jQuery(document).delegate('#cantica2', 'click', function(e) { + e.preventDefault(); + + if (!purgatorioLoaded){ + showCantica('Purgatorio') + purgatorioLoaded = true; + } + + }); + jQuery(document).delegate('#cantica3', 'click', function(e) { + e.preventDefault(); + + if (!paradisoLoaded){ + showCantica('Paradiso') + paradisoLoaded = true; + } + + }); + */ + + jQuery(document).delegate('#sentence', 'click', function(e) { + e.preventDefault(); + sentenceId=$(this).attr('class').split(' ')[0].replace('$','') + console.log(sentenceId) + if (shownSentenceList.has(sentenceId)){ + resetSentenceStructure(sentenceId) + shownSentenceList.delete(sentenceId) + } + else{ + showSentenceStructure (sentenceId) + shownSentenceList.add(sentenceId) + } + + }); + + var mmih = 0 + var mmiw = 0 + + + $("#" + displayId).scroll(function() { + if (minimapScrolling) { + minimapScrolling = false + console.log('no scroll') + } + else { + console.log('yes scrolling') + console.log("viewer top pos before: " + $('#minimapviewer').offset().top) + trackScrollCanto() + console.log("viewer top pos after: " + $('#minimapviewer').offset().top) + } + }); + + + + jQuery(document).delegate('.navig-canto', 'click', function(e) { + $('.canto').each(function() { + $(this).attr("style", 'display:none'); + }); + // Crea id per la div che contiene il canto + $("#" + $(this).attr('name').replace(" ", "_")).attr('style', 'display:block') + manageMiniMap(this); + + }); + + function manageMiniMap(divElem) { + mmiw = $("#" + displayId).innerWidth(); + mmih = $("#" + displayId).innerHeight(); + drawMinimap($(divElem).attr('name').replace(" ", "_")) + } + + //Query + + jQuery(document).delegate('#searchcomm, #searchcomm2', 'click', function(e) { + e.preventDefault(); + manageQuery() + }); + + + //Reset + + jQuery(document).delegate('#cleanresult', 'click', function(e) { + console.log('clean') + cleanSearchResult() + esprlogica = [] + $('#queryText').val("") + + }); + + //Utility functions + + function getHoverContent(categ){ + //console.log('Categoria '+categ) + + try { + + if(categ.includes('^')){ + categs=categ.split('^') + mycat=[] + for (cat of categs){ + mycat.push(cat[0]) + } + console.log(mycat.join('-')) + return categoriegrammaticali[mycat.join('-')] + } + if (categ[0]=='v'){ + return parserVerbi.parse(categ).split(',').filter(prop => prop.length > 0).join() + } + if(categ[0]=='s'){ + return parserSostantivi.parse(categ).split(',').filter(prop => prop.length > 0).join() + } + if(categ[0]=='e'){ + return parserPreposizioni.parse(categ).split(',').filter(prop => prop.length > 0).join() + } + if(categ[0]=='b'){ + return parserAvverbi.parse(categ).split(',').filter(prop => prop.length > 0).join() + } + if(categ[0]=='p'){ + return parserPronomi.parse(categ).split(',').filter(prop => prop.length > 0).join() + } + if(categ[0]=='a'){ + return parserAggettivi.parse(categ).split(',').filter(prop => prop.length > 0).join() + } + if(categ[0]=='r'){ + return parserArticolo.parse(categ).split(',').filter(prop => prop.length > 0).join() + } + if (categ[0] == 'f') { + return parserCitazione.parse(categ).split(',').filter(prop => prop.length > 0).join(); + } + if (categ[0] == 'n') { + return parserOnomastica.parse(categ).split(',').filter(prop => prop.length > 0).join(); + } + if (categ[0] == 'c') { + return parserCongiunzione.parse(categ).split(',').filter(prop => prop.length > 0).join(); + }else{ + return categoriegrammaticali[categ[0]] + } + } catch (Exception ) { + console.log("error parsing "+categ) + return ("error parsing "+categ); + } + } + + function drawMinimap(name){ + + showMinimap(name) + currentMinimap = name; + + //mmviewer diventa draggable + var minimapTopPos = $('#minimapviewer').offset().top + console.log("top viewer init " + minimapTopPos) + + $('#minimapviewer').draggable({ + axis: "y", + containment: $('#displayminimap'), + scroll: false, + start: function(event, ui) { minimapScrolling = true; }, + stop: function(event, ui) { minimapScrolling = false; }, + drag: function(event, ui) { + + minimapScrolling = true; + trackScrollViewer(ui.offset.top - minimapTopPos); + console.log(ui); + } + }); + } + + function cleanSearchResult() { + for (forma of listarisultati) { + idforma = '#' + forma + $(idforma).removeClass("font-weight-bold mark ") + } + $(".badge").remove(); + listarisultati = [] + resultSentences=new Set() + if (currentMinimap != '') + showMinimap(currentMinimap) + } + + + function manageQuery(){ + cleanSearchResult() + esprlogica = [] + jsonQuery=getJsonQuery() + console.log("got json query") + if(jsonQuery['QueryAvanzata']==0 && jsonQuery['Clausola0']['queryText']==''){ + alert('Digitare una stringa da cercare') + return + } + jsonQuery = buildSQ(jsonQuery) + + myquery = new sparqlGenerator().stringify(jsonQuery) + console.log(myquery) + executeQuerySearch(myquery) + } + + //manage sentence and clauses + + function showSentenceStructure(sentence) { + + sid = '.' + sentence.toString() + //console.log(sid) + $(sid).addClass('font-italic') + + $(sid).each(function(){ + //console.log($(this).attr('class')) + if ($(this).attr('class').includes(' Ma ')){ + $(this).addClass("text-primary font-weight-normal") + } + if ($(this).attr('class').includes(' Su ')){ + $(this).addClass("text-info font-weight-normal") + } + if ($(this).attr('class').includes(' Co ')){ + $(this).addClass("text-warning font-weight-normal") + } + if ($(this).attr('class').includes(' Pc ')){ + $(this).addClass("text-success font-weight-normal") + } + if ($(this).attr('class').includes(' Pa ')){ + $(this).addClass("text-secondary font-weight-normal") + } + }) + + } + + function resetSentenceStructure(sentence) { + $(" ." + sentence).removeClass('text-info font-weight-normal') + $(" ." + sentence).removeClass('text-primary font-weight-normal') + $(" ." + sentence).removeClass('text-secondary font-weight-normal') + $(" ." + sentence).removeClass('text-warning font-weight-normal') + $(" ." + sentence).removeClass('text-success font-weight-normal') + $(" ." + sentence).removeClass('font-italic') + } + + //minimap management + + + function showMinimap(element) { + mmplace = document.getElementById('displayminimap') + minimap.className = 'minimap__container' + minimapSize.className = 'minimap__size' + viewer.className = 'minimap__viewer' + viewer.id = 'minimapviewer' + minimapContent.className = 'minimap__content' + minimap.append(minimapSize, viewer, minimapContent); + + mmplace.appendChild(minimap) + + let html = document.getElementById(element).outerHTML//innerHTML + if (html == null | html == '') + return; + + let iFrameDoc = minimapContent.contentWindow.document; + var cssLinkb = document.createElement("link"); + cssLinkb.href = "https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css"; + cssLinkb.rel = "stylesheet"; + cssLinkb.type = "text/css"; + + var cssLinkscroll = document.createElement("link"); + cssLinkscroll.href = "./css/browsingldc.css"; + cssLinkscroll.rel = "stylesheet"; + cssLinkscroll.type = "text/css"; + + iFrameDoc.open(); + iFrameDoc.write(html); + iFrameDoc.close(); + + iFrameDoc.head.appendChild(cssLinkb); + iFrameDoc.head.appendChild(cssLinkscroll); + mappedElement = element + + getDimensionsDiv() + + window.addEventListener('scroll', trackScroll) + window.addEventListener('resize', getDimensionsDiv) + } + + + + + function getInnerHeight(elm) { + var computed = getComputedStyle(elm), + padding = parseInt(computed.paddingTop) + parseInt(computed.paddingBottom); + + return elm.clientHeight - padding + } + + function getDimensionsDiv() { + var cantoplace = document.getElementById(displayId) + var elementplace = document.getElementById(mappedElement) + + var bodyWidth = elementplace.clientWidth; + var bodyRatio = elementplace.clientHeight / bodyWidth; + + let winRatio = getInnerHeight(cantoplace) / (cantoplace.clientWidth); + + //minimap.style.width='15%'; + minimap.style.width = '100%'; + + realScale = minimap.clientWidth / bodyWidth; + + minimapSize.style.paddingTop = `${bodyRatio * 100}%` + viewer.style.paddingTop = `${winRatio * 100}%`; + minimapContent.style.transform = `scale(${realScale})`; + minimapContent.style.width = `${(100 / realScale)}%`; + minimapContent.style.height = `${(100 / realScale)}%`; + //minimapContent.style.height=`100%`; + minimapContent.style.float = 'right'; + } + + function trackScroll() { + //console.log(window.scrollY) + viewer.style.transform = `translateY(${window.scrollY * realScale}px)` + } + function trackScrollCanto() { + console.log('cantoscrollT*realscale ' + document.getElementById(displayId).scrollTop * realScale + ' top: ' + document.getElementById(displayId).scrollTop) + viewer.style.transform = `translateY(${document.getElementById(displayId).scrollTop * realScale}px)` + } + function trackScrollViewer(toppos) { + console.log('scrollMMView top*1/realScale: ' + toppos * (1 / realScale) + ' top pos: ' + toppos) + did = document.getElementById(displayId) + + did.scrollTop = (toppos * (1 / realScale)) + } + + function hideMinimap() { + $('.canto').each(function() { + $(this).attr("style", 'display:none'); + }); + $(".minimap__container").remove(); + currentMinimap = '' + } + + //Cantica management functions + + function showCantica(cantica) { + //var listaCanti = new Set() + var setVersi = new Set() + var containerForme = formeprima + var idcantica=1; + if (cantica == 'Paradiso'){ + containerForme = formeterza + idcantica=3 + } + + if (cantica == 'Purgatorio'){ + containerForme = formeseconda + idcantica=2 + } + + const endlc = performance.now(); + console.log(`Load `+cantica+` time: ${endlc - start} ms`); + var elverso, formaItem + for (var cmpItem of containerForme) { + + formaItem = cmpItem.split("_") + var sentenceid=idcantica+"_"+formaItem[1]+"_s_"+formaItem[5] + //createDivVerso(cantica, num, canto, forma, catgram, pos) + if (! setVersi.has(cantica + "_" + formaItem[3] + "_" + 'Canto_' + formaItem[1])){ + elverso=createDivVerso(cantica, formaItem[3], 'Canto_' + formaItem[1], formaItem[0], formaItem[4], formaItem[2], sentenceid,formaItem[6]) + setVersi.add(cantica+ "_" + formaItem[3] + "_" + 'Canto_' + formaItem[1]) + } + else{ + createSpanFormeNew(cantica, 'Canto_' + formaItem[1], formaItem[3], formaItem[0], formaItem[4], formaItem[2], sentenceid,formaItem[6],elverso) + } + + } + return + } + + + function createSpanFormeNew(cantica, canto, numverso, forma, catgramm, pos, sentenceid, clausefunct, elementoverso) { + var divOccorrenza = $('
') + divOccorrenza.attr('id', pos) + divOccorrenza.attr('class', sentenceid+" "+clausefunct+" "+"Nik_dropdown-content") + + var details=getHoverContent(catgramm); + if (details == null || (typeof details == 'undefined')){ + details = "error details is null for catgramm "+ catgramm; + console.log("error details is null for catgramm "+ catgramm) + } + var index = details.indexOf(","); + var categoria = ""; + if (index != -1){ + categoria = details.substring(0,index); + details = details.substring(index+1); + }else{ + categoria = details; + details = ""; + } + + var divSpan = $('
') + divSpan.attr('class','Nik_dropdown') + var spanWord = $(''); + spanWord.attr('data-cg', catgramm) + + spanWord.append (forma+" "); + divSpan.append(spanWord) + + var pCategoria = $('

'); + pCategoria.attr("style", "color:Blue; font-weight: 600;"); + + pCategoria.append(categoria); + var pDetails = $('

') + pDetails.attr("style", "line-height: 1.5em; color:Red; font-weight: 300;"); + + pCategoria.appendTo(divOccorrenza); + divOccorrenza.append ("

") + + pDetails.append(details); + pDetails.appendTo(divOccorrenza) + divOccorrenza.appendTo(divSpan) + divSpan.appendTo(elementoverso) + } + + function createDivVerso(cantica, numverso, canto, forma, catgramm, pos, sentenceid, clausefunct) { + + var details=getHoverContent(catgramm); + + if (details == null || (typeof details == 'undefined')){ + details = "error details is null for catgramm "+ catgramm; + console.log("error details is null for catgramm "+ catgramm) + } + var index = details.indexOf(","); + + var categoria = ""; + if (index != -1){ + categoria = details.substring(0,index); + details = details.substring(index+1); + }else{ + categoria = details; + details = ""; + } + var elementoverso = $('

') + + elementoverso.append(numverso + ". ") + elementoverso.attr("style", "line-height: 0.5em") + + elementoverso.attr('class', 'f6 text-secondary font-weight-lighter '+cantica+' '+canto) + + elementoverso.attr('id', cantica + "_" + canto + "_" + numverso) + + var divOccorrenza = $('

') + + divOccorrenza.attr('id', pos) + divOccorrenza.attr('class', sentenceid+" "+clausefunct+" "+"Nik_dropdown-content") + + + var divSpan = $('
') + divSpan.attr('class','Nik_dropdown') + var spanWord = $(''); + spanWord.append (forma+" "); + spanWord.attr('data-cg', catgramm) + + divSpan.append(spanWord) + var pCategoria = $('

'); + pCategoria.attr("style", "color:Blue; font-weight: 600;"); + + var pDetails = $('

') + pDetails.attr("style", "line-height: 1.5em; color:Red; font-weight: 300;"); + pCategoria.append(categoria); + + pCategoria.appendTo(divOccorrenza); + divOccorrenza.append ("

") + pDetails.append(details); + pDetails.appendTo(divOccorrenza) + divOccorrenza.appendTo(divSpan) + divSpan.appendTo(elementoverso) + + + elementoverso.appendTo('#' + cantica + canto) + + return elementoverso + + } + + + function createAllDivCanti() { + cantiche=["Inferno", "Purgatorio","Paradiso"] + for (cantica of cantiche){ + for (var i=1; i<35; i++){ + if(i==34 && cantica!=="Inferno"){ + continue + } + canto= "Canto "+i + var divcanto = $('
') + var titolocanto = $('

') + titolocanto.append(cantica + ", " + canto) + divcanto.attr('class', 'canto') + divcanto.attr('style', 'display:none') + divcanto.attr('id', (cantica + canto).replace(" ", "_")) + titolocanto.appendTo(divcanto) + divcanto.appendTo(' .blog-main') + } + } + } + + //execute query + async function executeQuerySearch(query) { + seachbBindingsStream = await myEngine.queryBindings(query, { sources: [{ type: 'sparql', value: sparqlEndpoint },], }); + //console.log(query) + alert(query) + try { + var result = new Set() + var resultClauses = new Set() + + var resultsInCantica = [] + var resultsInCanto = [] + seachbBindingsStream.on('data', (binding) => { + //cantica + cantica = binding.get('Cantica').value; + + //canto + canto = binding.get('Canto').value; + + //numero del verso + numverso = binding.get('NumeroVerso').value; + //posizione del frammento + pos = binding.get('pos').value; + //regione della clausola + var clfrom=binding.get('clfr').value; + var clto=binding.get('clto').value; + var cltype=binding.get('clatype').value + //id del periodo + var sentenceid=binding.get('sentence').value.replace('http://dantenetwork.it/data/commedia/','') + //console.log(sentenceid) + + if (!result.has(pos)){ + result.add(pos) + resultsInCantica.push(cantica); + resultsInCanto.push(cantica + canto) + } + resultClauses.add(cantica + "_" + canto.replace(" ", "_") + "_" + numverso + "-" +clfrom+'_'+clto+"-"+cltype) + resultSentences.add(sentenceid) + + }); + seachbBindingsStream.on('end', () => { + console.log('start rendering...') + listarisultati = Array.from(result) + + cantiche = ["Inferno", "Purgatorio", "Paradiso"] + + + console.log('periodi end...') + + //evidenzia risultati + for (ris of listarisultati) { + idris = '#' + ris + //$(idris).attr('class', "font-weight-bold mark ") + $(idris).addClass("font-weight-bold mark ") + + } + //aggiunge badge con totale risultati accanto alle cantiche + i = 0 + for (cantica of cantiche) { + i += 1 + let count = resultsInCantica.reduce((n, x) => n + (x === cantica), 0); + if (count>0){ + var spanbadgecantica = $(''); + spanbadgecantica.attr('class', 'badge badge-primary badge-pill ml-1'); + spanbadgecantica.append(count) + spanbadgecantica.appendTo($('#cantica' + i)) + } + } + //aggiunge badge con totale risultati accanto ai canti + console.log('results end...') + for (cantica of cantiche) { + for (k of Array(35).keys()) { + if (k == 0) + continue + let count = resultsInCanto.reduce((n, x) => n + (x === cantica + 'Canto ' + k), 0); + if (count>0){ + var spanbadge = $(''); + spanbadge.attr('class', cantobadgeclass); + spanbadge.append(count) + //$("[name='nameofobject']") + spanbadge.appendTo($('[name="' + cantica + 'Canto ' + k + '"]')) + //spanbadge.insertAfter($('[name="'+cantica+'Canto '+k+'"]')) + } + } + } + console.log('badge end...') + + //aggiorna minimap + if (currentMinimap != '') { + showMinimap(currentMinimap) + } + + }); + } + catch (err) { + console.log(err.message); + }; + + }; + });