tmdinosaurcenter
/
tainacan
mirror of https://github.com/tainacan/tainacan
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'develop' of https://github.com/tainacan/tainacan into develop

This commit is contained in:
vnmedeiros 2020-10-14 11:17:21 -03:00
parent fd7a56db11 1f25ed0c47
commit f5deccb9c2
12 changed files with 103 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

86
src/views/admin/components/edition/item-edition-form.vue
View File

@ -351,6 +351,20 @@
</a>
</div>
</div>
<div
v-if="form.thumbnail_id"
class="thumbnail-alt-input">
<label class="label">{{ $i18n.get('label_thumbnail_alt') }}</label>
<help-button
:title="$i18n.get('label_thumbnail_alt')"
:message="$i18n.get('info_thumbnail_alt')"/>
<b-input
type="textarea"
lazy
:placeholder="$i18n.get('instruction_thumbnail_alt')"
:value="form.thumbnail_alt ? form.thumbnail_alt : ''"
@input="onUpdateThumbnailAlt" />
</div>
</div>
<!-- Hook for extra Form options -->
@ -820,7 +834,9 @@ export default {
status: '',
document: '',
document_type: '',
comment_status: ''
comment_status: '',
thumbnail_id: '',
thumbnail_alt: ''
},
thumbnail: {},
formErrorMessage: '',
@ -988,6 +1004,7 @@ export default {
'sendItem',
'updateItem',
'updateItemDocument',
'updateThumbnailAlt',
'fetchItemMetadata',
'fetchItem',
'cleanItemMetadata',
@ -1054,6 +1071,8 @@ export default {
this.form.document = this.item.document;
this.form.document_type = this.item.document_type;
this.form.comment_status = this.item.comment_status;
this.form.thumbnail_id = this.item.thumbnail_id;
this.form.thumbnail_alt = this.item.thumbnail_alt;
this.isLoading = false;
@ -1152,6 +1171,8 @@ export default {
this.form.document = this.item.document;
this.form.document_type = this.item.document_type;
this.form.comment_status = this.item.comment_status;
this.form.thumbnail_id = this.item.thumbnail_id;
this.form.thumbnail_alt = this.item.thumbnail_alt;
// If a parameter was passed with a suggestion of item title, also send a patch to item metadata
if (this.$route.query.newitemtitle) {
@ -1297,9 +1318,10 @@ export default {
});
},
deleteThumbnail() {
this.updateThumbnail({itemId: this.itemId, thumbnailId: 0})
this.updateThumbnail({ itemId: this.itemId, thumbnailId: 0 })
.then(() => {
this.item.thumbnail = false;
this.item.thumbnail_id = null;
})
.catch((error) => {
this.$console.error(error);
@ -1372,13 +1394,19 @@ export default {
button_labels: {
frame_title: this.$i18n.get('instruction_select_item_thumbnail'),
},
thumbnail: this.form.thumbnail_id,
relatedPostId: this.itemId,
onSave: (media) => {
this.updateThumbnail({itemId: this.itemId, thumbnailId: media.id})
.then((res) => {
this.item.thumbnail = res.thumbnail;
})
.catch(error => this.$console.error(error));
this.updateThumbnail({ itemId: this.itemId, thumbnailId: media.id})
.then((res) => {
this.item.thumbnail = res.thumbnail;
this.item.thumbnail_id = res.thumbnail_id;
this.item.thumbnail_alt = res.thumbnail_alt;
this.form.thumbnail = res.thumbnail;
this.form.thumbnail_id = res.thumbnail_id;
this.form.thumbnail_alt = res.thumbnail_alt;
})
.catch(error => this.$console.error(error));
}
}
);
@ -1402,27 +1430,17 @@ export default {
);
},
// openNewAttachmentsMediaFrame() {
// const newAttachmentMediaFrame = new wpMediaFrames.customAttachmentsControl({
// existingAttachments: this.getAttachments().map((attachment) => attachment.id),
// button_labels: {
// frame_title: this.$i18n.get('instruction_select_files_to_attach_to_item'),
// frame_button_new: this.$i18n.get('label_attach_to_item'),
// frame_button_update: this.$i18n.get('finish')
// },
// relatedPostId: this.itemId,
// onSelect: (selected) => {
// console.log(selected);
// // Fetch current existing attachments
// this.isLoadingAttachments = true;
// this.fetchAttachments({ page: 1, attachmentsPerPage: 24, itemId: this.itemId, documentId: this.item.document })
// .then(() => this.isLoadingAttachments = false)
// .catch(() => this.isLoadingAttachments = false);
// }
// });
// setTimeout(() => newAttachmentMediaFrame.openModal(), 1000);
// },
onUpdateThumbnailAlt(updatedThumbnailAlt) {
this.updateThumbnailAlt({ thumbnailId: this.item.thumbnail_id, thumbnailAlt: updatedThumbnailAlt })
.then((res) => {
this.item.thumbnail_id = res.thumbnail_id;
this.item.thumbnail_alt = res.thumbnail_alt;
this.form.thumbnail_id = res.thumbnail_id;
this.form.thumbnail_alt = res.thumbnail_alt;
})
.catch(error => this.$console.error(error));
},
toggleCollapseAll() {
this.collapseAll = !this.collapseAll;
@ -1495,6 +1513,8 @@ export default {
this.form.document = this.item.document;
this.form.document_type = this.item.document_type;
this.form.comment_status = this.item.comment_status;
this.form.thumbnail_id = this.item.thumbnail_id;
this.form.thumbnail_alt = this.item.thumbnail_alt;
if (this.form.document_type != undefined && this.form.document_type == 'url')
this.urlLink = this.form.document;
@ -1758,6 +1778,16 @@ export default {
left: 90px;
bottom: 1.0em;
}
.thumbnail-alt-input {
.label {
font-size: 0.875em;
font-weight: 500;
margin-left: 15px;
margin-bottom: 0;
margin-top: 0.15em;
}
}
}
.footer {

12
src/views/admin/components/lists/items-list.vue
View File

@ -178,7 +178,7 @@
class="grid-item-thumbnail"
:style="{ backgroundImage: 'url(' + (item['thumbnail']['tainacan-medium'] ? item['thumbnail']['tainacan-medium'][0] : (item['thumbnail'].medium ? item['thumbnail'].medium[0] : thumbPlaceholderPath)) + ')' }">
<img
:alt="$i18n.get('label_thumbnail')"
:alt="item.thumbnail_alt ? item.thumbnail_alt : $i18n.get('label_thumbnail')"
:src="item['thumbnail']['tainacan-medium'] ? item['thumbnail']['tainacan-medium'][0] : (item['thumbnail'].medium ? item['thumbnail'].medium[0] : thumbPlaceholderPath)">
</a>
@ -291,7 +291,7 @@
class="tainacan-masonry-item-thumbnail"
:style="{ backgroundImage: 'url(' + (item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][0] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[0] : thumbPlaceholderPath)) + ')' }">
<img
:alt="$i18n.get('label_thumbnail')"
:alt="item.thumbnail_alt ? item.thumbnail_alt : $i18n.get('label_thumbnail')"
:src="item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][0] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[0] : thumbPlaceholderPath)">
</div>
@ -459,7 +459,7 @@
:style="{ backgroundImage: 'url(' + (item['thumbnail']['tainacan-medium'] ? item['thumbnail']['tainacan-medium'][0] : (item['thumbnail'].medium ? item['thumbnail'].medium[0] : thumbPlaceholderPath)) + ')' }"
class="card-thumbnail">
<img
:alt="$i18n.get('label_thumbnail')"
:alt="item.thumbnail_alt ? item.thumbnail_alt : $i18n.get('label_thumbnail')"
v-if="item.thumbnail != undefined"
:src="item['thumbnail']['tainacan-medium'] ? item['thumbnail']['tainacan-medium'][0] : (item['thumbnail'].medium ? item['thumbnail'].medium[0] : thumbPlaceholderPath)">
</div>
@ -650,7 +650,7 @@
<div class="list-metadata media-body">
<div class="tainacan-record-thumbnail">
<img
:alt="$i18n.get('label_thumbnail')"
:alt="item.thumbnail_alt ? item.thumbnail_alt : $i18n.get('label_thumbnail')"
v-if="item.thumbnail != undefined"
:src="item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][0] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[0] : thumbPlaceholderPath)">
</div>
@ -823,7 +823,7 @@
<span v-if="column.metadatum == 'row_thumbnail'">
<img
:alt="$i18n.get('label_thumbnail')"
:alt="item.thumbnail_alt ? item.thumbnail_alt : $i18n.get('label_thumbnail')"
class="table-thumb"
:src="item['thumbnail']['tainacan-small'] ? item['thumbnail']['tainacan-small'][0] : (item['thumbnail'].thumbnail ? item['thumbnail'].thumbnail[0] : thumbPlaceholderPath)">
</span>
@ -1028,7 +1028,7 @@
class="tainacan-list-thumbnail"
v-if="item.thumbnail != undefined">
<img
:alt="$i18n.get('label_thumbnail')"
:alt="item.thumbnail_alt ? item.thumbnail_alt : $i18n.get('label_thumbnail')"
:src="item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][0] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[0] : thumbPlaceholderPath)">
</div>
<div class="list-metadata media-body">

17
src/views/admin/js/store/modules/item/actions.js
View File

@ -279,7 +279,7 @@ export const fetchAttachments = ({ commit }, { page, attachmentsPerPage, itemId,
});
};
export const updateThumbnail = ({ commit }, { itemId, thumbnailId }) => {
export const updateThumbnail = ({ commit }, { itemId, thumbnailId, thumbnailAlt }) => {
return new Promise((resolve, reject) => {
axios.tainacan.patch('/items/' + itemId, {
_thumbnail_id: thumbnailId
@ -295,6 +295,21 @@ export const updateThumbnail = ({ commit }, { itemId, thumbnailId }) => {
});
};
export const updateThumbnailAlt = ({ commit }, { thumbnailId, thumbnailAlt }) => {
return new Promise((resolve, reject) => {
axios.wp.patch('/media/' + thumbnailId + '?force=true', {
alt_text: thumbnailAlt
}).then( res => {
let thumbnail = res.data;
commit('setLastUpdated');
resolve( thumbnail );
}).catch( error => {
reject( error );
});
});
};
// Item Submission ======================================================
export const clearItemSubmission = ({ commit }) => {
commit('clearItemSubmission');

6
src/views/admin/js/wp-media-frames.js
View File

@ -346,9 +346,9 @@ export default {
title: this.params.button_labels.frame_title,
library: wp.media.query({
type: 'image',
uploadedTo: null
}),
multiple: false,
autoSelect: true,
date: false,
priority: 20,
suggestedWidth: this.params.width,
@ -368,10 +368,10 @@ export default {
},
// Called on both skippedcrop and cropped states
setImageFromAttachment: function( attachment ) {
wp.media.view.settings.post = {
wp.media.view.settings.post.id = {
id: this.params.relatedPostId
}
this.params.attachment = attachment;
this.params.attachments = attachment;
this.params.onSave(attachment);
}

10
src/views/admin/pages/singles/item-page.vue
View File

@ -92,6 +92,16 @@
:src="thumbPlaceholderPath">
</figure>
</div>
<br>
<div
v-if="item.thumbnail_id"
class="thumbnail-alt-input">
<label class="label">{{ $i18n.get('label_thumbnail_alt') }}</label>
<help-button
:title="$i18n.get('label_thumbnail_alt')"
:message="$i18n.get('info_thumbnail_alt')"/>
<p> {{ item.thumbnail_alt }}</p>
</div>
</div>
<!-- Hook for extra Form options -->

5
src/views/tainacan-admin-i18n.php
View File

@ -169,6 +169,7 @@ return apply_filters( 'tainacan-admin-i18n', [
'label_slug' => __( 'Slug', 'tainacan' ),
'label_image' => __( 'Image', 'tainacan' ),
'label_thumbnail' => __( 'Thumbnail', 'tainacan' ),
'label_thumbnail_alt' => __( 'Thumbnail alternative text', 'tainacan' ),
'label_empty_thumbnail' => __( 'Empty Thumbnail', 'tainacan' ),
'label_empty_term_image' => __( 'Empty Term Image', 'tainacan' ),
'label_parent_collection' => __( 'Parent collection', 'tainacan' ),
@ -541,6 +542,7 @@ return apply_filters( 'tainacan-admin-i18n', [
'instruction_click_error_to_go_to_metadata' => __( 'Click on the error to go to the metadata:', 'tainacan'),
'instruction_click_to_see_or_search' => __( 'Click to see options or type to search...', 'tainacan'),
'instruction_select_one_or_more_collections' => __( 'Select one or more collections', 'tainacan'),
'instruction_thumbnail_alt' => __( 'Type here a descriptive text for the image thumbnail...', 'tainacan'),
// Info. Other feedback to user.
'info_items_tab_all' => __( 'Every published item, including those visible only to editors.', 'tainacan' ),
@ -749,7 +751,8 @@ return apply_filters( 'tainacan-admin-i18n', [
'info_thumbnail_custom' => __( 'Upload the desired image for the thumbnail', 'tainacan'),
'info_thumbnail_default_from_document' => __( 'A thumbnail will be automatically generated from the submitted document file', 'tainacan'),
'info_submission_processing' => __( 'Please, wait while the submission is being processed', 'tainacan'),
'info_submission_uploading' => __( 'Please, wait while files are uploaded', 'tainacan'),
'info_submission_uploading' => __( 'Please, wait while files are uploaded', 'tainacan'),
'info_thumbnail_alt' => __( 'The alternative text of the thumbnail is visible only by screen readers and should be usefull for users with visual impariments.', 'tainacan'),
// Datepicker months
'datepicker_month_january' => __( 'January', 'tainacan' ),

2
src/views/theme-search/components/view-mode-cards.vue
View File

@ -75,7 +75,7 @@
:style="{ backgroundImage: 'url(' + (item['thumbnail']['tainacan-medium'] ? item['thumbnail']['tainacan-medium'][0] : (item['thumbnail'].medium ? item['thumbnail'].medium[0] : thumbPlaceholderPath)) + ')' }"
class="card-thumbnail">
<img
:alt="$i18n.get('label_thumbnail')"
:alt="item.thumbnail_alt ? item.thumbnail_alt : $i18n.get('label_thumbnail')"
v-if="item.thumbnail != undefined"
:src="item['thumbnail']['tainacan-medium'] ? item['thumbnail']['tainacan-medium'][0] : (item['thumbnail'].medium ? item['thumbnail'].medium[0] : thumbPlaceholderPath)">
</div>

2
src/views/theme-search/components/view-mode-list.vue
View File

@ -78,7 +78,7 @@
class="tainacan-list-thumbnail"
v-if="item.thumbnail != undefined">
<img
:alt="$i18n.get('label_thumbnail')"
:alt="item.thumbnail_alt ? item.thumbnail_alt : $i18n.get('label_thumbnail')"
:src="item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][0] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[0] : thumbPlaceholderPath)">
</div>
<div class="list-metadata media-body">

2
src/views/theme-search/components/view-mode-masonry.vue
View File

@ -70,7 +70,7 @@
class="tainacan-masonry-item-thumbnail"
:style="{ backgroundImage: 'url(' + (item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][0] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[0] : thumbPlaceholderPath)) + ')' }">
<img
:alt="$i18n.get('label_thumbnail')"
:alt="item.thumbnail_alt ? item.thumbnail_alt : $i18n.get('label_thumbnail')"
:style="{ minHeight: getItemImageHeight(item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][1] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[1] : 120), item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][2] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[2] : 120)) + 'px'}"
:src="item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][0] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[0] : thumbPlaceholderPath)" >
</div>

2
src/views/theme-search/components/view-mode-records.vue
View File

@ -85,7 +85,7 @@
class="tainacan-record-thumbnail"
v-if="item.thumbnail != undefined">
<img
:alt="$i18n.get('label_thumbnail')"
:alt="item.thumbnail_alt ? item.thumbnail_alt : $i18n.get('label_thumbnail')"
:src="item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][0] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[0] : thumbPlaceholderPath)">
<div
:style="{

2
src/views/theme-search/components/view-mode-slideshow.vue
View File

@ -450,7 +450,7 @@ export default {
renderSlide(slideItem) {
return `<div role="listitem" class="swiper-slide tainacan-slide-item">
<img
alt="` + self.$i18n.get('label_thumbnail') + ': ' + slideItem.title + `"
alt="` + (slideItem['thumbnail_alt'] ? slideItem['thumbnail_alt'] : (self.$i18n.get('label_thumbnail') + ': ' + slideItem.title) ) + `"
class="thumbnail"
src="` + (slideItem['thumbnail']['tainacan-medium'] ? slideItem['thumbnail']['tainacan-medium'][0] : (slideItem['thumbnail']['medium']? slideItem['thumbnail']['medium'][0] : self.thumbPlaceholderPath)) + `">
</div>`;

2
src/views/theme-search/components/view-mode-table.vue
View File

@ -169,7 +169,7 @@
<span v-if="column.metadatum == 'row_thumbnail'">
<img
:alt="$i18n.get('label_thumbnail')"
:alt="item.thumbnail_alt ? item.thumbnail_alt : $i18n.get('label_thumbnail')"
class="table-thumb"
:src="item['thumbnail']['tainacan-small'] ? item['thumbnail']['tainacan-small'][0] : (item['thumbnail'].thumbnail ? item['thumbnail'].thumbnail[0] : thumbPlaceholderPath)">
<div class="skeleton"/>