Merge branch 'develop' of https://github.com/tainacan/tainacan into develop
This commit is contained in:
vnmedeiros
commit
8963a3d2c3
|
|
@ -73,7 +73,7 @@
|
|||
.wp-block-tainacan-dynamic-items-list .dynamic-items-collection-header .collection-name span.label {
|
||||
color: white;
|
||||
font-weight: normal;
|
||||
font-size: 0.75em; }
|
||||
font-size: 0.5em; }
|
||||
.wp-block-tainacan-dynamic-items-list .dynamic-items-collection-header .collection-name.only-collection-name {
|
||||
justify-content: center;
|
||||
padding: 1em; }
|
||||
|
|
@ -129,7 +129,7 @@
|
|||
.wp-block-tainacan-dynamic-items-list .dynamic-items-search-bar .search-button {
|
||||
order: 4;
|
||||
position: absolute;
|
||||
margin-top: 37px; }
|
||||
margin-top: 0.75em; }
|
||||
.wp-block-tainacan-dynamic-items-list .dynamic-items-search-bar input {
|
||||
width: 100% !important;
|
||||
order: 5;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -127,7 +127,7 @@
|
|||
.wp-block-tainacan-facets-list .facets-search-bar .search-button {
|
||||
order: 4;
|
||||
position: absolute;
|
||||
margin-top: 37px; }
|
||||
margin-top: 0.5em; }
|
||||
.wp-block-tainacan-facets-list .facets-search-bar input {
|
||||
width: 100% !important;
|
||||
order: 5;
|
||||
|
|
@ -364,7 +364,7 @@
|
|||
text-decoration: none; }
|
||||
.wp-block-tainacan-facets-list .show-more-button {
|
||||
margin: 12px auto;
|
||||
padding: 0.25em;
|
||||
padding: 0.2em 0.25em;
|
||||
display: block;
|
||||
background: var(--tainacan-block-primary, #298596);
|
||||
border: none;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -355,43 +355,58 @@ class Theme_Helper {
|
|||
return $image;
|
||||
}
|
||||
|
||||
public function search_shortcode($atts) {
|
||||
public function search_shortcode($args) {
|
||||
|
||||
$props = ' ';
|
||||
|
||||
$atts = shortcode_atts(
|
||||
array(
|
||||
'collection-id' => '',
|
||||
'term-id' => '',
|
||||
'taxonomy' => '',
|
||||
),
|
||||
$atts
|
||||
);
|
||||
|
||||
// Loads info related to view modes
|
||||
$default_view_mode = apply_filters( 'tainacan-default-view-mode-for-themes', 'masonry' );
|
||||
$enabled_view_modes = apply_filters( 'tainacan-enabled-view-modes-for-themes', ['table', 'cards', 'masonry', 'slideshow'] );
|
||||
$view_modes = tainacan_get_the_view_modes();
|
||||
$default_view_mode = $view_modes['default_view_mode'];
|
||||
$enabled_view_modes = $view_modes['enabled_view_modes'];
|
||||
|
||||
$params = '';
|
||||
if( isset($args['default-view-mode']) ) {
|
||||
$default_view_mode = $args['default-view-mode'];
|
||||
unset($args['default-view-mode']);
|
||||
}
|
||||
|
||||
// If is a collection page
|
||||
if (isset($atts['collection-id']) && $atts['collection-id'] != '') {
|
||||
$params .= "collection-id=" . $atts['collection-id'];
|
||||
$collection = new \Tainacan\Entities\Collection($atts['collection-id']);
|
||||
if( isset($args['enabled-view-modes']) ) {
|
||||
$enabled_view_modes = $args['enabled-view-modes'];
|
||||
if ( !in_array($default_view_mode, $enabled_view_modes) ) {
|
||||
$default_view_mode = $enabled_view_modes[0];
|
||||
}
|
||||
unset($args['enabled-view-modes']);
|
||||
}
|
||||
|
||||
// If in a collection page
|
||||
$collection_id = tainacan_get_collection_id();
|
||||
if ($collection_id) {
|
||||
$props .= 'collection-id="' . $collection_id . '" ';
|
||||
$collection = new \Tainacan\Entities\Collection($collection_id);
|
||||
$default_view_mode = $collection->get_default_view_mode();
|
||||
$enabled_view_modes = $collection->get_enabled_view_modes();
|
||||
}
|
||||
|
||||
// If is a tainacan taxonomy
|
||||
if (isset($atts['term-id']) && $atts['term-id'] != '' && isset($atts['taxonomy']) && $atts['taxonomy'] != '' ) {
|
||||
$params .= "term-id=" . $atts['term-id'];
|
||||
$params .= ' "taxonomy="' . $atts['taxonomy'];
|
||||
// If in a tainacan taxonomy
|
||||
$term = tainacan_get_term();
|
||||
if ($term) {
|
||||
$props .= 'term-id="' . $term->term_id . '" ';
|
||||
$props .= 'taxonomy="' . $term->taxonomy . '" ';
|
||||
}
|
||||
|
||||
$params .= ' default-view-mode="' . $default_view_mode . '" ';
|
||||
$params .= ' enabled-view-modes="' . implode(',', $enabled_view_modes) . '" ';
|
||||
$props .= 'default-view-mode="' . $default_view_mode . '" ';
|
||||
$props .= 'enabled-view-modes="' . implode(',', $enabled_view_modes) . '" ';
|
||||
|
||||
// Passes arguments to custom props
|
||||
foreach ($args as $key => $value) {
|
||||
if ($value == true || $value == 'true') {
|
||||
$props .= $key . '="' . $value . '" ';
|
||||
}
|
||||
}
|
||||
|
||||
$this->enqueue_scripts(true);
|
||||
|
||||
return "<div id='tainacan-items-page' $params ></div>";
|
||||
return "<div id='tainacan-items-page' $props ></div>";
|
||||
|
||||
}
|
||||
|
||||
function get_items_list_slug() {
|
||||
|
|
|
|||
|
|
@ -21,9 +21,40 @@ class Compound extends Metadata_Type {
|
|||
$this->set_component('tainacan-compound');
|
||||
$this->set_form_component('tainacan-form-compound');
|
||||
$this->set_preview_template('
|
||||
<div>
|
||||
<div class="control is-clearfix">
|
||||
Compound
|
||||
<div class="child-metadata-inputs">
|
||||
<a class="collapse-all">
|
||||
' . __('Collapse all', 'tainacan') . '
|
||||
<span class="icon">
|
||||
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"></i>
|
||||
</span>
|
||||
</a>
|
||||
<div class="multiple-inputs">
|
||||
<div class="field">
|
||||
<span class="collapse-handle">
|
||||
<span class="icon">
|
||||
<i class="has-text-secondary tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"></i>
|
||||
</span>
|
||||
<label class="label has-tooltip">' . __('Text', 'tainacan') . '</label>
|
||||
</span>
|
||||
<div>
|
||||
<div class="control is-clearfix">
|
||||
<input type="text" placeholder="' . __('Type here...') . '" autocomplete="on" id="tainacan-text-texto-simples" class="input">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field is-last-input">
|
||||
<span class="collapse-handle">
|
||||
<span class="icon">
|
||||
<i class="has-text-secondary tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"></i>
|
||||
</span>
|
||||
<label class="label has-tooltip"> ' . __('Number', 'tainacan') . '</label>
|
||||
</span>
|
||||
<div>
|
||||
<div class="control is-clearfix">
|
||||
<input placeholder="3,1415" type="number" autocomplete="on" id="tainacan-numeric-numerico" step="0.01" class="input" lang="en">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
');
|
||||
|
|
|
|||
|
|
@ -4,9 +4,9 @@
|
|||
expanded
|
||||
:disabled="disabled"
|
||||
:id="itemMetadatum.metadatum.metadata_type_object.component + '-' + itemMetadatum.metadatum.slug"
|
||||
:value="selected"
|
||||
size="is-small"
|
||||
icon="magnify"
|
||||
:value="selected"
|
||||
@input="onInput"
|
||||
@blur="onBlur"
|
||||
:data="options"
|
||||
|
|
@ -53,11 +53,10 @@
|
|||
itemMetadatum: Object,
|
||||
maxtags: undefined,
|
||||
disabled: false,
|
||||
allowNew: true,
|
||||
allowNew: true
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
results:'',
|
||||
selected:[],
|
||||
options: [],
|
||||
isLoading: false,
|
||||
|
|
@ -92,11 +91,6 @@
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
setResults(option){
|
||||
if(!option)
|
||||
return;
|
||||
this.results = option.value;
|
||||
},
|
||||
onInput(newSelected) {
|
||||
this.selected = newSelected;
|
||||
this.$emit('input', newSelected.map((item) => item.value));
|
||||
|
|
|
|||
|
|
@ -127,7 +127,7 @@
|
|||
return (this.itemMetadatum && this.itemMetadatum.metadatum && this.itemMetadatum.metadatum.multiple == 'yes') ? this.itemMetadatum.metadatum.multiple == 'yes' : false;
|
||||
},
|
||||
isTextInputComponent() {
|
||||
const array = ['tainacan-relationship','tainacan-taxonomy', 'tainacan-compound'];
|
||||
const array = ['tainacan-relationship','tainacan-taxonomy', 'tainacan-compound', 'tainacan-user'];
|
||||
return !(array.indexOf(this.metadatumComponent) >= 0 );
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -30,18 +30,18 @@ class Taxonomy extends Metadata_Type {
|
|||
$this->set_preview_template('
|
||||
<div>
|
||||
<div>
|
||||
<p class="has-text-gray">'. __('Selected terms') . ': </p>
|
||||
<p class="has-text-gray" style="font-size: 0.75em;">'. __('Selected terms') . ': </p>
|
||||
<div class="field selected-tags is-grouped-multiline is-grouped">
|
||||
<div>
|
||||
<div class="tags has-addons">
|
||||
<span class="tag"><span>'. __('Term') . ' 2</span></span>
|
||||
<a class="tag is-delete"></a>
|
||||
<span class="tag is-small"><span>'. __('Term') . ' 2</span></span>
|
||||
<a class="tag is-delete is-small"></a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="tags has-addons">
|
||||
<span class="tag"><span>'. __('Term') . ' 3</span></span>
|
||||
<a class="tag is-delete"></a>
|
||||
<span class="tag is-small"><span>'. __('Term') . ' 3</span></span>
|
||||
<a class="tag is-delete is-small"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,124 +1,166 @@
|
|||
<template>
|
||||
<b-autocomplete
|
||||
clearable
|
||||
:disabled="disabled"
|
||||
:value="currentUser && currentUser.name ? currentUser.name : null"
|
||||
:data="users"
|
||||
:placeholder="$i18n.get('instruction_type_search_users')"
|
||||
keep-first
|
||||
open-on-focus
|
||||
@input="loadUsers"
|
||||
@focus.once="($event) => loadUsers($event.target.value)"
|
||||
@select="onSelect"
|
||||
:loading="isFetchingUsers || isLoadingCurrentUser"
|
||||
field="name"
|
||||
icon="account"
|
||||
check-infinite-scroll
|
||||
@infinite-scroll="fetchMoreUsers">
|
||||
<template slot-scope="props">
|
||||
<div class="media">
|
||||
<div
|
||||
v-if="props.option.avatar_urls && props.option.avatar_urls['24']"
|
||||
class="media-left">
|
||||
<img
|
||||
width="24"
|
||||
:src="props.option.avatar_urls['24']">
|
||||
<div :class="{ 'is-flex': itemMetadatum.metadatum.multiple != 'yes' || maxtags != undefined }">
|
||||
<b-taginput
|
||||
expanded
|
||||
:disabled="disabled"
|
||||
:id="itemMetadatum.metadatum.metadata_type_object.component + '-' + itemMetadatum.metadatum.slug"
|
||||
size="is-small"
|
||||
icon="account"
|
||||
:value="selected"
|
||||
@input="onInput"
|
||||
@blur="onBlur"
|
||||
:data="options"
|
||||
:maxtags="maxtags != undefined ? maxtags : (itemMetadatum.metadatum.multiple == 'yes' || allowNew === true ? 100 : 1)"
|
||||
autocomplete
|
||||
attached
|
||||
:placeholder="$i18n.get('instruction_type_search_users')"
|
||||
keep-first
|
||||
open-on-focus
|
||||
:loading="isLoading || isLoading"
|
||||
:aria-close-label="$i18n.get('remove_value')"
|
||||
:class="{'has-selected': selected != undefined && selected != []}"
|
||||
field="name"
|
||||
@typing="search"
|
||||
check-infinite-scroll
|
||||
@infinite-scroll="searchMore">
|
||||
<template slot-scope="props">
|
||||
<div class="media">
|
||||
<div
|
||||
v-if="props.option.avatar_urls && props.option.avatar_urls['24']"
|
||||
class="media-left">
|
||||
<img
|
||||
width="24"
|
||||
:src="props.option.avatar_urls['24']">
|
||||
</div>
|
||||
<div class="media-content">
|
||||
{{ props.option.name }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="media-content">
|
||||
{{ props.option.name }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template slot="empty">{{ $i18n.get('info_no_user_found') }}</template>
|
||||
</b-autocomplete>
|
||||
</template>
|
||||
<template
|
||||
v-if="!isLoading"
|
||||
slot="empty">
|
||||
{{ $i18n.get('info_no_user_found') }}
|
||||
</template>
|
||||
</b-taginput>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { wp as wpAxios } from '../../../js/axios';
|
||||
import { mapActions } from 'vuex';
|
||||
import qs from 'qs';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
metadatum: Object,
|
||||
value: [String, Number, Array],
|
||||
disabled: false
|
||||
itemMetadatum: Object,
|
||||
maxtags: undefined,
|
||||
disabled: false,
|
||||
allowNew: true,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
users: [],
|
||||
defaultAuthor: 'no',
|
||||
isLoadingCurrentUser: false,
|
||||
isFetchingUsers: false,
|
||||
userId: null,
|
||||
selected:[],
|
||||
options: [],
|
||||
isLoading: false,
|
||||
usersSearchQuery: '',
|
||||
usersSearchPage: 1,
|
||||
totalUsers: 0,
|
||||
currentUser: {}
|
||||
totalUsers: 0
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadCurrentUser();
|
||||
this.loadCurrentUsers();
|
||||
},
|
||||
methods: {
|
||||
onSelect(value) {
|
||||
this.$emit('input', value.id);
|
||||
},
|
||||
...mapActions('activity', [
|
||||
'fetchUsers',
|
||||
'fetchUser'
|
||||
'fetchUsers'
|
||||
]),
|
||||
loadCurrentUser() {
|
||||
this.isLoadingCurrentUser = true;
|
||||
this.fetchUser(this.value)
|
||||
.then((res) => {
|
||||
this.currentUser = res.user;
|
||||
this.isLoadingCurrentUser = false;
|
||||
})
|
||||
.catch(() => this.isLoadingCurrentUser = false );
|
||||
onInput(newSelected) {
|
||||
this.selected = newSelected;
|
||||
this.$emit('input', newSelected.map((user) => user.id));
|
||||
},
|
||||
loadUsers: _.debounce(function (search) {
|
||||
onBlur() {
|
||||
this.$emit('blur');
|
||||
},
|
||||
loadCurrentUsers() {
|
||||
this.isLoading = true;
|
||||
let query = qs.stringify({ include: this.itemMetadatum.value });
|
||||
let endpoint = '/users/';
|
||||
|
||||
wpAxios.get(endpoint + '?' + query)
|
||||
.then((res) => {
|
||||
if (res.data.items) {
|
||||
for (let user of res.data) {
|
||||
this.selected.push({
|
||||
label: user.name,
|
||||
value: user.id,
|
||||
img: user.avatar_urls && user.avatar_urls['24'] ? user.avatar_urls['24'] : ''
|
||||
}) ;
|
||||
}
|
||||
}
|
||||
this.isLoading = false;
|
||||
})
|
||||
.catch(() => this.isLoading = false );
|
||||
},
|
||||
search: _.debounce(function (search) {
|
||||
|
||||
// String update
|
||||
if (search != this.usersSearchQuery) {
|
||||
this.usersSearchQuery = search;
|
||||
this.users = [];
|
||||
this.options = [];
|
||||
this.usersSearchPage = 1;
|
||||
}
|
||||
|
||||
// String cleared
|
||||
if (!search.length) {
|
||||
this.usersSearchQuery = search;
|
||||
this.users = [];
|
||||
this.options = [];
|
||||
this.usersSearchPage = 1;
|
||||
}
|
||||
|
||||
// No need to load more
|
||||
if (this.usersSearchPage > 1 && this.users.length > this.totalUsers)
|
||||
if (this.usersSearchPage > 1 && this.options.length > this.totalUsers)
|
||||
return;
|
||||
|
||||
this.isFetchingUsers = true;
|
||||
// There is already one value set and is not multiple
|
||||
if (this.selected.length > 0 && this.itemMetadatum.metadatum.multiple === 'no')
|
||||
return;
|
||||
|
||||
this.fetchUsers({ search: this.usersSearchQuery, page: this.usersSearchPage })
|
||||
.then((res) => {
|
||||
if (res.users) {
|
||||
for (let user of res.users)
|
||||
this.users.push(user);
|
||||
}
|
||||
|
||||
if (res.totalUsers)
|
||||
this.totalUsers = res.totalUsers;
|
||||
if (this.usersSearchQuery !== '') {
|
||||
this.isLoading = true;
|
||||
|
||||
this.usersSearchPage++;
|
||||
|
||||
this.isFetchingUsers = false;
|
||||
})
|
||||
.catch((error) => {
|
||||
this.$console.error(error);
|
||||
this.isFetchingPages = false;
|
||||
});
|
||||
this.fetchUsers({ search: this.usersSearchQuery, page: this.usersSearchPage })
|
||||
.then((res) => {
|
||||
if (res.users) {
|
||||
for (let user of res.users)
|
||||
this.options.push(user);
|
||||
}
|
||||
|
||||
if (res.totalUsers)
|
||||
this.totalUsers = res.totalUsers;
|
||||
|
||||
this.usersSearchPage++;
|
||||
|
||||
this.isLoading = false;
|
||||
})
|
||||
.catch((error) => {
|
||||
this.$console.error(error);
|
||||
this.isFetchingPages = false;
|
||||
});
|
||||
}
|
||||
}, 500),
|
||||
fetchMoreUsers: _.debounce(function () {
|
||||
this.loadUsers(this.usersSearchQuery)
|
||||
searchMore: _.debounce(function () {
|
||||
this.search(this.usersSearchQuery)
|
||||
}, 250),
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.help.counter {
|
||||
display: none;
|
||||
}
|
||||
div.is-flex {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -21,9 +21,59 @@ class User extends Metadata_Type {
|
|||
$this->set_name( __('User', 'tainacan') );
|
||||
$this->set_description( __('A registered user on WordPress', 'tainacan') );
|
||||
$this->set_preview_template('
|
||||
<div>
|
||||
<div class="control is-clearfix">
|
||||
user
|
||||
<div class="taginput control is-expanded has-selected">
|
||||
<div class="taginput-container is-small is-focusable">
|
||||
<div class="tags has-addons">
|
||||
<span class="tag is-small">
|
||||
<span>' . __('User', 'tainacan') .' 1</span>
|
||||
</span>
|
||||
<a class="tag is-delete is-small"></a>
|
||||
</div>
|
||||
<div class="tags has-addons">
|
||||
<span class="tag is-small">
|
||||
<span>' . __('User', 'tainacan') .' 2</span>
|
||||
</span>
|
||||
<a class="tag is-delete is-small"></a>
|
||||
</div>
|
||||
<div class="autocomplete control">
|
||||
<div class="control has-icons-left has-icons-right is-small">
|
||||
<input type="text" autocomplete="off" id="tainacan-user-usuario" placeholder="Type to search users..." class="input is-small">
|
||||
<span class="icon is-left is-small">
|
||||
<i class="mdi mdi-account"></i>
|
||||
</span>
|
||||
<span class="icon is-right is-small is-clickable">
|
||||
<i class="mdi mdi-alert-circle"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div class="dropdown-menu">
|
||||
<div class="dropdown-content">
|
||||
<a class="dropdown-item">
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<img src="http://1.gravatar.com/avatar/194c59734d14b92b3b37825616fa1876?s=24&d=mm&r=g" width="16">
|
||||
</div>
|
||||
<div class="media-content"><span>' . __('User', 'tainacan') .' 3</span></div>
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item is-hovered">
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<img src="http://1.gravatar.com/avatar/194c59734d14b92b3b37825616fa1876?s=24&d=mm&r=g" width="16">
|
||||
</div>
|
||||
<div class="media-content"><span>' . __('User', 'tainacan') .' 4</span></div>
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item">
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<img src="http://1.gravatar.com/avatar/194c59734d14b92b3b37825616fa1876?s=24&d=mm&r=g" width="16">
|
||||
</div>
|
||||
<div class="media-content"><span>' . __('User', 'tainacan') .' 5</span></div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
');
|
||||
|
|
|
|||
|
|
@ -74,6 +74,11 @@ export default {
|
|||
-o-transition: all .3s;
|
||||
transition: all .3s;
|
||||
}
|
||||
|
||||
iframe {
|
||||
height: 640px;
|
||||
height: 50vh;
|
||||
}
|
||||
}
|
||||
|
||||
figcaption {
|
||||
|
|
|
|||
|
|
@ -42,24 +42,11 @@
|
|||
aria-labelledby="items-per-page-select"
|
||||
@input="onChangeItemsPerPage">
|
||||
<option
|
||||
v-for="(itemsPerPageOption, index) of itemsPerPageOptions"
|
||||
:key="index"
|
||||
v-if="maxItemsPerPage >= 12"
|
||||
value="12">
|
||||
12
|
||||
</option>
|
||||
<option
|
||||
v-if="maxItemsPerPage >= 24"
|
||||
value="24">
|
||||
24
|
||||
</option>
|
||||
<option
|
||||
v-if="maxItemsPerPage >= 48"
|
||||
value="48">
|
||||
48
|
||||
</option>
|
||||
<option
|
||||
v-if="maxItemsPerPage >= 96"
|
||||
value="96">
|
||||
96
|
||||
:value="itemsPerPageOption">
|
||||
{{ itemsPerPageOption }}
|
||||
</option>
|
||||
</b-select>
|
||||
</b-field>
|
||||
|
|
@ -143,6 +130,13 @@ export default {
|
|||
},
|
||||
totalPages(){
|
||||
return Math.ceil(Number(this.totalItems)/Number(this.itemsPerPage));
|
||||
},
|
||||
itemsPerPageOptions() {
|
||||
const defaultItemsPerPageOptions = [12, 24, 48, 96];
|
||||
if (!isNaN(this.itemsPerPage) && !defaultItemsPerPageOptions.includes(this.itemsPerPage))
|
||||
defaultItemsPerPageOptions.push(this.itemsPerPage);
|
||||
|
||||
return defaultItemsPerPageOptions.sort();
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
|
|
|||
|
|
@ -236,14 +236,16 @@ export default {
|
|||
resetPageOnStore() {
|
||||
this.$store.dispatch('search/setPage', 1);
|
||||
},
|
||||
setItemsPerPage(itemsPerPage) {
|
||||
setItemsPerPage(itemsPerPage, shouldNotUpdatePrefs) {
|
||||
this.$store.dispatch('search/setItemsPerPage', itemsPerPage);
|
||||
this.updateURLQueries();
|
||||
|
||||
let prefsPerPage = this.collectionId != undefined ? 'items_per_page_' + this.collectionId : 'items_per_page';
|
||||
if (this.$userPrefs.get(prefsPerPage) != itemsPerPage) {
|
||||
this.$userPrefs.set(prefsPerPage, itemsPerPage)
|
||||
.catch(() => {});
|
||||
if (shouldNotUpdatePrefs == undefined || shouldNotUpdatePrefs == false) {
|
||||
let prefsPerPage = this.collectionId != undefined ? 'items_per_page_' + this.collectionId : 'items_per_page';
|
||||
if (this.$userPrefs.get(prefsPerPage) != itemsPerPage) {
|
||||
this.$userPrefs.set(prefsPerPage, itemsPerPage)
|
||||
.catch(() => {});
|
||||
}
|
||||
}
|
||||
},
|
||||
setOrderBy(orderBy) {
|
||||
|
|
|
|||
|
|
@ -173,15 +173,30 @@
|
|||
width: 100%;
|
||||
.label {
|
||||
color: var(--tainacan-info-color);
|
||||
font-size: 1em;
|
||||
line-height: 2em;
|
||||
font-size: 0.875em;
|
||||
line-height: 1.875em;
|
||||
}
|
||||
}
|
||||
.add-new-term {
|
||||
.add-new-term,
|
||||
.collapse-all {
|
||||
font-size: 0.75em;
|
||||
text-decoration: underline;
|
||||
margin: 0.875em 1.5em;
|
||||
}
|
||||
.selected-tags {
|
||||
font-size: 0.75em;
|
||||
}
|
||||
.child-metadata-inputs {
|
||||
margin-left: 5px;
|
||||
padding-left: 16px;
|
||||
padding-top: 2px;
|
||||
border-left: 1px solid var(--tainacan-gray3);
|
||||
|
||||
.is-last-input {
|
||||
margin-top: -14px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Metadata type textarea has different separators in different spots on interface
|
||||
|
|
|
|||
|
|
@ -207,7 +207,7 @@ a:hover {
|
|||
.multivalue-separator {
|
||||
display: block;
|
||||
max-height: 1px;
|
||||
width: 35px;
|
||||
width: 60px;
|
||||
background: var(--tainacan-gray3);
|
||||
content: none;
|
||||
color: transparent;
|
||||
|
|
@ -221,7 +221,7 @@ a:hover {
|
|||
.multivalue-separator {
|
||||
display: block;
|
||||
max-height: 1px;
|
||||
width: 35px;
|
||||
width: 60px;
|
||||
background: var(--tainacan-gray3);
|
||||
content: none;
|
||||
color: transparent;
|
||||
|
|
@ -233,8 +233,8 @@ a:hover {
|
|||
margin-left: 15px;
|
||||
border-left: 1px solid var(--tainacan-gray2);
|
||||
|
||||
.tainacan-compound-metadatum {
|
||||
margin-bottom: 0.5em;
|
||||
.tainacan-metadatum {
|
||||
margin-bottom: 0.75em;
|
||||
|
||||
.label:not(:last-child) {
|
||||
margin-bottom: 0.3em;
|
||||
|
|
|
|||
|
|
@ -84,6 +84,10 @@ registerBlockType('tainacan/faceted-search', {
|
|||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
defaultItemsPerPage: {
|
||||
type: Number,
|
||||
default: 12
|
||||
},
|
||||
hideGoToPageButton: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
|
|
@ -202,6 +206,7 @@ registerBlockType('tainacan/faceted-search', {
|
|||
hideSortByButton,
|
||||
hideExposersButton,
|
||||
hideItemsPerPageButton,
|
||||
defaultItemsPerPage,
|
||||
hideGoToPageButton,
|
||||
showFiltersButtonInsideSearchControl,
|
||||
startWithFiltersHidden,
|
||||
|
|
@ -228,6 +233,9 @@ registerBlockType('tainacan/faceted-search', {
|
|||
secondaryColor
|
||||
} = attributes;
|
||||
|
||||
const registeredViewModesEntries = Object.entries(tainacan_plugin.registered_view_modes);
|
||||
const registeredViewModesKeys = Object.keys(tainacan_plugin.registered_view_modes);
|
||||
|
||||
const fontSizes = [
|
||||
{
|
||||
name: __( 'Tiny', 'tainacan' ),
|
||||
|
|
@ -270,6 +278,10 @@ registerBlockType('tainacan/faceted-search', {
|
|||
} );
|
||||
}
|
||||
|
||||
function checkIfViewModeIsEnabled(viewMode) {
|
||||
return enabledViewModes.includes(viewMode);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={className}>
|
||||
|
||||
|
|
@ -360,8 +372,8 @@ registerBlockType('tainacan/faceted-search', {
|
|||
value={ defaultViewMode }
|
||||
options={
|
||||
[{ value: 'none', label: __('Use current view mode settings', 'tainacan') }]
|
||||
.concat(Object.entries(tainacan_plugin.registered_view_modes)
|
||||
.map(aViewMode => { return { label: aViewMode[1].label, value: aViewMode[0], disabled: aViewMode[1].full_screen }})
|
||||
.concat(registeredViewModesEntries
|
||||
.map(aViewMode => { return { label: aViewMode[1].label, value: aViewMode[0], disabled: !checkIfViewModeIsEnabled(aViewMode[0]) || aViewMode[1].full_screen }})
|
||||
)
|
||||
}
|
||||
onChange={ (aViewMode) => {
|
||||
|
|
@ -377,11 +389,12 @@ registerBlockType('tainacan/faceted-search', {
|
|||
help={ __('Select the view modes that you wish to be available for user selection on the items list.', 'tainacan') }>
|
||||
|
||||
{
|
||||
Object.entries(tainacan_plugin.registered_view_modes).map(aRegisteredViewMode => {
|
||||
registeredViewModesEntries.map(aRegisteredViewMode => {
|
||||
return (
|
||||
<CheckboxControl
|
||||
label={ aRegisteredViewMode[1].label }
|
||||
checked={ enabledViewModes.includes(aRegisteredViewMode[0]) }
|
||||
checked={ checkIfViewModeIsEnabled(aRegisteredViewMode[0]) }
|
||||
disabled={ checkIfViewModeIsEnabled(aRegisteredViewMode[0]) && enabledViewModes.filter((aViewMode) => tainacan_plugin.registered_view_modes[aViewMode] && !tainacan_plugin.registered_view_modes[aViewMode].full_screen).length <= 1 }
|
||||
onChange={ () => {
|
||||
let index = enabledViewModes.findIndex(aViewMode => aViewMode == aRegisteredViewMode[0]);
|
||||
if (index > -1)
|
||||
|
|
@ -389,7 +402,17 @@ registerBlockType('tainacan/faceted-search', {
|
|||
else
|
||||
enabledViewModes.push(aRegisteredViewMode[0]);
|
||||
|
||||
setAttributes({ enabledViewModes: enabledViewModes });
|
||||
// Puts a valid view mode as default if the current one is not in the list anymore.
|
||||
if (defaultViewMode != 'none' && !enabledViewModes.includes(defaultViewMode)) {
|
||||
const validViewModeIndex = enabledViewModes.findIndex((aViewMode) => (tainacan_plugin.registered_view_modes[aViewMode] && !tainacan_plugin.registered_view_modes[aViewMode].full_screen));
|
||||
if (validViewModeIndex >= 0)
|
||||
defaultViewMode = enabledViewModes[validViewModeIndex];
|
||||
}
|
||||
|
||||
setAttributes({
|
||||
enabledViewModes: JSON.parse(JSON.stringify(enabledViewModes)),
|
||||
defaultViewMode: defaultViewMode
|
||||
});
|
||||
} }
|
||||
/>
|
||||
)
|
||||
|
|
@ -469,6 +492,17 @@ registerBlockType('tainacan/faceted-search', {
|
|||
}
|
||||
}
|
||||
/>
|
||||
<RangeControl
|
||||
label={__('Default number of items per page', 'tainacan')}
|
||||
value={ defaultItemsPerPage ? defaultItemsPerPage : 12 }
|
||||
onChange={ ( itemsPerPage ) => {
|
||||
defaultItemsPerPage = itemsPerPage;
|
||||
setAttributes( { defaultItemsPerPage: itemsPerPage } )
|
||||
setContent();
|
||||
}}
|
||||
min={ 1 }
|
||||
max={ tainacan_plugin.api_max_items_per_page ? tainacan_plugin.api_max_items_per_page : 96 }
|
||||
/>
|
||||
</PanelBody>
|
||||
|
||||
<PanelBody
|
||||
|
|
@ -698,7 +732,7 @@ registerBlockType('tainacan/faceted-search', {
|
|||
listType = aListType;
|
||||
|
||||
if (listType != 'collection') {
|
||||
enabledViewModes = Object.keys(tainacan_plugin.registered_view_modes);
|
||||
enabledViewModes = registeredViewModesKeys;
|
||||
defaultViewMode = 'masonry';
|
||||
}
|
||||
|
||||
|
|
@ -925,8 +959,8 @@ registerBlockType('tainacan/faceted-search', {
|
|||
collectionEnabledViewModes = collectionEnabledViewModes && collectionEnabledViewModes.length ? collectionEnabledViewModes : enabledViewModes;
|
||||
setAttributes({
|
||||
collectionId: collectionId,
|
||||
collectionDefaultViewMode: collectionEnabledViewModes,
|
||||
defaultViewMode: collectionEnabledViewModes,
|
||||
collectionDefaultViewMode: collectionDefaultViewMode,
|
||||
defaultViewMode: collectionDefaultViewMode,
|
||||
collectionEnabledViewModes: collectionEnabledViewModes,
|
||||
enabledViewModes: collectionEnabledViewModes,
|
||||
isCollectionModalOpen: false
|
||||
|
|
@ -946,7 +980,7 @@ registerBlockType('tainacan/faceted-search', {
|
|||
}}
|
||||
onSelectTerm={ (selectedTermId) => {
|
||||
termId = selectedTermId;
|
||||
enabledViewModes = tainacan_plugin.registered_view_modes;
|
||||
enabledViewModes = registeredViewModesKeys;
|
||||
|
||||
setAttributes({
|
||||
termId: selectedTermId,
|
||||
|
|
@ -977,6 +1011,7 @@ registerBlockType('tainacan/faceted-search', {
|
|||
hideSortByButton,
|
||||
hideExposersButton,
|
||||
hideItemsPerPageButton,
|
||||
defaultItemsPerPage,
|
||||
hideGoToPageButton,
|
||||
showFiltersButtonInsideSearchControl,
|
||||
startWithFiltersHidden,
|
||||
|
|
@ -1022,26 +1057,27 @@ registerBlockType('tainacan/faceted-search', {
|
|||
}}
|
||||
className={ className }>
|
||||
<main
|
||||
term-id={ listType == 'term' ? termId : null }
|
||||
taxonomy={ listType == 'term' ? 'tnc_tax_' + taxonomyId : null }
|
||||
collection-id={ listType == 'collection' ? collectionId : null }
|
||||
default-view-mode={ defaultViewMode == 'none' ? defaultViewMode : (listType == 'collection' ? collectionDefaultViewMode : 'masonry') }
|
||||
is-forced-view-mode={ defaultViewMode == 'none' ? true : false }
|
||||
enabled-view-modes={ enabledViewModes.toString() }
|
||||
hide-filters = { hideFilters.toString() }
|
||||
hide-hide-filters-button= { hideHideFiltersButton.toString() }
|
||||
hide-search = { hideSearch.toString() }
|
||||
hide-advanced-search = { hideAdvancedSearch.toString() }
|
||||
hide-sort-by-button = { hideSortByButton.toString() }
|
||||
hide-exposers-button = { hideExposersButton.toString() }
|
||||
hide-items-per-page-button = { hideItemsPerPageButton.toString() }
|
||||
hide-go-to-page-button = { hideGoToPageButton.toString() }
|
||||
show-filters-button-inside-search-control = { showFiltersButtonInsideSearchControl.toString() }
|
||||
start-with-filters-hidden = { startWithFiltersHidden.toString() }
|
||||
filters-as-modal = { filtersAsModal.toString() }
|
||||
show-inline-view-mode-options = { showInlineViewModeOptions.toString() }
|
||||
show-fullscreen-with-view-modes = { showFullscreenWithViewModes.toString() }
|
||||
id="tainacan-items-page">
|
||||
term-id={ listType == 'term' ? termId : null }
|
||||
taxonomy={ listType == 'term' ? 'tnc_tax_' + taxonomyId : null }
|
||||
collection-id={ listType == 'collection' ? collectionId : null }
|
||||
default-view-mode={ defaultViewMode != 'none' ? defaultViewMode : (listType == 'collection' ? collectionDefaultViewMode : 'masonry') }
|
||||
is-forced-view-mode={ defaultViewMode == 'none' ? true : false }
|
||||
enabled-view-modes={ enabledViewModes.toString() }
|
||||
hide-filters = { hideFilters.toString() }
|
||||
hide-hide-filters-button= { hideHideFiltersButton.toString() }
|
||||
hide-search = { hideSearch.toString() }
|
||||
hide-advanced-search = { hideAdvancedSearch.toString() }
|
||||
hide-sort-by-button = { hideSortByButton.toString() }
|
||||
hide-exposers-button = { hideExposersButton.toString() }
|
||||
hide-items-per-page-button = { hideItemsPerPageButton.toString() }
|
||||
default-items-per-page = { defaultItemsPerPage }
|
||||
hide-go-to-page-button = { hideGoToPageButton.toString() }
|
||||
show-filters-button-inside-search-control = { showFiltersButtonInsideSearchControl.toString() }
|
||||
start-with-filters-hidden = { startWithFiltersHidden.toString() }
|
||||
filters-as-modal = { filtersAsModal.toString() }
|
||||
show-inline-view-mode-options = { showInlineViewModeOptions.toString() }
|
||||
show-fullscreen-with-view-modes = { showFullscreenWithViewModes.toString() }
|
||||
id="tainacan-items-page">
|
||||
</main>
|
||||
</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -150,7 +150,7 @@
|
|||
.search-button {
|
||||
order: 4;
|
||||
position: absolute;
|
||||
margin-top: 37px;
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
input {
|
||||
width: 100% !important;
|
||||
|
|
@ -436,7 +436,7 @@
|
|||
|
||||
.show-more-button {
|
||||
margin: 12px auto;
|
||||
padding: 0.25em;
|
||||
padding: 0.2em 0.25em;
|
||||
display: block;
|
||||
background: var(--tainacan-block-primary, $primary);
|
||||
border: none;
|
||||
|
|
|
|||
|
|
@ -84,7 +84,7 @@
|
|||
span.label {
|
||||
color: white;
|
||||
font-weight: normal;
|
||||
font-size: 0.75em;
|
||||
font-size: 0.5em;
|
||||
}
|
||||
|
||||
&.only-collection-name {
|
||||
|
|
@ -155,7 +155,7 @@
|
|||
.search-button {
|
||||
order: 4;
|
||||
position: absolute;
|
||||
margin-top: 37px;
|
||||
margin-top: 0.75em;
|
||||
}
|
||||
input {
|
||||
width: 100% !important;
|
||||
|
|
|
|||
|
|
@ -120,6 +120,7 @@ document.addEventListener("DOMContentLoaded", () => {
|
|||
defaultViewMode: '',
|
||||
isForcedViewMode: false,
|
||||
enabledViewModes: {},
|
||||
defaultItemsPerPage: '',
|
||||
hideFilters: false,
|
||||
hideHideFiltersButton: false,
|
||||
hideSearch: false,
|
||||
|
|
@ -174,6 +175,8 @@ document.addEventListener("DOMContentLoaded", () => {
|
|||
this.hideGoToPageButton = this.isParameterTrue('hide-go-to-page-button');
|
||||
|
||||
// Other Tweaks
|
||||
if (this.$el.attributes['default-items-per-page'] != undefined)
|
||||
this.defaultItemsPerPage = this.$el.attributes['default-items-per-page'].value;
|
||||
if (this.$el.attributes['show-filters-button-inside-search-control'] != undefined)
|
||||
this.showFiltersButtonInsideSearchControl = this.isParameterTrue('show-filters-button-inside-search-control');
|
||||
if (this.$el.attributes['start-with-filters-hidden'] != undefined)
|
||||
|
|
|
|||
|
|
@ -558,6 +558,7 @@
|
|||
hideItemsPerPageButton: false,
|
||||
hideGoToPageButton: false,
|
||||
// Other Tweaks
|
||||
defaultItemsPerPage: Number,
|
||||
showFiltersButtonInsideSearchControl: false,
|
||||
startWithFiltersHidden: false,
|
||||
filtersAsModal: false,
|
||||
|
|
@ -734,9 +735,13 @@
|
|||
let existingViewModeIndex = Object.keys(this.registeredViewModes).findIndex(viewMode => viewMode == this.$userPrefs.get(prefsViewMode));
|
||||
if (existingViewModeIndex >= 0) {
|
||||
if (!this.registeredViewModes[Object.keys(this.registeredViewModes)[existingViewModeIndex]].show_pagination) {
|
||||
this.$eventBusSearch.setItemsPerPage(12);
|
||||
this.$eventBusSearch.setItemsPerPage(12, true);
|
||||
}
|
||||
}
|
||||
|
||||
// If any default items per page is set, apply it
|
||||
if (this.defaultItemsPerPage)
|
||||
this.$eventBusSearch.setItemsPerPage(this.defaultItemsPerPage, true);
|
||||
|
||||
this.showItemsHiddingDueSortingDialog();
|
||||
|
||||
|
|
@ -1443,7 +1448,7 @@
|
|||
.multivalue-separator {
|
||||
display: block;
|
||||
max-height: 1px;
|
||||
width: 35px;
|
||||
width: 60px;
|
||||
background: var(--tainacan-gray3);
|
||||
content: none;
|
||||
color: transparent;
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
:enabled-view-modes="$root.enabledViewModes"
|
||||
:default-view-mode="$root.defaultViewMode"
|
||||
:is-forced-view-mode="$root.isForcedViewMode"
|
||||
:default-items-per-page="$root.defaultItemsPerPage"
|
||||
:hide-filters="$root.hideFilters ? $root.hideFilters : false"
|
||||
:hide-hide-filters-button="$root.hideHideFiltersButton ? $root.hideHideFiltersButton : false"
|
||||
:hide-search="$root.hideSearch ? $root.hideSearch : false"
|
||||
|
|
@ -205,7 +206,7 @@ export default {
|
|||
.multivalue-separator {
|
||||
display: block;
|
||||
max-height: 1px;
|
||||
width: 35px;
|
||||
width: 60px;
|
||||
background: var(--tainacan-gray3);
|
||||
content: none;
|
||||
color: transparent;
|
||||
|
|
|
|||
Loading…
Reference in New Issue