diff --git a/conf.py b/conf.py index 88b1ed3..ff673fa 100644 --- a/conf.py +++ b/conf.py @@ -26,3 +26,4 @@ pagination = "10" github_backup = "False" myEndpoint = "http://127.0.0.1:3000/blazegraph/sparql" +mainLang = "en" diff --git a/forms.py b/forms.py index f84f393..43cd05b 100644 --- a/forms.py +++ b/forms.py @@ -85,17 +85,18 @@ def get_form(json_form, from_dict=False, subtemplate=False): dropdown_values = [(k,v) for k,v in field['values'].items()] if 'values' in field else None # Text box - if field['type'] in ['Textbox','Vocab', 'WebsitePreview']: + if field['type'] == 'Textbox' and field['value'] == 'Literal': if "disambiguate" in field and field["disambiguate"] == 'True': - vpass = form.regexp(r".{0,200}$", 'must be between 1 and 200 characters') # TODO: check the regex (either set it to {0, 200} or remove it in case of Subtemplates' primary keys) - params = params + (form.Textbox(myid, vpass, + #vpass = form.regexp(r".{0,200}$", 'must be between 1 and 200 characters') # TODO: check the regex (either set it to {0, 200} or remove it in case of Subtemplates' primary keys) + params = params + (form.Textbox(myid, #vpass, description = description, id=myid, placeholder=placeholder, pre = prepend, class_= classes, value=default, - mandatory = mandatory) , ) + mandatory = mandatory, + lang=conf.mainLang) , ) else: params = params + (form.Textbox(myid, description = description, @@ -104,8 +105,20 @@ def get_form(json_form, from_dict=False, subtemplate=False): pre = prepend, class_= classes, value=default, - mandatory = mandatory), ) + mandatory = mandatory, + lang=conf.mainLang), ) + # Entities, SKOS thesauri, links + if field['type'] in ['Vocab', 'WebsitePreview'] or (field['type'] == 'Textbox' and field['value'] in ['URL', 'URI']): + params = params + (form.Textbox(myid, + description = description, + id=myid, + placeholder=placeholder, + pre = prepend, + class_= classes, + value=default, + mandatory = mandatory), ) + # Multimedia Link if field['type'] == 'Multimedia': params = params + (form.Textbox(myid, @@ -126,7 +139,8 @@ def get_form(json_form, from_dict=False, subtemplate=False): pre = prepend, class_= classes, value=default, - mandatory = mandatory), ) + mandatory = mandatory, + lang=conf.mainLang), ) if field['type'] == 'Date': if field['calendar'] == 'Month': diff --git a/mapping.py b/mapping.py index 76a6052..aff4c84 100644 --- a/mapping.py +++ b/mapping.py @@ -39,6 +39,7 @@ def getValuesFromFields(fieldPrefix, recordData, fields=None, field_type=None): """ request form fields by field prefix, check if multiple values are available, returns a set of tuples including ID (for the URI) and label of values """ + result_dict = {'type':'URI'} results = set() for key, value in recordData.items(): if key.startswith(fieldPrefix+'-'): # multiple values from text box (wikidata) + URL @@ -54,8 +55,20 @@ def getValuesFromFields(fieldPrefix, recordData, fields=None, field_type=None): values = value.split(',') for val in values: results.add(( val.strip(), val.strip() )) - return results + result_dict['results'] = results + return result_dict +def getValuesFromTextualFields(fieldPrefix, recordData): + """ request form fields by field prefix, check if multiple languages are available, + returns a set of tuples including textual values and their language """ + result_dict = {'type':'Literal'} + results = set() + for key, value in recordData.items(): + if key.startswith(fieldPrefix+'_'): + lang = key.rsplit('_')[1] + results.add((value,lang)) + result_dict['results'] = results + return result_dict def getRightURIbase(value): return WD+value if value.startswith('Q') else GEO+value if value.isdecimal() else VIAF+value[4:] if value.startswith("viaf") else ''+value if value.startswith("http") else base+value.lstrip().rstrip() @@ -102,7 +115,7 @@ def inputToRDF(recordData, userID, stage, knowledge_extraction, graphToClear=Non # retrieve hidden triples (to be saved) and re-introduce them in the named graph to_be_saved = queries.saveHiddenTriples(graphToClear, tpl_form) - if to_be_saved: + if to_be_saved['results']['bindings'] != [{}]: for binding in to_be_saved['results']['bindings']: subject = URIRef(binding['subject']['value']) for predicate_obj, inner_dict in binding.items(): @@ -133,13 +146,17 @@ def inputToRDF(recordData, userID, stage, knowledge_extraction, graphToClear=Non for field in fields: if field['type'] not in ['KnowledgeExtractor', 'Subtemplate']: # URI, Textarea (only text at this stage), Literals - value = getValuesFromFields(field['id'], recordData, fields) \ - if 'value' in field and field['value'] in ['URI','Place'] else getValuesFromFields(field['id'], recordData, field_type=field['type']) if 'value' in field and field['value'] == 'URL' else recordData[field['id']] + value = getValuesFromFields(field['id'], recordData, fields) if 'value' in field and field['value'] in ['URI','Place'] \ + else getValuesFromFields(field['id'], recordData, field_type=field['type']) if 'value' in field and field['value'] == 'URL' \ + else getValuesFromTextualFields(field['id'], recordData) if 'value' in field and field['value'] == 'Literal' else recordData[field['id']] # TODO disambiguate as URI, value if field["disambiguate"] == 'True': # use the key 'disambiguate' as title of the graph - wd.add(( URIRef(base+graph_name+'/'), URIRef(field['property']), Literal(value) )) - wd.add(( URIRef(base+graph_name), RDFS.label, Literal(value) )) - wd.add(( URIRef(base+graph_name+'/'), RDFS.label, Literal(value) )) + main_value = [label for label in value['results'] if label[1] == conf.mainLang][0] + main_label = main_value[0] + main_lang = main_value[1] + wd.add(( URIRef(base+graph_name+'/'), URIRef(field['property']), Literal(main_label, lang=main_lang) )) + wd.add(( URIRef(base+graph_name), RDFS.label, Literal(main_label) )) + wd.add(( URIRef(base+graph_name+'/'), RDFS.label, Literal(main_label) )) # the main entity has the same URI of the graph but the final / @@ -166,16 +183,22 @@ def inputToRDF(recordData, userID, stage, knowledge_extraction, graphToClear=Non if not to_add.startswith("http"): to_add = "http://" + to_add wd.add(( URIRef(base+graph_name), URIRef(field['property']), URIRef(to_add) )) - else: # object properties - for entity in value: - entityURI = getRightURIbase(entity[0]) # Wikidata or new entity - wd.add(( URIRef(base+graph_name), URIRef(field['property']), URIRef(entityURI) )) - wd.add(( URIRef( entityURI ), RDFS.label, Literal(entity[1].lstrip().rstrip(), datatype="http://www.w3.org/2001/XMLSchema#string") )) - + elif isinstance(value,dict): + if value['type'] == 'URI': #object properties + for entity in value['results']: + entityURI = getRightURIbase(entity[0]) # Wikidata or new entity + wd.add(( URIRef(base+graph_name), URIRef(field['property']), URIRef(entityURI) )) + wd.add(( URIRef( entityURI ), RDFS.label, Literal(entity[1].lstrip().rstrip(), datatype="http://www.w3.org/2001/XMLSchema#string") )) + elif value['type'] == 'Literal': + for literal in value['results']: + val, lang = literal + val = val.replace('\n','').replace('\r','') + wd.add(( URIRef(base+graph_name), URIRef(field['property']), Literal(val, lang=lang))) # now get also the entities associated to textareas (record creation) if field['type'] == 'Textarea': value = getValuesFromFields(field['id'], recordData, fields, 'Textarea') - for entity in value: + print('HERE', value) + for entity in value['results']: entityURI = getRightURIbase(entity[0])+entity[0] wd.add(( URIRef(base+graph_name), SCHEMA.keywords, URIRef(entityURI) )) wd.add(( URIRef( entityURI ), RDFS.label, Literal(entity[1].lstrip().rstrip(), datatype="http://www.w3.org/2001/XMLSchema#string") )) diff --git a/static/css/main.css b/static/css/main.css index 2048731..8d431b0 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -177,10 +177,6 @@ nav { } -#navbarSupportedContent * { - /*margin: 10px;*/ -} - nav a { margin-right: 2em; color: rgba(100, 23, 180, 1) !important; @@ -360,8 +356,6 @@ article:nth-child(even), background-color: #F5F6FA; } -.change_background {} - article p { font-size: 1em; line-height: 1.7em; @@ -1475,8 +1469,6 @@ select-selected.select-arrow-active:after { } /* template page */ -.set_template_field {} - .block_field { padding: 1em; border: solid 1px black; @@ -1728,7 +1720,10 @@ button#showTemplates { padding-top: 0px; } - + .suggested-vocabs-div { + margin-left: -2px; + margin-top: 0px !important; + } @@ -1876,6 +1871,10 @@ button#showTemplates { padding-left: 5% !important; } + .suggested-vocabs-div { + margin-left: -5px; + margin-top: 0px !important; + } } @@ -1956,6 +1955,10 @@ button#showTemplates { text-decoration: none; margin:8px 20px 10px 0px; } +.suggested-vocabs-div { + margin-bottom: 15px; + margin-top: -25px; +} /* knowledge extraction */ .pagination input.btn.extractor_2 { @@ -2036,7 +2039,140 @@ input[subtemplate]+.fa-plus-circle { color: rgba(100,23,180,1); cursor: pointer; } +<<<<<<< Updated upstream +======= +/* Subrecords visualisation */ + +.subtemplateValue { + background-color: #ececec !important; + display: block; + margin-bottom: 0px !important; +} + +.subtemplateValue > a { + background-color: white; + border: black 1px solid; + box-shadow: 3px 5px; + color: black !important; + display: inline-block; + font-weight: 400; + padding: 2px 50px 2px 15px !important; + text-decoration: none !important; + width: 100%; +} + +.subtemplateValue:last-of-type { + margin-bottom: 1rem; +} + +.subtemplateValue section:last-of-type { + margin-bottom: 0px !important; + padding-bottom: 1rem; +} + +.subtemplateValue > span { + display: inline-block; + position: absolute; + right: 2em; +} + +.subtemplateValue .subtemplateValue { + border: rgb(152, 128, 177) 1px solid !important; +} + +.fa-chevron-down { + color: #343a406e; + padding-top: 8px; +} + +.fa-chevron-down:hover { + color: rgba(100, 23, 180, 1); + cursor: pointer; +} + +.hidden-subrecord { + display: none; +} + +.subtemplateValue > div > section > p { + font-size: 1em !important; +} + +.subtemplateValue > div .articleSubtitle { + font-size: 0.8em !important; +} +.subtemplateValueOpen > a, +.subtemplateValue > a:hover { + border-color: rgba(100, 23, 180, 1) !important; + color: rgba(100, 23, 180, 1) !important; +} + +/* multiple lang */ +.language-options { + display: block; + max-height: 255px; + overflow-y: scroll; + border-radius: 5px; + border: 1px solid #ced4da; +} +.language-options a { + display: block; + background-color: #fff; + text-decoration: none !important; + color: #495057 !important; + line-height: 1.5; + padding: .375rem 1.75rem .375rem .75rem; +} + +.lang-item:first-of-type { + padding-left: 0.8em !important; +} +.lang-item { + padding-left: 0.4em; + color: rgb(182, 160, 206) !important; + text-decoration: none !important; + cursor: pointer; +} + +.lang-item.selected-lang, .lang-item:hover { + text-decoration: underline !important; + color: rgb(100, 23, 180) !important; +} + +#lang-form { + display: block; + position: absolute; + background: #eae2f6; + width: 400px; + padding: 20px; + border: solid 1px black; + border-radius: 5px; +} + +#lang-form:after { + content: " "; + position: absolute; + left: 12px; + top: -10px; + border-top: none; + border-right: 10px solid transparent; + border-left: 10px solid transparent; + border-bottom: 10px solid rgba(100, 23, 180, 1); +} + +#lang-form section:first-child div { + z-index: 1001; + position: relative; +} + +#lang-form section:nth-child(2) div { + z-index: 1000; + position: relative; +} + + +>>>>>>> Stashed changes /* extra */ -.fa-plus-circle, .fa-eye, .fa-trash{color: rgba(100,23,180,1); cursor: pointer;} +.fa-globe, .fa-plus-circle, .fa-eye, .fa-trash{color: rgba(100,23,180,1); cursor: pointer;} .link_btn, .btn {white-space: nowrap;} .add_fields .link_btn {display: inline-block; margin-bottom: 8px} \ No newline at end of file diff --git a/static/js/main.js b/static/js/main.js index 7e9ae5b..739e5d6 100644 --- a/static/js/main.js +++ b/static/js/main.js @@ -112,7 +112,7 @@ $(document).ready(function() { } }); - const div = $("
"); + const div = $("
"); if ($(this).prev().length > 0) { div.insertBefore($(this).prev()); } else { @@ -131,6 +131,10 @@ $(document).ready(function() { $(".main_content").on("click", "input[type='text']", function () { // make the onclick function valid for later generated inputs searchID = $(this).attr('id'); +<<<<<<< Updated upstream +======= + // make the searchresult element available within subforms +>>>>>>> Stashed changes const searchresult = $('#searchresult').detach(); if ($(this).closest('.subform_section').length) { $(this).closest('.subform_section').prepend(searchresult); @@ -381,8 +385,233 @@ $(document).ready(function() { $(this).after(""); }); +<<<<<<< Updated upstream }); +======= + // language tags handling + $('[lang]').each(function() { + const section = $(this).parent().prev();; + var id = $(this).attr('id'); + var new_id = id+"_"+$(this).attr('lang'); + $('#'+id).attr('name',new_id); + $('#'+id).attr('id',new_id); + var lang = $(this).attr('lang').toUpperCase(); + const languages_list = $('
'); + const main_lang = $(''+lang+''); + main_lang.on('click', function(e) { + e.preventDefault(); + }) + languages_list.append(main_lang); + section.append(languages_list) + }) +}); + +///////////////////////// +// MULTIPLE LANGUAGES /// +///////////////////////// +function language_form(el) { + if ($('#lang-form').length > 0) { + $('#lang-form').remove() + } else { + var height = $(el).offset().top + 30 + "px"; + var left = $(el).offset().left - 15 +"px"; + var current_lang = $(el).parent().find('.selected-lang').text().toLowerCase(); + var input = $(el).parent().parent().next().find('textarea, input').filter(':visible'); + var field_id = input.attr('id'); + const lang_form = $('
'); + const change_language = $('
'); + const add_language = $('
') + const remove_lang = $('
'); + $.ajax({ + type: 'GET', + url: "https://raw.githubusercontent.com/mattcg/language-subtag-registry/master/data/json/registry.json", + dataType: 'json', + success: function(data) { + let languageObjects = []; + // Loop through the array of objects + for (let obj of data) { + // Check if the object has "type": "language" + if (obj.Type === "language" && !("Deprecated" in obj)) { + var lang = obj.Description[0]; + var tag = obj.Subtag; + if (tag === current_lang) { + change_language.find('div').prepend(''+lang+' ('+tag+')'); + change_language.find('input').attr('placeholder',lang+' ('+tag+')'); + } + var optionSelect = $(""+lang+" ("+tag+")"); + change_language.find('div').append(optionSelect.clone()); + add_language.find('div').append(optionSelect.clone()); + } + } + change_language.find('div').hide(); + add_language.find('div').hide(); + lang_form.append(change_language, add_language, remove_lang); + lang_form.css({'top':height, 'left':left}); + $('main').append(lang_form); + }, + error: function(data) { + console.log("Resource not available"); + } + }) + } +} + +function activate_filter(el){ + if ($(el).next('div').attr('style') == 'display: none;') { + $(el).next('div').show(); + $(el).keyup(function(){ + let input_val = $(el).val(); + $(el).next('div').find('a:not([lang*="' + input_val + '"])').hide(); + $(el).next('div').find('a[lang*="' + input_val + '"]').show(); + }) + } else { + $(el).next('div').hide(); + } + +} + +function add_new_language(el) { + var new_lang = $(el).val(); + if (new_lang !== 'None') { + var last_lang_id = $(el).parent().parent().parent().attr('data-input'); + const new_lang_input = $('#'+last_lang_id).clone(); + var new_lang_input_id = last_lang_id.split('_')[0] + "_" + new_lang; + $('#languages-'+last_lang_id.split('_')[0]).find('.selected-lang').removeClass('selected-lang'); + $('#languages-'+last_lang_id.split('_')[0]).append(""+new_lang.toUpperCase()+""); + new_lang_input.attr('id', new_lang_input_id); + new_lang_input.attr('name', new_lang_input_id); + new_lang_input.attr('lang', new_lang); + new_lang_input.val(''); + $('[id^="'+last_lang_id.split('_')[0]+'"]').hide(); + $('#'+last_lang_id).after(new_lang_input); + $(el).parent().parent().parent().remove(); + } +} + +function change_current_language(el) { + var new_lang = $(el).val(); + var id = $(el).parent().parent().parent().attr('data-input'); + var current_lang = $('#languages-'+id.split('_')[0]).find('.selected-lang').eq(0); + console.log(current_lang.text().toLowerCase()) + var current_lang_field_id = id.split('_')[0] +"_"+current_lang.text().toLowerCase(); + if (current_lang.text().toLowerCase() !== new_lang) { + var new_id = id.split('_')[0] + '_' + new_lang; + var title = 'text language: '+new_lang.toUpperCase(); + current_lang.attr('title',title); + current_lang.attr('onclick','show_lang("'+new_id+'")'); + current_lang.text(new_lang.toUpperCase()); + $('#'+current_lang_field_id).attr('name',new_id); + $('#'+current_lang_field_id).attr('id',new_id); + $('#'+new_id).attr('lang',new_lang); + $(el).parent().parent().parent().remove(); + } +} + +function remove_current_language(el) { + var current_field = $(el).parent().parent().attr('data-input'); + let field_base = current_field.split('_')[0]; + var current_lang_tag = $('#languages-'+field_base).find('.selected-lang'); + if (current_lang_tag.next('a').length > 0) { + current_lang_tag.next('a').addClass('selected-lang'); + var next_lang = current_lang_tag.next('a').text().toLowerCase(); + current_lang_tag.remove(); + $('#'+current_field).remove(); + console.log('#'+field_base+'_'+next_lang) + $('#'+field_base+'_'+next_lang).show(); + } else if (current_lang_tag.prev('a').length > 0) { + current_lang_tag.prev('a').addClass('selected-lang'); + var prev_lang = current_lang_tag.prev('a').text().toLowerCase(); + current_lang_tag.remove(); + $('#'+current_field).remove(); + $('#'+field_base+'_'+prev_lang).show(); + } else { + alert('Not allowed. Change current language, instead'); + } + $('[data-input="'+current_field+'"]').remove(); +} + +function show_lang(field_id) { + let field_base = field_id.split('_')[0]; + $('[id^="'+field_base+'_"]').hide(); + $('#'+field_id).show(); + var target_lang = field_id.split('_')[1]; + $('#languages-'+field_base).find('.selected-lang').removeClass('selected-lang'); + console.log('[title="text language: '+target_lang.toUpperCase()+'"]') + $('#languages-'+field_base).find('[title="text language: '+target_lang.toUpperCase()+'"]').addClass('selected-lang') +} + +///////////////////////// +//// SUBRECORDS VIEW //// +///////////////////////// +function add_subtemplate(el) { + var hide = el.hasClass('oneValue'); + var subtemplate_values = el.find('p'); + subtemplate_values.each(function() { + var externalLink = $(this).find('a').eq(0); + + if (!hide) { + // organize subrecords as an accordion + $(this).addClass('subtemplateValue') + $(this).append('') + externalLink.prepend(" ") + + // show and hide inner values + $(this).bind('click', function(e){ + if (!($(e.target).parent().context.localName == "i")) { + e.preventDefault(); + if ($(e.target).parent().is($(this))) { + $($(e.target).parent()).find('div').eq(0).toggleClass('hidden-subrecord'); + $(e.target).parent().toggleClass('subtemplateValueOpen'); + } + } + }) + } else { + $(this).parent().hide(); + } + + var calledValue = $(this); + var calledRecord = externalLink.attr('href').replace("term", "view"); + $.ajax({ + type:'GET', + url:calledRecord, + dataType:"html", + success:function(data) { + var calledRecordData = $(data).find('.articleBox').find('.col-md-8.row').find('section'); + + if (!hide) { + calledRecordData.each(function() { + var cls = $(this).attr('class'); + var new_cls = cls.replace("col-md-5", "col-md-12") + $(this).attr('class', new_cls); + $(this).find('.wikiEntity').append(wd_img); + $(this).find('.geoEntity').append(geo_img); + $(this).find('.viafEntity').append(viaf_img); + }) + calledValue.append($('
').append(calledRecordData)); + } else { + calledRecordData.find('.wikiEntity').append(wd_img); + calledRecordData.find('.geoEntity').append(geo_img); + calledRecordData.find('.viafEntity').append(viaf_img); + calledValue.parent().after(calledRecordData) + } + + + + var new_values = calledValue.find('.subtemplateField'); + new_values.each(function() { + add_subtemplate($(this)); + }); + + }, + error:function() { + console.log("Error: requested resource is not available"); + } + }) + }); +} + +>>>>>>> Stashed changes ////////////// // BACKEND // //////////////