Skip to content
Snippets Groups Projects
Commit ff1bd1f1 authored by Benoit Alessandroni's avatar Benoit Alessandroni
Browse files

Merge branch 'feature/filter-by-type' into 'master' 

Filtering by type.

See merge request startinblox/applications/coop-starter/coopstarter-front!42
parents bca1ce41 d01c4556
No related branches found
No related tags found
1 merge request!42Filtering by type.
Hide whitespace changes
Inline Side-by-side
src/includes/components/widgets.pug
+ 9
− 4
View file @ ff1bd1f1
...@@ -125,7 +125,12 @@ sib-widget(name='cs-profile-picture') ...@@ -125,7 +125,12 @@ sib-widget(name='cs-profile-picture')
img(name="${name}", src="\${value || '/images/alien.jpg'}", alt="Coopstarter") img(name="${name}", src="\${value || '/images/alien.jpg'}", alt="Coopstarter")
sib-widget(name="hidden-widget") sib-widget(name="hidden-widget")
template template
div(data-content style="display:none;") div(data-content style="display:none;")
\ No newline at end of file sib-widget(name="fake-tabs")
template
h2.fake-tabs ${value}
\ No newline at end of file
src/includes/entrepreneur/dashboard.pug
+ 0
− 3
View file @ ff1bd1f1
...@@ -7,9 +7,6 @@ header#header(role='banner') ...@@ -7,9 +7,6 @@ header#header(role='banner')
include ./components/header.pug include ./components/header.pug
section#home section#home
div#coopstarter-loader
hidden Loading, please wait...
//TODO: //TODO:
//-Distinguish the search form from the listing //-Distinguish the search form from the listing
//-Create two Sib-displays getting the resources by "types" //-Create two Sib-displays getting the resources by "types"
......
src/includes/entrepreneur/resources/list.pug
+ 269
− 236
View file @ ff1bd1f1
...@@ -14,9 +14,12 @@ container.block_list.flex.flex_espace ...@@ -14,9 +14,12 @@ container.block_list.flex.flex_espace
div.w_75.block-g-entre div.w_75.block-g-entre
div div
h2.title_form Search for a resource h2.title_form Search for a resource
div#resources-loader
hidden Loading resources, please wait...
sib-form#search-by-keyword( sib-form#search-by-keyword(
data-src=`${endpoints.resources}`, data-src=`${endpoints.resources}`,
loader-id="coopstarter-loader" loader-id="resources-loader"
fields='keyword(name_keyword, description, author)' fields='keyword(name_keyword, description, author)'
label-keyword="Search by author, name..." label-keyword="Search by author, name..."
widget-keyword="sib-form-placeholder-text" widget-keyword="sib-form-placeholder-text"
...@@ -75,249 +78,279 @@ container.block_list.flex.flex_espace ...@@ -75,249 +78,279 @@ container.block_list.flex.flex_espace
div div
div.button_base Make a request div.button_base Make a request
div#resources-loader
hidden Loading resources, please wait... //Fake tabs to filter by type.
div.tabs.flex_espace
div(class='tablink filter_by_type active', onclick="openFakeTab(this)")
sib-display#type1(
data-src=`${endpoints.types}1/`
fields='name'
widget-name='fake-tabs'
)
//Step 1 div(class='tablink filter_by_type', onclick="openFakeTab(this)")
sib-display#circles-list( sib-display#type2(
loader-id="resources-loader" data-src=`${endpoints.types}2/`
data-src=`${endpoints.steps}1/`, fields='name'
fields='name' widget-name='fake-tabs'
)
label-name ='Step 1 ' div.block_log.block_list
label-resources=''
//Step 1
widget-name='cs-steps-header' sib-display#circles-list(
) loader-id="resources-loader"
data-src=`${endpoints.steps}1/`,
sib-display.resource_by_step( fields='name'
data-src=`${endpoints.steps}1/resources/`,
fields='name, author, format, publication_year, description, country, language, fields',
search-fields='search_for_a_resource(name, description, author), more_criterias_hidden(format, publication_year, country, language, fields)',
search-range-format=`${endpoints.formats}`
search-range-language=`${endpoints.languages}`
search-range-fields=`${endpoints.fields}`
search-widget-search_for_a_resource="hidden-widget"
search-widget-more_criterias_hidden="hidden-widget"
search-multiple-format='sib-form-dropdown'
search-widget-format='sib-form-auto-completion'
search-multiple-language='sib-form-dropdown'
search-widget-language='sib-form-auto-completion'
search-multiple-fields='sib-form-dropdown'
search-widget-fields='sib-form-auto-completion'
widget-name='cs-display-property'
widget-country='cs-display-property'
widget-publication_year='cs-display-property'
widget-description='cs-display-property'
widget-fields='hidden-widget'
widget-language="hidden-widget"
widget-author="cs-display-property"
widget-format='cs-display-multiple-property'
label-format=''
multiple-format
label-language=''
multiple-language
label-fields=''
multiple-fields
paginate-by="5"
)
//Step 2 label-name ='Step 1 '
sib-display#circles-list( label-resources=''
data-src=`${endpoints.steps}2/`,
fields='name' widget-name='cs-steps-header'
)
sib-display.resource_by_step(
data-src=`${endpoints.steps}1/resources/`,
fields='name, author, format, publication_year, description, country, language, fields',
search-fields='search_for_a_resource(name, description, author), more_criterias_hidden(format, publication_year, country, language, fields, type)',
search-range-format=`${endpoints.formats}`
search-range-language=`${endpoints.languages}`
search-range-fields=`${endpoints.fields}`
search-range-type=`${endpoints.types}`
search-widget-search_for_a_resource="hidden-widget"
search-widget-more_criterias_hidden="hidden-widget"
search-multiple-type='sib-form-dropdown'
search-widget-type='sib-form-auto-completion'
search-multiple-format='sib-form-dropdown'
search-widget-format='sib-form-auto-completion'
search-multiple-language='sib-form-dropdown'
search-widget-language='sib-form-auto-completion'
search-multiple-fields='sib-form-dropdown'
search-widget-fields='sib-form-auto-completion'
label-name ='Step 2 '
label-resources=''
widget-name='cs-steps-header' widget-name='cs-display-property'
) widget-country='cs-display-property'
widget-publication_year='cs-display-property'
sib-display.resource_by_step( widget-description='cs-display-property'
data-src=`${endpoints.steps}2/resources/`, widget-fields='hidden-widget'
fields='name, author, format, publication_year, description, country, language, fields', widget-language="hidden-widget"
search-fields='search_for_a_resource(name, description, author), more_criterias_hidden(format, publication_year, country, language, fields)', widget-author="cs-display-property"
search-range-format=`${endpoints.formats}` widget-format='cs-display-multiple-property'
search-range-language=`${endpoints.languages}` label-format=''
search-range-fields=`${endpoints.fields}` multiple-format
label-language=''
multiple-language
search-widget-search_for_a_resource="hidden-widget" label-fields=''
search-widget-more_criterias_hidden="hidden-widget" multiple-fields
search-multiple-format='sib-form-dropdown'
search-widget-format='sib-form-auto-completion' paginate-by="5"
search-multiple-language='sib-form-dropdown' )
search-widget-language='sib-form-auto-completion'
search-multiple-fields='sib-form-dropdown' //Step 2
search-widget-fields='sib-form-auto-completion' sib-display#circles-list(
data-src=`${endpoints.steps}2/`,
fields='name'
widget-name='cs-display-property'
widget-country='cs-display-property'
widget-publication_year='cs-display-property'
widget-description='cs-display-property'
widget-fields='hidden-widget'
widget-language="hidden-widget"
widget-author="cs-display-property"
widget-format='cs-display-multiple-property'
label-format=''
multiple-format
label-language=''
multiple-language
label-fields=''
multiple-fields
paginate-by="5"
)
//Step 3 label-name ='Step 2 '
sib-display#circles-list( label-resources=''
data-src=`${endpoints.steps}3/`,
fields='name' widget-name='cs-steps-header'
)
sib-display.resource_by_step(
data-src=`${endpoints.steps}2/resources/`,
fields='name, author, format, publication_year, description, country, language, fields',
search-fields='search_for_a_resource(name, description, author), more_criterias_hidden(format, publication_year, country, language, fields, type)',
search-range-format=`${endpoints.formats}`
search-range-language=`${endpoints.languages}`
search-range-fields=`${endpoints.fields}`
search-range-type=`${endpoints.types}`
search-widget-search_for_a_resource="hidden-widget"
search-widget-more_criterias_hidden="hidden-widget"
search-multiple-type='sib-form-dropdown'
search-widget-type='sib-form-auto-completion'
search-multiple-format='sib-form-dropdown'
search-widget-format='sib-form-auto-completion'
search-multiple-language='sib-form-dropdown'
search-widget-language='sib-form-auto-completion'
search-multiple-fields='sib-form-dropdown'
search-widget-fields='sib-form-auto-completion'
label-name ='Step 3 '
label-resources=''
widget-name='cs-steps-header' widget-name='cs-display-property'
widget-country='cs-display-property'
) widget-publication_year='cs-display-property'
widget-description='cs-display-property'
sib-display.resource_by_step( widget-fields='hidden-widget'
data-src=`${endpoints.steps}3/resources/`, widget-language="hidden-widget"
fields='name, author, format, publication_year, description, country, language, fields', widget-author="cs-display-property"
search-fields='search_for_a_resource(name, description, author), more_criterias_hidden(format, publication_year, country, language, fields)', widget-format='cs-display-multiple-property'
search-range-format=`${endpoints.formats}` label-format=''
search-range-language=`${endpoints.languages}` multiple-format
search-range-fields=`${endpoints.fields}` label-language=''
multiple-language
label-fields=''
search-widget-search_for_a_resource="hidden-widget" multiple-fields
search-widget-more_criterias_hidden="hidden-widget"
search-multiple-format='sib-form-dropdown' paginate-by="5"
search-widget-format='sib-form-auto-completion' )
search-multiple-language='sib-form-dropdown'
search-widget-language='sib-form-auto-completion' //Step 3
search-multiple-fields='sib-form-dropdown' sib-display#circles-list(
search-widget-fields='sib-form-auto-completion' data-src=`${endpoints.steps}3/`,
fields='name'
widget-name='cs-display-property' label-name ='Step 3 '
widget-country='cs-display-property' label-resources=''
widget-publication_year='cs-display-property'
widget-description='cs-display-property' widget-name='cs-steps-header'
widget-fields='hidden-widget'
widget-language="hidden-widget" )
widget-author="cs-display-property"
widget-format='cs-display-multiple-property' sib-display.resource_by_step(
label-format='' data-src=`${endpoints.steps}3/resources/`,
multiple-format fields='name, author, format, publication_year, description, country, language, fields',
label-language='' search-fields='search_for_a_resource(name, description, author), more_criterias_hidden(format, publication_year, country, language, fields, type)',
multiple-language search-range-format=`${endpoints.formats}`
label-fields='' search-range-language=`${endpoints.languages}`
multiple-fields search-range-fields=`${endpoints.fields}`
search-range-type=`${endpoints.types}`
search-widget-search_for_a_resource="hidden-widget"
search-widget-more_criterias_hidden="hidden-widget"
search-multiple-type='sib-form-dropdown'
search-widget-type='sib-form-auto-completion'
search-multiple-format='sib-form-dropdown'
search-widget-format='sib-form-auto-completion'
search-multiple-language='sib-form-dropdown'
search-widget-language='sib-form-auto-completion'
search-multiple-fields='sib-form-dropdown'
search-widget-fields='sib-form-auto-completion'
paginate-by="5" widget-name='cs-display-property'
) widget-country='cs-display-property'
widget-publication_year='cs-display-property'
//Step 4 widget-description='cs-display-property'
sib-display#circles-list( widget-fields='hidden-widget'
data-src=`${endpoints.steps}4/`, widget-language="hidden-widget"
fields='name' widget-author="cs-display-property"
widget-format='cs-display-multiple-property'
label-name ='Step 4 ' label-format=''
label-resources='' multiple-format
label-language=''
widget-name='cs-steps-header' multiple-language
label-fields=''
) multiple-fields
sib-display.resource_by_step( paginate-by="5"
data-src=`${endpoints.steps}4/resources/`, )
fields='name, author, format, publication_year, description, country, language, fields',
search-fields='search_for_a_resource(name, description, author), more_criterias_hidden(format, publication_year, country, language, fields)', //Step 4
search-range-format=`${endpoints.formats}` sib-display#circles-list(
search-range-language=`${endpoints.languages}` data-src=`${endpoints.steps}4/`,
search-range-fields=`${endpoints.fields}` fields='name'
label-name ='Step 4 '
search-widget-search_for_a_resource="hidden-widget" label-resources=''
search-widget-more_criterias_hidden="hidden-widget"
search-multiple-format='sib-form-dropdown' widget-name='cs-steps-header'
search-widget-format='sib-form-auto-completion'
search-multiple-language='sib-form-dropdown' )
search-widget-language='sib-form-auto-completion'
search-multiple-fields='sib-form-dropdown' sib-display.resource_by_step(
search-widget-fields='sib-form-auto-completion' data-src=`${endpoints.steps}4/resources/`,
fields='name, author, format, publication_year, description, country, language, fields',
search-fields='search_for_a_resource(name, description, author), more_criterias_hidden(format, publication_year, country, language, fields, type)',
widget-name='cs-display-property' search-range-format=`${endpoints.formats}`
widget-country='cs-display-property' search-range-language=`${endpoints.languages}`
widget-publication_year='cs-display-property' search-range-fields=`${endpoints.fields}`
widget-description='cs-display-property' search-range-type=`${endpoints.types}`
widget-fields='hidden-widget'
widget-language="hidden-widget"
widget-author="cs-display-property" search-widget-search_for_a_resource="hidden-widget"
widget-format='cs-display-multiple-property' search-widget-more_criterias_hidden="hidden-widget"
label-format='' search-multiple-type='sib-form-dropdown'
multiple-format search-widget-type='sib-form-auto-completion'
label-language='' search-multiple-format='sib-form-dropdown'
multiple-language search-widget-format='sib-form-auto-completion'
label-fields='' search-multiple-language='sib-form-dropdown'
multiple-fields search-widget-language='sib-form-auto-completion'
search-multiple-fields='sib-form-dropdown'
search-widget-fields='sib-form-auto-completion'
paginate-by="5" widget-name='cs-display-property'
) widget-country='cs-display-property'
widget-publication_year='cs-display-property'
//Step 5 widget-description='cs-display-property'
sib-display#circles-list( widget-fields='hidden-widget'
data-src=`${endpoints.steps}5/`, widget-language="hidden-widget"
fields='name' widget-author="cs-display-property"
widget-format='cs-display-multiple-property'
label-name ='Step 5 ' label-format=''
label-resources='' multiple-format
label-language=''
widget-name='cs-steps-header' multiple-language
) label-fields=''
multiple-fields
sib-display.resource_by_step(
data-src=`${endpoints.steps}5/resources/`, paginate-by="5"
fields='name, author, format, publication_year, description, country, language, fields', )
search-fields='search_for_a_resource(name, description, author), more_criterias_hidden(format, publication_year, country, language, fields)',
search-range-format=`${endpoints.formats}` //Step 5
search-range-language=`${endpoints.languages}` sib-display#circles-list(
search-range-fields=`${endpoints.fields}` data-src=`${endpoints.steps}5/`,
fields='name'
search-widget-search_for_a_resource="hidden-widget" label-name ='Step 5 '
search-widget-more_criterias_hidden="hidden-widget" label-resources=''
search-multiple-format='sib-form-dropdown'
search-widget-format='sib-form-auto-completion' widget-name='cs-steps-header'
search-multiple-language='sib-form-dropdown' )
search-widget-language='sib-form-auto-completion'
search-multiple-fields='sib-form-dropdown' sib-display.resource_by_step(
search-widget-fields='sib-form-auto-completion' data-src=`${endpoints.steps}5/resources/`,
fields='name, author, format, publication_year, description, country, language, fields',
search-fields='search_for_a_resource(name, description, author), more_criterias_hidden(format, publication_year, country, language, fields, type)',
widget-name='cs-display-property' search-range-format=`${endpoints.formats}`
widget-country='cs-display-property' search-range-language=`${endpoints.languages}`
widget-publication_year='cs-display-property' search-range-fields=`${endpoints.fields}`
widget-description='cs-display-property' search-range-type=`${endpoints.types}`
widget-fields='hidden-widget'
widget-language="hidden-widget"
widget-author="cs-display-property" search-widget-search_for_a_resource="hidden-widget"
widget-format='cs-display-multiple-property' search-widget-more_criterias_hidden="hidden-widget"
label-format='' search-multiple-type='sib-form-dropdown'
multiple-format search-widget-type='sib-form-auto-completion'
label-language='' search-multiple-format='sib-form-dropdown'
multiple-language search-widget-format='sib-form-auto-completion'
label-fields='' search-multiple-language='sib-form-dropdown'
multiple-fields search-widget-language='sib-form-auto-completion'
search-multiple-fields='sib-form-dropdown'
search-widget-fields='sib-form-auto-completion'
paginate-by="5" widget-name='cs-display-property'
) widget-country='cs-display-property'
widget-publication_year='cs-display-property'
widget-description='cs-display-property'
widget-fields='hidden-widget'
widget-language="hidden-widget"
widget-author="cs-display-property"
widget-format='cs-display-multiple-property'
label-format=''
multiple-format
label-language=''
multiple-language
label-fields=''
multiple-fields
paginate-by="5"
)
src/scripts/coopstarter.js
+ 60
− 7
View file @ ff1bd1f1
...@@ -14,6 +14,18 @@ function openTab(pageName, elmnt) { ...@@ -14,6 +14,18 @@ function openTab(pageName, elmnt) {
elmnt.classList.add("active"); elmnt.classList.add("active");
} }
//Manage the visual of the fake tabs in entrepreneur dashboard.
function openFakeTab(elmnt) {
// Hide all elements with class="tabcontent" by default */
var i, tablinks;
tablinks = document.getElementsByClassName("tablink");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].classList.remove("active");
}
elmnt.classList.add("active");
}
function linkDatasetToField(detail, targetFormName, inputName) { function linkDatasetToField(detail, targetFormName, inputName) {
let targetForm = document.getElementById(targetFormName); let targetForm = document.getElementById(targetFormName);
targetForm.addEventListener("populate", event => { targetForm.addEventListener("populate", event => {
...@@ -74,7 +86,6 @@ function selectHiddenManagement(select_hidden, option_selected, form) { ...@@ -74,7 +86,6 @@ function selectHiddenManagement(select_hidden, option_selected, form) {
} }
form.querySelector("sib-form").component.inputChange(); form.querySelector("sib-form").component.inputChange();
refreshPagination(); refreshPagination();
} }
//Manage input hidden field to fullfill them with more "more criterias" selection //Manage input hidden field to fullfill them with more "more criterias" selection
...@@ -82,7 +93,37 @@ function inputHiddenManagement(field, field_search, form) { ...@@ -82,7 +93,37 @@ function inputHiddenManagement(field, field_search, form) {
field.setAttribute("value", field_search.value); field.setAttribute("value", field_search.value);
form.querySelector("sib-form").component.inputChange(); form.querySelector("sib-form").component.inputChange();
refreshPagination(); refreshPagination();
}
//Manage select hidden for type to fullfill them with more "more criterias" selection
function selectHiddenManagementForType(tab, form) {
let type_hidden_field = document.querySelectorAll(
'hidden-widget[name="more_criterias_hidden"] select[name="type"]'
);
if (tab.classList.contains("active")) {
//Fullfill hidden field
let type_field_search = tab
.querySelector(`sib-display`)
.getAttribute("data-src");
type_hidden_field.forEach(function(select_hidden) {
options_hidden = select_hidden.getElementsByTagName("option");
for (let option_hidden of options_hidden) {
option_hidden.removeAttribute("selected");
if (option_hidden.value == '{"@id": "' + type_field_search + '"}') {
//Actually selecting the option if it is the good one
option_hidden.setAttribute("selected", "selected");
select_hidden.setAttribute("value", option_hidden.value);
form.querySelector("sib-form").component.inputChange();
refreshPagination();
}
}
//Trigerring a reload of the associated form
let parent_form = select_hidden.closest("sib-form");
parent_form.component.inputChange();
refreshPagination();
});
}
} }
jQuery(document).ready(function($) { jQuery(document).ready(function($) {
...@@ -133,8 +174,15 @@ jQuery(document).ready(function($) { ...@@ -133,8 +174,15 @@ jQuery(document).ready(function($) {
forms.forEach(form => { forms.forEach(form => {
form.addEventListener("populate", e => { form.addEventListener("populate", e => {
//Manage fake tabs
let tabs = document.getElementsByClassName("filter_by_type");
for (let tab of tabs) {
selectHiddenManagementForType(tab, form);
}
//On load in dashbord Entrepreneur //On load in dashbord Entrepreneur
refreshPagination(); refreshPagination();
//SEARCH BY KEYWORD //SEARCH BY KEYWORD
//To retrieve keyword //To retrieve keyword
//https://git.happy-dev.fr/startinblox/framework/sib-core/issues/379 //https://git.happy-dev.fr/startinblox/framework/sib-core/issues/379
...@@ -152,7 +200,6 @@ jQuery(document).ready(function($) { ...@@ -152,7 +200,6 @@ jQuery(document).ready(function($) {
hidden_field.setAttribute("value", keyword_field.value); hidden_field.setAttribute("value", keyword_field.value);
form.querySelector("sib-form").component.inputChange(); form.querySelector("sib-form").component.inputChange();
refreshPagination(); refreshPagination();
}); });
}); });
...@@ -168,14 +215,12 @@ jQuery(document).ready(function($) { ...@@ -168,14 +215,12 @@ jQuery(document).ready(function($) {
}; };
//MORE CRITERIAS //MORE CRITERIAS
//TODO: Refactor this section ?
const more_criterias_form = document.getElementById("more_criterias"); const more_criterias_form = document.getElementById("more_criterias");
// https://git.happy-dev.fr/startinblox/framework/sib-core/issues/453 // https://git.happy-dev.fr/startinblox/framework/sib-core/issues/453
window.setTimeout(() => { window.setTimeout(() => {
//Refresh data list on delete resources //Refresh data list on delete resources
const deleteButton = document.querySelectorAll("sib-delete"); const deleteButton = document.querySelectorAll("sib-delete");
for (var i = 0; i < deleteButton.length; i++) { for (var i = 0; i < deleteButton.length; i++) {
deleteButton[i].addEventListener("resourceDeleted", e => { deleteButton[i].addEventListener("resourceDeleted", e => {
const historyList = document.getElementById("resources-history"); const historyList = document.getElementById("resources-history");
...@@ -198,13 +243,21 @@ jQuery(document).ready(function($) { ...@@ -198,13 +243,21 @@ jQuery(document).ready(function($) {
}); });
} }
//Manage fake tabs for type
let tabs = document.getElementsByClassName("filter_by_type");
for (let tab of tabs) {
tab.addEventListener(
"click",
selectHiddenManagementForType(tab, form)
);
}
//To retrieve format //To retrieve format
//TODO: How we should filled the hidden field with multiple value?
//TODO: The hidden search field set with one value doesn't work
let format_field_search = more_criterias_form.querySelector( let format_field_search = more_criterias_form.querySelector(
`select[name="format"]` `select[name="format"]`
); );
format_hidden_field = document.querySelectorAll( let format_hidden_field = document.querySelectorAll(
'hidden-widget[name="more_criterias_hidden"] select[name="format"]' 'hidden-widget[name="more_criterias_hidden"] select[name="format"]'
); );
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment