refined advanced search form display to be more explicite

This commit is contained in:
Bachir Soussi Chiadmi 2017-11-20 17:52:39 +01:00
parent 81810c5af4
commit 106129c27c
3 changed files with 232 additions and 135 deletions

View File

@ -796,14 +796,10 @@ function materio_search_api_search_form_submit($form, &$form_state){
function materio_search_api_advanced_search_form($form, &$form_state){
// dsm($form_state, 'form_state');
// dsm($form, 'form');
// global $user;
// $form = array();
// get vid from settings
$vid = variable_get('msa-advancedsearchvocabulary', null);
if($vid){
// global $language;
// dsm($language, "language");
$voc = taxonomy_vocabulary_load($vid);
$voc_machinename = $voc->machine_name;
@ -826,25 +822,6 @@ function materio_search_api_advanced_search_form($form, &$form_state){
// get the keywords from args and reconstruct the filter lines with default values
$args_values = array();
if($path == 'explore/filters' && $args[0] !== "ajax"){
// WORKING WITH TERM NAMES instead of tids
// $keywords = explode("+", $args[0]);
// // dsm($keywords, 'keywords');
// foreach ($keywords as $key => $value) {
// $name = str_replace('"', '', $value);
// //Get the term
// $terms = taxonomy_get_term_by_name($name, $voc_machinename);
// $term = array_shift($terms);
// // dsm($term, $term->tid.' : '.$term->name);
// // get parents
// if(isset($term->tid)){
// $parents = taxonomy_get_parents_all($term->tid);
// // dsm($parents, 'parents');
// // build default values
// for ($p=count($parents)-1; $p >=0 ; $p--) {
// $args_values[$key][] = $parents[$p]->tid;
// }
// }
// }
// WORKING WITH TIDS instead of term name
$tids = explode("+", $args[0]);
foreach ($tids as $key => $tid) {
@ -878,13 +855,38 @@ function materio_search_api_advanced_search_form($form, &$form_state){
}
// dsm($form_state['filterlines'], "form_state['filterlines']");
// filters form container
$form['filters'] = array(
'#type' => 'container',
'#prefix' => '<div id="advancedsearch-filters">',
'#attributes' => array('class' => array("advancedsearch-filters")),
'#prefix' => '<div id="advancedsearch-filters-wrapper">',
'#suffix' => '</div>',
);
$form['filters']['filters-table'] = array(
'#type' => 'container',
'#attributes' => array('class' => array("advanced-search-form-table"))
);
// form headers
// $form['filters']['filters-table']['headers'] = array(
// '#type' => 'container',
// '#attributes' => array('class' => array("advanced-search-form-headers")),
// 'category' => array(
// '#markup' => t("Category"),
// '#prefix' => '<div>','#suffix' => '</div>',
// ),
// 'main' => array(
// '#markup' => t("Main Filter"),
// '#prefix' => '<div>','#suffix' => '</div>',
// ),
// 'child' => array(
// '#markup' => t("Child Filter"),
// '#prefix' => '<div>','#suffix' => '</div>',
// )
// );
$trigger = FALSE;
if (!empty($form_state['triggering_element']['#name'])) {
$trigger = $form_state['triggering_element'];
@ -939,11 +941,9 @@ function materio_search_api_advanced_search_form($form, &$form_state){
}
// dsm("l : ".$l." | ll : ".$ll);
$form['filters']['filterline-'.$ll] = array(
$form['filters']['filters-table']['filterline-'.$ll] = array(
'#type' => 'container',
'#attributes' => array(
'class' => array("filter-line")
)
'#attributes' => array('class' => array("filter-line"))
);
// get the default value
@ -959,99 +959,122 @@ function materio_search_api_advanced_search_form($form, &$form_state){
// dsm($default0, "default 0");
// form select element for first level
$form['filters']['filterline-'.$ll]['filter-'.$ll.'-0'] = array(
$form['filters']['filters-table']['filterline-'.$ll]['filter-'.$ll.'-0'] = array(
'#type' => 'select',
'#options' => $level_0_ops,
'#name' => 'filter-'.$ll.'-0',
'#empty_option' => t("Choose a filter"),
'#empty_option' => t("Choose a category"),
// '#empty_values' => 0,
'#default_value' => $default0,
'#ajax' => array(
'callback' => 'materio_search_api_advanced_search_select_callback',
'wrapper' => 'advancedsearch-filters',
'wrapper' => 'advancedsearch-filters-wrapper',
),
);
// without this line, form api will mess with default values
$form_state["input"]['filter-'.$ll.'-0'] = $default0;
// add level 1 filter if level 0 chosen
if($default0){
if(is_null($default0)){
// $form['filters']['filterline-'.$ll]['filter-'.$ll.'-1']
$form['filters']['filters-table']['filterline-'.$ll]['filter-'.$ll.'-1'] = array(
'#markup' => t("Main Filter"),
'#prefix' => '<div class="filter-markup"><span>',
'#suffix' => '</span></div>',
);
// the definition of this markup appears twice, i may avoid that ...
$form['filters']['filters-table']['filterline-'.$ll]['filter-'.$ll.'-2'] = array(
'#markup' => t("Child Filter"),
'#prefix' => '<div class="filter-markup"><span>',
'#suffix' => '</span></div>',
);
}else{
// build second level taxonomy tree and select options
$taxotree1 = taxonomy_get_tree($vid, $default0, 1, true);
// dsm($taxotree1, 'taxotree1');
$level_1_ops = array();
foreach ($taxotree1 as $index => $term) {
// TODO: get translated tag name
// $term = taxonomy_term_load($tid);
$level_1_ops[$term->tid] = $term->name;
}
// build second level taxonomy tree and select options
$taxotree1 = taxonomy_get_tree($vid, $default0, 1, true);
// dsm($taxotree1, 'taxotree1');
$level_1_ops = array();
foreach ($taxotree1 as $index => $term) {
// TODO: get translated tag name
// $term = taxonomy_term_load($tid);
$level_1_ops[$term->tid] = $term->name;
}
// get the default value
// from from_state values if ajax
// or from url args
// or 0
$default1 = null;
if(isset($values['filter-'.$l.'-1']) && $values['filter-'.$l.'-1']){
$default1 = $values['filter-'.$l.'-1'];
}elseif(isset($args_values[$l][1])){
$default1 = $args_values[$l][1];
}
// dsm($default1, "default 1");
// get the default value
// from from_state values if ajax
// or from url args
// or 0
$default1 = null;
if(isset($values['filter-'.$l.'-1']) && $values['filter-'.$l.'-1']){
$default1 = $values['filter-'.$l.'-1'];
}elseif(isset($args_values[$l][1])){
$default1 = $args_values[$l][1];
}
// dsm($default1, "default 1");
// form select element for second level
$form['filters']['filters-table']['filterline-'.$ll]['filter-'.$ll.'-1'] = array(
'#type' => 'select',
'#options' => $level_1_ops,
'#name' => 'filter-'.$ll.'-1',
'#empty_option' => t("Choose a main filter"),
// '#empty_values' => 0,
'#default_value' => $default1,
'#ajax' => array(
'callback' => 'materio_search_api_advanced_search_select_callback',
'wrapper' => 'advancedsearch-filters-wrapper',
),
);
// without this line, form api will mess with default values
$form_state["input"]['filter-'.$ll.'-1'] = $default1;
// form select element for second level
$form['filters']['filterline-'.$ll]['filter-'.$ll.'-1'] = array(
'#type' => 'select',
'#options' => $level_1_ops,
'#name' => 'filter-'.$ll.'-1',
'#empty_option' => t("Choose a filter"),
// '#empty_values' => 0,
'#default_value' => $default1,
'#ajax' => array(
'callback' => 'materio_search_api_advanced_search_select_callback',
'wrapper' => 'advancedsearch-filters',
),
// add level 2 filter if level 1 chosen
if(is_null($default1)){
$form['filters']['filters-table']['filterline-'.$ll]['filter-'.$ll.'-2'] = array(
'#markup' => t("Child Filter"),
'#prefix' => '<div class="filter-markup"><span>',
'#suffix' => '</span></div>',
);
// without this line, form api will mess with default values
$form_state["input"]['filter-'.$ll.'-1'] = $default1;
}else{
// build second level taxonomy tree and select options
$taxotree2 = taxonomy_get_tree($vid, $default1, 1, true);
if(!count($taxotree2)){
$form['filters']['filters-table']['filterline-'.$ll]['filter-'.$ll.'-2'] = array(
'#markup' => t("No Child"),
'#prefix' => '<div class="filter-markup"><span>',
'#suffix' => '</span></div>',
);
}else{
// $default2 = isset($args_values[$l][2]) ? $args_values[$l][2] : 0;
$default2 = null;
if(isset($values['filter-'.$l.'-2']) && $values['filter-'.$l.'-2']){
$default2 = $values['filter-'.$l.'-2'];
}elseif(isset($args_values[$l][2])){
$default2 = $args_values[$l][2];
}
// dsm($default2, "default 2");
// add level 2 filter if level 1 chosen
if($default1){
// build second level taxonomy tree and select options
$taxotree2 = taxonomy_get_tree($vid, $default1, 1, true);
if(count($taxotree2)){
// $default2 = isset($args_values[$l][2]) ? $args_values[$l][2] : 0;
$default2 = null;
if(isset($values['filter-'.$l.'-2']) && $values['filter-'.$l.'-2']){
$default2 = $values['filter-'.$l.'-2'];
}elseif(isset($args_values[$l][2])){
$default2 = $args_values[$l][2];
}
// dsm($default2, "default 2");
$level_2_ops = array();
foreach ($taxotree2 as $index => $term) {
// TODO: get translated tag name
$level_2_ops[$term->tid] = t($term->name);
}
// form select element for third level
$form['filters']['filterline-'.$ll]['filter-'.$ll.'-2'] = array(
'#type' => 'select',
'#options' => $level_2_ops,
'#name' => 'filter-'.$ll.'-2',
'#empty_option' => t("Choose a filter"),
// '#empty_values' => 0,
'#default_value' => $default2,
);
// without this line, form api will mess with default values
$form_state["input"]['filter-'.$ll.'-2'] = $default2;
}
$level_2_ops = array();
foreach ($taxotree2 as $index => $term) {
// TODO: get translated tag name
$level_2_ops[$term->tid] = t($term->name);
}
// form select element for third level
$form['filters']['filters-table']['filterline-'.$ll]['filter-'.$ll.'-2'] = array(
'#type' => 'select',
'#options' => $level_2_ops,
'#name' => 'filter-'.$ll.'-2',
'#empty_option' => t("Refine with a child filter"),
// '#empty_values' => 0,
'#default_value' => $default2,
);
// without this line, form api will mess with default values
$form_state["input"]['filter-'.$ll.'-2'] = $default2;
}
}
}
// add remove the line button
$form['filters']['filterline-'.$ll]['rm-filter-'.$ll] = array(
$form['filters']['filters-table']['filterline-'.$ll]['rm-filter-'.$ll] = array(
'#type' => 'image_button',
'#src' => drupal_get_path('module', 'materio_search_api') . '/images/rmfilter.png',
'#title' => t('Remove this filter line'),
@ -1060,7 +1083,7 @@ function materio_search_api_advanced_search_form($form, &$form_state){
'#executes_submit_callback' => false,
'#ajax' => array(
'callback' => 'materio_search_api_advanced_search_rmline_callback',
'wrapper' => 'advancedsearch-filters',
'wrapper' => 'advancedsearch-filters-wrapper',
// 'trigger_as' => array("name"=>"rmfilters".$l),
),
"#attributes" => array('class'=>array('rm-btn')),
@ -1081,17 +1104,16 @@ function materio_search_api_advanced_search_form($form, &$form_state){
'#return_value' => "add",
'#ajax' => array(
'callback' => 'materio_search_api_advanced_search_addfilter_callback',
'wrapper' => 'advancedsearch-filters',
'wrapper' => 'advancedsearch-filters-wrapper',
),
'#executes_submit_callback' => false,
'#attributes' => array(
'class'=>array('add-filter')
),
'#attributes' => array('class'=>array('add-filter'))
);
// buttons form container
$form['rightcol'] = array(
'#type' => 'container',
"#attributes" => array('class'=>array('right-col')),
);
// add a back to search/base home bouton if on explore/foo
if ($path == 'explore' || $path == 'explore/filters' || $path == 'bookmarks' || $path == 'lists' ) {
@ -1168,7 +1190,7 @@ function materio_search_api_advanced_search_rmline_callback($form, &$form_state)
function materio_search_api_advanced_search_form_validate($form, &$form_state){
if($form_state['triggering_element']['#name'] == 'search'){
// dsm($form, '$form');
// dsm($form_state, 'form_state');
dsm($form_state, 'form_state');
if (!isset($form_state['values']['filter-0-1']) || $form_state['values']['filter-0-1'] == '') {
form_set_error('filters', 'Please choose at least 1 keyword.');

View File

@ -3289,7 +3289,8 @@ body.node-type-publication #footer {
*/
#utilities {
background-color: #fff;
margin-top: 60px; }
margin-top: 60px;
max-height: 100px; }
.not-logged-in #utilities {
overflow: hidden; }
#utilities > .inner {
@ -3926,44 +3927,69 @@ body.home-v2 #main {
display: none; } }
#tool-bar #materio-search-api-advanced-search-form > div {
position: relative; }
#tool-bar #materio-search-api-advanced-search-form > div #advancedsearch-filters, #tool-bar #materio-search-api-advanced-search-form > div > .form-wrapper {
#tool-bar #materio-search-api-advanced-search-form > div #advancedsearch-filters-wrapper, #tool-bar #materio-search-api-advanced-search-form > div .form-wrapper.right-col {
display: inline-block;
vertical-align: top; }
#tool-bar #materio-search-api-advanced-search-form > div > .form-wrapper {
#tool-bar #materio-search-api-advanced-search-form > div .form-wrapper.right-col {
position: relative;
text-align: center; }
#tool-bar #materio-search-api-advanced-search-form > div > .form-wrapper > * {
#tool-bar #materio-search-api-advanced-search-form > div .form-wrapper.right-col > * {
display: block; }
#tool-bar #materio-search-api-advanced-search-form > div > .form-wrapper a.back-search-home {
#tool-bar #materio-search-api-advanced-search-form > div .form-wrapper.right-col a.back-search-home {
color: #000;
padding-top: 0.45em; }
#tool-bar #materio-search-api-advanced-search-form > div > .form-wrapper a.back-search-home i:before {
#tool-bar #materio-search-api-advanced-search-form > div .form-wrapper.right-col a.back-search-home i:before {
font-size: 1.3em; }
#tool-bar #materio-search-api-advanced-search-form > div > .form-wrapper #edit-search {
#tool-bar #materio-search-api-advanced-search-form > div .form-wrapper.right-col #edit-search {
margin: 1em 0 0.5em; }
#tool-bar #materio-search-api-advanced-search-form #advancedsearch-filters {
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters {
padding-right: 0.5em;
margin-right: 0.5em;
border-right: 1px solid #ccc; }
#tool-bar #materio-search-api-advanced-search-form #advancedsearch-filters .filter-line {
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters .advanced-search-form-table {
display: table;
border-collapse: separate;
border-spacing: 0 0.2em; }
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters .advanced-search-form-headers {
display: table-header-group;
width: 100%; }
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters .advanced-search-form-headers > div {
display: table-cell;
text-align: left;
text-transform: uppercase;
font-size: 9px; }
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters .advanced-search-form-headers > div:last-child:after {
content: "";
display: table-cell; }
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters .filter-line {
margin: 0.3em 0;
padding-top: 0.3em; }
#tool-bar #materio-search-api-advanced-search-form #advancedsearch-filters .filter-line:not(:first-child) {
padding-top: 0.3em;
display: table-row; }
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters .filter-line:not(:first-child) {
border-top: 1px solid #ccc; }
#tool-bar #materio-search-api-advanced-search-form #advancedsearch-filters .filter-line .form-item {
display: inline-block;
vertical-align: middle;
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters .filter-line > * {
display: table-cell;
text-align: left; }
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters .filter-line > *:not(:last-child) {
padding: 0 1em 0 0; }
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters .filter-line .form-item {
font-size: 12px;
line-height: 1;
text-transform: capitalize;
margin: 0 0em 0 0; }
#tool-bar #materio-search-api-advanced-search-form #advancedsearch-filters .filter-line select {
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters .filter-line select {
width: auto; }
#tool-bar #materio-search-api-advanced-search-form #advancedsearch-filters .rm-btn {
float: right;
margin: 0.4em 0 0.4em 0.4em; }
#tool-bar #materio-search-api-advanced-search-form #advancedsearch-filters .add-filter {
margin: 0.5em 0; }
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters .filter-line .filter-markup span {
padding: 0.4em 1em;
display: block;
font-size: 11px;
background-color: #eee;
color: #777;
text-align: center;
border-radius: 7px; }
#tool-bar #materio-search-api-advanced-search-form .form-wrapper.advancedsearch-filters .add-filter {
margin: 0.5em 0;
display: table-row; }
#tool-bar #materio-search-api-advanced-search-form div.search-btn-wrapper {
display: inline-block; }
#tool-bar #materio-search-api-advanced-search-form.loading div.search-btn-wrapper {

View File

@ -573,6 +573,7 @@ $headerouterheight:$headerheight+$headerpaddingtop+$headerpaddingbottom;
@media #{$small-only}{
margin-top:0;
}
max-height: 100px;
}
/*
_
@ -1196,12 +1197,12 @@ $headerouterheight:$headerheight+$headerpaddingtop+$headerpaddingbottom;
#materio-search-api-advanced-search-form{
>div{
position: relative;
#advancedsearch-filters, >.form-wrapper{
#advancedsearch-filters-wrapper, .form-wrapper.right-col{
display: inline-block;
vertical-align: top;
}
>.form-wrapper{
.form-wrapper.right-col{
position: relative;
text-align: center;
>*{display:block;}
@ -1218,22 +1219,56 @@ $headerouterheight:$headerheight+$headerpaddingtop+$headerpaddingbottom;
}
}
#advancedsearch-filters{
.form-wrapper.advancedsearch-filters{
padding-right: 0.5em;
margin-right: 0.5em;
border-right: 1px solid #ccc;
.advanced-search-form-table{
display:table;
border-collapse:separate;
border-spacing: 0 0.2em;
// min-width: 500px;
}
.advanced-search-form-headers{
display:table-header-group;
width:100%;
// grid-template-columns: 30% 30% 30%;
>div{
display:table-cell;
// min-width: 30%;
text-align: left;
text-transform: uppercase;
font-size: 9px;
}
>div:last-child:after{
content:"";
display:table-cell;
}
}
.filter-line{
margin:0.3em 0;
padding-top:0.3em;
display: table-row;
&:not(:first-child){
border-top: 1px solid #ccc;
}
>*{
display:table-cell;
text-align: left;
&:not(:last-child){
padding:0 1em 0 0;
}
}
.form-item{
display:inline-block;
vertical-align: middle;
// display:inline-block;
// vertical-align: middle;
@include fs12; line-height:1;
// padding-right:3em;
text-transform: capitalize;
@ -1244,15 +1279,29 @@ $headerouterheight:$headerheight+$headerpaddingtop+$headerpaddingbottom;
select{
width:auto;
}
.filter-markup{
// border-left: 1px solid #ccc;
span{
padding:0.4em 1em;
display: block;
font-size: 11px;
background-color: #eee;
color:#777;
text-align: center;
border-radius: 7px;
}
}
}
.rm-btn{
float: right;
margin:0.4em 0 0.4em 0.4em;
}
// .rm-btn{
// float: right;
// margin:0.4em 0 0.4em 0.4em;
// }
.add-filter{
margin:0.5em 0;
display: table-row;
}
}