Fixes carousels responsiveness on screen smaller than 468px and fixes selection of facets metadatum type after translation.
This commit is contained in:
mateuswetah
parent
f8af51c924
commit
e6fefd3259
|
|
@ -637,13 +637,13 @@
|
|||
.wp-block-tainacan-facets-list .show-more-button i > svg {
|
||||
fill: white; }
|
||||
|
||||
.filter-item-enter-active {
|
||||
.child-reveal-enter-active {
|
||||
overflow: hidden;
|
||||
animation-name: filter-item-in;
|
||||
animation-duration: 0.1s;
|
||||
animation-timing-function: ease; }
|
||||
|
||||
.filter-item-leave-active {
|
||||
.child-reveal-leave-active {
|
||||
overflow: hidden;
|
||||
animation-name: filter-item-out;
|
||||
animation-duration: 0.1s;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -141,9 +141,15 @@ class REST_Facets_Controller extends REST_Controller {
|
|||
$second_arg = $val['taxonomy'];
|
||||
}
|
||||
$entity = $metadatum_type_object->get_repository()->fetch( (int) $val['value'], $second_arg );
|
||||
if ($entity) {
|
||||
|
||||
$add_attt_item = function($array_item, $item) {
|
||||
$array_item['thumbnail'] = $item->get_thumbnail();
|
||||
return $array_item;
|
||||
};
|
||||
add_filter('tainacan-item-to-array', $add_attt_item, 10, 2);
|
||||
$val['entity'] = $entity->_toArray();
|
||||
}
|
||||
remove_filter( 'tainacan-item-to-array', $add_attt_item, 10);
|
||||
|
||||
return $val;
|
||||
}, $all_values['values']);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@
|
|||
<div
|
||||
class="skeleton"
|
||||
:style="{
|
||||
minHeight: (childItemMetadatum.metadatum.metadata_type_object.component == 'tainacan-checkbox' || childItemMetadatum.metadatum.metadata_type_object.component == 'tainacan-taxonomycheckbox') ? '150px' : '30px'
|
||||
minHeight: (childItemMetadatum.metadatum.metadata_type_object.component == 'tainacan-checkbox' || childItemMetadatum.metadatum.metadata_type_object.component == 'tainacan-taxonomy-checkbox') ? '150px' : '30px'
|
||||
}" />
|
||||
</div>
|
||||
<tainacan-form-item
|
||||
|
|
|
|||
|
|
@ -237,7 +237,7 @@ export default {
|
|||
preventInteractionOnTransition: true,
|
||||
allowClick: true,
|
||||
allowTouchMove: true,
|
||||
slidesPerView: this.showCollectionThumbnail ? 6 : 5,
|
||||
slidesPerView: 1,
|
||||
slidesPerGroup: 1,
|
||||
spaceBetween: this.showCollectionThumbnail ? 32 : 16,
|
||||
slideToClickedSlide: true,
|
||||
|
|
@ -264,13 +264,13 @@ export default {
|
|||
|
||||
if (!isNaN(this.maxCollectionsPerScreen)) {
|
||||
this.swiperOptions.breakpoints = {
|
||||
498: { slidesPerView: this.maxCollectionsPerScreen - 5 > 0 ? this.maxCollectionsPerScreen - 5 : 1 },
|
||||
768: { slidesPerView: this.maxCollectionsPerScreen - 4 > 0 ? this.maxCollectionsPerScreen - 4 : 1 },
|
||||
1024: { slidesPerView: this.maxCollectionsPerScreen - 3 > 0 ? this.maxCollectionsPerScreen - 3 : 1 },
|
||||
1366: { slidesPerView: this.maxCollectionsPerScreen - 2 > 0 ? this.maxCollectionsPerScreen - 2 : 1 },
|
||||
1600: { slidesPerView: this.maxCollectionsPerScreen - 1 > 0 ? this.maxCollectionsPerScreen - 1 : 1 },
|
||||
498: { slidesPerView: this.maxCollectionsPerScreen - 4 > 0 ? this.maxCollectionsPerScreen - 4 : 1 },
|
||||
768: { slidesPerView: this.maxCollectionsPerScreen - 3 > 0 ? this.maxCollectionsPerScreen - 3 : 1 },
|
||||
1024: { slidesPerView: this.maxCollectionsPerScreen - 2 > 0 ? this.maxCollectionsPerScreen - 2 : 1 },
|
||||
1366: { slidesPerView: this.maxCollectionsPerScreen - 1 > 0 ? this.maxCollectionsPerScreen - 1 : 1 },
|
||||
1600: { slidesPerView: this.maxCollectionsPerScreen > 0 ? this.maxCollectionsPerScreen : 1 },
|
||||
}
|
||||
this.swiperOptions.slidesPerView = this.maxCollectionsPerScreen;
|
||||
this.swiperOptions.slidesPerView = 1;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,416 @@
|
|||
export default [
|
||||
/* Deprecated on Tainacan 0.17.2, due to the introduction of support: fontSize */
|
||||
{
|
||||
attributes: {
|
||||
content: {
|
||||
type: 'array',
|
||||
source: 'children',
|
||||
selector: 'div'
|
||||
},
|
||||
collectionId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
collectionSlug: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
facets: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
facetsObject: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
showImage: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showItemsCount: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showLoadMore: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
showSearchBar: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
layout: {
|
||||
type: String,
|
||||
default: 'grid'
|
||||
},
|
||||
cloudRate: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
isModalOpen: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
gridMargin: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
metadatumId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
metadatumType: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
facetsRequestSource: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
maxFacetsNumber: {
|
||||
type: Number,
|
||||
value: undefined
|
||||
},
|
||||
isLoading: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
isLoadingCollection: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
collection: {
|
||||
type: Object,
|
||||
value: undefined
|
||||
},
|
||||
searchString: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
blockId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
parentTerm: {
|
||||
type: Number,
|
||||
default: null
|
||||
},
|
||||
isParentTermModalOpen: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
save({ attributes, className }){
|
||||
const {
|
||||
content,
|
||||
blockId,
|
||||
collectionId,
|
||||
collectionSlug,
|
||||
parentTerm,
|
||||
showImage,
|
||||
showItemsCount,
|
||||
showLoadMore,
|
||||
layout,
|
||||
cloudRate,
|
||||
gridMargin,
|
||||
metadatumId,
|
||||
metadatumType,
|
||||
maxFacetsNumber,
|
||||
showSearchBar,
|
||||
} = attributes;
|
||||
return <div
|
||||
className={ className }
|
||||
metadatum-id={ metadatumId }
|
||||
metadatum-type={ metadatumType }
|
||||
collection-id={ collectionId }
|
||||
collection-slug={ collectionSlug }
|
||||
parent-term-id={ parentTerm ? parentTerm.id : null }
|
||||
show-image={ '' + showImage }
|
||||
show-items-count={ '' + showItemsCount }
|
||||
show-search-bar={ '' + showSearchBar }
|
||||
show-load-more={ '' + showLoadMore }
|
||||
layout={ layout }
|
||||
cloud-rate={ cloudRate }
|
||||
grid-margin={ gridMargin }
|
||||
max-facets-number={ maxFacetsNumber }
|
||||
tainacan-api-root={ tainacan_blocks.root }
|
||||
tainacan-base-url={ tainacan_blocks.base_url }
|
||||
tainacan-site-url={ tainacan_blocks.site_url }
|
||||
id={ 'wp-block-tainacan-facets-list_' + blockId }>
|
||||
{ content }
|
||||
</div>
|
||||
}
|
||||
},
|
||||
{
|
||||
attributes: {
|
||||
content: {
|
||||
type: 'array',
|
||||
source: 'children',
|
||||
selector: 'div'
|
||||
},
|
||||
collectionId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
collectionSlug: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
facets: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
facetsObject: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
showImage: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showItemsCount: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showLoadMore: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
showSearchBar: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
layout: {
|
||||
type: String,
|
||||
default: 'grid'
|
||||
},
|
||||
cloudRate: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
isModalOpen: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
gridMargin: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
metadatumId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
metadatumType: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
facetsRequestSource: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
maxFacetsNumber: {
|
||||
type: Number,
|
||||
value: undefined
|
||||
},
|
||||
isLoading: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
isLoadingCollection: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
collection: {
|
||||
type: Object,
|
||||
value: undefined
|
||||
},
|
||||
searchString: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
blockId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
parentTerm: {
|
||||
type: Number,
|
||||
default: null
|
||||
},
|
||||
isParentTermModalOpen: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
save({ attributes, className }){
|
||||
const {
|
||||
content,
|
||||
blockId,
|
||||
collectionId,
|
||||
collectionSlug,
|
||||
parentTerm,
|
||||
showImage,
|
||||
showItemsCount,
|
||||
showLoadMore,
|
||||
layout,
|
||||
cloudRate,
|
||||
gridMargin,
|
||||
metadatumId,
|
||||
metadatumType,
|
||||
maxFacetsNumber,
|
||||
showSearchBar,
|
||||
} = attributes;
|
||||
return <div
|
||||
className={ className }
|
||||
metadatum-id={ metadatumId }
|
||||
metadatum-type={ metadatumType }
|
||||
collection-id={ collectionId }
|
||||
collection-slug={ collectionSlug }
|
||||
parent-term-id={ parentTerm ? parentTerm.id : null }
|
||||
show-image={ '' + showImage }
|
||||
show-items-count={ '' + showItemsCount }
|
||||
show-search-bar={ '' + showSearchBar }
|
||||
show-load-more={ '' + showLoadMore }
|
||||
layout={ layout }
|
||||
cloud-rate={ cloudRate }
|
||||
grid-margin={ gridMargin }
|
||||
max-facets-number={ maxFacetsNumber }
|
||||
tainacan-base-url={ tainacan_blocks.base_url }
|
||||
id={ 'wp-block-tainacan-facets-list_' + blockId }>
|
||||
{ content }
|
||||
</div>
|
||||
}
|
||||
},
|
||||
{
|
||||
attributes: {
|
||||
content: {
|
||||
type: 'array',
|
||||
source: 'children',
|
||||
selector: 'div'
|
||||
},
|
||||
collectionId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
collectionSlug: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
facets: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
facetsObject: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
showImage: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showItemsCount: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showLoadMore: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
showSearchBar: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
layout: {
|
||||
type: String,
|
||||
default: 'grid'
|
||||
},
|
||||
cloudRate: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
isModalOpen: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
gridMargin: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
metadatumId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
metadatumType: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
facetsRequestSource: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
maxFacetsNumber: {
|
||||
type: Number,
|
||||
value: undefined
|
||||
},
|
||||
isLoading: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
isLoadingCollection: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
collection: {
|
||||
type: Object,
|
||||
value: undefined
|
||||
},
|
||||
searchString: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
blockId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
save({ attributes, className }){
|
||||
const {
|
||||
content,
|
||||
blockId,
|
||||
collectionId,
|
||||
collectionSlug,
|
||||
showImage,
|
||||
showItemsCount,
|
||||
showLoadMore,
|
||||
layout,
|
||||
cloudRate,
|
||||
gridMargin,
|
||||
metadatumId,
|
||||
metadatumType,
|
||||
maxFacetsNumber,
|
||||
showSearchBar,
|
||||
} = attributes;
|
||||
|
||||
return <div
|
||||
className={ className }
|
||||
metadatum-id={ metadatumId }
|
||||
metadatum-type={ metadatumType }
|
||||
collection-id={ collectionId }
|
||||
collection-slug={ collectionSlug }
|
||||
show-image={ '' + showImage }
|
||||
show-items-count={ '' + showItemsCount }
|
||||
show-search-bar={ '' + showSearchBar }
|
||||
show-load-more={ '' + showLoadMore }
|
||||
layout={ layout }
|
||||
cloud-rate={ cloudRate }
|
||||
grid-margin={ gridMargin }
|
||||
max-facets-number={ maxFacetsNumber }
|
||||
tainacan-api-root={ tainacan_plugin.root }
|
||||
tainacan-base-url={ tainacan_plugin.base_url }
|
||||
tainacan-site-url={ tainacan_plugin.site_url }
|
||||
id={ 'wp-block-tainacan-facets-list_' + blockId }>
|
||||
{ content }
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
||||
]
|
||||
|
|
@ -5,12 +5,12 @@
|
|||
:style="{ marginBottom: layout == 'grid' ? gridMargin + 'px' : ''}">
|
||||
<a
|
||||
:id="isNaN(facetId) ? facetId : 'facet-id-' + facetId"
|
||||
:href="(appendChildTerms && facet.total_children > 0) ? null : ((linkTermFacetsToTermPage && metadatumType == 'Taxonomy') ? facet.term_url : facet.url)"
|
||||
:href="(appendChildTerms && facet.total_children > 0) ? null : ((linkTermFacetsToTermPage && isMetadatumTypeTaxonomy) ? facet.term_url : facet.url)"
|
||||
@click="() => { (appendChildTerms && facet.total_children > 0) ? displayChildTerms(facetId) : null }"
|
||||
target="_blank"
|
||||
:style="{ fontSize: layout == 'cloud' && facet.total_items ? + (1 + (cloudRate/4) * Math.log(facet.total_items)) + 'em' : ''}">
|
||||
<img
|
||||
v-if="metadatumType == 'Taxonomy'"
|
||||
v-if="isMetadatumTypeTaxonomy"
|
||||
:src="
|
||||
facet.entity && facet.entity['header_image']
|
||||
?
|
||||
|
|
@ -20,7 +20,7 @@
|
|||
"
|
||||
:alt="facet.label ? facet.label : $root.__('Thumbnail', 'tainacan')">
|
||||
<img
|
||||
v-if="metadatumType == 'Relationship'"
|
||||
v-if="isMetadatumTypeRelationship"
|
||||
:src="
|
||||
facet.entity.thumbnail && facet.entity.thumbnail['tainacan-medium'][0] && facet.entity.thumbnail['tainacan-medium'][0]
|
||||
?
|
||||
|
|
@ -62,7 +62,7 @@
|
|||
}" />
|
||||
</ul>
|
||||
<template v-else>
|
||||
<transition name="filter-item">
|
||||
<transition name="child-reveal">
|
||||
<ul
|
||||
v-if="childFacetsObject[facet.id != undefined ? facet.id : facet.value] && childFacetsObject[facet.id != undefined ? facet.id : facet.value].visible"
|
||||
class="child-term-facets">
|
||||
|
|
@ -82,6 +82,8 @@
|
|||
:show-items-count="showItemsCount"
|
||||
:is-loading-child-terms="isloadingChildTerms"
|
||||
:link-term-facets-to-term-page="linkTermFacetsToTermPage"
|
||||
:is-metadatum-type-taxonomy="isMetadatumTypeTaxonomy"
|
||||
:is-metadatum-type-relationship="isMetadatumTypeRelationship"
|
||||
@on-display-child-terms="displayChildTerms" />
|
||||
</template>
|
||||
<p
|
||||
|
|
@ -111,7 +113,9 @@ export default {
|
|||
layout: String,
|
||||
cloudRate: Number,
|
||||
metadatumType: String,
|
||||
childFacetsObject: Object
|
||||
childFacetsObject: Object,
|
||||
isMetadatumTypeTaxonomy: Boolean,
|
||||
isMetadatumTypeRelationship: Boolean
|
||||
},
|
||||
computed:{
|
||||
facetId() {
|
||||
|
|
@ -125,12 +129,12 @@ export default {
|
|||
getSkeletonHeight() {
|
||||
switch(this.layout) {
|
||||
case 'grid':
|
||||
if ((this.metadatumType == 'Relationship' || this.metadatumType == 'Taxonomy') && this.showImage)
|
||||
if ((this.isMetadatumTypeRelationship || this.isMetadatumTypeTaxonomy) && this.showImage)
|
||||
return '230px';
|
||||
else
|
||||
return '24px'
|
||||
case 'list':
|
||||
if ((this.metadatumType == 'Relationship' || this.metadatumType == 'Taxonomy') && this.showImage)
|
||||
if ((this.isMetadatumTypeRelationship || this.isMetadatumTypeTaxonomy) && this.showImage)
|
||||
return '54px';
|
||||
else
|
||||
return '24px'
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@
|
|||
v-for="facet in Number(maxFacetsNumber)"
|
||||
class="facet-list-item skeleton"
|
||||
:style="{
|
||||
marginBottom: layout == 'grid' && ((metadatumType == 'Relationship' || metadatumType == 'Taxonomy') && showImage) ? (showName ? gridMargin + 12 : gridMargin) + 'px' : '',
|
||||
marginBottom: layout == 'grid' && ((isMetadatumTypeRelationship || isMetadatumTypeTaxonomy) && showImage) ? (showName ? gridMargin + 12 : gridMargin) + 'px' : '',
|
||||
minHeight: getSkeletonHeight()
|
||||
}" />
|
||||
</ul>
|
||||
|
|
@ -64,7 +64,7 @@
|
|||
:key="facet"
|
||||
class="facet-list-item skeleton"
|
||||
:style="{
|
||||
marginBottom: layout == 'grid' && ((metadatumType == 'Relationship' || metadatumType == 'Taxonomy') && showImage) ? (showName ? gridMargin + 12 : gridMargin) + 'px' : '',
|
||||
marginBottom: layout == 'grid' && ((isMetadatumTypeRelationship || isMetadatumTypeTaxonomy) && showImage) ? (showName ? gridMargin + 12 : gridMargin) + 'px' : '',
|
||||
minHeight: getSkeletonHeight()
|
||||
}" />
|
||||
</div>
|
||||
|
|
@ -95,6 +95,8 @@
|
|||
:show-items-count="showItemsCount"
|
||||
:is-loading-child-terms="isloadingChildTerms"
|
||||
:link-term-facets-to-term-page="linkTermFacetsToTermPage"
|
||||
:is-metadatum-type-taxonomy="isMetadatumTypeTaxonomy"
|
||||
:is-metadatum-type-relationship="isMetadatumTypeRelationship"
|
||||
@on-display-child-terms="displayChildTerms" />
|
||||
</ul>
|
||||
<ul
|
||||
|
|
@ -123,6 +125,8 @@
|
|||
:show-items-count="showItemsCount"
|
||||
:is-loading-child-terms="isloadingChildTerms"
|
||||
:link-term-facets-to-term-page="linkTermFacetsToTermPage"
|
||||
:is-metadatum-type-taxonomy="isMetadatumTypeTaxonomy"
|
||||
:is-metadatum-type-relationship="isMetadatumTypeRelationship"
|
||||
@on-display-child-terms="displayChildTerms" />
|
||||
</div>
|
||||
</ul>
|
||||
|
|
@ -204,6 +208,14 @@ export default {
|
|||
lastTerm: undefined
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isMetadatumTypeRelationship() {
|
||||
return (this.metadatumType == 'Tainacan\\Metadata_Types\\Relationship') || (this.metadatumType == this.$root.__('Relationship', 'tainacan') );
|
||||
},
|
||||
isMetadatumTypeTaxonomy() {
|
||||
return (this.metadatumType == 'Tainacan\\Metadata_Types\\Taxonomy') || (this.metadatumType == this.$root.__('Taxonomy', 'tainacan') );
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.tainacanAxios = axios.create({ baseURL: this.tainacanApiRoot });
|
||||
this.offset = 0;
|
||||
|
|
@ -266,7 +278,7 @@ export default {
|
|||
queryObject.last_term = this.lastTerm;
|
||||
|
||||
// Set up parentTerm for taxonomies
|
||||
if (this.parentTermId !== undefined && this.parentTermId !== null && this.parentTermId !== '' && this.metadatumType == 'Taxonomy')
|
||||
if (this.parentTermId !== undefined && this.parentTermId !== null && this.parentTermId !== '' && this.isMetadatumTypeTaxonomy)
|
||||
queryObject.parent = this.parentTermId;
|
||||
else {
|
||||
delete queryObject.parent;
|
||||
|
|
@ -281,7 +293,7 @@ export default {
|
|||
this.tainacanAxios.get(endpoint, { cancelToken: this.facetsRequestSource.token })
|
||||
.then(response => {
|
||||
|
||||
if (this.metadatumType == 'Taxonomy') {
|
||||
if (this.isMetadatumTypeTaxonomy) {
|
||||
for (let facet of response.data.values) {
|
||||
this.facets.push(Object.assign({
|
||||
term_url: facet.entity && facet.entity.url ? facet.entity.url : this.tainacanSiteUrl + '/' + this.collectionSlug + '/#/?taxquery[0][compare]=IN&taxquery[0][taxonomy]=' + facet.taxonomy + '&taxquery[0][terms][0]=' + facet.value,
|
||||
|
|
@ -375,12 +387,12 @@ export default {
|
|||
getSkeletonHeight() {
|
||||
switch(this.layout) {
|
||||
case 'grid':
|
||||
if ((this.metadatumType == 'Relationship' || this.metadatumType == 'Taxonomy') && this.showImage)
|
||||
if ((this.isMetadatumTypeRelationship || this.isMetadatumTypeTaxonomy) && this.showImage)
|
||||
return '230px';
|
||||
else
|
||||
return '24px'
|
||||
case 'list':
|
||||
if ((this.metadatumType == 'Relationship' || this.metadatumType == 'Taxonomy') && this.showImage)
|
||||
if ((this.isMetadatumTypeRelationship || this.isMetadatumTypeTaxonomy) && this.showImage)
|
||||
return '54px';
|
||||
else
|
||||
return '24px'
|
||||
|
|
|
|||
|
|
@ -637,13 +637,13 @@
|
|||
}
|
||||
}
|
||||
|
||||
.filter-item-enter-active {
|
||||
.child-reveal-enter-active {
|
||||
overflow: hidden;
|
||||
animation-name: filter-item-in;
|
||||
animation-duration: 0.1s;
|
||||
animation-timing-function: ease;
|
||||
}
|
||||
.filter-item-leave-active {
|
||||
.child-reveal-leave-active {
|
||||
overflow: hidden;
|
||||
animation-name: filter-item-out;
|
||||
animation-duration: 0.1s;
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@ import tainacan from '../../js/axios.js';
|
|||
import axios from 'axios';
|
||||
import qs from 'qs';
|
||||
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
|
||||
import DeprecatedBlocks from './facets-list-deprecated.js';
|
||||
|
||||
registerBlockType('tainacan/facets-list', {
|
||||
title: __('Tainacan Facets List', 'tainacan'),
|
||||
|
|
@ -159,6 +160,7 @@ registerBlockType('tainacan/facets-list', {
|
|||
supports: {
|
||||
align: ['full', 'wide'],
|
||||
html: false,
|
||||
fontSize: true
|
||||
},
|
||||
edit({ attributes, setAttributes, className, isSelected, clientId }){
|
||||
let {
|
||||
|
|
@ -208,7 +210,7 @@ registerBlockType('tainacan/facets-list', {
|
|||
setAttributes({ showImage: showImage });
|
||||
}
|
||||
if (nameInsideImage === undefined) {
|
||||
nameInsideImage = true;
|
||||
nameInsideImage = false;
|
||||
setAttributes({ nameInsideImage: nameInsideImage });
|
||||
}
|
||||
if (showItemsCount === undefined) {
|
||||
|
|
@ -219,7 +221,7 @@ registerBlockType('tainacan/facets-list', {
|
|||
gridMargin = 24;
|
||||
setAttributes({ gridMargin: gridMargin });
|
||||
}
|
||||
|
||||
console.log(metadatumType)
|
||||
function prepareFacet(facet) {
|
||||
const facetId = facet.id != undefined ? facet.id : facet.value;
|
||||
return (
|
||||
|
|
@ -228,11 +230,11 @@ registerBlockType('tainacan/facets-list', {
|
|||
className={ 'facet-list-item' + (!showImage ? ' facet-without-image' : '') + (nameInsideImage ? ' facet-with-name-inside-image' : '') + ((appendChildTerms && facet.total_children > 0) ? ' facet-term-with-children': '')}>
|
||||
<a
|
||||
id={ isNaN(facetId) ? facetId : 'facet-id-' + facetId }
|
||||
href={ !appendChildTerms ? ((linkTermFacetsToTermPage && metadatumType == 'Taxonomy') ? facet.term_url : facet.url) : (facet.total_children > 0 ? null : (linkTermFacetsToTermPage ? facet.term_url : facet.url)) }
|
||||
href={ !appendChildTerms ? ((linkTermFacetsToTermPage && isMetadatumTypeTaxonomy(metadatumType)) ? facet.term_url : facet.url) : (facet.total_children > 0 ? null : (linkTermFacetsToTermPage ? facet.term_url : facet.url)) }
|
||||
onClick={ () => { (appendChildTerms && facet.total_children > 0) ? displayChildTerms(facetId) : null } }
|
||||
target="_blank"
|
||||
style={{ fontSize: layout == 'cloud' && facet.total_items ? + (1 + (cloudRate/4) * Math.log(facet.total_items)) + 'rem' : ''}}>
|
||||
{ metadatumType == 'Taxonomy' ?
|
||||
{ isMetadatumTypeTaxonomy(metadatumType) ?
|
||||
<img
|
||||
src={
|
||||
facet.entity && facet.entity['header_image']
|
||||
|
|
@ -244,7 +246,7 @@ registerBlockType('tainacan/facets-list', {
|
|||
alt={ facet.label ? facet.label : __( 'Thumbnail', 'tainacan' ) }/>
|
||||
: null
|
||||
}
|
||||
{ metadatumType == 'Relationship' ?
|
||||
{ isMetadatumTypeRelationship(metadatumType) ?
|
||||
<img
|
||||
src={
|
||||
facet.entity.thumbnail && facet.entity.thumbnail['tainacan-medium'][0] && facet.entity.thumbnail['tainacan-medium'][0]
|
||||
|
|
@ -326,7 +328,7 @@ registerBlockType('tainacan/facets-list', {
|
|||
}
|
||||
|
||||
// Set up parentTerm for taxonomies
|
||||
if (parentTerm && parentTerm.id !== undefined && parentTerm.id !== null && parentTerm.id !== '' && metadatumType == 'Taxonomy') {
|
||||
if (parentTerm && parentTerm.id !== undefined && parentTerm.id !== null && parentTerm.id !== '' && isMetadatumTypeTaxonomy(metadatumType)) {
|
||||
queryObject.parent = parentTerm.id;
|
||||
} else {
|
||||
delete queryObject.parent;
|
||||
|
|
@ -342,7 +344,7 @@ registerBlockType('tainacan/facets-list', {
|
|||
.then(response => {
|
||||
facetsObject = [];
|
||||
|
||||
if (metadatumType == 'Taxonomy') {
|
||||
if (isMetadatumTypeTaxonomy(metadatumType)) {
|
||||
for (let facet of response.data.values) {
|
||||
facetsObject.push(Object.assign({
|
||||
term_url: facet.entity && facet.entity.url ? facet.entity.url : tainacan_blocks.site_url + '/' + collectionSlug + '/#/?taxquery[0][compare]=IN&taxquery[0][taxonomy]=' + facet.taxonomy + '&taxquery[0][terms][0]=' + facet.value,
|
||||
|
|
@ -500,6 +502,14 @@ registerBlockType('tainacan/facets-list', {
|
|||
}
|
||||
}
|
||||
|
||||
// These two functions are necessary as previous versions of the block used a translated version of the type label as metadatum type.
|
||||
function isMetadatumTypeRelationship(metadatumType) {
|
||||
return (metadatumType == 'Tainacan\\Metadata_Types\\Relationship') || (metadatumType == __('Relationship', 'tainacan') );
|
||||
}
|
||||
function isMetadatumTypeTaxonomy(metadatumType) {
|
||||
return (metadatumType == 'Tainacan\\Metadata_Types\\Taxonomy') || (metadatumType == __('Taxonomy', 'tainacan') );
|
||||
}
|
||||
|
||||
// Executed only on the first load of page
|
||||
if(content && content.length && content[0].type)
|
||||
setContent();
|
||||
|
|
@ -507,19 +517,19 @@ registerBlockType('tainacan/facets-list', {
|
|||
const layoutControls = [
|
||||
{
|
||||
icon: 'grid-view',
|
||||
title: __( 'Grid View' ),
|
||||
title: __( 'Grid View', 'tainacan' ),
|
||||
onClick: () => updateLayout('grid'),
|
||||
isActive: layout === 'grid',
|
||||
},
|
||||
{
|
||||
icon: 'list-view',
|
||||
title: __( 'List View' ),
|
||||
title: __( 'List View', 'tainacan' ),
|
||||
onClick: () => updateLayout('list'),
|
||||
isActive: layout === 'list',
|
||||
},
|
||||
{
|
||||
icon: 'cloud',
|
||||
title: __( 'Cloud View' ),
|
||||
title: __( 'Cloud View', 'tainacan' ),
|
||||
onClick: () => updateLayout('cloud'),
|
||||
isActive: layout === 'cloud',
|
||||
}
|
||||
|
|
@ -610,7 +620,7 @@ registerBlockType('tainacan/facets-list', {
|
|||
/>
|
||||
</PanelBody>
|
||||
{/* Settings related only to facets from Taxonomy metadata */}
|
||||
{ metadatumType == 'Taxonomy' ?
|
||||
{ isMetadatumTypeTaxonomy(metadatumType) ?
|
||||
<PanelBody
|
||||
title={__('Taxonomy options', 'tainacan')}
|
||||
initialOpen={ true }>
|
||||
|
|
@ -665,7 +675,7 @@ registerBlockType('tainacan/facets-list', {
|
|||
initialOpen={ true }
|
||||
>
|
||||
<div>
|
||||
{ (metadatumType == 'Taxonomy' || metadatumType == 'Relationship') ?
|
||||
{ (isMetadatumTypeTaxonomy(metadatumType) || isMetadatumTypeRelationship(metadatumType)) ?
|
||||
<ToggleControl
|
||||
label={__('Name inside image', 'tainacan')}
|
||||
help={ nameInsideImage ? __("Toggle to show facet's name inside the image", 'tainacan') : __("Do not show facet's name image", 'tainacan')}
|
||||
|
|
@ -715,7 +725,7 @@ registerBlockType('tainacan/facets-list', {
|
|||
initialOpen={ true }
|
||||
>
|
||||
<div>
|
||||
{ (metadatumType == 'Taxonomy' || metadatumType == 'Relationship') ?
|
||||
{ (isMetadatumTypeTaxonomy(metadatumType) || isMetadatumTypeRelationship(metadatumType)) ?
|
||||
<ToggleControl
|
||||
label={__('Image', 'tainacan')}
|
||||
help={ showImage ? __("Toggle to show facet's image", 'tainacan') : __("Do not show facet's image", 'tainacan')}
|
||||
|
|
@ -871,7 +881,7 @@ registerBlockType('tainacan/facets-list', {
|
|||
{__('List facets from a Tainacan Collection or Repository', 'tainacan')}
|
||||
</p>
|
||||
{
|
||||
parentTerm && parentTerm.id && metadatumType == 'Taxonomy'?
|
||||
parentTerm && parentTerm.id && isMetadatumTypeTaxonomy(metadatumType)?
|
||||
<div style={{ display: 'flex' }}>
|
||||
<Button
|
||||
isPrimary
|
||||
|
|
@ -1008,279 +1018,5 @@ registerBlockType('tainacan/facets-list', {
|
|||
{ content }
|
||||
</div>
|
||||
},
|
||||
deprecated: [
|
||||
{
|
||||
attributes: {
|
||||
content: {
|
||||
type: 'array',
|
||||
source: 'children',
|
||||
selector: 'div'
|
||||
},
|
||||
collectionId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
collectionSlug: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
facets: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
facetsObject: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
showImage: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showItemsCount: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showLoadMore: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
showSearchBar: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
layout: {
|
||||
type: String,
|
||||
default: 'grid'
|
||||
},
|
||||
cloudRate: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
isModalOpen: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
gridMargin: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
metadatumId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
metadatumType: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
facetsRequestSource: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
maxFacetsNumber: {
|
||||
type: Number,
|
||||
value: undefined
|
||||
},
|
||||
isLoading: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
isLoadingCollection: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
collection: {
|
||||
type: Object,
|
||||
value: undefined
|
||||
},
|
||||
searchString: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
blockId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
parentTerm: {
|
||||
type: Number,
|
||||
default: null
|
||||
},
|
||||
isParentTermModalOpen: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
save({ attributes, className }){
|
||||
const {
|
||||
content,
|
||||
blockId,
|
||||
collectionId,
|
||||
collectionSlug,
|
||||
parentTerm,
|
||||
showImage,
|
||||
showItemsCount,
|
||||
showLoadMore,
|
||||
layout,
|
||||
cloudRate,
|
||||
gridMargin,
|
||||
metadatumId,
|
||||
metadatumType,
|
||||
maxFacetsNumber,
|
||||
showSearchBar,
|
||||
} = attributes;
|
||||
return <div
|
||||
className={ className }
|
||||
metadatum-id={ metadatumId }
|
||||
metadatum-type={ metadatumType }
|
||||
collection-id={ collectionId }
|
||||
collection-slug={ collectionSlug }
|
||||
parent-term-id={ parentTerm ? parentTerm.id : null }
|
||||
show-image={ '' + showImage }
|
||||
show-items-count={ '' + showItemsCount }
|
||||
show-search-bar={ '' + showSearchBar }
|
||||
show-load-more={ '' + showLoadMore }
|
||||
layout={ layout }
|
||||
cloud-rate={ cloudRate }
|
||||
grid-margin={ gridMargin }
|
||||
max-facets-number={ maxFacetsNumber }
|
||||
tainacan-api-root={ tainacan_blocks.root }
|
||||
tainacan-base-url={ tainacan_blocks.base_url }
|
||||
tainacan-site-url={ tainacan_blocks.site_url }
|
||||
id={ 'wp-block-tainacan-facets-list_' + blockId }>
|
||||
{ content }
|
||||
</div>
|
||||
}
|
||||
},
|
||||
{
|
||||
attributes: {
|
||||
content: {
|
||||
type: 'array',
|
||||
source: 'children',
|
||||
selector: 'div'
|
||||
},
|
||||
collectionId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
collectionSlug: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
facets: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
facetsObject: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
showImage: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showItemsCount: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showLoadMore: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
showSearchBar: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
layout: {
|
||||
type: String,
|
||||
default: 'grid'
|
||||
},
|
||||
cloudRate: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
isModalOpen: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
gridMargin: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
metadatumId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
metadatumType: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
facetsRequestSource: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
maxFacetsNumber: {
|
||||
type: Number,
|
||||
value: undefined
|
||||
},
|
||||
isLoading: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
isLoadingCollection: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
collection: {
|
||||
type: Object,
|
||||
value: undefined
|
||||
},
|
||||
searchString: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
blockId: {
|
||||
type: String,
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
save({ attributes, className }){
|
||||
const {
|
||||
content,
|
||||
blockId,
|
||||
collectionId,
|
||||
collectionSlug,
|
||||
showImage,
|
||||
showItemsCount,
|
||||
showLoadMore,
|
||||
layout,
|
||||
cloudRate,
|
||||
gridMargin,
|
||||
metadatumId,
|
||||
metadatumType,
|
||||
maxFacetsNumber,
|
||||
showSearchBar,
|
||||
} = attributes;
|
||||
|
||||
return <div
|
||||
className={ className }
|
||||
metadatum-id={ metadatumId }
|
||||
metadatum-type={ metadatumType }
|
||||
collection-id={ collectionId }
|
||||
collection-slug={ collectionSlug }
|
||||
show-image={ '' + showImage }
|
||||
show-items-count={ '' + showItemsCount }
|
||||
show-search-bar={ '' + showSearchBar }
|
||||
show-load-more={ '' + showLoadMore }
|
||||
layout={ layout }
|
||||
cloud-rate={ cloudRate }
|
||||
grid-margin={ gridMargin }
|
||||
max-facets-number={ maxFacetsNumber }
|
||||
tainacan-api-root={ tainacan_plugin.root }
|
||||
tainacan-base-url={ tainacan_plugin.base_url }
|
||||
tainacan-site-url={ tainacan_plugin.site_url }
|
||||
id={ 'wp-block-tainacan-facets-list_' + blockId }>
|
||||
{ content }
|
||||
</div>
|
||||
}
|
||||
}
|
||||
]
|
||||
deprecated: DeprecatedBlocks
|
||||
});
|
||||
|
|
@ -38,7 +38,6 @@ export default class MetadataModal extends React.Component {
|
|||
this.fetchModalCollections = this.fetchModalCollections.bind(this);
|
||||
this.selectMetadatum = this.selectMetadatum.bind(this);
|
||||
this.fetchModalMetadata = this.fetchModalMetadata.bind(this);
|
||||
this.getMetadatumType = this.getMetadatumType.bind(this);
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
|
|
@ -211,7 +210,8 @@ export default class MetadataModal extends React.Component {
|
|||
otherModalMetadata.push({
|
||||
name: metadatum.name,
|
||||
id: metadatum.id,
|
||||
type: this.getMetadatumType(metadatum)
|
||||
type: metadatum.metadata_type,
|
||||
typeLabel: metadatum.metadata_type_object ? metadatum.metadata_type_object.name : ''
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -227,26 +227,6 @@ export default class MetadataModal extends React.Component {
|
|||
});
|
||||
}
|
||||
|
||||
getMetadatumType(metadatum) {
|
||||
let metadatumType = metadatum.metadata_type_object ? metadatum.metadata_type_object.component : false;
|
||||
|
||||
if (metadatumType) {
|
||||
switch(metadatumType) {
|
||||
case 'tainacan-text': return __('Text', 'tainacan');
|
||||
case 'tainacan-textarea': return __('Text area', 'tainacan');
|
||||
case 'tainacan-date': return __('Date', 'tainacan');
|
||||
case 'tainacan-numeric': return __('Numeric', 'tainacan');
|
||||
case 'tainacan-selectbox': return __('Select box', 'tainacan');
|
||||
case 'tainacan-relationship': return __('Relationship', 'tainacan');
|
||||
case 'tainacan-taxonomy': return __('Taxonomy', 'tainacan');
|
||||
case 'tainacan-compound': return __('Compound', 'tainacan');
|
||||
default: return false;
|
||||
}
|
||||
} else {
|
||||
return metadatumType;
|
||||
}
|
||||
}
|
||||
|
||||
selectMetadatum(selectedMetadatum) {
|
||||
this.setState({
|
||||
metadatumId: selectedMetadatum.id,
|
||||
|
|
@ -276,7 +256,7 @@ export default class MetadataModal extends React.Component {
|
|||
selected={ this.state.temporaryMetadatumId }
|
||||
options={
|
||||
this.state.modalMetadata.map((metadatum) => {
|
||||
return { label: metadatum.name + ' (' + metadatum.type + ')', value: '' + metadatum.id }
|
||||
return { label: metadatum.name + ' (' + metadatum.typeLabel + ')', value: '' + metadatum.id }
|
||||
})
|
||||
}
|
||||
onChange={ ( aMetadatumId ) => {
|
||||
|
|
|
|||
|
|
@ -248,7 +248,7 @@ export default {
|
|||
preventInteractionOnTransition: true,
|
||||
allowClick: true,
|
||||
allowTouchMove: true,
|
||||
slidesPerView: 7,
|
||||
slidesPerView: 1,
|
||||
slidesPerGroup: 1,
|
||||
spaceBetween: 32,
|
||||
slideToClickedSlide: true,
|
||||
|
|
@ -279,13 +279,13 @@ export default {
|
|||
|
||||
if (!isNaN(this.maxItemsPerScreen) && this.maxItemsPerScreen != 6) {
|
||||
this.swiperOptions.breakpoints = {
|
||||
498: { slidesPerView: this.maxItemsPerScreen - 5 > 0 ? this.maxItemsPerScreen - 5 : 1 },
|
||||
768: { slidesPerView: this.maxItemsPerScreen - 4 > 0 ? this.maxItemsPerScreen - 4 : 1 },
|
||||
1024: { slidesPerView: this.maxItemsPerScreen - 3 > 0 ? this.maxItemsPerScreen - 3 : 1 },
|
||||
1366: { slidesPerView: this.maxItemsPerScreen - 2 > 0 ? this.maxItemsPerScreen - 2 : 1 },
|
||||
1600: { slidesPerView: this.maxItemsPerScreen - 1 > 0 ? this.maxItemsPerScreen - 1 : 1 },
|
||||
498: { slidesPerView: this.maxItemsPerScreen - 4 > 0 ? this.maxItemsPerScreen - 4 : 1 },
|
||||
768: { slidesPerView: this.maxItemsPerScreen - 3 > 0 ? this.maxItemsPerScreen - 3 : 1 },
|
||||
1024: { slidesPerView: this.maxItemsPerScreen - 2 > 0 ? this.maxItemsPerScreen - 2 : 1 },
|
||||
1366: { slidesPerView: this.maxItemsPerScreen - 1 > 0 ? this.maxItemsPerScreen - 1 : 1 },
|
||||
1600: { slidesPerView: this.maxItemsPerScreen > 0 ? this.maxItemsPerScreen : 1 },
|
||||
}
|
||||
this.swiperOptions.slidesPerView = this.maxItemsPerScreen;
|
||||
this.swiperOptions.slidesPerView = 1;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
|
|||
|
|
@ -211,7 +211,7 @@ export default {
|
|||
preventInteractionOnTransition: true,
|
||||
allowClick: true,
|
||||
allowTouchMove: true,
|
||||
slidesPerView: this.showTermThumbnail ? 6 : 5,
|
||||
slidesPerView: 1,
|
||||
slidesPerGroup: 1,
|
||||
spaceBetween: this.showTermThumbnail ? 32 : 16,
|
||||
slideToClickedSlide: true,
|
||||
|
|
@ -238,13 +238,13 @@ export default {
|
|||
|
||||
if (!isNaN(this.maxTermsPerScreen)) {
|
||||
this.swiperOptions.breakpoints = {
|
||||
498: { slidesPerView: this.maxTermsPerScreen - 5 > 0 ? this.maxTermsPerScreen - 5 : 1 },
|
||||
768: { slidesPerView: this.maxTermsPerScreen - 4 > 0 ? this.maxTermsPerScreen - 4 : 1 },
|
||||
1024: { slidesPerView: this.maxTermsPerScreen - 3 > 0 ? this.maxTermsPerScreen - 3 : 1 },
|
||||
1366: { slidesPerView: this.maxTermsPerScreen - 2 > 0 ? this.maxTermsPerScreen - 2 : 1 },
|
||||
1600: { slidesPerView: this.maxTermsPerScreen - 1 > 0 ? this.maxTermsPerScreen - 1 : 1 },
|
||||
498: { slidesPerView: this.maxTermsPerScreen - 4 > 0 ? this.maxTermsPerScreen - 4 : 1 },
|
||||
768: { slidesPerView: this.maxTermsPerScreen - 3 > 0 ? this.maxTermsPerScreen - 3 : 1 },
|
||||
1024: { slidesPerView: this.maxTermsPerScreen - 2 > 0 ? this.maxTermsPerScreen - 2 : 1 },
|
||||
1366: { slidesPerView: this.maxTermsPerScreen - 1 > 0 ? this.maxTermsPerScreen - 1 : 1 },
|
||||
1600: { slidesPerView: this.maxTermsPerScreen > 0 ? this.maxTermsPerScreen : 1 },
|
||||
}
|
||||
this.swiperOptions.slidesPerView = this.maxTermsPerScreen;
|
||||
this.swiperOptions.slidesPerView = 1;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
|
|||
Loading…
Reference in New Issue