{{ $i18n.get('info_upload_a_source_to_see_metadata') }}
- @@ -207,7 +219,8 @@ export default { isEditingMetadatum: false, metadatum: {}, editedMetadatum: {}, - backgroundProcess: undefined + backgroundProcess: undefined, + metadataSearchCancel: undefined } }, components: { @@ -275,22 +288,37 @@ export default { loadMetadata() { // Generates options for metadata listing this.isFetchingCollectionMetadata = true; - this.fetchMetadata({collectionId: this.collectionId, isRepositoryLevel: false, isContextEdit: false }) - .then((metadata) => { - this.collectionMetadata = JSON.parse(JSON.stringify(metadata)); - this.isFetchingCollectionMetadata = false; - this.fetchMappingImporter({ collection: this.collectionId, sessionId: this.sessionId }) - .then(res => { - if( res ) { - this.mappedCollection['mapping'] = res; - } - }) - }) - .catch((error) => { - this.$console.error(error); - this.isFetchingCollectionMetadata = false; - }); + // Cancels previous Request + if (this.metadataSearchCancel != undefined) + this.metadataSearchCancel.cancel('Metadata search Canceled.'); + + this.fetchMetadata({ + collectionId: this.collectionId, + isRepositoryLevel: false, + isContextEdit: false + }).then((resp) => { + resp.request + .then((metadata) => { + this.collectionMetadata = JSON.parse(JSON.stringify(metadata)); + this.isFetchingCollectionMetadata = false; + + this.fetchMappingImporter({ collection: this.collectionId, sessionId: this.sessionId }) + .then(res => { + if( res ) { + this.mappedCollection['mapping'] = res; + } + }) + }) + .catch((error) => { + this.$console.error(error); + this.isFetchingCollectionMetadata = false; + }); + + // Search Request Token for cancelling + this.metadataSearchCancel = resp.source; + }) + .catch(() => this.isFetchingCollectionMetadata = false); }, cancelBack(){ this.$router.go(-2); @@ -433,6 +461,11 @@ export default { this.loadImporter(); this.loadMetadata(); + }, + beforeDestroy() { + // Cancels previous Request + if (this.metadataSearchCancel != undefined) + this.metadataSearchCancel.cancel('Metadata search Canceled.'); } } @@ -490,6 +523,13 @@ export default { position: relative; } + .tainacan-form { + display: flex; + flex-direction: column; + justify-content: space-between; + min-height: 247px; + } + .form-submit { margin-top: 24px; } diff --git a/src/admin/components/edition/item-bulk-edition-form.vue b/src/admin/components/edition/item-bulk-edition-form.vue index 97fac9c69..5f6b6f8cc 100644 --- a/src/admin/components/edition/item-bulk-edition-form.vue +++ b/src/admin/components/edition/item-bulk-edition-form.vue @@ -263,7 +263,7 @@ export default { this.uploadedItems.splice(index, 1); item.errorMessage = error.data.message; - this.$toast.open({ + this.$buefy.toast.open({ message: item.errorMessage + ": " + file.name, type: 'is-danger', position: 'is-bottom', @@ -321,7 +321,7 @@ export default { }); }, deleteOneItem(itemId, index) { - this.$modal.open({ + this.$buefy.modal.open({ parent: this, component: CustomDialog, props: { diff --git a/src/admin/components/edition/item-edition-form.vue b/src/admin/components/edition/item-edition-form.vue index 8a48e8965..5b990391e 100644 --- a/src/admin/components/edition/item-edition-form.vue +++ b/src/admin/components/edition/item-edition-form.vue @@ -509,14 +509,16 @@ style="margin-left: calc(4.666667% + 12px)" type="button" class="button is-secondary" - @click.prevent="attachmentMediaFrame.openFrame($event)"> + @click.prevent="attachmentMediaFrame.openFrame($event)" + :disabled="isLoadingAttachments"> {{ $i18n.get("label_edit_attachments") }} -
+
+
+ {
+ this.setState({
+ searchCollectionName: value.target.value
+ });
+ }}
+ onChange={(value) => this.fetchCollections(value)}/>
+
+ {(
+ this.state.searchCollectionName != '' ? (
+
+ this.state.collections.length > 0 ?
+ (
+
+
+ )
+ : this.state.isLoadingCollections ? -
+ {
+ this.state.collections.map((collection) =>
+
-
+ { collection.thumbnail ?
+
+ : null + } +
{ this.toggleSelectTemporaryCollection(collection, isChecked) } } + /> +
+ )
+ }
+
+
+ ) :
+ this.state.modalCollections.length > 0 ?
+ (
+ { __('Sorry, no collections found.', 'tainacan') }
+
+
+ ) : this.state.isLoadingCollections ? -
+ {
+ this.state.modalCollections.map((collection) =>
+
-
+ { collection.thumbnail ?
+
{ this.toggleSelectTemporaryCollection(collection, isChecked) } } /> +
+ )
+ }
+ { this.state.isLoadingCollections ?
+
+ { __('Showing', 'tainacan') + " " + this.state.modalCollections.length + " " + __('of', 'tainacan') + " " + this.state.totalModalCollections + " " + __('collections', 'tainacan') + "."}
+ { + this.state.modalCollections.length < this.state.totalModalCollections ? ( + + ) : null + } +
+
+ )}
+ { __('Sorry, no collections found.', 'tainacan') }
+
+
+
+
+
+
+
+
+
+ :
+
+
+
+ );
+ },
+ save({ attributes, className }){
+ const {
+ content,
+ blockId,
+ selectedCollections,
+ arrowsPosition,
+ maxCollectionsNumber,
+ autoPlay,
+ autoPlaySpeed,
+ loopSlides,
+ hideName,
+ showCollectionThumbnail
+ } = attributes;
+ return
+
+
+
+
+
+
+
+ { isSelected ?
+ (
+
+ {/* {
+ showCollectionThumbnail = isChecked;
+ setAttributes({ showCollectionThumbnail: showCollectionThumbnail });
+ setContent();
+ }
+ }
+ /> */}
+
+
+ {
+ hideName = isChecked;
+ setAttributes({ hideName: hideName });
+ setContent();
+ }
+ }
+ />
+ {
+ loopSlides = isChecked;
+ setAttributes({ loopSlides: loopSlides });
+ }
+ }
+ />
+ {
+ autoPlay = isChecked;
+ setAttributes({ autoPlay: autoPlay });
+ }
+ }
+ />
+ {
+ autoPlay ?
+ {
+ autoPlaySpeed = aAutoPlaySpeed;
+ setAttributes( { autoPlaySpeed: aAutoPlaySpeed } )
+ }}
+ min={ 1 }
+ max={ 5 }
+ />
+ : null
+ }
+ {
+ arrowsPosition = aPosition;
+
+ setAttributes({ arrowsPosition: arrowsPosition });
+ }}/>
+
+
+
+
+
+
+ { isModalOpen ?
+ {
+ selectedCollections = selectedCollections.concat(aSelectionOfCollections.map((collection) => { return collection.id; }));
+ setAttributes({
+ selectedCollections: selectedCollections,
+ isModalOpen: false
+ });
+ setContent();
+ }}
+ onCancelSelection={ () => setAttributes({ isModalOpen: false }) }/>
+ : null
+ }
+
+ { collections.length ? (
+
+ ) : null
+ }
+
+ { !collections.length && !isLoading ? (
+
+
+ ): null
+ }
+ + + {__('List collections on a Carousel', 'tainacan')} +
+ ++ + {__('List collections on a Carousel, using search or collection selection.', 'tainacan')} +
+ + + ) : null + } + + { isLoading ? +
+
:
+
+ { isSelected && collections.length ?
+
+ }
+ {__('Warning: this is just a demonstration. To see the carousel in action, either preview or publish your post.', 'tainacan')}
+ : null
+ }
+ { collections.length ? (
+
+
+
+ ):null
+ }
+ -
+ { collections }
+
+ { content }
+
+ }
+});
\ No newline at end of file
diff --git a/src/gutenberg-blocks/tainacan-collections/collections-list/collections-list.scss b/src/gutenberg-blocks/tainacan-collections/collections-list/collections-list.scss
index c65e9d809..1b7ecfaf8 100644
--- a/src/gutenberg-blocks/tainacan-collections/collections-list/collections-list.scss
+++ b/src/gutenberg-blocks/tainacan-collections/collections-list/collections-list.scss
@@ -121,26 +121,26 @@
ul.collections-list.collections-layout-list,
ul.collections-list-edit.collections-layout-list {
padding: 0;
- display: block;
+ display: flex;
+ flex-wrap: wrap;
+ align-items: center;
list-style-type: none;
li.collection-list-item {
position: relative;
- display: inline-block;
margin: 12px 12px 24px 12px;
margin-bottom: 12px;
min-height: 54px;
- min-width: 22%;
- width: 22%;
+ min-width: calc(20% - 24px);
+ width: calc(20% - 24px);
a {
color: #454647;
- // overflow: hidden;
- // text-overflow: ellipsis;
- // white-space: nowrap;
+ height: auto;
display: flex;
align-items: center;
- height: 54px;
+ word-break: break-all;
+ word-break: break-word;
}
img {
@@ -151,6 +151,7 @@
margin-right: 20px;
}
+
a.collection-without-image img {
display: none;
}
@@ -159,31 +160,26 @@
color: #454647;
text-decoration: none;
}
+
+ @media only screen and (max-width: 1600px) {
+ min-width: calc(25% - 24px);
+ width: calc(25% - 24px);
+ }
+
+ @media only screen and (max-width: 1024px) {
+ min-width: calc(33.333% - 24px);
+ width: calc(33.333% - 24px);
+ }
+
+ @media only screen and (max-width: 768px) {
+ min-width: calc(50% - 24px);
+ width: calc(50% - 24px);
+ }
+
+ @media only screen and (max-width: 498px) {
+ min-width: calc(100% - 24px);
+ width: calc(100% - 24px);
+ }
}
}
-
- @media only screen and (max-width: 1600px) {
- ul.collections-list.collections-layout-list li.collection-list-item,
- ul.collections-list-edit.collections-layout-list li.collection-list-item {
- min-width: 30%;
- width: 30%;
- }
- }
-
- @media only screen and (max-width: 1024px) {
- ul.collections-list.collections-layout-list li.collection-list-item,
- ul.collections-list-edit.collections-layout-list li.collection-list-item {
- min-width: 45%;
- width: 45%;
- }
- }
-
- @media only screen and (max-width: 768px) {
- ul.collections-list.collections-layout-list li.collection-list-item,
- ul.collections-list-edit.collections-layout-list li.collection-list-item {
- min-width: 100%;
- width: 100%;
- }
- }
-
}
diff --git a/src/gutenberg-blocks/tainacan-collections/collections-list/collections-modal.js b/src/gutenberg-blocks/tainacan-collections/collections-list/collections-modal.js
index 9a423acbc..8ebd20a40 100644
--- a/src/gutenberg-blocks/tainacan-collections/collections-list/collections-modal.js
+++ b/src/gutenberg-blocks/tainacan-collections/collections-list/collections-modal.js
@@ -201,6 +201,7 @@ export default class CollectionsModal extends React.Component {