Merge pull request #641 from tainacan/feature/504

Better way to fetch items on caroussels - Feature/504
This commit is contained in:
Mateus Machado Luna 2021-11-26 10:56:06 -03:00 committed by GitHub
commit 1c0aa0734a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 143 additions and 146 deletions

View File

@ -31,6 +31,7 @@ class REST_Collections_Controller extends REST_Controller {
*/
public function init_objects() {
$this->collections_repository = Repositories\Collections::get_instance();
$this->items_repository = Repositories\Items::get_instance();
$this->collection = new Entities\Collection();
}
@ -178,6 +179,38 @@ class REST_Collections_Controller extends REST_Controller {
return new \WP_REST_Response($response, 200);
}
/**
* @param \Tainacan\Entities\Collection $collection
*
* @return array
*/
private function get_preview_image_items($collection, $amount) {
if($amount <= 0 )
return [];
$collection_id = $collection->get_id();
$args = [
'meta_query' => [
[
'key' => 'collection_id',
'value' => $collection_id
]
],
'posts_per_page' => $amount
];
$items = $this->items_repository->fetch($args, [], 'OBJECT');
$thumbnails = array_map( function($item) {
$images = array();
$images['thumbnail'] = $item->get_thumbnail();
$images['document_mimetype'] = $item->get_document_mimetype();
return $images;
}, $items);
return $thumbnails;
}
/**
*
* Receive a \WP_Query or a Collection object and return both in JSON
@ -242,6 +275,10 @@ class REST_Collections_Controller extends REST_Controller {
$item_arr['url'] = get_permalink( $item_arr['id'] );
}
if(isset($request['fetch_preview_image_items']) && $request['fetch_preview_image_items'] != 0) {
$item_arr['preview_image_items'] = $this->get_preview_image_items($item, $request['fetch_preview_image_items']);
}
$total_items = wp_count_posts( $item->get_db_identifier(), 'readable' );
if (isset($total_items->publish) ||

View File

@ -29,6 +29,7 @@ class REST_Terms_Controller extends REST_Controller {
$this->terms_repository = Repositories\Terms::get_instance();
$this->taxonomy = new Entities\Taxonomy();
$this->taxonomy_repository = Repositories\Taxonomies::get_instance();
$this->items_repository = Repositories\Items::get_instance();
}
public function register_routes() {
@ -135,10 +136,10 @@ class REST_Terms_Controller extends REST_Controller {
* @return bool|\WP_Error
*/
public function create_item_permissions_check( $request ) {
$taxonomy = $this->taxonomy_repository->fetch($request['taxonomy_id']);
$taxonomy = $this->taxonomy_repository->fetch($request['taxonomy_id']);
if ($taxonomy instanceof Entities\Taxonomy) {
if ( $taxonomy->can_edit() ) {
if ($taxonomy instanceof Entities\Taxonomy) {
if ( $taxonomy->can_edit() ) {
return true;
}
@ -154,9 +155,9 @@ class REST_Terms_Controller extends REST_Controller {
}
}
}
}
}
return false;
return false;
}
/**
@ -195,11 +196,11 @@ class REST_Terms_Controller extends REST_Controller {
$taxonomy = $this->taxonomy_repository->fetch($request['taxonomy_id']);
$term = $this->terms_repository->fetch($term_id, $taxonomy);
if ($term instanceof Entities\Term) {
return $term->can_delete();
}
if ($term instanceof Entities\Term) {
return $term->can_delete();
}
return false;
return false;
}
/**
@ -264,11 +265,45 @@ class REST_Terms_Controller extends REST_Controller {
$taxonomy = $this->taxonomy_repository->fetch($request['taxonomy_id']);
$term = $this->terms_repository->fetch($term_id, $taxonomy);
if ($term instanceof Entities\Term) {
return $term->can_edit();
}
if ($term instanceof Entities\Term) {
return $term->can_edit();
}
return false;
return false;
}
/**
* @param \Tainacan\Entities\Term $term
*
* @return array
*/
private function get_preview_image_items($term, $amount) {
if($amount <= 0 )
return [];
$term_id = $term->get_id();
$taxonomy = $term->get_taxonomy();
$args = [
'tax_query' => [
[
'taxonomy' => $taxonomy,
'field' => 'term_id',
'terms' => $term_id
]
],
'posts_per_page' => $amount
];
$items = $this->items_repository->fetch($args, [], 'OBJECT');
$thumbnails = array_map( function($item) {
$images = array();
$images['thumbnail'] = $item->get_thumbnail();
$images['document_mimetype'] = $item->get_document_mimetype();
return $images;
}, $items);
return $thumbnails;
}
/**
@ -295,12 +330,17 @@ class REST_Terms_Controller extends REST_Controller {
]);
$item_arr['total_children'] = count($children);
} else {
$attributes_to_filter = $request['fetch_only'];
$item_arr = $this->filter_object_by_attributes($item, $attributes_to_filter);
}
if(isset($request['fetch_preview_image_items']) && $request['fetch_preview_image_items'] != 0) {
$item_arr['preview_image_items'] = $this->get_preview_image_items($item, $request['fetch_preview_image_items']);
}
/**
* Use this filter to add additional term_meta to the api response
* Use the $request object to get the context of the request and other variables
@ -413,11 +453,11 @@ class REST_Terms_Controller extends REST_Controller {
$taxonomy = $this->taxonomy_repository->fetch($request['taxonomy_id']);
$term = $this->terms_repository->fetch($term_id, $taxonomy);
if ($term instanceof Entities\Term) {
return $term->can_read();
}
if ($term instanceof Entities\Term) {
return $term->can_read();
}
return false;
return false;
}
/**
@ -429,9 +469,9 @@ class REST_Terms_Controller extends REST_Controller {
$endpoint_args = [];
if($method === \WP_REST_Server::READABLE) {
$endpoint_args = array_merge(
$endpoint_args,
parent::get_wp_query_params()
);
$endpoint_args,
parent::get_wp_query_params()
);
} elseif ($method === \WP_REST_Server::CREATABLE || $method === \WP_REST_Server::EDITABLE) {
$map = $this->terms_repository->get_map();

View File

@ -71,7 +71,7 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
<a
id={ isNaN(collection.id) ? collection.id : 'collection-id-' + collection.id }
href={ collection.url }>
{ !showCollectionThumbnail ?
{ ( !showCollectionThumbnail && Array.isArray(collectionItems) ) ?
<div class="collection-items-grid">
<img
src={ collectionItems[0] ? thumbHelper.getSrc(collectionItems[0]['thumbnail'], 'tainacan-medium', collectionItems[0]['document_mimetype']) :`${tainacan_blocks.base_url}/assets/images/placeholder_square.png` }
@ -107,9 +107,9 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
);
}
function setContent(){
isLoading = true;
function setContent() {
isLoading = true;
setAttributes({
isLoading: isLoading
});
@ -121,41 +121,20 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
collections = [];
let endpoint = '/collections?'+ qs.stringify({ postin: selectedCollections.map((collection) => { return collection.id }), perpage: selectedCollections.length }) + '&fetch_only=name,url,thumbnail';
let endpoint = '/collections?'+ qs.stringify({ postin: selectedCollections.map((collection) => { return collection.id }), perpage: selectedCollections.length, fetch_preview_image_items: showCollectionThumbnail ? 0 : 3 }) + '&fetch_only=name,url,thumbnail';
tainacan.get(endpoint, { cancelToken: itemsRequestSource.token })
.then(response => {
if (showCollectionThumbnail) {
for (let collection of response.data) {
collections.push(prepareItem(collection));
}
setAttributes({
content: <div></div>,
collections: collections,
isLoading: false,
itemsRequestSource: itemsRequestSource
});
} else {
let promises = [];
for (let collection of response.data) {
promises.push(
tainacan.get('/collection/' + collection.id + '/items?perpage=3&fetch_only=name,url,thumbnail')
.then(response => { return({ collection: collection, collectionItems: response.data.items }) })
.catch((error) => console.log(error))
);
}
axios.all(promises).then((results) => {
for (let result of results) {
collections.push(prepareItem(result.collection, result.collectionItems));
}
setAttributes({
content: <div></div>,
collections: collections,
isLoading: false,
itemsRequestSource: itemsRequestSource
});
})
}
for (let collection of response.data)
collections.push(prepareItem(collection, (!showCollectionThumbnail && collection.preview_image_items) ? collection.preview_image_items : []));
isLoading = false;
setAttributes({
content: <div></div>,
collections: collections,
isLoading: isLoading,
itemsRequestSource: itemsRequestSource
});
});
}

View File

@ -43,12 +43,8 @@
:
`${tainacanBaseUrl}/assets/images/placeholder_square.png`)
"
:class="maxCollectionsPerScreen <= 4 ? 'swiper-lazy' : ''"
:alt="collection.name ? collection.name : $root.__('Thumbnail', 'tainacan')">
<span v-if="!hideName">{{ collection.name ? collection.name : '' }}</span>
<div
v-if="maxCollectionsPerScreen <= 4"
class="swiper-lazy-preloader swiper-lazy-preloader-white"/>
</a>
<a
v-else
@ -299,43 +295,26 @@ export default {
this.collectionsRequestSource = axios.CancelToken.source();
let endpoint = '/collections?'+ qs.stringify({ postin: this.selectedCollections, perpage: this.selectedCollections.length }) + '&fetch_only=name,url,thumbnail';
let endpoint = '/collections?'+ qs.stringify({ postin: this.selectedCollections, perpage: this.selectedCollections.length, fetch_preview_image_items: this.showCollectionThumbnail ? 0 : 3 }) + '&fetch_only=name,url,thumbnail';
this.tainacanAxios.get(endpoint, { cancelToken: this.collectionsRequestSource.token })
.then(response => {
if (this.showCollectionThumbnail) {
for (let collection of response.data)
this.collections.push(collection);
this.isLoading = false;
} else {
let promises = [];
for (let collection of response.data) {
promises.push(
this.tainacanAxios.get('/collection/' + collection.id + '/items?perpage=3&fetch_only=name,url,thumbnail')
.then(response => { return({ collectionId: collection.id, collectionItems: response.data.items }) })
);
this.collections.push(collection);
}
axios.all(promises).then((results) => {
for (let result of results) {
this.collectionItems[result.collectionId] = result.collectionItems;
}
this.isLoading = false;
})
for (let collection of response.data) {
this.collections.push(collection);
if (!this.showCollectionThumbnail)
this.collectionItems[collection.id] = collection.preview_image_items ? collection.preview_image_items : [];
}
this.isLoading = false;
this.totalCollections = response.headers['x-wp-total'];
}).catch((error) => {
this.isLoading = false;
if (error.response && error.response.status && error.response.status == 401)
this.errorMessage = 'Not allowed to see these collections.'
if (error.response && error.response.status && error.response.status == 401)
this.errorMessage = 'Not allowed to see these collections.'
});
},
}
}

View File

@ -67,7 +67,7 @@ export default function({ attributes, setAttributes, className, isSelected, clie
<a
id={ isNaN(term.id) ? term.id : 'term-id-' + term.id }
href={ term.url }>
{ !showTermThumbnail ?
{ ( !showTermThumbnail && Array.isArray(termItems) ) ?
<div class="term-items-grid">
<img
src={ termItems[0] ? thumbHelper.getSrc(termItems[0]['thumbnail'], 'tainacan-medium', termItems[0]['document_mimetype']) :`${tainacan_blocks.base_url}/assets/images/placeholder_square.png` }
@ -93,9 +93,9 @@ export default function({ attributes, setAttributes, className, isSelected, clie
);
}
function setContent(){
isLoading = true;
function setContent() {
isLoading = true;
setAttributes({
isLoading: isLoading
});
@ -107,41 +107,20 @@ export default function({ attributes, setAttributes, className, isSelected, clie
terms = [];
let endpoint = '/taxonomy/' + taxonomyId + '/terms/?'+ qs.stringify({ hideempty: 0, include: selectedTerms.map((term) => { return term.id; }) }) + '&order=asc&fetch_only=id,name,url,header_image';
let endpoint = '/taxonomy/' + taxonomyId + '/terms/?'+ qs.stringify({ hideempty: 0, include: selectedTerms.map((term) => { return term.id; }), fetch_preview_image_items: showTermThumbnail ? 0 : 3 }) + '&order=asc';
tainacan.get(endpoint, { cancelToken: itemsRequestSource.token })
.then(response => {
if (showTermThumbnail) {
for (let term of response.data) {
terms.push(prepareItem(term));
}
setAttributes({
content: <div></div>,
terms: terms,
isLoading: false,
itemsRequestSource: itemsRequestSource
});
} else {
let promises = [];
for (let term of response.data) {
promises.push(
tainacan.get('/items/?perpage=3&fetch_only=name,url,thumbnail&taxquery[0][taxonomy]=tnc_tax_' + taxonomyId + '&taxquery[0][terms][0]=' + term.id + '&taxquery[0][compare]=IN')
.then(response => { return({ term: term, termItems: response.data.items }) })
.catch((error) => console.log(error))
);
}
axios.all(promises).then((results) => {
for (let result of results) {
terms.push(prepareItem(result.term, result.termItems));
}
setAttributes({
content: <div></div>,
terms: terms,
isLoading: false,
itemsRequestSource: itemsRequestSource
});
})
}
for (let term of response.data)
terms.push(prepareItem(term, (!showTermThumbnail && term.preview_image_items) ? term.preview_image_items : []));
isLoading = false;
setAttributes({
content: <div></div>,
terms: terms,
isLoading: isLoading,
itemsRequestSource: itemsRequestSource
});
});
}

View File

@ -31,7 +31,7 @@
:href="term.url">
<div class="term-items-grid">
<blur-hash-image
:height="termItems[term.id][2] ? $thumbHelper.getHeight(termItems[term.id][0]['thumbnail'], 'tainacan-medium') : 275"
:height="termItems[term.id][0] ? $thumbHelper.getHeight(termItems[term.id][0]['thumbnail'], 'tainacan-medium') : 275"
:width="termItems[term.id][0] ? $thumbHelper.getWidth(termItems[term.id][0]['thumbnail'], 'tainacan-medium') : 275"
:src="termItems[term.id][0] ? $thumbHelper.getSrc(termItems[term.id][0]['thumbnail'], 'tainacan-medium', termItems[term.id][0]['document_mimetype']) :`${tainacanBaseUrl}/assets/images/placeholder_square.png`"
:srcset="termItems[term.id][0] ? $thumbHelper.getSrcSet(termItems[term.id][0]['thumbnail'], 'tainacan-medium', termItems[term.id][0]['document_mimetype']) :`${tainacanBaseUrl}/assets/images/placeholder_square.png`"
@ -274,43 +274,26 @@ export default {
this.termsRequestSource = axios.CancelToken.source();
let endpoint = '/taxonomy/' + this.taxonomyId + '/terms/?'+ qs.stringify({ hideempty: 0, include: this.selectedTerms }) + '&order=asc&fetch_only=id,name,url,header_image';
let endpoint = '/taxonomy/' + this.taxonomyId + '/terms/?'+ qs.stringify({ hideempty: 0, include: this.selectedTerms, fetch_preview_image_items: this.showTermThumbnail ? 0 : 3 }) + '&order=asc';
this.tainacanAxios.get(endpoint, { cancelToken: this.termsRequestSource.token })
.then(response => {
if (this.showTermThumbnail) {
for (let term of response.data)
this.terms.push(term);
this.isLoading = false;
} else {
let promises = [];
for (let term of response.data) {
promises.push(
this.tainacanAxios.get('/items/?perpage=3&fetch_only=name,url,thumbnail&taxquery[0][taxonomy]=tnc_tax_' + this.taxonomyId + '&taxquery[0][terms][0]=' + term.id + '&taxquery[0][compare]=IN')
.then(response => { return({ termId: term.id, termItems: response.data.items }) })
);
this.terms.push(term);
}
axios.all(promises).then((results) => {
for (let result of results) {
this.termItems[result.termId] = result.termItems;
}
this.isLoading = false;
})
for (let term of response.data) {
this.terms.push(term);
if (!this.showTermThumbnail)
this.termItems[term.id] = term.preview_image_items ? term.preview_image_items : [];
}
this.isLoading = false;
this.totalTerms = response.headers['x-wp-total'];
}).catch((error) => {
this.isLoading = false;
if (error.response && error.response.status && error.response.status == 401)
this.errorMessage = 'Not allowed to see these terms.'
if (error.response && error.response.status && error.response.status == 401)
this.errorMessage = 'Not allowed to see these terms.'
});
},
}
}