From a3a83e1c12c595babd2cc84a65cd2f219b45d4b8 Mon Sep 17 00:00:00 2001 From: Benoit Alessandroni <benoit@happy-dev.fr> Date: Fri, 10 Jul 2020 17:09:22 +0200 Subject: [PATCH 1/3] update: avoid duplicate required star --- src/scripts/coopstarter.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/scripts/coopstarter.js b/src/scripts/coopstarter.js index 7bf683aa..83736c06 100644 --- a/src/scripts/coopstarter.js +++ b/src/scripts/coopstarter.js @@ -768,7 +768,9 @@ document.addEventListener("DOMContentLoaded", event => { setTimeout(function() { resourceLabelsSelector.forEach((labelSelector) => { let labelElement = mentorResourceCreationForm.querySelector(labelSelector); - labelElement.innerHTML = labelElement.innerHTML + " <span class='required'>*</span>"; + if (!labelElement.innerHTML.includes("<span class='required'>*</span>")) { + labelElement.innerHTML = labelElement.innerHTML + " <span class='required'>*</span>"; + } }); }, 500); @@ -799,7 +801,9 @@ document.addEventListener("DOMContentLoaded", event => { setTimeout(function() { resourceLabelsSelector.forEach((labelSelector) => { let labelElement = mentorResourceCreationForm.querySelector(labelSelector); - labelElement.innerHTML = labelElement.innerHTML + " <span class='required'>*</span>"; + if (!labelElement.innerHTML.includes("<span class='required'>*</span>")) { + labelElement.innerHTML = labelElement.innerHTML + " <span class='required'>*</span>"; + } }); }, 500); -- GitLab From a81b03083652d26dfcad931aaab44f8bf8d1153d Mon Sep 17 00:00:00 2001 From: Benoit Alessandroni <benoit@happy-dev.fr> Date: Fri, 10 Jul 2020 20:38:11 +0200 Subject: [PATCH 2/3] Manage language select properly --- src/includes/head.pug | 2 +- src/scripts/coopstarter.js | 26 +++++++++++++++++++++++++- translation/en.yml | 2 +- translation/it.yml | 4 ++-- 4 files changed, 29 insertions(+), 5 deletions(-) diff --git a/src/includes/head.pug b/src/includes/head.pug index 10367632..655b0332 100644 --- a/src/includes/head.pug +++ b/src/includes/head.pug @@ -32,7 +32,7 @@ head }); script. uploadPreviewImageLabel = "#{data.UploadPreviewImage}"; - uploadProfilePictureLabel = '#{data.UploadProfilePictureLabel}'; + uploadProfilePictureLabel = "#{data.UploadProfilePictureLabel}"; script(src="/scripts/coopstarter.js") script(async src="https://platform.twitter.com/widgets.js" charset="utf-8") script(src="https://browser.sentry-cdn.com/5.15.5/bundle.min.js" integrity="sha384-wF7Jc4ZlWVxe/L8Ji3hOIBeTgo/HwFuaeEfjGmS3EXAG7Y+7Kjjr91gJpJtr+PAT" crossorigin="anonymous") diff --git a/src/scripts/coopstarter.js b/src/scripts/coopstarter.js index 83736c06..809caf50 100644 --- a/src/scripts/coopstarter.js +++ b/src/scripts/coopstarter.js @@ -432,7 +432,6 @@ async function manageSelectLanguage() { for (let item of languageSelects) { item.addEventListener("change", async function() { //We listen the selected option for the language - uriLanguage = item.querySelector("option:checked").value //We retrieve element of the url var pathAfterThePrefix = window.location.pathname.split('/')[2]; @@ -450,6 +449,27 @@ async function manageSelectLanguage() { } } +async function selectProperLanguage() { + let languageFormSelects = document.getElementsByClassName("languageChoice"); + for (let solidForm of languageFormSelects) { + solidForm.addEventListener("populate", async function(e) { + let languageSelect = e.target.querySelector("select[name='languages']"); + var chosenPrefix = window.location.pathname.split('/')[1]; + let languagesList = await solidForm.component.resource['ldp:contains']; + languagesList.forEach(async (resource) => { + let resourceCode = await resource['code']; + let resourceId = await resource['@id']; + Array.from(languageSelect.options).forEach(function(option_element) { + if ((resourceCode.toLowerCase() === chosenPrefix) && + option_element.value === '{"@id": "' + resourceId + '"}') { + option_element.selected = true; + } + }); + }); + }); + } +} + /** * Initialise the custom form file behaviour * Todo : we can improve the performance adding param to reduce the loop @@ -932,6 +952,10 @@ document.addEventListener("DOMContentLoaded", event => { //Manage the select language manageSelectLanguage(); + //Select the current language in the dropdown on load + selectProperLanguage(); + + /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXX MENTOR DASHBOARD XXXXXXXXXXXXXXXXXXXX diff --git a/translation/en.yml b/translation/en.yml index e45c2733..233beed3 100644 --- a/translation/en.yml +++ b/translation/en.yml @@ -94,7 +94,7 @@ LocationWeblinkReq: Location/weblink AuthorReq : Resource author SkillReq : Learning outcomes, skills IframeLink: For videos, insert iframe link -UploadPreviewImage: Upload preview image +UploadPreviewImage: "Upload preview image" AddTags: Add tags ResourceTargetReq: Resource target TypeContentReq: Type of content diff --git a/translation/it.yml b/translation/it.yml index 48bb6e71..985df483 100644 --- a/translation/it.yml +++ b/translation/it.yml @@ -93,7 +93,7 @@ LocationWeblinkReq: Link AuthorReq : Autore della risorsa SkillReq : "Risultati di apprendimento, abilità " IframeLink: "Nel caso di video, inserisci qui il link iframe" -UploadPreviewImage: Carica immagine di anteprima +UploadPreviewImage: "Carica immagine di anteprima" AddTags: Aggiungi tag ResourceTargetReq: Target della risorsa TypeContentReq: Tipo di contenuto @@ -126,7 +126,7 @@ SubmitterEmailLabel: Indirizzo email del contributore FieldsInputLabel: Settori LanguageLabel: Lingue RequestDealtWith: Fatto -UploadProfilePictureLabel: Carica un'immagine profilo +UploadProfilePictureLabel: "Carica un'immagine profilo" ImprovementRequired: Sono necessarie migliorie Published: Pubblicata PendingValidation: In attesa di validazione -- GitLab From 1997cb727e294a48c27607fa9a78c5ae1b298f9b Mon Sep 17 00:00:00 2001 From: Benoit Alessandroni <benoit@happy-dev.fr> Date: Fri, 10 Jul 2020 21:49:10 +0200 Subject: [PATCH 3/3] Fix form validation and associated labels --- src/includes/mentor/profile/create.pug | 14 +++---- src/includes/mentor/resources/create.pug | 26 ++++++------ src/includes/mentor/resources/edit.pug | 26 ++++++------ src/scripts/coopstarter.js | 52 +----------------------- 4 files changed, 35 insertions(+), 83 deletions(-) diff --git a/src/includes/mentor/profile/create.pug b/src/includes/mentor/profile/create.pug index b146349b..edec11af 100644 --- a/src/includes/mentor/profile/create.pug +++ b/src/includes/mentor/profile/create.pug @@ -34,16 +34,16 @@ solid-form#mentor_profile_creation.block_log.block_creat_count( widget-header_about_you="cs-section_introduction" widget-aboutfields="cs-about-field" - label-first_name=`${data.Surname}` - label-last_name=`${data.Name}` - label-mentorProfile.organisation=`${data.Organisation}` + label-first_name=`${data.Surname} <span class="required">*</span>` + label-last_name=`${data.Name} <span class="required">*</span>` + label-mentorProfile.organisation=`${data.Organisation} <span class="required">*</span>` label-mentorProfile.phone=`${data.PhoneNumber}` - label-mentorProfile.languages=`${data.Language}` - label-mentorProfile.fields=`${data.Field}` + label-mentorProfile.languages=`${data.Language} <span class="required">*</span>` + label-mentorProfile.fields=`${data.Field} <span class="required">*</span>` label-mentorProfile.headline=`${data.Headline}` class-mentorProfile.headline="w_100" - label-mentorProfile.city=`${data.City}` - label-mentorProfile.country=`${data.Country}` + label-mentorProfile.city=`${data.City} <span class="required">*</span>` + label-mentorProfile.country=`${data.Country} <span class="required">*</span>` label-mentorProfile.biography=`${data.ActivitiesMore}` label-mentorProfile.skills=`${data.SkillForSearcher}` label-mentorProfile.linkedin="Linkedin" diff --git a/src/includes/mentor/resources/create.pug b/src/includes/mentor/resources/create.pug index 02e0357a..6624da8b 100644 --- a/src/includes/mentor/resources/create.pug +++ b/src/includes/mentor/resources/create.pug @@ -38,24 +38,24 @@ p.p_entete=`${data.ThankYouEnrichingDatabase}` required-format required-country required-fields - label-name=`${data.TitleRequired}` - label-country=`${data.Country}` - label-languages=`${data.Language}` - label-uri=`${data.LocationWeblinkReq}` - label-format=`${data.FormatReq}` - label-fields=`${data.FieldRequired}` - label-resource_author=`${data.AuthorReq}` + label-name=`${data.TitleRequired} <span class="required">*</span>` + label-country=`${data.CountryPublication} <span class="required">*</span>` + label-languages=`${data.Language} <span class="required">*</span>` + label-uri=`${data.LocationWeblinkReq} <span class="required">*</span>` + label-format=`${data.FormatReq} <span class="required">*</span>` + label-fields=`${data.FieldRequired} <span class="required">*</span>` + label-resource_author=`${data.AuthorReq} <span class="required">*</span>` label-publication_year=`${data.DatePublication}` - label-skills=`${data.SkillReq}` - label-description=`${data.Description}` + label-skills=`${data.SkillReq} <span class="required">*</span>` + label-description=`${data.Description} <span class="required">*</span>` label-iframe_link=`${data.IframeLink}` label-preview_image=`${data.UploadPreviewImage}` - label-target=`${data.ResourceTargetReq}` - label-type=`${data.TypeContentReq}` - label-steps=`${data.CategorisationReq}` + label-target=`${data.ResourceTargetReq} <span class="required">*</span>` + label-type=`${data.TypeContentReq} <span class="required">*</span>` + label-steps=`${data.CategorisationReq} <span class="required">*</span>` - label-sharing=`${data.ShareWithReq}` + label-sharing=`${data.ShareWithReq} <span class="required">*</span>` label-related=`${data.AddResource}` multiple-fields='solid-multiple-select' diff --git a/src/includes/mentor/resources/edit.pug b/src/includes/mentor/resources/edit.pug index 77b05aa3..58b9b78f 100644 --- a/src/includes/mentor/resources/edit.pug +++ b/src/includes/mentor/resources/edit.pug @@ -36,23 +36,23 @@ p.p_entete=`${data.ThankYouEnrichingDatabase}` label-header_access=`${data.Access}` label-header_related=`${data.RelatedResources}` - label-name=`${data.TitleRequired}` - label-country=`${data.Country}` - label-languages=`${data.Language}` - label-uri=`${data.LocationWeblinkReq}` - label-format=`${data.FormatReq}` - label-fields=`${data.FieldRequired}` - label-resource_author=`${data.AuthorReq}` + label-name=`${data.TitleRequired} <span class="required">*</span>` + label-country=`${data.Country} <span class="required">*</span>` + label-languages=`${data.Language} <span class="required">*</span>` + label-uri=`${data.LocationWeblinkReq} <span class="required">*</span>` + label-format=`${data.FormatReq} <span class="required">*</span>` + label-fields=`${data.FieldRequired} <span class="required">*</span>` + label-resource_author=`${data.AuthorReq} <span class="required">*</span>` label-publication_year=`${data.DatePublication}` - label-skills=`${data.SkillReq}` - label-description=`${data.Description}` + label-skills=`${data.SkillReq} <span class="required">*</span>` + label-description=`${data.Description} <span class="required">*</span>` label-iframe_link=`${data.IframeLink}` label-preview_image=`${data.UploadPreviewImage}` - label-target=`${data.ResourceTargetReq}` - label-type=`${data.TypeContentReq}` - label-steps=`${data.CategorisationReq}` - label-sharing=`${data.ShareWithReq}` + label-target=`${data.ResourceTargetReq} <span class="required">*</span>` + label-type=`${data.TypeContentReq} <span class="required">*</span>` + label-steps=`${data.CategorisationReq} <span class="required">*</span>` + label-sharing=`${data.ShareWithReq} <span class="required">*</span>` label-related=`${data.AddResource}` diff --git a/src/scripts/coopstarter.js b/src/scripts/coopstarter.js index 809caf50..c9678272 100644 --- a/src/scripts/coopstarter.js +++ b/src/scripts/coopstarter.js @@ -637,22 +637,6 @@ function addProperFilterToSearchComponents(targetId) { }); } -let resourceLabelsSelector = [ - 'solid-form-label-text[name="name"]>label>div', - 'solid-form-label-text[name="uri"]>label>div', - 'solid-form-label-text[name="resource_author"]>label>div', - 'solid-form-auto-completion[name="country"]>label>div', - 'solid-form-auto-completion[name="languages"]>label>div', - 'solid-form-auto-completion[name="skills"]>label>div', - 'solid-form-auto-completion[name="fields"]>label>div', - 'solid-form-auto-completion[name="target"]>label>div', - 'solid-form-auto-completion[name="type"]>label>div', - 'solid-form-auto-completion[name="steps"]>label>div', - 'solid-form-auto-completion[name="format"]>label>div', - 'solid-form-auto-completion[name="sharing"]>label>div', - 'solid-form-textarea[name="description"]>label>div' -] - let resourcesFieldsSelector = [ 'input[name="name"]', 'input[name="uri"]', @@ -669,15 +653,6 @@ let resourcesFieldsSelector = [ 'textarea[name="description"]' ] -let mentorLabelsSelector = [ - 'solid-form-label-text[name="first_name"]>label>div', - 'solid-form-label-text[name="last_name"]>label>div', - 'solid-form-label-text[name="mentorProfile.city"]>label>div', - 'solid-form-auto-completion[name="mentorProfile.languages"]>label>div', - 'solid-form-auto-completion[name="mentorProfile.fields"]>label>div', - 'solid-form-auto-completion[name="mentorProfile.country"]>label>div' -] - let mentorFieldsSelector = [ 'input[name="first_name"]', 'input[name="last_name"]', @@ -761,13 +736,6 @@ document.addEventListener("DOMContentLoaded", event => { const mentorCreationForm = document.getElementById('mentor_profile_creation'); mentorCreationForm.addEventListener("populate", e => { - setTimeout(function() { - mentorLabelsSelector.forEach((labelSelector) => { - let labelElement = mentorCreationForm.querySelector(labelSelector); - labelElement.innerHTML = labelElement.innerHTML + " <span class='required'>*</span>"; - }); - }, 500); - let submitInput = mentorCreationForm.querySelectorAll('input[type=submit]')[0]; submitInput.disabled = true; submitInput.classList.add('disabled'); @@ -785,15 +753,6 @@ document.addEventListener("DOMContentLoaded", event => { const mentorResourceCreationForm = document.getElementById('resource_creation_form'); mentorResourceCreationForm.addEventListener("populate", e => { - setTimeout(function() { - resourceLabelsSelector.forEach((labelSelector) => { - let labelElement = mentorResourceCreationForm.querySelector(labelSelector); - if (!labelElement.innerHTML.includes("<span class='required'>*</span>")) { - labelElement.innerHTML = labelElement.innerHTML + " <span class='required'>*</span>"; - } - }); - }, 500); - let submitInput = mentorResourceCreationForm.querySelectorAll('input[type=submit]')[0]; submitInput.disabled = true; submitInput.classList.add('disabled'); @@ -818,21 +777,14 @@ document.addEventListener("DOMContentLoaded", event => { const mentorResourceEditionForm = document.getElementById('resource_edition_form'); mentorResourceEditionForm.addEventListener("populate", e => { - setTimeout(function() { - resourceLabelsSelector.forEach((labelSelector) => { - let labelElement = mentorResourceCreationForm.querySelector(labelSelector); - if (!labelElement.innerHTML.includes("<span class='required'>*</span>")) { - labelElement.innerHTML = labelElement.innerHTML + " <span class='required'>*</span>"; - } - }); - }, 500); - let submitInput = mentorResourceEditionForm.querySelectorAll('input[type=submit]')[0]; submitInput.disabled = true; submitInput.classList.add('disabled'); resourcesFieldsSelector.forEach(function(fieldSelector) { let input = mentorResourceEditionForm.querySelector(fieldSelector); + listenToInputChangeOnResourceCreation(mentorResourceEditionForm); + input.addEventListener('input', (() => { listenToInputChangeOnResourceCreation(mentorResourceEditionForm); })); -- GitLab