Merge pull request #681 from tainacan/feature/680
Adds option to begin filter collapsed #680.
This commit is contained in:
Mateus Machado Luna
GitHub
commit
49348bd0ea
|
|
@ -19,7 +19,8 @@ class Filter extends Entity {
|
|||
$metadatum_id,
|
||||
$max_options,
|
||||
$filter_type,
|
||||
$filter_type_options;
|
||||
$filter_type_options,
|
||||
$begin_with_filter_collapsed;
|
||||
|
||||
static $post_type = 'tainacan-filter';
|
||||
public $enabled_for_collection = true;
|
||||
|
|
@ -178,6 +179,16 @@ class Filter extends Entity {
|
|||
return $this->get_mapped_property('filter_type_options');
|
||||
}
|
||||
|
||||
/**
|
||||
* Return 'yes' or 'no' to the option of begining the filter collapsed
|
||||
*
|
||||
* @return string
|
||||
*/
|
||||
public function get_begin_with_filter_collapsed() {
|
||||
return $this->get_mapped_property('begin_with_filter_collapsed');
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Define the filter name
|
||||
*
|
||||
|
|
@ -248,9 +259,17 @@ class Filter extends Entity {
|
|||
* @param string | \Tainacan\Filter_Types\Filter_Type $value The name of the class or the instance
|
||||
*/
|
||||
public function set_filter_type($value){
|
||||
$this->set_mapped_property('filter_type', ( is_object( $value ) ) ? get_class( $value ) : $value );
|
||||
$this->set_mapped_property('filter_type', ( is_object( $value ) ) ? get_class( $value ) : $value );
|
||||
}
|
||||
|
||||
/**
|
||||
* Tells if filter should begin collapsed, not loading facets
|
||||
*
|
||||
* @param string $begin_with_filter_collapsed
|
||||
*/
|
||||
public function set_begin_with_filter_collapsed($begin_with_filter_collapsed) {
|
||||
$this->set_mapped_property('begin_with_filter_collapsed', $begin_with_filter_collapsed);
|
||||
}
|
||||
|
||||
/**
|
||||
* Transient property used to store the status of the filter for a particular collection
|
||||
|
|
|
|||
|
|
@ -68,6 +68,15 @@ class Filters extends Repository {
|
|||
'description' => __( 'The filter type class name, such as filter_type: Tainacan\Filter_Types\Checkbox', 'tainacan' ),
|
||||
'validation' => ''
|
||||
],
|
||||
'begin_with_filter_collapsed' => [
|
||||
'map' => 'meta',
|
||||
'title' => __( 'Begin with filter collapsed', 'tainacan' ),
|
||||
'type' => 'string',
|
||||
'description' => __( 'With this option enabled, the filter will appear as a button with an add icon, that should be pressed prior to loading any facet information.', 'tainacan' ),
|
||||
'on_error' => __( 'Please set the "Begin with filter collapsed" value as "yes" or "no"', 'tainacan' ),
|
||||
'validation' => v::stringType()->in( [ 'yes', 'no' ] ), // yes or no
|
||||
'default' => 'no'
|
||||
],
|
||||
'collection_id' => [
|
||||
'map' => 'meta',
|
||||
'title' => __( 'Collection', 'tainacan' ),
|
||||
|
|
|
|||
|
|
@ -152,6 +152,26 @@
|
|||
</div>
|
||||
</b-field>
|
||||
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.getHelperTitle('filters', 'begin_with_filter_collapsed')"
|
||||
:type="formErrors['begin_with_filter_collapsed'] != undefined ? 'is-danger' : ''"
|
||||
:message="formErrors['begin_with_filter_collapsed'] != undefined ? formErrors['begin_with_filter_collapsed'] : ''">
|
||||
|
||||
<b-switch
|
||||
size="is-small"
|
||||
@input="clearErrors('begin_with_filter_collapsed')"
|
||||
v-model="form.begin_with_filter_collapsed"
|
||||
true-value="yes"
|
||||
false-value="no"
|
||||
name="begin_with_filter_collapsed">
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('filters', 'begin_with_filter_collapsed')"
|
||||
:message="$i18n.getHelperMessage('filters', 'begin_with_filter_collapsed')"
|
||||
:extra-classes="isRepositoryLevel ? 'tainacan-repository-tooltip' : ''" />
|
||||
</b-switch>
|
||||
</b-field>
|
||||
|
||||
<component
|
||||
:errors="formErrors['filter_type_options']"
|
||||
v-if="(form.filter_type_object && form.filter_type_object.form_component) || form.edit_form == ''"
|
||||
|
|
@ -253,6 +273,7 @@ export default {
|
|||
|
||||
this.isLoading = true;
|
||||
// this.fillExtraFormData(this.form);
|
||||
|
||||
this.updateFilter({ filterId: filter.id, index: this.index, options: this.form})
|
||||
.then(() => {
|
||||
this.form = {};
|
||||
|
|
@ -280,7 +301,10 @@ export default {
|
|||
let formObj = {};
|
||||
|
||||
for (let [key, value] of formData.entries()) {
|
||||
formObj[key] = value;
|
||||
if (key === 'begin_with_filter_collapsed')
|
||||
formObj[key] = value ? 'yes' : 'no';
|
||||
else
|
||||
formObj[key] = value;
|
||||
}
|
||||
|
||||
this.fillExtraFormData(formObj);
|
||||
|
|
|
|||
|
|
@ -478,8 +478,12 @@
|
|||
let formData = new FormData(formElement);
|
||||
let formObj = {};
|
||||
|
||||
for (let [key, value] of formData.entries())
|
||||
formObj[key] = value;
|
||||
for (let [key, value] of formData.entries()) {
|
||||
if (key === 'description_bellow_name')
|
||||
formObj[key] = value ? 'yes' : 'no';
|
||||
else
|
||||
formObj[key] = value;
|
||||
}
|
||||
|
||||
this.fillExtraFormData(formObj);
|
||||
this.isUpdating = true;
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@
|
|||
class="filter-item-forms"
|
||||
:style="{ columnSpan: filtersAsModal && filter.filter_type_object && filter.filter_type_object.component && (filter.filter_type_object.component == 'tainacan-filter-taxonomy-checkbox' || filter.filter_type_object.component == 'tainacan-filter-checkbox') ? 'all' : 'unset'}">
|
||||
<b-collapse
|
||||
v-if="displayFilter"
|
||||
class="show"
|
||||
:open.sync="open"
|
||||
animation="filter-item">
|
||||
|
|
@ -28,7 +29,10 @@
|
|||
slot-scope="props">
|
||||
<span class="icon">
|
||||
<i
|
||||
:class="{ 'tainacan-icon-arrowdown' : props.open, 'tainacan-icon-arrowright' : !props.open }"
|
||||
:class="{
|
||||
'tainacan-icon-arrowdown' : props.open,
|
||||
'tainacan-icon-arrowright' : !props.open
|
||||
}"
|
||||
class="tainacan-icon tainacan-icon-1-25em"/>
|
||||
</span>
|
||||
<span class="collapse-label">{{ filter.name }}</span>
|
||||
|
|
@ -47,6 +51,34 @@
|
|||
:filters-as-modal="filtersAsModal"/>
|
||||
</div>
|
||||
</b-collapse>
|
||||
<div
|
||||
v-if="beginWithFilterCollapsed && !displayFilter"
|
||||
class="collapse show">
|
||||
<div class="collapse-trigger">
|
||||
<button
|
||||
|
||||
:for="'filter-input-id-' + filter.id"
|
||||
:aria-controls="'filter-input-id-' + filter.id"
|
||||
v-tooltip="{
|
||||
delay: {
|
||||
shown: 500,
|
||||
hide: 300,
|
||||
},
|
||||
content: $i18n.get('instruction_click_to_load_filter'),
|
||||
html: false,
|
||||
autoHide: false,
|
||||
placement: 'top-start',
|
||||
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : '']
|
||||
}"
|
||||
@click="displayFilter = true"
|
||||
class="label">
|
||||
<span class="icon">
|
||||
<i class="tainacan-icon tainacan-icon-add tainacan-icon-1em"/>
|
||||
</span>
|
||||
<span class="collapse-label">{{ filter.name }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</b-field>
|
||||
</template>
|
||||
|
||||
|
|
@ -63,7 +95,21 @@
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
isUsingElasticSearch: tainacan_plugin.wp_elasticpress == "1" ? true : false
|
||||
isUsingElasticSearch: tainacan_plugin.wp_elasticpress == "1" ? true : false,
|
||||
displayFilter: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
beginWithFilterCollapsed() {
|
||||
return this.filter && this.filter.begin_with_filter_collapsed && this.filter.begin_with_filter_collapsed === 'yes';
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
beginWithFilterCollapsed: {
|
||||
handler() {
|
||||
this.displayFilter = !this.beginWithFilterCollapsed;
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
|
|||
|
|
@ -685,6 +685,7 @@ return apply_filters( 'tainacan-i18n', [
|
|||
'instruction_thumbnail_alt' => __( 'Type here a descriptive text for the image thumbnail...', 'tainacan'),
|
||||
'instruction_click_to_see_%s_child_terms' => __( 'Click to see %s child terms', 'tainacan'),
|
||||
'instruction_click_to_see_%s_child_term' => __( 'Click to see %s child term', 'tainacan'),
|
||||
'instruction_click_to_load_filter' => __( 'Click to load the filter', 'tainacan' ),
|
||||
|
||||
// Info. Other feedback to user.
|
||||
'info_items_tab_all' => __( 'Every item, except by those sent to trash.', 'tainacan' ),
|
||||
|
|
|
|||
Loading…
Reference in New Issue