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

Merge branch 'develop' into feature/200

This commit is contained in:
Mateus Machado Luna 2019-12-17 17:33:17 -03:00
parent 4011e073d1 64399da8ac
commit 37344fe4b7
108 changed files with 3489 additions and 1046 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
package-lock.json generated
View File

@ -1951,9 +1951,9 @@
} }
}, },
"buefy": { "buefy": {
"version": "0.8.6", "version": "0.8.8",
"resolved": "https://registry.npmjs.org/buefy/-/buefy-0.8.6.tgz", "resolved": "https://registry.npmjs.org/buefy/-/buefy-0.8.8.tgz",
"integrity": "sha512-7woxrdwANcnJbe7lofPxkJLGRRGIVwFXOo0kzEpiNB6alQj18NV6UrdAKse+LWCOADz+AeHe5gyc6qdgRjG5mw==", "integrity": "sha512-kTUnroPBLm998KFZbeJuUgJV+nJbDUJxw1c8gzeJoe+Mve73Nb3hi6AZpgrIH8FtXmh5r8nMBYBqwN54EtPWXg==",
"requires": { "requires": {
"bulma": "0.7.5" "bulma": "0.7.5"
} }
@ -4767,9 +4767,9 @@
} }
}, },
"he": { "he": {
"version": "1.1.1", "version": "1.2.0",
"resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz", "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
"integrity": "sha1-k0EP0hsAlzUVH4howvJx80J+I/0=", "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==",
"dev": true "dev": true
}, },
"hmac-drbg": { "hmac-drbg": {
@ -5682,11 +5682,6 @@
"integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168=", "integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168=",
"dev": true "dev": true
}, },
"lodash.merge": {
"version": "4.6.2",
"resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
"integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ=="
},
"lodash.tail": { "lodash.tail": {
"version": "4.1.1", "version": "4.1.1",
"resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz", "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz",
@ -6714,9 +6709,9 @@
} }
}, },
"popper.js": { "popper.js": {
"version": "1.14.3", "version": "1.16.0",
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.14.3.tgz", "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.0.tgz",
"integrity": "sha1-FDj5jQRqz3tNeM1QK/QYrGTU8JU=" "integrity": "sha512-+G+EkOPoE5S/zChTpmBSSDYmhXJ5PsW8eMhH8cP/CQHMFPBG/kC9Y5IIw6qNYgdJ+/COf0ddY2li28iHaZRSjw=="
}, },
"portfinder": { "portfinder": {
"version": "1.0.17", "version": "1.0.17",
@ -8081,9 +8076,9 @@
} }
}, },
"sortablejs": { "sortablejs": {
"version": "1.7.0", "version": "1.10.1",
"resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.7.0.tgz", "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.10.1.tgz",
"integrity": "sha1-gKKyNwq9Vo4c7IwnETHvMKkE+ig=" "integrity": "sha512-N6r7GrVmO8RW1rn0cTdvK3JR0BcqecAJ0PmYMCL3ZuqTH3pY+9QyqkmJSkkLyyDvd+AJnwaxTP22Ybr/83V9hQ=="
}, },
"source-list-map": { "source-list-map": {
"version": "2.0.0", "version": "2.0.0",
@ -9072,13 +9067,13 @@
"dev": true "dev": true
}, },
"v-tooltip": { "v-tooltip": {
"version": "2.0.0-rc.33", "version": "2.0.2",
"resolved": "https://registry.npmjs.org/v-tooltip/-/v-tooltip-2.0.0-rc.33.tgz", "resolved": "https://registry.npmjs.org/v-tooltip/-/v-tooltip-2.0.2.tgz",
"integrity": "sha1-ePfY6cNCZWIr5lup3HjGfx3AK3M=", "integrity": "sha512-xQ+qzOFfywkLdjHknRPgMMupQNS8yJtf9Utd5Dxiu/0n4HtrxqsgDtN2MLZ0LKbburtSAQgyypuE/snM8bBZhw==",
"requires": { "requires": {
"lodash.merge": "^4.6.0", "lodash": "^4.17.11",
"popper.js": "^1.12.9", "popper.js": "^1.15.0",
"vue-resize": "^0.4.3" "vue-resize": "^0.4.5"
} }
}, },
"v8-compile-cache": { "v8-compile-cache": {
@ -9122,9 +9117,9 @@
} }
}, },
"vue": { "vue": {
"version": "2.5.17", "version": "2.6.10",
"resolved": "https://registry.npmjs.org/vue/-/vue-2.5.17.tgz", "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.10.tgz",
"integrity": "sha512-mFbcWoDIJi0w0Za4emyLiW72Jae0yjANHbCVquMKijcavBGypqlF7zHRgMa5k4sesdv7hv2rB4JPdZfR+TPfhQ==" "integrity": "sha512-ImThpeNU9HbdZL3utgMCq0oiMzAkt1mcgy3/E6zWC/G6AaQoeuFdsl9nDhTDU3X1R6FK7nsIUuRACVcjI+A2GQ=="
}, },
"vue-awesome-swiper": { "vue-awesome-swiper": {
"version": "3.1.3", "version": "3.1.3",
@ -9222,9 +9217,9 @@
"integrity": "sha512-viecHQiHVLez7HlYUQsv1wJb2MT/RDSzkDp6m3In41vPrk6OsBmT2qRE8LZqYIA4daIwrnx/Xm8h4fjOpuE3hw==" "integrity": "sha512-viecHQiHVLez7HlYUQsv1wJb2MT/RDSzkDp6m3In41vPrk6OsBmT2qRE8LZqYIA4daIwrnx/Xm8h4fjOpuE3hw=="
}, },
"vue-resize": { "vue-resize": {
"version": "0.4.4", "version": "0.4.5",
"resolved": "https://registry.npmjs.org/vue-resize/-/vue-resize-0.4.4.tgz", "resolved": "https://registry.npmjs.org/vue-resize/-/vue-resize-0.4.5.tgz",
"integrity": "sha512-Lb/cnE2N9Y42ZJPw8wpjkpuX5a9ReerWNGcQRcbNCwfCnkHG6++FurNNmLIdU8dcCTH4c5rtTPdxBqFoRMK2cQ==" "integrity": "sha512-bhP7MlgJQ8TIkZJXAfDf78uJO+mEI3CaLABLjv0WNzr4CcGRGPIAItyWYnP6LsPA4Oq0WE+suidNs6dgpO4RHg=="
}, },
"vue-router": { "vue-router": {
"version": "3.0.1", "version": "3.0.1",
@ -9242,9 +9237,9 @@
} }
}, },
"vue-template-compiler": { "vue-template-compiler": {
"version": "2.5.17", "version": "2.6.10",
"resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.5.17.tgz", "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.6.10.tgz",
"integrity": "sha512-63uI4syCwtGR5IJvZM0LN5tVsahrelomHtCxvRkZPJ/Tf3ADm1U1wG6KWycK3qCfqR+ygM5vewUvmJ0REAYksg==", "integrity": "sha512-jVZkw4/I/HT5ZMvRnhv78okGusqe0+qH2A0Em0Cp8aq78+NK9TII263CDVz2QXZsIT+yyV/gZc/j/vlwa+Epyg==",
"dev": true, "dev": true,
"requires": { "requires": {
"de-indent": "^1.0.2", "de-indent": "^1.0.2",
@ -9263,11 +9258,11 @@
"integrity": "sha512-UquSfnSWejD0zAfcD+3jJ1chUAkOAyoxya9Lxh9acCRtrlmGcAIvd0cQYraWqKenbuZJUdum+S174atv2AuEHQ==" "integrity": "sha512-UquSfnSWejD0zAfcD+3jJ1chUAkOAyoxya9Lxh9acCRtrlmGcAIvd0cQYraWqKenbuZJUdum+S174atv2AuEHQ=="
}, },
"vuedraggable": { "vuedraggable": {
"version": "2.16.0", "version": "2.23.2",
"resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-2.16.0.tgz", "resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-2.23.2.tgz",
"integrity": "sha512-fr9gcWKXMJlzbbtJcrQs4kU7qdOZqd4SEpAcx+r0nykbW8AygZN0aKVpadEtI53T8A2azhzCdXMvEqrLuKE2fA==", "integrity": "sha512-PgHCjUpxEAEZJq36ys49HfQmXglattf/7ofOzUrW2/rRdG7tu6fK84ir14t1jYv4kdXewTEa2ieKEAhhEMdwkQ==",
"requires": { "requires": {
"sortablejs": "^1.7.0" "sortablejs": "^1.10.1"
} }
}, },
"vuex": { "vuex": {

10
package.json
View File

@ -8,7 +8,7 @@
}, },
"dependencies": { "dependencies": {
"axios": "^0.19.0", "axios": "^0.19.0",
"buefy": "^0.8.6", "buefy": "^0.8.8",
"bulma": "^0.7.5", "bulma": "^0.7.5",
"mdi": "^2.2.43", "mdi": "^2.2.43",
"moment": "^2.22.2", "moment": "^2.22.2",
@ -17,13 +17,13 @@
"react": "^16.8.3", "react": "^16.8.3",
"react-dom": "^16.8.3", "react-dom": "^16.8.3",
"t": "^0.5.1", "t": "^0.5.1",
"v-tooltip": "^2.0.0-rc.33", "v-tooltip": "^2.0.2",
"vue": "^2.5.17", "vue": "^2.5.22",
"vue-awesome-swiper": "^3.1.3", "vue-awesome-swiper": "^3.1.3",
"vue-masonry-css": "^1.0.3", "vue-masonry-css": "^1.0.3",
"vue-router": "^3.0.1", "vue-router": "^3.0.1",
"vue-the-mask": "^0.11.1", "vue-the-mask": "^0.11.1",
"vuedraggable": "^2.16.0", "vuedraggable": "^2.23.2",
"vuex": "^3.0.1" "vuex": "^3.0.1"
}, },
"devDependencies": { "devDependencies": {
@ -43,7 +43,7 @@
"style-loader": "^0.23.1", "style-loader": "^0.23.1",
"terser-webpack-plugin": "^1.1.0", "terser-webpack-plugin": "^1.1.0",
"vue-loader": "^15.4.2", "vue-loader": "^15.4.2",
"vue-template-compiler": "^2.5.17", "vue-template-compiler": "^2.5.22",
"webpack": "^4.22.0", "webpack": "^4.22.0",
"webpack-bundle-analyzer": "^3.3.2", "webpack-bundle-analyzer": "^3.3.2",
"webpack-cli": "^3.1.2", "webpack-cli": "^3.1.2",

215
src/admin/components/edition/importer-mapping-form.vue
View File

@ -49,15 +49,15 @@
</template> </template>
<div <div
class="source-metadatum" class="source-metadatum"
v-for="(source_metadatum, index) of importerSourceInfo.source_metadata" v-for="(sourceMetadatum, index) of importerSourceInfo.source_metadata"
:key="index"> :key="index">
<p>{{ source_metadatum }}</p> <p>{{ sourceMetadatum }}</p>
<b-select <b-select
v-if="collectionMetadata != undefined && v-if="collectionMetadata != undefined &&
collectionMetadata.length > 0 && collectionMetadata.length > 0 &&
!isFetchingCollectionMetadata" !isFetchingCollectionMetadata"
:value="checkCurrentSelectedCollectionMetadatum(source_metadatum)" :value="checkCurrentSelectedCollectionMetadatum(sourceMetadatum)"
@input="onSelectCollectionMetadata($event, source_metadatum)" @input="onSelectCollectionMetadata($event, sourceMetadatum)"
:placeholder="$i18n.get('label_select_metadatum')"> :placeholder="$i18n.get('label_select_metadatum')">
<option :value="undefined"> <option :value="undefined">
{{ $i18n.get('label_select_metadatum') }} {{ $i18n.get('label_select_metadatum') }}
@ -193,6 +193,88 @@
</div> </div>
</form> </form>
<!-- Prompt to show title -->
<b-modal
v-if="importerSourceInfo"
:active.sync="showTitlePromptModal"
:can-cancel="false"
:width="820"
scroll="keep"
trap-focus
autofocus
role="dialog"
tabindex="-1"
aria-modal>
<form class="tainacan-modal-content tainacan-form">
<div class="tainacan-modal-title">
<h2>{{ $i18n.get('instruction_select_title_mapping') }}</h2>
<hr>
</div>
<div class="columns">
<div class="column">
<p style="margin: 12px 0px 24px 0px">{{ $i18n.get('info_title_mapping') }}</p>
<b-field>
<b-select
expanded
v-model="selectedTitle"
:placeholder="$i18n.get('label_select_metadatum')">
<option
v-for="(sourceMetadatum, index) of importerSourceInfo.source_metadata"
:key="index"
:value="index">
<span class="metadatum-name">
{{ sourceMetadatum }}
</span>
</option>
</b-select>
</b-field>
</div>
<div
style="text-align: right"
class="column">
<div
v-for="item in 4"
:key="item"
class="item-demo">
<p>{{ selectedTitle == '' || selectedTitle == undefined ? $i18n.get('label_title') : importerSourceInfo.source_metadata[selectedTitle] }}</p>
<div />
</div>
</div>
</div>
<div
style="margin-top: -24px"
class="field is-grouped form-submit">
<div class="control">
<button
class="button is-outlined"
type="button"
@click="selectedTitle = ''; showTitlePromptModal = false;">
{{ $i18n.get('cancel') }}
</button>
</div>
<div
style="margin-left: auto"
class="control">
<button
class="button is-secondary"
type="button"
@click="selectedTitle = ''; showTitlePromptModal = false; onRunImporter(true)">
{{ $i18n.get('skip') }}
</button>
</div>
<div class="control">
<button
type="submit"
class="button is-success"
@click="onConfirmTitleSelection"
:disabled="selectedTitle === '' || selectedTitle == undefined">
{{ $i18n.get('apply') }}
</button>
</div>
</div>
</form>
</b-modal>
<b-loading <b-loading
:active.sync="isLoading" :active.sync="isLoading"
:can-cancel="false"/> :can-cancel="false"/>
@ -229,7 +311,9 @@ export default {
metadatum: {}, metadatum: {},
editedMetadatum: {}, editedMetadatum: {},
backgroundProcess: undefined, backgroundProcess: undefined,
metadataSearchCancel: undefined metadataSearchCancel: undefined,
showTitlePromptModal: false,
selectedTitle: undefined
} }
}, },
components: { components: {
@ -286,6 +370,8 @@ export default {
.then(importerSourceInfo => { .then(importerSourceInfo => {
this.importerSourceInfo = importerSourceInfo; this.importerSourceInfo = importerSourceInfo;
this.mappedCollection['total_items'] = this.importerSourceInfo.source_total_items; this.mappedCollection['total_items'] = this.importerSourceInfo.source_total_items;
this.loadMetadata();
}) })
.catch((errors) => { .catch((errors) => {
this.$console.log(errors); this.$console.log(errors);
@ -307,25 +393,24 @@ export default {
isRepositoryLevel: false, isRepositoryLevel: false,
isContextEdit: false isContextEdit: false
}).then((resp) => { }).then((resp) => {
resp.request resp.request
.then((metadata) => { .then((metadata) => {
this.collectionMetadata = JSON.parse(JSON.stringify(metadata)); this.collectionMetadata = JSON.parse(JSON.stringify(metadata));
this.isFetchingCollectionMetadata = false; this.isFetchingCollectionMetadata = false;
this.fetchMappingImporter({ collection: this.collectionId, sessionId: this.sessionId }) this.fetchMappingImporter({ collection: this.collectionId, sessionId: this.sessionId })
.then(res => { .then(res => {
if( res ) { if (res)
this.mappedCollection['mapping'] = res; this.mappedCollection['mapping'] = res;
} });
}) })
}) .catch((error) => {
.catch((error) => { this.$console.error(error);
this.$console.error(error); this.isFetchingCollectionMetadata = false;
this.isFetchingCollectionMetadata = false; });
});
// Search Request Token for cancelling // Search Request Token for cancelling
this.metadataSearchCancel = resp.source; this.metadataSearchCancel = resp.source;
}) })
.catch(() => this.isFetchingCollectionMetadata = false); .catch(() => this.isFetchingCollectionMetadata = false);
}, },
@ -339,21 +424,33 @@ export default {
let val = this.mappedCollection['mapping'][metadatumId]; let val = this.mappedCollection['mapping'][metadatumId];
const { source_metadata } = this.importerSourceInfo; const { source_metadata } = this.importerSourceInfo;
if(source_metadata && source_metadata.indexOf(val) >= 0) { if (source_metadata && source_metadata.indexOf(val) >= 0)
return true; return true;
}
} }
return false; return false;
}, },
checkCurrentSelectedCollectionMetadatum(sourceMetadatum) { checkCurrentSelectedCollectionMetadatum(sourceMetadatum) {
for (let key in this.mappedCollection['mapping']) { for (let key in this.mappedCollection['mapping']) {
if(this.mappedCollection['mapping'][key] == sourceMetadatum) if (this.mappedCollection['mapping'][key] == sourceMetadatum)
return key; return key;
} }
return undefined; return undefined;
}, },
onRunImporter() { onRunImporter(skipTitleCheck) {
if (skipTitleCheck !== true) {
let coreTitleIndex = this.collectionMetadata.findIndex((metadatum) => metadatum.metadata_type == 'Tainacan\\Metadata_Types\\Core_Title');
if (coreTitleIndex >= 0 &&
this.mappedCollection &&
this.mappedCollection.mapping &&
!this.mappedCollection.mapping[this.collectionMetadata[coreTitleIndex].id]
) {
this.showTitlePromptModal = true;
return;
}
}
this.isLoadingRun = true; this.isLoadingRun = true;
this.updateImporterCollection({ sessionId: this.sessionId, collection: this.mappedCollection }) this.updateImporterCollection({ sessionId: this.sessionId, collection: this.mappedCollection })
.then(updatedImporter => { .then(updatedImporter => {
@ -433,17 +530,31 @@ export default {
this.isNewMetadatumModalActive = false; this.isNewMetadatumModalActive = false;
this.selectedMetadatumType = undefined; this.selectedMetadatumType = undefined;
// Generates options for metadata listing // Updates options for metadata listing
this.isFetchingCollectionMetadata = true; this.isFetchingCollectionMetadata = true;
this.fetchMetadata({collectionId: this.collectionId, isRepositoryLevel: false, isContextEdit: false })
.then((metadata) => { // Cancels previous Request
this.collectionMetadata = JSON.parse(JSON.stringify(metadata)); if (this.metadataSearchCancel != undefined)
this.isFetchingCollectionMetadata = false; this.metadataSearchCancel.cancel('Metadata search Canceled.');
})
.catch((error) => { this.fetchMetadata({
this.$console.error(error); collectionId: this.collectionId,
this.isFetchingCollectionMetadata = false; isRepositoryLevel: false,
}); isContextEdit: false
}).then((resp) => {
resp.request
.then((metadata) => {
this.collectionMetadata = JSON.parse(JSON.stringify(metadata));
this.isFetchingCollectionMetadata = false;
})
.catch((error) => {
this.$console.error(error);
this.isFetchingCollectionMetadata = false;
});
// Search Request Token for cancelling
this.metadataSearchCancel = resp.source;
})
.catch(() => this.isFetchingCollectionMetadata = false);
}, },
onMetadatumEditionCanceled() { onMetadatumEditionCanceled() {
// Reset variables for metadatum creation // Reset variables for metadatum creation
@ -454,6 +565,15 @@ export default {
this.isEditingMetadatum = false; this.isEditingMetadatum = false;
this.isNewMetadatumModalActive = false; this.isNewMetadatumModalActive = false;
this.selectedMetadatumType = undefined; this.selectedMetadatumType = undefined;
},
onConfirmTitleSelection(event) {
event.preventDefault();
let coreTitleIndex = this.collectionMetadata.findIndex((metadatum) => metadatum.metadata_type == 'Tainacan\\Metadata_Types\\Core_Title');
if (coreTitleIndex >= 0)
this.onSelectCollectionMetadata(this.collectionMetadata[coreTitleIndex].id, this.importerSourceInfo.source_metadata[this.selectedTitle])
this.showTitlePromptModal = false;
this.onRunImporter();
} }
}, },
created() { created() {
@ -469,7 +589,6 @@ export default {
}); });
this.loadImporter(); this.loadImporter();
this.loadMetadata();
}, },
beforeDestroy() { beforeDestroy() {
// Cancels previous Request // Cancels previous Request
@ -552,6 +671,7 @@ export default {
.source-metadatum { .source-metadatum {
padding: 2px 0; padding: 2px 0;
min-height: 35px;
border-bottom: 1px solid $gray2; border-bottom: 1px solid $gray2;
width: 100%; width: 100%;
margin-bottom: 6px; margin-bottom: 6px;
@ -600,8 +720,27 @@ export default {
} }
} }
.item-demo {
display: inline-block;
margin: 8px 12px;
p {
max-width: 74px;
font-size: 0.875rem;
color: $gray5;
margin: 4px 8px;
text-align: left;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
div {
height: 90px;
width: 90px;
background-color: $gray2;
border-radius: 2px;
}
}
</style> </style>

26
src/admin/components/lists/filters-list.vue
View File

@ -40,14 +40,12 @@
@change="handleChangeOnFilter" @change="handleChangeOnFilter"
:class="{'filters-area-receive': isDraggingFromAvailable}" :class="{'filters-area-receive': isDraggingFromAvailable}"
v-model="activeFilterList" v-model="activeFilterList"
:options="{ :group="{ name:'filters', pull: false, put: true }"
group: { name:'filters', pull: false, put: true }, :sort="(openedFilterId == '' || openedFilterId == undefined) && !isRepositoryLevel"
sort: (openedFilterId == '' || openedFilterId == undefined) && !isRepositoryLevel, :handle="'.handle'"
//disabled: openedFilterId != '' && openedFilterId != undefined, ghost-class="sortable-ghost"
handle: '.handle', filter="not-sortable-item"
ghostClass: 'sortable-ghost', :animation="250">
filter: 'not-sortable-item',
animation: '250'}">
<div <div
class="active-filter-item" class="active-filter-item"
:class="{ :class="{
@ -82,8 +80,8 @@
:class="{ :class="{
'tainacan-icon-collections': filter.collection_id == collectionId, 'tainacan-icon-collections': filter.collection_id == collectionId,
'tainacan-icon-repository': filter.collection_id != collectionId, 'tainacan-icon-repository': filter.collection_id != collectionId,
'has-text-turquoise5': filter.enabled && filter.collection_id == collectionId, 'has-text-turquoise5': filter.enabled && filter.collection_id != 'default',
'has-text-blue5': filter.enabled && filter.collection_id != collectionId, 'has-text-blue5': filter.enabled && filter.collection_id == 'default',
'has-text-gray3': !filter.enabled 'has-text-gray3': !filter.enabled
}" }"
class="tainacan-icon" /> class="tainacan-icon" />
@ -166,11 +164,9 @@
@change="handleChangeOnMetadata" @change="handleChangeOnMetadata"
v-if="availableMetadata.length > 0 && !isLoadingMetadatumTypes" v-if="availableMetadata.length > 0 && !isLoadingMetadatumTypes"
v-model="availableMetadata" v-model="availableMetadata"
:options="{ :sort="false"
sort: false, :group="{ name:'filters', pull: !isSelectingFilterType, put: false, revertClone: true }"
group: { name:'filters', pull: !isSelectingFilterType, put: false, revertClone: true }, drag-class="sortable-drag">
dragClass: 'sortable-drag'
}">
<div <div
class="available-metadatum-item" class="available-metadatum-item"
:class="{ :class="{

24
src/admin/components/lists/metadata-list.vue
View File

@ -43,15 +43,13 @@
class="active-metadata-area" class="active-metadata-area"
@change="handleChange" @change="handleChange"
:class="{'metadata-area-receive': isDraggingFromAvailable}" :class="{'metadata-area-receive': isDraggingFromAvailable}"
:options="{ :group="{ name:'metadata', pull: false, put: true }"
group: { name:'metadata', pull: false, put: true }, :sort="(openedMetadatumId == '' || openedMetadatumId == undefined) && !isRepositoryLevel"
sort: (openedMetadatumId == '' || openedMetadatumId == undefined) && !isRepositoryLevel, :handle="'.handle'"
//disabled: openedMetadatumId != '' && openedMetadatumId != undefined, ghost-class="sortable-ghost"
handle: '.handle', chosen-class="sortable-chosen"
ghostClass: 'sortable-ghost', filter="not-sortable-item"
chosenClass: 'sortable-chosen', :animation="250">
filter: 'not-sortable-item',
animation: '250'}">
<div <div
class="active-metadatum-item" class="active-metadatum-item"
:class="{ :class="{
@ -190,11 +188,9 @@
<h3 class="label has-text-secondary">{{ $i18n.get('label_available_metadata_types') }}</h3> <h3 class="label has-text-secondary">{{ $i18n.get('label_available_metadata_types') }}</h3>
<draggable <draggable
v-model="availableMetadatumList" v-model="availableMetadatumList"
:options="{ :sort="false"
sort: false, :group="{ name:'metadata', pull: 'clone', put: false, revertClone: true }"
group: { name:'metadata', pull: 'clone', put: false, revertClone: true }, drag-class="sortable-drag">
dragClass: 'sortable-drag'
}">
<div <div
@click.prevent="addMetadatumViaButton(metadatum)" @click.prevent="addMetadatumViaButton(metadatum)"
class="available-metadatum-item" class="available-metadatum-item"

28
src/admin/components/lists/processes-list.vue
View File

@ -472,23 +472,27 @@
} }
}, },
created(){ created(){
jQuery( document ).on( 'heartbeat-tick-list', ( event, data ) => { if (jQuery && jQuery( document )) {
let updatedProcesses = data.bg_process_feedback; jQuery( document ).on( 'heartbeat-tick-list', ( event, data ) => {
let updatedProcesses = data.bg_process_feedback;
for (let updatedProcess of updatedProcesses) { for (let updatedProcess of updatedProcesses) {
let updatedProcessIndex = this.processes.findIndex((aProcess) => aProcess.ID == updatedProcess.ID); let updatedProcessIndex = this.processes.findIndex((aProcess) => aProcess.ID == updatedProcess.ID);
if (updatedProcessIndex >= 0) { if (updatedProcessIndex >= 0) {
this.heartBitUpdateProcess(updatedProcess); this.heartBitUpdateProcess(updatedProcess);
}
} }
} });
});
jQuery( document ).on( 'heartbeat-tick', ( event, data ) => { jQuery( document ).on( 'heartbeat-tick', ( event, data ) => {
jQuery( document ).trigger('heartbeat-tick-list', data); jQuery( document ).trigger('heartbeat-tick-list', data);
}); });
}
}, },
beforeDestroy() { beforeDestroy() {
jQuery( document ).unbind( 'heartbeat-tick-list') if (jQuery && jQuery( document )) {
jQuery( document ).unbind( 'heartbeat-tick-list')
}
} }
} }
</script> </script>

2
src/admin/components/lists/terms-list.vue
View File

@ -530,7 +530,7 @@ export default {
color: $blue5; color: $blue5;
height: 27px; height: 27px;
font-size: 18px !important; font-size: 18px !important;
height: 2rem !important; height: auto !important;
} }
} }
a { a {

19
src/admin/components/other/processes-popup.vue
View File

@ -236,18 +236,19 @@ export default {
this.showProcessesList = false; this.showProcessesList = false;
jQuery( document ).on( 'heartbeat-tick-popup', ( event, data ) => { if (jQuery && jQuery( document )) {
this.setProcesses(data.bg_process_feedback); jQuery( document ).on( 'heartbeat-tick-popup', ( event, data ) => {
}); this.setProcesses(data.bg_process_feedback);
});
jQuery( document ).on( 'heartbeat-tick', ( event, data ) => {
jQuery( document ).trigger('heartbeat-tick-popup',data);
});
jQuery( document ).on( 'heartbeat-tick', ( event, data ) => {
jQuery( document ).trigger('heartbeat-tick-popup',data);
});
}
}, },
beforeDestroy() { beforeDestroy() {
jQuery( document ).unbind( 'heartbeat-tick-popup') if (jQuery && jQuery( document ))
jQuery( document ).unbind( 'heartbeat-tick-popup')
} }
} }
</script> </script>

5
src/admin/js/theme-main.js
View File

@ -13,6 +13,7 @@ import FilterCheckbox from '../../classes/filter-types/checkbox/Checkbox.vue';
import FilterTaginput from '../../classes/filter-types/taginput/Taginput.vue'; import FilterTaginput from '../../classes/filter-types/taginput/Taginput.vue';
import FilterTaxonomyCheckbox from '../../classes/filter-types/taxonomy/Checkbox.vue'; import FilterTaxonomyCheckbox from '../../classes/filter-types/taxonomy/Checkbox.vue';
import FilterTaxonomyTaginput from '../../classes/filter-types/taxonomy/Taginput.vue'; import FilterTaxonomyTaginput from '../../classes/filter-types/taxonomy/Taginput.vue';
import FilterDateInterval from '../../classes/filter-types/date-interval/DateInterval.vue';
import FilterNumericInterval from '../../classes/filter-types/numeric-interval/NumericInterval.vue'; import FilterNumericInterval from '../../classes/filter-types/numeric-interval/NumericInterval.vue';
import FilterNumericListInterval from '../../classes/filter-types/numeric-list-interval/NumericListInterval.vue'; import FilterNumericListInterval from '../../classes/filter-types/numeric-list-interval/NumericListInterval.vue';
@ -54,6 +55,7 @@ Vue.component('tainacan-filter-checkbox', FilterCheckbox);
Vue.component('tainacan-filter-taginput', FilterTaginput); Vue.component('tainacan-filter-taginput', FilterTaginput);
Vue.component('tainacan-filter-taxonomy-checkbox', FilterTaxonomyCheckbox); Vue.component('tainacan-filter-taxonomy-checkbox', FilterTaxonomyCheckbox);
Vue.component('tainacan-filter-taxonomy-taginput', FilterTaxonomyTaginput); Vue.component('tainacan-filter-taxonomy-taginput', FilterTaxonomyTaginput);
Vue.component('tainacan-filter-date-interval', FilterDateInterval);
Vue.component('tainacan-filter-numeric-interval', FilterNumericInterval); Vue.component('tainacan-filter-numeric-interval', FilterNumericInterval);
Vue.component('tainacan-filter-numeric-list-interval', FilterNumericListInterval); Vue.component('tainacan-filter-numeric-list-interval', FilterNumericListInterval);
@ -116,7 +118,8 @@ function listen(evnt, elem, func) {
return r; return r;
} }
else { else {
jQuery('head').append('<style>.tainacan-icon{ opacity: 1 !important; }</style>'); if (jQuery && jQuery('head'))
jQuery('head').append('<style>.tainacan-icon{ opacity: 1 !important; }</style>');
} }
} }
listen("load", window, function() { listen("load", window, function() {

9
src/admin/pages/lists/items-page.vue
View File

@ -1524,7 +1524,9 @@
this.$nextTick(() => { this.$nextTick(() => {
if (this.$refs['search-control'] != undefined) if (this.$refs['search-control'] != undefined)
this.searchControlHeight = this.$refs['search-control'] ? this.$refs['search-control'].clientHeight + this.$refs['search-control'].offsetTop : 0; this.searchControlHeight = this.$refs['search-control'] ? this.$refs['search-control'].clientHeight + this.$refs['search-control'].offsetTop : 0;
this.isFiltersMenuCompressed = jQuery(window).width() <= 768;
if (jQuery && jQuery(window))
this.isFiltersMenuCompressed = jQuery(window).width() <= 768;
}); });
}, 500), }, 500),
removeEventListeners() { removeEventListeners() {
@ -1773,7 +1775,6 @@
.filters-menu { .filters-menu {
position: relative; position: relative;
z-index: 10; z-index: 10;
background-color: white;
width: $filter-menu-width; width: $filter-menu-width;
min-width: 180px; min-width: 180px;
min-height: 100%; min-height: 100%;
@ -1815,7 +1816,7 @@
color: $blue5; color: $blue5;
height: 27px; height: 27px;
font-size: 1.125rem !important; font-size: 1.125rem !important;
height: 2rem !important; height: auto !important;
} }
margin-bottom: 5px; margin-bottom: 5px;
} }
@ -1983,7 +1984,7 @@
color: $blue5; color: $blue5;
height: 27px; height: 27px;
font-size: 1.125rem !important; font-size: 1.125rem !important;
height: 2rem !important; height: auto !important;
} }
} }
a { a {

11
src/admin/pages/lists/term-items-page.vue
View File

@ -1447,9 +1447,11 @@
}, },
adjustSearchControlHeight: _.debounce( function() { adjustSearchControlHeight: _.debounce( function() {
this.$nextTick(() => { this.$nextTick(() => {
if (this.$refs['search-control'] != undefined) if (this.$refs['search-control'] != undefined)
this.searchControlHeight = this.$refs['search-control'] ? this.$refs['search-control'].clientHeight + this.$refs['search-control'].offsetTop : 0; this.searchControlHeight = this.$refs['search-control'] ? this.$refs['search-control'].clientHeight + this.$refs['search-control'].offsetTop : 0;
this.isFiltersMenuCompressed = jQuery(window).width() <= 768;
if (jQuery && jQuery(window))
this.isFiltersMenuCompressed = jQuery(window).width() <= 768;
}); });
}, 500), }, 500),
removeEventListeners() { removeEventListeners() {
@ -1688,7 +1690,6 @@
.filters-menu { .filters-menu {
position: relative; position: relative;
z-index: 10; z-index: 10;
background-color: white;
width: $filter-menu-width; width: $filter-menu-width;
min-width: 180px; min-width: 180px;
min-height: 100%; min-height: 100%;
@ -1730,7 +1731,7 @@
color: $blue5; color: $blue5;
height: 27px; height: 27px;
font-size: 1.125rem !important; font-size: 1.125rem !important;
height: 2rem !important; height: auto !important;
} }
margin-bottom: 5px; margin-bottom: 5px;
} }
@ -1899,7 +1900,7 @@
color: $blue5; color: $blue5;
height: 27px; height: 27px;
font-size: 1.125rem !important; font-size: 1.125rem !important;
height: 2rem !important; height: auto !important;
} }
} }
a { a {

7
src/admin/scss/_buttons.scss
View File

@ -37,8 +37,8 @@ button.link-style:active {
&.is-success:hover, &.is-success:focus { &.is-success:hover, &.is-success:focus {
background: $success !important; background: $success !important;
} }
&.is-white:hover, &.is-white:focus, &.is-outlined:hover, &.is-outlined:focus { &.is-white, &.is-white:hover, &.is-white:focus, &.is-outlined:hover, &.is-outlined:focus {
background: $white !important; background-color: transparent !important;
} }
&:active { &:active {
-webkit-transform: none !important; -webkit-transform: none !important;
@ -68,7 +68,8 @@ button.link-style:active {
background-color: white !important; background-color: white !important;
} }
&.is-white[disabled] { &.is-white[disabled] {
background-color: white !important; background-color: transparent !important;
opacity: 0.85;
} }
} }
.button.is-small { .button.is-small {

25
src/admin/scss/_dropdown-and-autocomplete.scss
View File

@ -97,6 +97,9 @@
max-height: unset !important; max-height: unset !important;
} }
} }
.taginput.is-expanded {
width: 100%;
}
.taginput-container .mdi-magnify::before, .taginput-container .mdi-magnify::before,
.autocomplete .mdi-magnify::before { .autocomplete .mdi-magnify::before {
content: 'search'; content: 'search';
@ -109,11 +112,12 @@
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
font-size: 20px; font-size: 20px;
text-transform: none !important;
} }
.taginput-container { .taginput-container {
padding: 0px !important; padding: 0px !important;
background-color: white !important; background-color: transparent !important;
&:focus, &:active { &:focus, &:active {
border: none !important; border: none !important;
@ -204,6 +208,23 @@
} }
} }
// Not working yet, as we don't have this icon.
// .dropdown-trigger {
// span.icon>i.mdi-calendar-today::before{
// display: inline-block;
// font: normal normal normal 20px/1 "TainacanIcons";
// font-size: inherit;
// text-rendering: auto;
// vertical-align: middle;
// line-height: inherit;
// -webkit-font-smoothing: antialiased;
// -moz-osx-font-smoothing: grayscale;
// content: 'calendar';
// text-transform: none !important;
// letter-spacing: normal !important;
// }
// }
.dropdown-menu { .dropdown-menu {
background: transparent; background: transparent;
border: none; border: none;
@ -224,6 +245,8 @@
line-height: inherit; line-height: inherit;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
text-transform: none !important;
letter-spacing: normal !important;
color: $secondary; color: $secondary;
} }

1
src/admin/scss/_filters-menu-modal.scss
View File

@ -1,4 +1,5 @@
#filters-mobile-modal { #filters-mobile-modal {
background-color: white;
.modal-close { .modal-close {
right: calc(8.3333333% + 20px); right: calc(8.3333333% + 20px);

24
src/admin/scss/_inputs.scss
View File

@ -1,17 +1,37 @@
.input, .textarea { input[type="color"].input,
input[type="date"].input,
input[type="datetime-local"].input,
input[type="datetime"].input,
input[type="email"].input,
input[type="number"].input,
input[type="month"].input,
input[type="password"].input,
input[type="search"].input,
input[type="tel"].input,
input[type="text"].input,
input[type="time"].input,
input[type="url"].input,
input[type="week"].input,
input.input,
.input,
textarea.textarea,
.textarea {
font-size: 0.875rem; font-size: 0.875rem;
border-radius: 1px !important; border-radius: 1px !important;
box-shadow: none !important; box-shadow: none !important;
background-color: white; background-color: white;
border: 1px solid $gray2; border: 1px solid $gray2;
color: $tainacan-input-color; color: $tainacan-input-color;
transition: background-color 0.1s, border 0.3s; transition: background-color 0.1s ease, border-color 0.3s ease;
&:focus, &:active { &:focus, &:active {
box-shadow: none !important; box-shadow: none !important;
background-color: white; background-color: white;
border: 1px solid $gray4 !important; border: 1px solid $gray4 !important;
} }
&:hover {
border: 1px solid $gray3;
}
&[disabled] { &[disabled] {
color: $gray4 !important; color: $gray4 !important;
background-color: $gray2 !important; background-color: $gray2 !important;

2
src/admin/scss/_pagination.scss
View File

@ -115,6 +115,8 @@
line-height: inherit; line-height: inherit;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
text-transform: none !important;
letter-spacing: normal !important;
} }
.mdi-chevron-left::before { .mdi-chevron-left::before {
content: "arrowleft" !important; content: "arrowleft" !important;

8
src/admin/scss/_selects.scss
View File

@ -6,24 +6,26 @@
height: 30px; height: 30px;
} }
select { select {
background: transparent; // WordPress 5.3 adds arrows here
border: none; border: none;
border-radius: 1px !important; border-radius: 1px !important;
font-weight: normal; font-weight: normal;
font-size: 0.875rem !important; font-size: 0.875rem !important;
min-height: 30px !important;
height: 30px !important; height: 30px !important;
padding: 2px 25px 2px 15px!important; padding: 2px 25px 2px 15px!important;
margin-top: 0px !important; margin-top: 0px !important;
margin-bottom: 0px !important; margin-bottom: 0px !important;
color: $tainacan-input-color; color: $tainacan-input-color;
option:checked, option:hover { option:checked, option:hover {
background-color: $gray2 !important; background: $gray2 !important;
} }
&:focus, &:active { &:focus, &:active {
box-shadow: none !important; box-shadow: none !important;
text-decoration: none !important; text-decoration: none !important;
} }
&[disabled=disabled] { &[disabled=disabled] {
background-color: white !important; background: $gray1 !important;
} }
} }
&:not(.is-loading)::after { &:not(.is-loading)::after {
@ -37,6 +39,8 @@
display: flex !important; display: flex !important;
align-items: initial; align-items: initial;
margin-top: -10px !important; margin-top: -10px !important;
text-transform: none !important;
letter-spacing: normal !important;
} }
&.is-loading.is-small::after { &.is-loading.is-small::after {
font-size: 0.875rem; font-size: 0.875rem;

2
src/admin/scss/_tainacan-form.scss
View File

@ -85,6 +85,8 @@
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
transform: none !important; transform: none !important;
text-transform: none !important;
letter-spacing: normal !important;
font-size: 20px; font-size: 20px;
margin-top: -2px; margin-top: -2px;
} }

1
src/admin/scss/_view-mode-cards.scss
View File

@ -136,6 +136,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
} }
} }

1
src/admin/scss/_view-mode-masonry.scss
View File

@ -113,6 +113,7 @@
text-align: left !important; text-align: left !important;
margin-bottom: 0 !important; margin-bottom: 0 !important;
word-break: break-word; word-break: break-word;
margin: 0;
} }
} }

1
src/admin/scss/_view-mode-records.scss
View File

@ -109,6 +109,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
margin: 0;
transition: background-color 0.3s; transition: background-color 0.3s;
} }
} }

4
src/admin/tainacan-admin-i18n.php
View File

@ -84,6 +84,7 @@ return apply_filters( 'tainacan-admin-i18n', [
'clear_radio' => __( 'Clear selected radio', 'tainacan' ), 'clear_radio' => __( 'Clear selected radio', 'tainacan' ),
'undo' => __( 'Undo', 'tainacan' ), 'undo' => __( 'Undo', 'tainacan' ),
'delete' => __( 'Delete', 'tainacan' ), 'delete' => __( 'Delete', 'tainacan' ),
'skip' => __( 'Skip', 'tainacan' ),
// Wordpress Status // Wordpress Status
'status_publish' => __( 'Publish', 'tainacan' ), 'status_publish' => __( 'Publish', 'tainacan' ),
@ -492,7 +493,7 @@ return apply_filters( 'tainacan-admin-i18n', [
'instruction_type_value_year' => __( 'Type year value', 'tainacan' ), 'instruction_type_value_year' => __( 'Type year value', 'tainacan' ),
'instruction_select_the_amount_of_copies' => __( 'Select the amount of copies of the item that you want to create', 'tainacan'), 'instruction_select_the_amount_of_copies' => __( 'Select the amount of copies of the item that you want to create', 'tainacan'),
'instruction_select_a_interval' => __( 'Select an interval', 'tainacan'), 'instruction_select_a_interval' => __( 'Select an interval', 'tainacan'),
'instruction_select_title_mapping' => __( 'Before runnning import, consider selecting the title source metadata', 'tainacan'),
// Info. Other feedback to user. // Info. Other feedback to user.
'info_items_tab_all' => __( 'Every published item, including those visible only to editors.', 'tainacan' ), 'info_items_tab_all' => __( 'Every published item, including those visible only to editors.', 'tainacan' ),
@ -672,6 +673,7 @@ return apply_filters( 'tainacan-admin-i18n', [
'info_initial_value' => __( 'Initial value', 'tainacan' ), 'info_initial_value' => __( 'Initial value', 'tainacan' ),
'info_final_value' => __( 'Final value', 'tainacan' ), 'info_final_value' => __( 'Final value', 'tainacan' ),
'info_show_interval_on_tag' => __( 'Show applied interval on tags', 'tainacan' ), 'info_show_interval_on_tag' => __( 'Show applied interval on tags', 'tainacan' ),
'info_title_mapping' => __( 'The title is the most relevant metadata, that shall identify your item on lists for different view modes. Select the title source metadata first, or skip to run importer as it is.', 'taincan'),
// Datepicker months // Datepicker months
'datepicker_month_january' => __( 'January', 'tainacan' ), 'datepicker_month_january' => __( 'January', 'tainacan' ),

3
src/assets/css/fonts/tainacanicons.css
View File

@ -20,8 +20,11 @@
text-rendering: auto; text-rendering: auto;
vertical-align: middle; vertical-align: middle;
line-height: inherit; line-height: inherit;
text-transform: none !important;
letter-spacing: normal !important;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
.tainacan-icon-pdf:before { .tainacan-icon-pdf:before {

35
src/assets/css/tainacan-gutenberg-block-carousel-collections-list.css
View File

@ -3,6 +3,7 @@
.block-control { .block-control {
display: flex; display: flex;
flex-wrap: wrap;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -22,15 +23,21 @@
position: relative; position: relative;
fill: #555758; } fill: #555758; }
.components-placeholder__fieldset p { .components-placeholder {
font-size: 0.875rem !important; margin-bottom: 0;
margin-top: -2px; background: #f6f6f6; }
fill: #555758; } .components-placeholder .components-placeholder__label {
.components-placeholder__fieldset p svg { margin-bottom: 0; }
margin-right: 1rem; .components-placeholder .components-placeholder__fieldset p {
top: 4px; font-size: 0.875rem !important;
position: relative; margin: 12px 0;
color: #454647;
fill: #555758; } fill: #555758; }
.components-placeholder .components-placeholder__fieldset p svg {
margin-right: 1rem;
top: 4px;
position: relative;
fill: #555758; }
.wp-block-tainacan-modal { .wp-block-tainacan-modal {
width: 50%; } width: 50%; }
@ -111,6 +118,9 @@
.wp-block-tainacan-modal .modal-checkbox-list .components-base-control, .wp-block-tainacan-modal .modal-checkbox-list .components-base-control,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control { .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control {
overflow: hidden; } overflow: hidden; }
.wp-block-tainacan-modal .modal-checkbox-list svg.dashicon.components-checkbox-control__checked,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field svg.dashicon.components-checkbox-control__checked {
fill: black; }
.wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item,
.wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option, .wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item,
@ -226,7 +236,7 @@
background: #f2f2f2; } background: #f2f2f2; }
.wp-block-tainacan-carousel-collections-list { .wp-block-tainacan-carousel-collections-list {
margin: 2rem 0px; } margin: 2rem auto; }
.wp-block-tainacan-carousel-collections-list .spinner-container { .wp-block-tainacan-carousel-collections-list .spinner-container {
min-height: 56px; min-height: 56px;
padding: 1rem; padding: 1rem;
@ -282,7 +292,7 @@
text-decoration: none; text-decoration: none;
padding: 8px 16px; padding: 8px 16px;
display: block; display: block;
line-height: 1.2rem; } line-height: 1.2em; }
.wp-block-tainacan-carousel-collections-list .tainacan-carousel .swiper-container a > img { .wp-block-tainacan-carousel-collections-list .tainacan-carousel .swiper-container a > img {
width: 100%; width: 100%;
height: auto; } height: auto; }
@ -298,7 +308,8 @@
display: grid; display: grid;
grid-template-columns: 33% 33% 33%; grid-template-columns: 33% 33% 33%;
grid-template-rows: 50% 50%; grid-template-rows: 50% 50%;
width: 100%; } width: 100%;
box-sizing: border-box; }
.wp-block-tainacan-carousel-collections-list .tainacan-carousel .swiper-container .swiper-slide.collection-list-item-grid .collection-items-grid img:first-of-type { .wp-block-tainacan-carousel-collections-list .tainacan-carousel .swiper-container .swiper-slide.collection-list-item-grid .collection-items-grid img:first-of-type {
flex-basis: 100%; flex-basis: 100%;
-ms-grid-column: 1; -ms-grid-column: 1;
@ -331,6 +342,8 @@
margin: 0 -4px; } margin: 0 -4px; }
.wp-block-tainacan-carousel-collections-list .swiper-button-prev svg, .wp-block-tainacan-carousel-collections-list .swiper-button-next svg { .wp-block-tainacan-carousel-collections-list .swiper-button-prev svg, .wp-block-tainacan-carousel-collections-list .swiper-button-next svg {
fill: #298596; } fill: #298596; }
.wp-block-tainacan-carousel-collections-list.alignfull .swiper-button-prev, .wp-block-tainacan-carousel-collections-list .swiper-button-next {
margin: 0 6px; }
.wp-block-tainacan-carousel-collections-list .collections-list-edit-container, .wp-block-tainacan-carousel-collections-list .collections-list-edit-container,
.wp-block-tainacan-carousel-collections-list .tainacan-carousel { .wp-block-tainacan-carousel-collections-list .tainacan-carousel {
position: relative; } position: relative; }

2
src/assets/css/tainacan-gutenberg-block-carousel-collections-list.css.map
View File

File diff suppressed because one or more lines are too long

35
src/assets/css/tainacan-gutenberg-block-carousel-items-list.css
View File

@ -3,6 +3,7 @@
.block-control { .block-control {
display: flex; display: flex;
flex-wrap: wrap;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -22,15 +23,21 @@
position: relative; position: relative;
fill: #555758; } fill: #555758; }
.components-placeholder__fieldset p { .components-placeholder {
font-size: 0.875rem !important; margin-bottom: 0;
margin-top: -2px; background: #f6f6f6; }
fill: #555758; } .components-placeholder .components-placeholder__label {
.components-placeholder__fieldset p svg { margin-bottom: 0; }
margin-right: 1rem; .components-placeholder .components-placeholder__fieldset p {
top: 4px; font-size: 0.875rem !important;
position: relative; margin: 12px 0;
color: #454647;
fill: #555758; } fill: #555758; }
.components-placeholder .components-placeholder__fieldset p svg {
margin-right: 1rem;
top: 4px;
position: relative;
fill: #555758; }
.wp-block-tainacan-modal { .wp-block-tainacan-modal {
width: 50%; } width: 50%; }
@ -111,6 +118,9 @@
.wp-block-tainacan-modal .modal-checkbox-list .components-base-control, .wp-block-tainacan-modal .modal-checkbox-list .components-base-control,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control { .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control {
overflow: hidden; } overflow: hidden; }
.wp-block-tainacan-modal .modal-checkbox-list svg.dashicon.components-checkbox-control__checked,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field svg.dashicon.components-checkbox-control__checked {
fill: black; }
.wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item,
.wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option, .wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item,
@ -159,7 +169,7 @@
color: #454647; } color: #454647; }
.wp-block-tainacan-carousel-items-list { .wp-block-tainacan-carousel-items-list {
margin: 2rem 0px; } margin: 2rem auto; }
.wp-block-tainacan-carousel-items-list .spinner-container { .wp-block-tainacan-carousel-items-list .spinner-container {
min-height: 56px; min-height: 56px;
padding: 1rem; padding: 1rem;
@ -225,12 +235,13 @@
.wp-block-tainacan-carousel-items-list .carousel-items-collection-header .collection-name h3 { .wp-block-tainacan-carousel-items-list .carousel-items-collection-header .collection-name h3 {
color: white; color: white;
text-decoration: none; text-decoration: none;
font-size: 1.3rem; } font-size: 1.3em;
margin: 0; }
.wp-block-tainacan-carousel-items-list .carousel-items-collection-header .collection-name h3:hover { .wp-block-tainacan-carousel-items-list .carousel-items-collection-header .collection-name h3:hover {
text-decoration: none; } text-decoration: none; }
.wp-block-tainacan-carousel-items-list .carousel-items-collection-header .collection-name span.label { .wp-block-tainacan-carousel-items-list .carousel-items-collection-header .collection-name span.label {
font-weight: normal; font-weight: normal;
font-size: 1rem; } font-size: 0.75em; }
.wp-block-tainacan-carousel-items-list .carousel-items-collection-header .collection-name.only-collection-name { .wp-block-tainacan-carousel-items-list .carousel-items-collection-header .collection-name.only-collection-name {
justify-content: center; justify-content: center;
padding: 1rem; } padding: 1rem; }
@ -287,7 +298,7 @@
text-decoration: none; text-decoration: none;
padding: 8px 16px; padding: 8px 16px;
display: block; display: block;
line-height: 1.2rem; } line-height: 1.2em; }
.wp-block-tainacan-carousel-items-list .tainacan-carousel .swiper-container a > img { .wp-block-tainacan-carousel-items-list .tainacan-carousel .swiper-container a > img {
width: 100%; width: 100%;
height: auto; } height: auto; }

2
src/assets/css/tainacan-gutenberg-block-carousel-items-list.css.map
View File

File diff suppressed because one or more lines are too long

32
src/assets/css/tainacan-gutenberg-block-carousel-terms-list.css
View File

@ -3,6 +3,7 @@
.block-control { .block-control {
display: flex; display: flex;
flex-wrap: wrap;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -22,15 +23,21 @@
position: relative; position: relative;
fill: #555758; } fill: #555758; }
.components-placeholder__fieldset p { .components-placeholder {
font-size: 0.875rem !important; margin-bottom: 0;
margin-top: -2px; background: #f6f6f6; }
fill: #555758; } .components-placeholder .components-placeholder__label {
.components-placeholder__fieldset p svg { margin-bottom: 0; }
margin-right: 1rem; .components-placeholder .components-placeholder__fieldset p {
top: 4px; font-size: 0.875rem !important;
position: relative; margin: 12px 0;
color: #454647;
fill: #555758; } fill: #555758; }
.components-placeholder .components-placeholder__fieldset p svg {
margin-right: 1rem;
top: 4px;
position: relative;
fill: #555758; }
.wp-block-tainacan-modal { .wp-block-tainacan-modal {
width: 50%; } width: 50%; }
@ -111,6 +118,9 @@
.wp-block-tainacan-modal .modal-checkbox-list .components-base-control, .wp-block-tainacan-modal .modal-checkbox-list .components-base-control,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control { .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control {
overflow: hidden; } overflow: hidden; }
.wp-block-tainacan-modal .modal-checkbox-list svg.dashicon.components-checkbox-control__checked,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field svg.dashicon.components-checkbox-control__checked {
fill: black; }
.wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item,
.wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option, .wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item,
@ -226,7 +236,7 @@
background: #f2f2f2; } background: #f2f2f2; }
.wp-block-tainacan-carousel-terms-list { .wp-block-tainacan-carousel-terms-list {
margin: 2rem 0px; } margin: 2rem auto; }
.wp-block-tainacan-carousel-terms-list .spinner-container { .wp-block-tainacan-carousel-terms-list .spinner-container {
min-height: 56px; min-height: 56px;
padding: 1rem; padding: 1rem;
@ -282,7 +292,7 @@
text-decoration: none; text-decoration: none;
padding: 8px 16px; padding: 8px 16px;
display: block; display: block;
line-height: 1.2rem; } line-height: 1.2em; }
.wp-block-tainacan-carousel-terms-list .tainacan-carousel .swiper-container a > img { .wp-block-tainacan-carousel-terms-list .tainacan-carousel .swiper-container a > img {
width: 100%; width: 100%;
height: auto; } height: auto; }
@ -331,6 +341,8 @@
margin: 0 -4px; } margin: 0 -4px; }
.wp-block-tainacan-carousel-terms-list .swiper-button-prev svg, .wp-block-tainacan-carousel-terms-list .swiper-button-next svg { .wp-block-tainacan-carousel-terms-list .swiper-button-prev svg, .wp-block-tainacan-carousel-terms-list .swiper-button-next svg {
fill: #298596; } fill: #298596; }
.wp-block-tainacan-carousel-terms-list.alignfull .swiper-button-prev, .wp-block-tainacan-carousel-terms-list .swiper-button-next {
margin: 0 6px; }
.wp-block-tainacan-carousel-terms-list .terms-list-edit-container, .wp-block-tainacan-carousel-terms-list .terms-list-edit-container,
.wp-block-tainacan-carousel-terms-list .tainacan-carousel { .wp-block-tainacan-carousel-terms-list .tainacan-carousel {
position: relative; } position: relative; }

2
src/assets/css/tainacan-gutenberg-block-carousel-terms-list.css.map
View File

File diff suppressed because one or more lines are too long

33
src/assets/css/tainacan-gutenberg-block-collections-list.css
View File

@ -3,6 +3,7 @@
.block-control { .block-control {
display: flex; display: flex;
flex-wrap: wrap;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -22,15 +23,21 @@
position: relative; position: relative;
fill: #555758; } fill: #555758; }
.components-placeholder__fieldset p { .components-placeholder {
font-size: 0.875rem !important; margin-bottom: 0;
margin-top: -2px; background: #f6f6f6; }
fill: #555758; } .components-placeholder .components-placeholder__label {
.components-placeholder__fieldset p svg { margin-bottom: 0; }
margin-right: 1rem; .components-placeholder .components-placeholder__fieldset p {
top: 4px; font-size: 0.875rem !important;
position: relative; margin: 12px 0;
color: #454647;
fill: #555758; } fill: #555758; }
.components-placeholder .components-placeholder__fieldset p svg {
margin-right: 1rem;
top: 4px;
position: relative;
fill: #555758; }
.wp-block-tainacan-modal { .wp-block-tainacan-modal {
width: 50%; } width: 50%; }
@ -111,6 +118,9 @@
.wp-block-tainacan-modal .modal-checkbox-list .components-base-control, .wp-block-tainacan-modal .modal-checkbox-list .components-base-control,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control { .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control {
overflow: hidden; } overflow: hidden; }
.wp-block-tainacan-modal .modal-checkbox-list svg.dashicon.components-checkbox-control__checked,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field svg.dashicon.components-checkbox-control__checked {
fill: black; }
.wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item,
.wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option, .wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item,
@ -159,10 +169,15 @@
color: #454647; } color: #454647; }
.wp-block-tainacan-collections-list { .wp-block-tainacan-collections-list {
margin: 2rem 0px; } margin: 2rem auto; }
.wp-block-tainacan-collections-list .components-spinner { .wp-block-tainacan-collections-list .components-spinner {
position: absolute; position: absolute;
right: 0; } right: 0; }
.wp-block-tainacan-collections-list ul.collections-list li.collection-list-item > button,
.wp-block-tainacan-collections-list ul.collections-list li.collection-list-item > button:hover {
display: none;
visibility: hidden;
opacity: 0; }
.wp-block-tainacan-collections-list ul.collections-list.collections-list-without-margin, .wp-block-tainacan-collections-list ul.collections-list.collections-list-without-margin,
.wp-block-tainacan-collections-list ul.collections-list-edit.collections-list-without-margin { .wp-block-tainacan-collections-list ul.collections-list-edit.collections-list-without-margin {
grid-template-columns: repeat(auto-fill, 185px); grid-template-columns: repeat(auto-fill, 185px);

2
src/assets/css/tainacan-gutenberg-block-collections-list.css.map
View File

File diff suppressed because one or more lines are too long

517
src/assets/css/tainacan-gutenberg-block-dynamic-items-list.css
View File

@ -3,6 +3,7 @@
.block-control { .block-control {
display: flex; display: flex;
flex-wrap: wrap;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -22,15 +23,21 @@
position: relative; position: relative;
fill: #555758; } fill: #555758; }
.components-placeholder__fieldset p { .components-placeholder {
font-size: 0.875rem !important; margin-bottom: 0;
margin-top: -2px; background: #f6f6f6; }
fill: #555758; } .components-placeholder .components-placeholder__label {
.components-placeholder__fieldset p svg { margin-bottom: 0; }
margin-right: 1rem; .components-placeholder .components-placeholder__fieldset p {
top: 4px; font-size: 0.875rem !important;
position: relative; margin: 12px 0;
color: #454647;
fill: #555758; } fill: #555758; }
.components-placeholder .components-placeholder__fieldset p svg {
margin-right: 1rem;
top: 4px;
position: relative;
fill: #555758; }
.wp-block-tainacan-modal { .wp-block-tainacan-modal {
width: 50%; } width: 50%; }
@ -111,6 +118,9 @@
.wp-block-tainacan-modal .modal-checkbox-list .components-base-control, .wp-block-tainacan-modal .modal-checkbox-list .components-base-control,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control { .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control {
overflow: hidden; } overflow: hidden; }
.wp-block-tainacan-modal .modal-checkbox-list svg.dashicon.components-checkbox-control__checked,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field svg.dashicon.components-checkbox-control__checked {
fill: black; }
.wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item,
.wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option, .wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item,
@ -159,7 +169,7 @@
color: #454647; } color: #454647; }
.wp-block-tainacan-dynamic-items-list { .wp-block-tainacan-dynamic-items-list {
margin: 2rem 0px; } margin: 2rem auto; }
.wp-block-tainacan-dynamic-items-list .spinner-container { .wp-block-tainacan-dynamic-items-list .spinner-container {
min-height: 56px; min-height: 56px;
padding: 1rem; padding: 1rem;
@ -167,6 +177,8 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
color: #555758; } color: #555758; }
.wp-block-tainacan-dynamic-items-list:hover .components-resizable-box__handle {
display: block; }
@-webkit-keyframes skeleton-animation { @-webkit-keyframes skeleton-animation {
0% { 0% {
opacity: 1.0; } opacity: 1.0; }
@ -224,12 +236,13 @@
.wp-block-tainacan-dynamic-items-list .dynamic-items-collection-header .collection-name h3 { .wp-block-tainacan-dynamic-items-list .dynamic-items-collection-header .collection-name h3 {
color: white; color: white;
text-decoration: none; text-decoration: none;
font-size: 1.3rem; } font-size: 1.3em;
margin: 0; }
.wp-block-tainacan-dynamic-items-list .dynamic-items-collection-header .collection-name h3:hover { .wp-block-tainacan-dynamic-items-list .dynamic-items-collection-header .collection-name h3:hover {
text-decoration: none; } text-decoration: none; }
.wp-block-tainacan-dynamic-items-list .dynamic-items-collection-header .collection-name span.label { .wp-block-tainacan-dynamic-items-list .dynamic-items-collection-header .collection-name span.label {
font-weight: normal; font-weight: normal;
font-size: 1rem; } font-size: 0.75em; }
.wp-block-tainacan-dynamic-items-list .dynamic-items-collection-header .collection-name.only-collection-name { .wp-block-tainacan-dynamic-items-list .dynamic-items-collection-header .collection-name.only-collection-name {
justify-content: center; justify-content: center;
padding: 1rem; } padding: 1rem; }
@ -337,60 +350,28 @@
width: 100%; width: 100%;
border: 1px solid #cbcbcb; border: 1px solid #cbcbcb;
box-shadow: none; } box-shadow: none; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-list-without-margin, .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-list.items-list-without-margin,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-list-without-margin { .wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-list.items-list-without-margin,
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid.items-list-without-margin,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid.items-list-without-margin {
grid-template-columns: repeat(auto-fill, 185px); grid-template-columns: repeat(auto-fill, 185px);
justify-content: center !important; justify-content: center !important;
grid-template-rows: auto !important; grid-template-rows: auto !important;
list-style: none; } list-style: none; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-list-without-margin li, .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-list.items-list-without-margin li,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-list-without-margin li { .wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-list.items-list-without-margin li,
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid.items-list-without-margin li,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid.items-list-without-margin li {
margin-top: 0 !important; margin-top: 0 !important;
margin-right: 0 !important; margin-right: 0 !important;
margin-left: 0 !important; margin-left: 0 !important;
height: 185px !important; } height: 185px !important; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-list-without-margin li img, .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-list.items-list-without-margin li img,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-list-without-margin li img { .wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-list.items-list-without-margin li img,
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid.items-list-without-margin li img,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid.items-list-without-margin li img {
height: 185px !important; height: 185px !important;
margin-bottom: 0px !important; } margin-bottom: 0px !important; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid {
padding: 0;
flex-wrap: wrap;
display: flex;
display: -ms-grid;
display: grid;
-ms-grid-columns: 220px 220px 220px 220px 220px;
grid-template-columns: repeat(auto-fill, 220px);
grid-gap: 0px;
justify-content: space-evenly;
list-style-type: none; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid li.item-list-item {
position: relative;
display: block;
margin: 12px 12px 24px 12px;
margin-bottom: 12px;
width: 185px; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid li.item-list-item a,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid li.item-list-item a {
color: #454647;
font-weight: bold;
line-height: normal; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid li.item-list-item img,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid li.item-list-item img {
height: auto;
width: 185px;
min-width: 185px;
padding: 0px;
margin-bottom: 0.5rem; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid li.item-list-item a.item-without-title span,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid li.item-list-item a.item-without-title span {
display: none; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid li.item-list-item:hover a,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid li.item-list-item:hover a {
color: #454647;
text-decoration: none; }
.wp-block-tainacan-dynamic-items-list ul.items-list-edit li.item-list-item { .wp-block-tainacan-dynamic-items-list ul.items-list-edit li.item-list-item {
display: flex; display: flex;
align-items: flex-start; } align-items: flex-start; }
@ -420,6 +401,45 @@
.wp-block-tainacan-dynamic-items-list ul.items-list-edit li.item-list-item:hover button:hover { .wp-block-tainacan-dynamic-items-list ul.items-list-edit li.item-list-item:hover button:hover {
background-color: white !important; background-color: white !important;
border: 1px solid #cbcbcb !important; } border: 1px solid #cbcbcb !important; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid {
padding: 0;
flex-wrap: wrap;
display: flex;
display: -ms-grid;
display: grid;
-ms-grid-columns: 220px 220px 220px 220px 220px;
grid-template-columns: repeat(auto-fill, 220px);
grid-gap: 0px;
justify-content: space-evenly;
list-style-type: none;
margin: 0; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid li.item-list-item {
position: relative;
display: block;
margin: 12px 12px 24px 12px;
margin-bottom: 12px;
width: 185px; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid li.item-list-item a,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid li.item-list-item a {
color: #454647;
font-weight: bold;
line-height: normal; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid li.item-list-item img,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid li.item-list-item img {
height: auto;
width: 185px;
min-width: 185px;
padding: 0px;
margin-bottom: 0.5rem; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid li.item-list-item a.item-without-title span,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid li.item-list-item a.item-without-title span {
display: none; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid li.item-list-item:hover a,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid li.item-list-item:hover a {
color: #454647;
text-decoration: none; }
@media only screen and (max-width: 498px) { @media only screen and (max-width: 498px) {
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid, .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-grid,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid { .wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-grid {
@ -436,7 +456,8 @@
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
align-items: center; align-items: center;
list-style-type: none; } list-style-type: none;
margin: 0; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-list li.item-list-item, .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-list li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-list li.item-list-item { .wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-list li.item-list-item {
position: relative; position: relative;
@ -487,5 +508,389 @@
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-list li.item-list-item { .wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-list li.item-list-item {
min-width: calc(100% - 24px); min-width: calc(100% - 24px);
width: calc(100% - 24px); } } width: calc(100% - 24px); } }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic {
width: auto;
display: flex;
list-style: none;
min-height: 280px;
margin: 0; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container {
padding: 0;
justify-content: stretch;
flex-wrap: wrap;
display: flex;
display: -ms-grid;
display: grid;
-ms-grid-columns: 150px 150px 150px;
grid-template-columns: repeat(3, 150px);
grid-auto-flow: dense;
width: 100%;
list-style-type: none; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container:not(:first-of-type),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container:not(:first-of-type) {
margin-left: 0 !important; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container li.item-list-item {
flex-grow: 1;
justify-self: stretch;
position: relative;
min-width: 100%;
background-size: cover;
background-position: center;
margin: 0; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container li.item-list-item a,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container li.item-list-item a {
width: 100%;
height: 100%;
display: block;
color: #454647;
font-weight: bold;
line-height: normal; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container li.item-list-item img,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container li.item-list-item img {
display: none; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container li.item-list-item a span,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container li.item-list-item a span {
display: block;
position: absolute;
background: rgba(255, 255, 255, 0.75);
bottom: 0;
opacity: 0;
padding: 8px 12px;
word-break: break-word;
transition: opacity 0.5s ease; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container li.item-list-item:hover a span,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container li.item-list-item:hover a span {
opacity: 1; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container li.item-list-item a.item-without-title span,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container li.item-list-item a.item-without-title span {
display: none; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container li.item-list-item:hover a,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container li.item-list-item:hover a {
color: #454647;
text-decoration: none; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--1-2x3 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--1-2x3 li.item-list-item {
grid-row: span 2;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--2-2x3 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--2-2x3 li.item-list-item {
grid-row: span 1;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-2x3 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-2x3 li.item-list-item:nth-of-type(1) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-2x3 li.item-list-item:nth-of-type(1), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-2x3 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-2x3 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-2x3 li.item-list-item:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-2x3 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-2x3 li.item-list-item:nth-of-type(2) {
grid-row: span 2;
grid-column: span 1; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--1-3x2 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--1-3x2 li.item-list-item {
grid-row: span 3;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--2-3x2 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--2-3x2 li.item-list-item {
grid-row: span 3;
grid-column: span 1; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-3x2 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-3x2 li.item-list-item:nth-of-type(1) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-3x2 li.item-list-item:nth-of-type(1), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-3x2 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-3x2 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-3x2 li.item-list-item:nth-of-type(3) {
grid-row: span 2;
grid-column: span 1; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-3x2 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-3x2 li.item-list-item:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--1-3x3 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--1-3x3 li.item-list-item {
grid-row: span 3;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--2-3x3 li.item-list-item:first-of-type,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--2-3x3 li.item-list-item:first-of-type {
grid-row: span 1;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--2-3x3 li.item-list-item:last-of-type,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--2-3x3 li.item-list-item:last-of-type {
grid-row: span 2;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-3x3 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-3x3 li.item-list-item:nth-of-type(1) {
grid-row: span 2;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-3x3 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-3x3 li.item-list-item:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-3x3 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-3x3 li.item-list-item:nth-of-type(1) {
grid-row: span 2;
grid-column: span 1; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-3x3 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-3x3 li.item-list-item:nth-of-type(2) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-3x3 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-3x3 li.item-list-item:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-3x3 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-3x3 li.item-list-item:nth-of-type(1) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-3x3 li.item-list-item:nth-of-type(4),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-3x3 li.item-list-item:nth-of-type(4) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-3x3 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-3x3 li.item-list-item:nth-of-type(3) {
grid-row: span 2;
grid-column: span 1; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-3x3 li.item-list-item:nth-of-type(4), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-3x3 li.item-list-item:nth-of-type(6),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-3x3 li.item-list-item:nth-of-type(4),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-3x3 li.item-list-item:nth-of-type(6) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--1-3x4 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--1-3x4 li.item-list-item {
grid-row: span 3;
grid-column: span 4; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--2-3x4 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--2-3x4 li.item-list-item {
grid-row: span 3;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-3x4 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-3x4 li.item-list-item:nth-of-type(1) {
grid-row: span 3;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-3x4 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-3x4 li.item-list-item:nth-of-type(2) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-3x4 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-3x4 li.item-list-item:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-3x4 li.item-list-item:nth-of-type(1), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-3x4 li.item-list-item:nth-of-type(4),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-3x4 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-3x4 li.item-list-item:nth-of-type(4) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-3x4 li.item-list-item:nth-of-type(2), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-3x4 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-3x4 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-3x4 li.item-list-item:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-3x4 li.item-list-item:nth-of-type(1), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-3x4 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-3x4 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-3x4 li.item-list-item:nth-of-type(3) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-3x4 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-3x4 li.item-list-item:nth-of-type(2) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-3x4 li.item-list-item:nth-of-type(2), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-3x4 li.item-list-item:nth-of-type(6),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-3x4 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-3x4 li.item-list-item:nth-of-type(6) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-3x4 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-3x4 li.item-list-item:nth-of-type(3) {
grid-row: span 2;
grid-column: span 1; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-3x4 li.item-list-item:nth-of-type(4),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-3x4 li.item-list-item:nth-of-type(4) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--1-4x3 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--1-4x3 li.item-list-item {
grid-row: span 4;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--2-4x3 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--2-4x3 li.item-list-item {
grid-row: span 2;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-4x3 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-4x3 li.item-list-item:nth-of-type(1) {
grid-row: span 2;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-4x3 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-4x3 li.item-list-item:nth-of-type(2) {
grid-row: span 2;
grid-column: span 1; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-4x3 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-4x3 li.item-list-item:nth-of-type(3) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-4x3 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-4x3 li.item-list-item:nth-of-type(1) {
grid-row: span 2;
grid-column: span 1; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-4x3 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-4x3 li.item-list-item:nth-of-type(2) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-4x3 li.item-list-item:nth-of-type(4),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-4x3 li.item-list-item:nth-of-type(4) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-4x3 li.item-list-item:nth-of-type(2), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-4x3 li.item-list-item:nth-of-type(4),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-4x3 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-4x3 li.item-list-item:nth-of-type(4) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-4x3 li.item-list-item:nth-of-type(5),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-4x3 li.item-list-item:nth-of-type(5) {
grid-row: span 2;
grid-column: span 1; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-4x3 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-4x3 li.item-list-item:nth-of-type(2) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-4x3 li.item-list-item:nth-of-type(3), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-4x3 li.item-list-item:nth-of-type(6),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-4x3 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-4x3 li.item-list-item:nth-of-type(6) {
grid-row: span 2;
grid-column: span 1; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-4x3 li.item-list-item:nth-of-type(5),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-4x3 li.item-list-item:nth-of-type(5) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--1-4x5 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--1-4x5 li.item-list-item {
grid-row: span 4;
grid-column: span 5; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--2-4x5 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--2-4x5 li.item-list-item {
grid-row: span 2;
grid-column: span 5; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-4x5 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-4x5 li.item-list-item:nth-of-type(1) {
grid-row: span 2;
grid-column: span 5; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-4x5 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-4x5 li.item-list-item:nth-of-type(2) {
grid-row: span 2;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-4x5 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-4x5 li.item-list-item:nth-of-type(3) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-4x5 li.item-list-item:nth-of-type(1), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-4x5 li.item-list-item:nth-of-type(4),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-4x5 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-4x5 li.item-list-item:nth-of-type(4) {
grid-row: span 2;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-4x5 li.item-list-item:nth-of-type(2), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-4x5 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-4x5 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-4x5 li.item-list-item:nth-of-type(3) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-4x5 li.item-list-item:nth-of-type(3), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-4x5 li.item-list-item:nth-of-type(5),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-4x5 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-4x5 li.item-list-item:nth-of-type(5) {
grid-row: span 2;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-4x5 li.item-list-item:nth-of-type(4),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-4x5 li.item-list-item:nth-of-type(4) {
grid-row: span 3;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-4x5 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-4x5 li.item-list-item:nth-of-type(1) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-4x5 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-4x5 li.item-list-item:nth-of-type(3) {
grid-row: span 3;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-4x5 li.item-list-item:nth-of-type(5),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-4x5 li.item-list-item:nth-of-type(5) {
grid-row: span 2;
grid-column: span 3; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-4x5 li.item-list-item:nth-of-type(6),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-4x5 li.item-list-item:nth-of-type(6) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--1-5x4 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--1-5x4 li.item-list-item {
grid-row: span 5;
grid-column: span 4; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--2-5x4 li.item-list-item,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--2-5x4 li.item-list-item {
grid-row: span 5;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-5x4 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-5x4 li.item-list-item:nth-of-type(1) {
grid-row: span 3;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-5x4 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-5x4 li.item-list-item:nth-of-type(2) {
grid-row: span 5;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--3-5x4 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--3-5x4 li.item-list-item:nth-of-type(3) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-5x4 li.item-list-item:nth-of-type(1), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-5x4 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-5x4 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-5x4 li.item-list-item:nth-of-type(3) {
grid-row: span 3;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-5x4 li.item-list-item:nth-of-type(2), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--4-5x4 li.item-list-item:nth-of-type(4),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-5x4 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--4-5x4 li.item-list-item:nth-of-type(4) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-5x4 li.item-list-item:nth-of-type(1), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-5x4 li.item-list-item:nth-of-type(3), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-5x4 li.item-list-item:nth-of-type(5),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-5x4 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-5x4 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-5x4 li.item-list-item:nth-of-type(5) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-5x4 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-5x4 li.item-list-item:nth-of-type(2) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--5-5x4 li.item-list-item:nth-of-type(4),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--5-5x4 li.item-list-item:nth-of-type(4) {
grid-row: span 3;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-5x4 li.item-list-item:nth-of-type(1), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-5x4 li.item-list-item:nth-of-type(5),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-5x4 li.item-list-item:nth-of-type(1),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-5x4 li.item-list-item:nth-of-type(5) {
grid-row: span 2;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-5x4 li.item-list-item:nth-of-type(2),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-5x4 li.item-list-item:nth-of-type(2) {
grid-row: span 3;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-5x4 li.item-list-item:nth-of-type(3),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-5x4 li.item-list-item:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-5x4 li.item-list-item:nth-of-type(4), .wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container.mosaic-container--6-5x4 li.item-list-item:nth-of-type(6),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-5x4 li.item-list-item:nth-of-type(4),
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container.mosaic-container--6-5x4 li.item-list-item:nth-of-type(6) {
grid-row: span 2;
grid-column: span 1; }
@media only screen and (max-width: 1024px) {
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic {
overflow-x: auto; }
.wp-block-tainacan-dynamic-items-list ul.items-list.items-layout-mosaic .mosaic-container,
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-mosaic .mosaic-container {
min-width: 240px; } }
/*# sourceMappingURL=tainacan-gutenberg-block-dynamic-items-list.css.map */ /*# sourceMappingURL=tainacan-gutenberg-block-dynamic-items-list.css.map */

2
src/assets/css/tainacan-gutenberg-block-dynamic-items-list.css.map
View File

File diff suppressed because one or more lines are too long

33
src/assets/css/tainacan-gutenberg-block-facets-list.css
View File

@ -3,6 +3,7 @@
.block-control { .block-control {
display: flex; display: flex;
flex-wrap: wrap;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -22,15 +23,21 @@
position: relative; position: relative;
fill: #555758; } fill: #555758; }
.components-placeholder__fieldset p { .components-placeholder {
font-size: 0.875rem !important; margin-bottom: 0;
margin-top: -2px; background: #f6f6f6; }
fill: #555758; } .components-placeholder .components-placeholder__label {
.components-placeholder__fieldset p svg { margin-bottom: 0; }
margin-right: 1rem; .components-placeholder .components-placeholder__fieldset p {
top: 4px; font-size: 0.875rem !important;
position: relative; margin: 12px 0;
color: #454647;
fill: #555758; } fill: #555758; }
.components-placeholder .components-placeholder__fieldset p svg {
margin-right: 1rem;
top: 4px;
position: relative;
fill: #555758; }
.wp-block-tainacan-modal { .wp-block-tainacan-modal {
width: 50%; } width: 50%; }
@ -111,6 +118,9 @@
.wp-block-tainacan-modal .modal-checkbox-list .components-base-control, .wp-block-tainacan-modal .modal-checkbox-list .components-base-control,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control { .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control {
overflow: hidden; } overflow: hidden; }
.wp-block-tainacan-modal .modal-checkbox-list svg.dashicon.components-checkbox-control__checked,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field svg.dashicon.components-checkbox-control__checked {
fill: black; }
.wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item,
.wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option, .wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item,
@ -159,7 +169,7 @@
color: #454647; } color: #454647; }
.wp-block-tainacan-facets-list { .wp-block-tainacan-facets-list {
margin: 2rem 0px; } margin: 2rem auto; }
.wp-block-tainacan-facets-list .spinner-container { .wp-block-tainacan-facets-list .spinner-container {
min-height: 56px; min-height: 56px;
padding: 1rem; padding: 1rem;
@ -224,12 +234,13 @@
.wp-block-tainacan-facets-list .facets-collection-header .collection-name h3 { .wp-block-tainacan-facets-list .facets-collection-header .collection-name h3 {
color: white; color: white;
text-decoration: none; text-decoration: none;
font-size: 1.3rem; } font-size: 1.3em;
margin: 0; }
.wp-block-tainacan-facets-list .facets-collection-header .collection-name h3:hover { .wp-block-tainacan-facets-list .facets-collection-header .collection-name h3:hover {
text-decoration: none; } text-decoration: none; }
.wp-block-tainacan-facets-list .facets-collection-header .collection-name span.label { .wp-block-tainacan-facets-list .facets-collection-header .collection-name span.label {
font-weight: normal; font-weight: normal;
font-size: 1rem; } font-size: 0.75em; }
.wp-block-tainacan-facets-list .facets-collection-header .collection-name.only-collection-name { .wp-block-tainacan-facets-list .facets-collection-header .collection-name.only-collection-name {
justify-content: center; justify-content: center;
padding: 1rem; } padding: 1rem; }

2
src/assets/css/tainacan-gutenberg-block-facets-list.css.map
View File

File diff suppressed because one or more lines are too long

33
src/assets/css/tainacan-gutenberg-block-items-list.css
View File

@ -3,6 +3,7 @@
.block-control { .block-control {
display: flex; display: flex;
flex-wrap: wrap;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -22,15 +23,21 @@
position: relative; position: relative;
fill: #555758; } fill: #555758; }
.components-placeholder__fieldset p { .components-placeholder {
font-size: 0.875rem !important; margin-bottom: 0;
margin-top: -2px; background: #f6f6f6; }
fill: #555758; } .components-placeholder .components-placeholder__label {
.components-placeholder__fieldset p svg { margin-bottom: 0; }
margin-right: 1rem; .components-placeholder .components-placeholder__fieldset p {
top: 4px; font-size: 0.875rem !important;
position: relative; margin: 12px 0;
color: #454647;
fill: #555758; } fill: #555758; }
.components-placeholder .components-placeholder__fieldset p svg {
margin-right: 1rem;
top: 4px;
position: relative;
fill: #555758; }
.wp-block-tainacan-modal { .wp-block-tainacan-modal {
width: 50%; } width: 50%; }
@ -111,6 +118,9 @@
.wp-block-tainacan-modal .modal-checkbox-list .components-base-control, .wp-block-tainacan-modal .modal-checkbox-list .components-base-control,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control { .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control {
overflow: hidden; } overflow: hidden; }
.wp-block-tainacan-modal .modal-checkbox-list svg.dashicon.components-checkbox-control__checked,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field svg.dashicon.components-checkbox-control__checked {
fill: black; }
.wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item,
.wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option, .wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item,
@ -159,10 +169,15 @@
color: #454647; } color: #454647; }
.wp-block-tainacan-items-list { .wp-block-tainacan-items-list {
margin: 2rem 0px; } margin: 2rem auto; }
.wp-block-tainacan-items-list .components-spinner { .wp-block-tainacan-items-list .components-spinner {
position: absolute; position: absolute;
right: 0; } right: 0; }
.wp-block-tainacan-items-list ul.items-list li.item-list-item > button,
.wp-block-tainacan-items-list ul.items-list li.item-list-item > button:hover {
display: none;
visibility: hidden;
opacity: 0; }
.wp-block-tainacan-items-list ul.items-list.items-list-without-margin, .wp-block-tainacan-items-list ul.items-list.items-list-without-margin,
.wp-block-tainacan-items-list ul.items-list-edit.items-list-without-margin { .wp-block-tainacan-items-list ul.items-list-edit.items-list-without-margin {
grid-template-columns: repeat(auto-fill, 185px); grid-template-columns: repeat(auto-fill, 185px);

2
src/assets/css/tainacan-gutenberg-block-items-list.css.map
View File

File diff suppressed because one or more lines are too long

122
src/assets/css/tainacan-gutenberg-block-search-bar.css
View File

@ -3,6 +3,7 @@
.block-control { .block-control {
display: flex; display: flex;
flex-wrap: wrap;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -22,15 +23,21 @@
position: relative; position: relative;
fill: #555758; } fill: #555758; }
.components-placeholder__fieldset p { .components-placeholder {
font-size: 0.875rem !important; margin-bottom: 0;
margin-top: -2px; background: #f6f6f6; }
fill: #555758; } .components-placeholder .components-placeholder__label {
.components-placeholder__fieldset p svg { margin-bottom: 0; }
margin-right: 1rem; .components-placeholder .components-placeholder__fieldset p {
top: 4px; font-size: 0.875rem !important;
position: relative; margin: 12px 0;
color: #454647;
fill: #555758; } fill: #555758; }
.components-placeholder .components-placeholder__fieldset p svg {
margin-right: 1rem;
top: 4px;
position: relative;
fill: #555758; }
.wp-block-tainacan-modal { .wp-block-tainacan-modal {
width: 50%; } width: 50%; }
@ -111,6 +118,9 @@
.wp-block-tainacan-modal .modal-checkbox-list .components-base-control, .wp-block-tainacan-modal .modal-checkbox-list .components-base-control,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control { .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control {
overflow: hidden; } overflow: hidden; }
.wp-block-tainacan-modal .modal-checkbox-list svg.dashicon.components-checkbox-control__checked,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field svg.dashicon.components-checkbox-control__checked {
fill: black; }
.wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item,
.wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option, .wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item,
@ -163,10 +173,10 @@
justify-content: center; } justify-content: center; }
.wp-block-tainacan-search-bar { .wp-block-tainacan-search-bar {
margin: 2rem 0px; } margin: 2rem auto; }
.wp-block-tainacan-search-bar .tainacan-search-container { .wp-block-tainacan-search-bar .tainacan-search-container {
width: 100%; } width: 100%; }
.wp-block-tainacan-search-bar .tainacan-search-container #taincan-search-bar-block { .wp-block-tainacan-search-bar .tainacan-search-container #tainacan-search-bar-block {
height: 32px; height: 32px;
max-width: 100%; max-width: 100%;
display: flex; display: flex;
@ -175,22 +185,22 @@
margin: 0 auto; margin: 0 auto;
border: 1px solid #dbdbdb; border: 1px solid #dbdbdb;
transition: border-color ease 0.3s; } transition: border-color ease 0.3s; }
.wp-block-tainacan-search-bar .tainacan-search-container #taincan-search-bar-block.is-aligned-left { .wp-block-tainacan-search-bar .tainacan-search-container #tainacan-search-bar-block.is-aligned-left {
margin-left: 0; margin-left: 0;
justify-content: flex-start; } justify-content: flex-start; }
.wp-block-tainacan-search-bar .tainacan-search-container #taincan-search-bar-block.is-aligned-right { .wp-block-tainacan-search-bar .tainacan-search-container #tainacan-search-bar-block.is-aligned-right {
margin-right: 0; margin-right: 0;
justify-content: flex-end; } justify-content: flex-end; }
.wp-block-tainacan-search-bar .tainacan-search-container #taincan-search-bar-block:hover, .wp-block-tainacan-search-bar .tainacan-search-container #taincan-search-bar-block:focus, .wp-block-tainacan-search-bar .tainacan-search-container #taincan-search-bar-block:active { .wp-block-tainacan-search-bar .tainacan-search-container #tainacan-search-bar-block:hover, .wp-block-tainacan-search-bar .tainacan-search-container #tainacan-search-bar-block:focus, .wp-block-tainacan-search-bar .tainacan-search-container #tainacan-search-bar-block:active {
border: 1px solid #545758; } border: 1px solid #545758; }
.wp-block-tainacan-search-bar .tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input { .wp-block-tainacan-search-bar .tainacan-search-container #tainacan-search-bar-block input#tainacan-search-bar-block_input {
width: 100%; width: 100%;
min-width: 28px; min-width: 28px;
margin: 0; margin: 0;
border: none; border: none;
padding: 4px 0.75rem; padding: 4px 0.75rem;
text-overflow: ellipsis; } text-overflow: ellipsis; }
.wp-block-tainacan-search-bar .tainacan-search-container #taincan-search-bar-block button { .wp-block-tainacan-search-bar .tainacan-search-container #tainacan-search-bar-block button {
height: auto; height: auto;
display: flex; display: flex;
align-items: center; align-items: center;
@ -200,36 +210,40 @@
background: white; background: white;
padding: 4px 1rem; padding: 4px 1rem;
font-size: 1rem; } font-size: 1rem; }
.wp-block-tainacan-search-bar .tainacan-search-container #taincan-search-bar-block button .icon { .wp-block-tainacan-search-bar .tainacan-search-container #tainacan-search-bar-block button .icon {
height: 28px; } height: 28px; }
.wp-block-tainacan-search-bar .tainacan-search-container #taincan-search-bar-block button .icon svg { .wp-block-tainacan-search-bar .tainacan-search-container #tainacan-search-bar-block button .icon svg {
fill: #298596; } fill: #298596; }
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
.wp-block-tainacan-search-bar .tainacan-search-container #taincan-search-bar-block { .wp-block-tainacan-search-bar .tainacan-search-container #tainacan-search-bar-block {
margin-left: 0px; margin-left: 0px;
margin-right: 0px; margin-right: 0px;
max-width: 100% !important; } max-width: 100% !important; }
.wp-block-tainacan-search-bar .tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input { .wp-block-tainacan-search-bar .tainacan-search-container #tainacan-search-bar-block input#tainacan-search-bar-block_input {
width: 100% !important; } } width: 100% !important; } }
.wp-block-tainacan-search-bar .search-bar-collection-header-container .search-bar-collection-header-title {
max-width: 1400px;
margin-left: auto;
margin-right: auto; }
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
.wp-block-tainacan-search-bar .search-bar-collection-header-container { .wp-block-tainacan-search-bar .search-bar-collection-header-container {
flex-wrap: wrap !important; } flex-wrap: wrap !important; }
.wp-block-tainacan-search-bar .search-bar-collection-header-container .search-bar-collection-header-title { .wp-block-tainacan-search-bar .search-bar-collection-header-container .search-bar-collection-header-title {
text-align: center !important; } } text-align: center !important; } }
.wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block { .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: row-reverse; flex-direction: row-reverse;
border: none; } border: none; }
.wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block.is-aligned-left { .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block.is-aligned-left {
margin-left: 0; margin-left: 0;
justify-content: flex-end; } justify-content: flex-end; }
.wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block.is-aligned-right { .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block.is-aligned-right {
margin-right: 0; margin-right: 0;
justify-content: flex-start; } justify-content: flex-start; }
.wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block:focus, .wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block:active, .wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block:hover { .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block:focus, .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block:active, .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block:hover {
border: none; } border: none; }
.wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block input#taincan-search-bar-block_input { .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block input#tainacan-search-bar-block_input {
width: 35%; width: 35%;
border-radius: 0; border-radius: 0;
margin-left: -52px; margin-left: -52px;
@ -237,12 +251,14 @@
border: 1px solid transparent; border: 1px solid transparent;
background: rgba(250, 250, 250, 0.2); background: rgba(250, 250, 250, 0.2);
transition: border-color 0.4s ease, width 0.5s ease-in, background-color 0.3s ease, color 0.3s ease; } transition: border-color 0.4s ease, width 0.5s ease-in, background-color 0.3s ease, color 0.3s ease; }
.wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block input#taincan-search-bar-block_input:focus, .wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block input#taincan-search-bar-block_input:active, .wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block input#taincan-search-bar-block_input:hover { .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block input#tainacan-search-bar-block_input:focus, .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block input#tainacan-search-bar-block_input:active, .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block input#tainacan-search-bar-block_input:hover {
width: 100%; width: 100%;
border-color: #cbcbcb; border-color: #cbcbcb;
background: #fafafa; background: #fafafa;
box-shadow: none; } box-shadow: none; }
.wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block button { .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block input#tainacan-search-bar-block_input::placeholder {
color: #cbcbcb; }
.wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block button {
margin-right: 0.75rem; margin-right: 0.75rem;
padding: 0 0.35rem; padding: 0 0.35rem;
min-height: 28px; min-height: 28px;
@ -250,48 +266,46 @@
border: none; border: none;
background: transparent; background: transparent;
cursor: pointer; } cursor: pointer; }
.wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block button .icon svg { .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block button .icon svg {
fill: #cbcbcb; fill: #cbcbcb;
transition: fill 0.4s ease; } transition: fill 0.4s ease; }
.wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block button:hover { .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block button:hover {
background: transparent; } background: transparent; }
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
.wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block { .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block {
margin-left: 0px; margin-left: 0px;
margin-right: 0px; margin-right: 0px;
max-width: 100% !important; } max-width: 100% !important; }
.wp-block-tainacan-search-bar.is-style-alternate #taincan-search-bar-block input#taincan-search-bar-block_input { .wp-block-tainacan-search-bar.is-style-alternate #tainacan-search-bar-block input#tainacan-search-bar-block_input {
width: 100% !important; } } width: 100% !important; } }
.wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block:focus input, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block:focus input,
.wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block:focus input::placeholder, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block:active input, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block:focus input::placeholder, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block:active input,
.wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block:active input::placeholder, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block:hover input, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block:active input::placeholder, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block:hover input,
.wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block:hover input::placeholder { .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block:hover input::placeholder {
color: #454647; color: #454647;
border-width: 0; } border-width: 0; }
.wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block:focus button .icon svg, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block:active button .icon svg, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block:hover button .icon svg { .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block:focus button .icon svg, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block:active button .icon svg, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block:hover button .icon svg {
fill: #cbcbcb !important; } fill: #cbcbcb !important; }
.wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input { .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block input#tainacan-search-bar-block_input {
color: white; } color: white; }
.wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input::placeholder { .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block input#tainacan-search-bar-block_input:focus, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block input#tainacan-search-bar-block_input:active, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block input#tainacan-search-bar-block_input:hover, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block input#tainacan-search-bar-block_input:focus::placeholder, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block input#tainacan-search-bar-block_input:active::placeholder, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block input#tainacan-search-bar-block_input:hover::placeholder {
color: white; }
.wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input:focus, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input:active, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input:hover, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input:focus::placeholder, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input:active::placeholder, .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input:hover::placeholder {
color: #454647; } color: #454647; }
.wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block button .icon svg { .wp-block-tainacan-search-bar.is-style-alternate .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block button .icon svg {
fill: #dbdbdb !important; } fill: #dbdbdb !important; }
.wp-block-tainacan-search-bar.is-style-stylish #taincan-search-bar-block { .wp-block-tainacan-search-bar.is-style-stylish #tainacan-search-bar-block {
width: 100%; width: 100%;
height: 53px; height: 53px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
border: none; } border: none; }
.wp-block-tainacan-search-bar.is-style-stylish #taincan-search-bar-block:focus, .wp-block-tainacan-search-bar.is-style-stylish #taincan-search-bar-block:active, .wp-block-tainacan-search-bar.is-style-stylish #taincan-search-bar-block:hover { .wp-block-tainacan-search-bar.is-style-stylish #tainacan-search-bar-block:focus, .wp-block-tainacan-search-bar.is-style-stylish #tainacan-search-bar-block:active, .wp-block-tainacan-search-bar.is-style-stylish #tainacan-search-bar-block:hover {
border: none; } border: none; }
.wp-block-tainacan-search-bar.is-style-stylish #taincan-search-bar-block:hover input#taincan-search-bar-block_input { .wp-block-tainacan-search-bar.is-style-stylish #tainacan-search-bar-block:hover input#tainacan-search-bar-block_input {
width: 100%; width: 100%;
padding-right: 52px; padding-right: 52px;
padding-left: 24px; padding-left: 24px;
border-width: 0; } border-width: 0; }
.wp-block-tainacan-search-bar.is-style-stylish #taincan-search-bar-block input#taincan-search-bar-block_input { .wp-block-tainacan-search-bar.is-style-stylish #tainacan-search-bar-block input#tainacan-search-bar-block_input {
width: 0%; width: 0%;
min-width: 0%; min-width: 0%;
border-radius: 28px; border-radius: 28px;
@ -301,13 +315,13 @@
font-size: 1rem; font-size: 1rem;
border-width: 0; border-width: 0;
background: #f2f2f2; background: #f2f2f2;
transition: width 0.5s ease-in; } transition: width 0.5s ease-in, padding 0.5s ease-in; }
.wp-block-tainacan-search-bar.is-style-stylish #taincan-search-bar-block input#taincan-search-bar-block_input:focus, .wp-block-tainacan-search-bar.is-style-stylish #taincan-search-bar-block input#taincan-search-bar-block_input:active, .wp-block-tainacan-search-bar.is-style-stylish #taincan-search-bar-block input#taincan-search-bar-block_input:hover { .wp-block-tainacan-search-bar.is-style-stylish #tainacan-search-bar-block input#tainacan-search-bar-block_input:focus, .wp-block-tainacan-search-bar.is-style-stylish #tainacan-search-bar-block input#tainacan-search-bar-block_input:active, .wp-block-tainacan-search-bar.is-style-stylish #tainacan-search-bar-block input#tainacan-search-bar-block_input:hover {
width: 100%; width: 100%;
padding-right: 52px; padding-right: 52px;
padding-left: 24px; padding-left: 24px;
border-width: 0; } border-width: 0; }
.wp-block-tainacan-search-bar.is-style-stylish #taincan-search-bar-block button { .wp-block-tainacan-search-bar.is-style-stylish #tainacan-search-bar-block button {
margin-left: 0.75rem; margin-left: 0.75rem;
padding: 0 0.35rem; padding: 0 0.35rem;
min-height: 28px; min-height: 28px;
@ -315,10 +329,10 @@
border: none; border: none;
background: transparent; background: transparent;
cursor: pointer; } cursor: pointer; }
.wp-block-tainacan-search-bar.is-style-stylish #taincan-search-bar-block button .icon svg { .wp-block-tainacan-search-bar.is-style-stylish #tainacan-search-bar-block button .icon svg {
fill: black; fill: black;
transition: fill 0.4s ease; } transition: fill 0.4s ease; }
.wp-block-tainacan-search-bar.is-style-stylish #taincan-search-bar-block button:hover { .wp-block-tainacan-search-bar.is-style-stylish #tainacan-search-bar-block button:hover {
background: transparent; } background: transparent; }
.wp-block-tainacan-search-bar.is-style-stylish .search-bar-collection-header-container:not(.is-aligned-right):not(.is-aligned-left) .tainacan-search-container { .wp-block-tainacan-search-bar.is-style-stylish .search-bar-collection-header-container:not(.is-aligned-right):not(.is-aligned-left) .tainacan-search-container {
width: calc(100% - 4.1667% - 53px); width: calc(100% - 4.1667% - 53px);
@ -340,14 +354,14 @@
left: calc(4.1667% + 26px); left: calc(4.1667% + 26px);
left: calc(4.1667vw + 26px); left: calc(4.1667vw + 26px);
position: absolute; } position: absolute; }
.wp-block-tainacan-search-bar.is-style-stylish .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input { .wp-block-tainacan-search-bar.is-style-stylish .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block input#tainacan-search-bar-block_input {
background: white; background: white;
border-width: 3px; border-width: 3px;
border-style: solid; border-style: solid;
margin-right: -56px; margin-right: -56px;
padding-right: 24px; padding-right: 24px;
padding-left: 24px; } padding-left: 24px; }
.wp-block-tainacan-search-bar.is-style-stylish .search-bar-collection-header-container .tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input:hover { .wp-block-tainacan-search-bar.is-style-stylish .search-bar-collection-header-container .tainacan-search-container #tainacan-search-bar-block input#tainacan-search-bar-block_input:hover {
border-width: 3px !important; } border-width: 3px !important; }
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
.wp-block-tainacan-search-bar.is-style-stylish .search-bar-collection-header-container .tainacan-search-container { .wp-block-tainacan-search-bar.is-style-stylish .search-bar-collection-header-container .tainacan-search-container {
@ -377,7 +391,7 @@
text-align: center; text-align: center;
text-decoration: none !important; } text-decoration: none !important; }
.wp-block-tainacan-search-bar .search-bar-collection-header-container.is-aligned-left { .wp-block-tainacan-search-bar .search-bar-collection-header-container.is-aligned-left {
min-height: 100px; min-height: 115px;
text-align: left; text-align: left;
flex-direction: row-reverse; flex-direction: row-reverse;
flex-wrap: nowrap; flex-wrap: nowrap;
@ -385,7 +399,7 @@
.wp-block-tainacan-search-bar .search-bar-collection-header-container.is-aligned-left .search-bar-collection-header-title { .wp-block-tainacan-search-bar .search-bar-collection-header-container.is-aligned-left .search-bar-collection-header-title {
text-align: right; } text-align: right; }
.wp-block-tainacan-search-bar .search-bar-collection-header-container.is-aligned-right { .wp-block-tainacan-search-bar .search-bar-collection-header-container.is-aligned-right {
min-height: 100px; min-height: 115px;
text-align: right; text-align: right;
flex-direction: row; flex-direction: row;
flex-wrap: nowrap; flex-wrap: nowrap;
@ -407,7 +421,7 @@
.wp-block-tainacan-search-bar .search-bar-collection-header-container .search-bar-collection-header-title span.label { .wp-block-tainacan-search-bar .search-bar-collection-header-container .search-bar-collection-header-title span.label {
width: 100%; width: 100%;
display: block; display: block;
margin-top: -12px; margin-top: -8px;
font-weight: normal; font-weight: normal;
font-size: 1rem; } font-size: 1rem; }
@media only screen and (max-width: 1024px) { @media only screen and (max-width: 1024px) {

2
src/assets/css/tainacan-gutenberg-block-search-bar.css.map
View File

File diff suppressed because one or more lines are too long

33
src/assets/css/tainacan-gutenberg-block-terms-list.css
View File

@ -3,6 +3,7 @@
.block-control { .block-control {
display: flex; display: flex;
flex-wrap: wrap;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -22,15 +23,21 @@
position: relative; position: relative;
fill: #555758; } fill: #555758; }
.components-placeholder__fieldset p { .components-placeholder {
font-size: 0.875rem !important; margin-bottom: 0;
margin-top: -2px; background: #f6f6f6; }
fill: #555758; } .components-placeholder .components-placeholder__label {
.components-placeholder__fieldset p svg { margin-bottom: 0; }
margin-right: 1rem; .components-placeholder .components-placeholder__fieldset p {
top: 4px; font-size: 0.875rem !important;
position: relative; margin: 12px 0;
color: #454647;
fill: #555758; } fill: #555758; }
.components-placeholder .components-placeholder__fieldset p svg {
margin-right: 1rem;
top: 4px;
position: relative;
fill: #555758; }
.wp-block-tainacan-modal { .wp-block-tainacan-modal {
width: 50%; } width: 50%; }
@ -111,6 +118,9 @@
.wp-block-tainacan-modal .modal-checkbox-list .components-base-control, .wp-block-tainacan-modal .modal-checkbox-list .components-base-control,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control { .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control {
overflow: hidden; } overflow: hidden; }
.wp-block-tainacan-modal .modal-checkbox-list svg.dashicon.components-checkbox-control__checked,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field svg.dashicon.components-checkbox-control__checked {
fill: black; }
.wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-checkbox-list .modal-checkbox-list-item,
.wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option, .wp-block-tainacan-modal .modal-checkbox-list .components-radio-control__option,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item, .wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item,
@ -159,10 +169,15 @@
color: #454647; } color: #454647; }
.wp-block-tainacan-terms-list { .wp-block-tainacan-terms-list {
margin: 2rem 0px; } margin: 2rem auto; }
.wp-block-tainacan-terms-list .components-spinner { .wp-block-tainacan-terms-list .components-spinner {
position: absolute; position: absolute;
right: 0; } right: 0; }
.wp-block-tainacan-terms-list ul.terms-list li.term-list-item > button,
.wp-block-tainacan-terms-list ul.terms-list li.term-list-item > button:hover {
display: none;
visibility: hidden;
opacity: 0; }
.wp-block-tainacan-terms-list ul.terms-list.terms-layout-grid, .wp-block-tainacan-terms-list ul.terms-list.terms-layout-grid,
.wp-block-tainacan-terms-list ul.terms-list-edit.terms-layout-grid { .wp-block-tainacan-terms-list ul.terms-list-edit.terms-layout-grid {
padding: 0; padding: 0;

2
src/assets/css/tainacan-gutenberg-block-terms-list.css.map
View File

File diff suppressed because one or more lines are too long

18
src/classes/class-tainacan-elastic-press.php
View File

@ -59,7 +59,7 @@ class Elastic_Press {
$array_dynamic_templates = $mapping["mappings"]["post"]["dynamic_templates"]; $array_dynamic_templates = $mapping["mappings"]["post"]["dynamic_templates"];
foreach ($array_dynamic_templates as $key => $dynamic_templates) { foreach ($array_dynamic_templates as $key => $dynamic_templates) {
if ( isset($dynamic_templates['template_meta_types'] )) { if ( isset($dynamic_templates['template_meta_types'] )) {
$mapping["mappings"]["post"]["dynamic_templates"][$key]['template_meta_types']["mapping"]["properties"][$name_field] = ['type' => 'keyword']; $mapping["mappings"]["post"]["dynamic_templates"][$key]['template_meta_types']["mapping"]["properties"][$name_field] = ['type' => 'keyword', 'normalizer' => 'lowerasciinormalizer'];
// $mapping["mappings"]["post"]["dynamic_templates"][$key]['template_meta_types']["mapping"]["properties"][$name_field] = // $mapping["mappings"]["post"]["dynamic_templates"][$key]['template_meta_types']["mapping"]["properties"][$name_field] =
// ['type' => 'nested', // ['type' => 'nested',
// 'properties' => [ // 'properties' => [
@ -284,8 +284,8 @@ class Elastic_Press {
$new_sort["post_name.raw"] = $value; $new_sort["post_name.raw"] = $value;
} elseif ($key == 'post_type') { } elseif ($key == 'post_type') {
$new_sort["post_type.raw"] = $value; $new_sort["post_type.raw"] = $value;
} elseif( !in_array("long", $parts) && in_array("meta", $parts) ) { // } elseif( !in_array("long", $parts) && in_array("meta", $parts) ) {
$new_sort["$key.sortable"] = $value; // $new_sort["$key.sortable"] = $value;
} else { } else {
$new_sort[$key] = $value; $new_sort[$key] = $value;
} }
@ -434,7 +434,8 @@ class Elastic_Press {
//"size" => $filter['max_options'], //"size" => $filter['max_options'],
"script" => [ "script" => [
"lang" => "painless", "lang" => "painless",
"source"=> "def c= [''];if(!params._source.terms.empty && params._source.$field != null){ for(term in params._source.$field) { if(term.parent==$parent) { c.add(term.term_id); }}} return c;" "source" => "for (int i = 0; i < doc['$field.parent'].length; ++i) { if (doc['$field.parent'][i] == 0) { return doc['$field.term_id'][i]; }}",
//"source"=> "def c= [''];if(!params._source.terms.empty && params._source.$field != null){ for(term in params._source.$field) { if(term.parent==$parent) { c.add(term.term_id); }}} return c;"
] ]
) )
) )
@ -452,7 +453,8 @@ class Elastic_Press {
"terms"=>array( "terms"=>array(
"script" => [ "script" => [
"lang" => "painless", "lang" => "painless",
"source"=> "def c= ['']; if(!params._source.terms.empty && params._source.$field != null) { for(term in params._source.$field) { if( [$terms_id_inlcude].contains(term.term_id) ) { c.add(term.term_id); }}} return c;" "source" => "def c= ['']; for (int i = 0; i < doc['$field.term_id'].length; ++i) { if( [$terms_id_inlcude].contains(doc['$field.term_id'][i]) ) { c.add(doc['$field.term_id'][i]); } } return c;"
//"source"=> "def c= ['']; if(!params._source.terms.empty && params._source.$field != null) { for(term in params._source.$field) { if( [$terms_id_inlcude].contains(term.term_id) ) { c.add(term.term_id); }}} return c;"
] ]
) )
) )
@ -559,7 +561,8 @@ class Elastic_Press {
"terms" => [ "terms" => [
"script" => [ "script" => [
"lang" => "painless", "lang" => "painless",
"source" => "def c= ['']; if(!params._source.terms.empty && params._source.$field != null) { for(term in params._source.$field) { if(term.parent==$parent) { c.add(term.term_id); }}} return c;" "source" => "for (int i = 0; i < doc['$field.parent'].length; ++i) { if (doc['$field.parent'][i] == 0) { return doc['$field.term_id'][i]; }}",
//"source" => "def c= ['']; if(!params._source.terms.empty && params._source.$field != null) { for(term in params._source.$field) { if(term.parent==$parent) { c.add(term.term_id); }}} return c;"
] ]
] ]
] ]
@ -575,7 +578,8 @@ class Elastic_Press {
"terms" => array( "terms" => array(
"script" => [ "script" => [
"lang" => "painless", "lang" => "painless",
"source"=> "def c= ['']; if(!params._source.terms.empty && params._source.$field != null) { for(term in params._source.$field) { if(term.parent==$parent) { c.add(term.term_id); }}} return c;" "source" => "for (int i = 0; i < doc['$field.parent'].length; ++i) { if (doc['$field.parent'][i] == 0) { return doc['$field.term_id'][i]; }}",
//"source"=> "def c= ['']; if(!params._source.terms.empty && params._source.$field != null) { for(term in params._source.$field) { if(term.parent==$parent) { c.add(term.term_id); }}} return c;"
] ]
) )
) )

102
src/classes/class-tainacan-media.php
View File

@ -9,14 +9,34 @@ class Media {
private static $instance = null; private static $instance = null;
private static $file_handle = null; private static $file_handle = null;
private static $file_name = null; private static $file_name = null;
private $attachment_html_url_base = 'tainacan_attachment_html';
public static function get_instance() { public static function get_instance() {
if(!isset(self::$instance)) { if(!isset(self::$instance)) {
self::$instance = new self(); self::$instance = new self();
} }
return self::$instance; return self::$instance;
} }
protected function __construct() {
add_action( 'init', [$this, 'add_attachment_page_rewrite_rule'] );
add_filter( 'query_vars', [$this, 'attachment_page_add_var'] );
add_action( 'template_redirect', [$this, 'attachment_page'] );
}
public function add_attachment_page_rewrite_rule() {
add_rewrite_rule(
'^' . $this->attachment_html_url_base . '/([0-9]+)/?',
'index.php?tainacan_attachment_page=$matches[1]',
'top'
);
}
public function attachment_page_add_var($vars) {
$vars[] = 'tainacan_attachment_page';
return $vars;
}
/** /**
* Insert an attachment from an URL address. * Insert an attachment from an URL address.
@ -32,7 +52,7 @@ class Media {
return false; return false;
} }
$file = fopen($filename,'r'); $file = file_get_contents($filename);
if (false === $file) { if (false === $file) {
return false; return false;
@ -55,7 +75,7 @@ class Media {
return false; return false;
} }
return $this->insert_attachment_from_blob(fopen($filename,'r'), basename($filename), $post_id); return $this->insert_attachment_from_blob(file_get_contents($filename), basename($filename), $post_id);
} }
@ -273,4 +293,70 @@ class Media {
} }
} }
public function get_attachment_html_url($attachment_id) {
return site_url( $this->attachment_html_url_base . '/' . (int) $attachment_id );
}
public function attachment_page() {
$att_id = get_query_var('tainacan_attachment_page');
if ( ! $att_id ) {
return; // continue normal execution
}
$attachment = get_post($att_id);
if ( $attachment instanceof \WP_Post && $attachment->post_type == 'attachment' ) {
$parent = $attachment->post_parent;
$item = \Tainacan\Repositories\Items::get_instance()->fetch( (int) $parent );
if ( $item instanceof \Tainacan\Entities\Item ) {
if ( ! $item->can_read() ) {
http_response_code(401);
die;
}
} else {
http_response_code(404);
die;
}
} else {
http_response_code(404);
die;
}
$output = '';
if ( wp_attachment_is_image($att_id) ) {
$img = wp_get_attachment_url($attachment->ID, 'large');
$output .= "<img style='max-width: 100%;' src='" . $img . "' />";
} else {
global $wp_embed;
$url = wp_get_attachment_url($att_id);
$embed = $wp_embed->autoembed($url);
if ( $embed == $url ) {
$output .= sprintf("<a href='%s' target='blank'>%s</a>", $url, $url);
} else {
$output .= $embed;
}
}
echo $output;
exit();
}
} }

1
src/classes/class-tainacan-private-files.php
View File

@ -235,6 +235,7 @@ class Private_Files {
$mime_type = \Tainacan\Media::get_instance()->get_mime_content_type($existing_file); $mime_type = \Tainacan\Media::get_instance()->get_mime_content_type($existing_file);
if ($item instanceof \Tainacan\Entities\Item && $item->can_read()) { if ($item instanceof \Tainacan\Entities\Item && $item->can_read()) {
http_response_code(200); //header("HTTP/1.1 200 Ok");
//header('Content-Description: File Transfer'); //header('Content-Description: File Transfer');
//header('Content-Type: application/octet-stream'); //header('Content-Type: application/octet-stream');
header("Content-type: " . $mime_type); header("Content-type: " . $mime_type);

4
src/classes/filter-types/checkbox/Checkbox.vue
View File

@ -63,6 +63,10 @@
'query.metaquery'() { 'query.metaquery'() {
if (!this.isUsingElasticSearch) if (!this.isUsingElasticSearch)
this.loadOptions(); this.loadOptions();
},
facetsFromItemSearch() {
if (this.isUsingElasticSearch)
this.loadOptions();
} }
}, },
mounted() { mounted() {

1
src/classes/filter-types/filter-types-mixin.js
View File

@ -114,7 +114,6 @@ export const dynamicFilterTypeMixin = {
}); });
} else { } else {
let callback = new Promise((resolve) => { let callback = new Promise((resolve) => {
for (const facet in this.facetsFromItemSearch) { for (const facet in this.facetsFromItemSearch) {
if (facet == this.filter.id) if (facet == this.filter.id)

2
src/classes/filter-types/numeric-list-interval/FormNumericListInterval.vue
View File

@ -28,7 +28,7 @@
<div <div
class="options-input" class="options-input"
v-for="(interval, index) of intervals" v-for="(interval, index) of intervals"
:key="index"> :key="0 + index">
<b-field> <b-field>
<b-input <b-input
expanded expanded

4
src/classes/filter-types/selectbox/Selectbox.vue
View File

@ -40,6 +40,10 @@
'query.metaquery'() { 'query.metaquery'() {
if (!this.isUsingElasticSearch) if (!this.isUsingElasticSearch)
this.loadOptions(); this.loadOptions();
},
facetsFromItemSearch() {
if (this.isUsingElasticSearch)
this.loadOptions();
} }
}, },
mounted(){ mounted(){

3
src/classes/filter-types/tainacan-filter-item.vue
View File

@ -36,6 +36,7 @@
:is="filter.filter_type_object.component" :is="filter.filter_type_object.component"
:filter="filter" :filter="filter"
:query="query" :query="query"
:is-using-elastic-search="isUsingElasticSearch"
:is-repository-level="isRepositoryLevel" :is-repository-level="isRepositoryLevel"
:is-loading-items.sync="isLoadingItems" :is-loading-items.sync="isLoadingItems"
@input="onInput" @input="onInput"
@ -63,7 +64,7 @@
mounted() { mounted() {
if (this.isUsingElasticSearch) { if (this.isUsingElasticSearch) {
this.$eventBusSearch.$on('isLoadingItems', isLoadingItems => { this.$eventBusSearch.$on('isLoadingItems', isLoadingItems => {
this.isLoadingOptions = isLoadingItems; this.isLoadingItems = isLoadingItems;
}); });
} }
}, },

1
src/classes/filter-types/taxonomy/Checkbox.vue
View File

@ -149,7 +149,6 @@
this.getOptionsValuesCancel = promise.source; this.getOptionsValuesCancel = promise.source;
} else { } else {
for (const facet in this.facetsFromItemSearch) { for (const facet in this.facetsFromItemSearch) {
if (facet == this.filter.id) { if (facet == this.filter.id) {
if (Array.isArray(this.facetsFromItemSearch[facet])) if (Array.isArray(this.facetsFromItemSearch[facet]))

6
src/classes/metadata-types/date/Date.vue
View File

@ -9,6 +9,7 @@
v-mask="dateMask" v-mask="dateMask"
v-model="dateValue" v-model="dateValue"
@input.native="onInput" @input.native="onInput"
@blur="onBlur"
:placeholder="dateFormat.toLowerCase()" /> :placeholder="dateFormat.toLowerCase()" />
<p <p
v-if="isInvalidDate && dateValue" v-if="isInvalidDate && dateValue"
@ -76,7 +77,10 @@
} else { } else {
this.$emit('input', [null]); this.$emit('input', [null]);
} }
}, 300) }, 300),
onBlur() {
this.$emit('blur');
}
} }
} }
</script> </script>

4
src/classes/metadata-types/numeric/Numeric.vue
View File

@ -4,6 +4,7 @@
:id="metadatum.metadatum.metadata_type_object.component + '-' + metadatum.metadatum.slug" :id="metadatum.metadatum.metadata_type_object.component + '-' + metadatum.metadatum.slug"
:value="value" :value="value"
@input="onInput($event)" @input="onInput($event)"
@blur="onBlur"
type="number" type="number"
lang="en" lang="en"
:step="getStep"/> :step="getStep"/>
@ -27,6 +28,9 @@
methods: { methods: {
onInput(value) { onInput(value) {
this.$emit('input', value); this.$emit('input', value);
},
onBlur() {
this.$emit('blur');
} }
} }
} }

4
src/classes/metadata-types/relationship/Relationship.vue
View File

@ -8,6 +8,7 @@
size="is-small" size="is-small"
icon="magnify" icon="magnify"
@input="onInput" @input="onInput"
@blur="onBlur"
:data="options" :data="options"
:maxtags="maxtags != undefined ? maxtags : (metadatum.metadatum.multiple == 'yes' || allowNew === true ? 100 : 1)" :maxtags="maxtags != undefined ? maxtags : (metadatum.metadatum.multiple == 'yes' || allowNew === true ? 100 : 1)"
autocomplete autocomplete
@ -95,6 +96,9 @@
this.selected = newSelected; this.selected = newSelected;
this.$emit('input', newSelected.map((item) => item.value)); this.$emit('input', newSelected.map((item) => item.value));
}, },
onBlur() {
this.$emit('blur');
},
search: _.debounce(function(query) { search: _.debounce(function(query) {
if ( this.selected.length > 0 && this.metadatum.metadatum.multiple === 'no') if ( this.selected.length > 0 && this.metadatum.metadatum.multiple === 'no')
return ''; return '';

2
src/classes/metadata-types/selectbox/Selectbox.vue
View File

@ -37,7 +37,7 @@
methods: { methods: {
onSelected(value) { onSelected(value) {
this.$emit('input', value); this.$emit('input', value);
}, }
} }
} }
</script> </script>

94
src/classes/metadata-types/tainacan-form-item.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<b-field <b-field
:addons="false" :addons="false"
:message="getErrorMessage" :message="errorMessage"
:type="metadatumTypeMessage"> :type="metadatumTypeMessage">
<span <span
class="collapse-handle" class="collapse-handle"
@ -45,32 +45,36 @@
:is="metadatum.metadatum.metadata_type_object.component" :is="metadatum.metadatum.metadata_type_object.component"
v-model="inputs[0]" v-model="inputs[0]"
:metadatum="metadatum" :metadatum="metadatum"
@input="changeValue()"/> @input="changeValue()"
<template v-if="metadatum.metadatum.multiple == 'yes'"> @blur="performValueChange()"/>
<template v-if="metadatum.metadatum.multiple == 'yes' && inputs.length > 1">
<transition-group <transition-group
name="filter-item" name="filter-item"
class="multiple-inputs"> class="multiple-inputs">
<template <template v-for="(input, index) of inputs">
v-for="(input, index) in inputs.slice(1)"> <component
<component v-if="index > 0"
:key="index" :key="index"
:is="metadatum.metadatum.metadata_type_object.component" :is="metadatum.metadatum.metadata_type_object.component"
v-model="inputs[index]" v-model="inputs[index]"
:metadatum="metadatum" :metadatum="metadatum"
@input="changeValue()"/> @input="changeValue()"
<a @blur="performValueChange()"/>
v-if="index > 0" <a
@click="removeInput(index)" v-if="index > 0"
class="add-link" @click="removeInput(index)"
:key="index"> class="add-link"
<b-icon :key="index">
icon="minus-circle" <b-icon
size="is-small" icon="minus-circle"
type="is-secondary"/> size="is-small"
&nbsp;{{ $i18n.get('label_remove_value') }} type="is-secondary"/>
</a> &nbsp;{{ $i18n.get('label_remove_value') }}
</a>
</template> </template>
</transition-group> </transition-group>
</template>
<template v-if="metadatum.metadatum.multiple == 'yes'">
<a <a
@click="addInput" @click="addInput"
class="is-block add-link"> class="is-block add-link">
@ -90,7 +94,8 @@
:is="metadatum.metadatum.metadata_type_object.component" :is="metadatum.metadatum.metadata_type_object.component"
v-model="inputs" v-model="inputs"
:metadatum="metadatum" :metadatum="metadatum"
@input="changeValue()"/> @input="changeValue()"
@blur="performValueChange()"/>
</div> </div>
</transition> </transition>
</b-field> </b-field>
@ -107,33 +112,33 @@
}, },
data(){ data(){
return { return {
inputs: [] inputs: [],
errorMessage: ''
} }
}, },
computed: { computed: {
getErrorMessage() {
let errorMessage = '';
let errors = eventBus.getErrors(this.metadatum.metadatum.id);
if (errors) {
for (let error of errors) {
for (let index of Object.keys(error))
errorMessage += error[index] + '\n';
}
}
return errorMessage;
},
metadatumTypeMessage() { metadatumTypeMessage() {
return this.getErrorMessage ? 'is-danger' : '' return this.errorMessage ? 'is-danger' : ''
} }
}, },
created() { created() {
this.createInputs(); this.createInputs();
eventBus.$on('updateErrorMessageOf#' + this.metadatum.metadatum.id, (errors) => {
let updatedErrorMessage = '';
if (errors && this.metadatum.metadatum.id == errors.metadatum_id && errors.errors) {
for (let error of errors.errors) {
for (let index of Object.keys(error))
updatedErrorMessage += error[index] + '\n';
}
}
this.errorMessage = updatedErrorMessage;
})
}, },
methods: { methods: {
changeValue: _.debounce(function() { changeValue: _.debounce(function() {
this.performValueChange();
}, 800),
performValueChange() {
if (this.inputs && this.inputs.length > 0 && this.inputs[0] && this.inputs[0].value) { if (this.inputs && this.inputs.length > 0 && this.inputs[0] && this.inputs[0].value) {
let terms = this.inputs.map(term => term.value) let terms = this.inputs.map(term => term.value)
@ -148,7 +153,6 @@
if (equal.length == terms.length && this.metadatum.value.length <= equal.length) if (equal.length == terms.length && this.metadatum.value.length <= equal.length)
return; return;
} }
} else if (this.metadatum.value.constructor.name == 'Object') { } else if (this.metadatum.value.constructor.name == 'Object') {
@ -168,6 +172,8 @@
if (equal.length == this.inputs.length && this.metadatum.value.length <= equal.length) if (equal.length == this.inputs.length && this.metadatum.value.length <= equal.length)
return; return;
} else if (this.inputs && this.inputs.length == 1 && this.inputs[0] == this.metadatum.value) {
return
} }
eventBus.$emit('input', { eventBus.$emit('input', {
@ -175,9 +181,8 @@
metadatumId: this.metadatum.metadatum.id, metadatumId: this.metadatum.metadatum.id,
values: this.inputs ? this.inputs : '' values: this.inputs ? this.inputs : ''
}); });
},
}, 900), createInputs() {
createInputs(){
if (this.metadatum.value instanceof Array) if (this.metadatum.value instanceof Array)
this.inputs = this.metadatum.value.slice(0); this.inputs = this.metadatum.value.slice(0);
else else
@ -195,6 +200,9 @@
const array = ['tainacan-relationship','tainacan-taxonomy']; const array = ['tainacan-relationship','tainacan-taxonomy'];
return !(array.indexOf(component) >= 0 ); return !(array.indexOf(component) >= 0 );
} }
},
beforeDestroy() {
eventBus.$off('updateErrorMessageOf#' + this.metadatum.metadatum.id);
} }
} }
</script> </script>

4
src/classes/metadata-types/taxonomy/Taxonomy.vue
View File

@ -86,10 +86,6 @@
this.valueComponent = values; this.valueComponent = values;
} }
}, },
onInput($event) {
this.valueComponent = $event;
this.$emit('input', this.valueComponent);
},
reload($event) { reload($event) {
if ($event.taxonomyId == this.taxonomyId && $event.metadatumId == this.metadatum.metadatum.id) { if ($event.taxonomyId == this.taxonomyId && $event.metadatumId == this.metadatum.metadatum.id) {
this.valueComponent = $event.values; this.valueComponent = $event.values;

30
src/classes/metadata-types/taxonomy/TaxonomyTaginput.vue
View File

@ -1,8 +1,9 @@
<template> <template>
<div class="block"> <div class="block">
<b-taginput <b-taginput
:id="metadatumComponentId" expanded
:disabled="disabled" :disabled="disabled"
:id="metadatumComponentId"
size="is-small" size="is-small"
icon="magnify" icon="magnify"
:allow-new="false" :allow-new="false"
@ -19,7 +20,20 @@
:loading="isFetching" :loading="isFetching"
:class="{'has-selected': selected != undefined && selected != []}" :class="{'has-selected': selected != undefined && selected != []}"
autocomplete autocomplete
@typing="autoCompleteTerm"/> @typing="autoCompleteTerm">
<template slot-scope="props">
<div class="media">
<div class="media-content">
{{ props.option.label }}
</div>
</div>
</template>
<template
v-if="!isFetching"
slot="empty">
{{ $i18n.get('info_no_terms_found') }}
</template>
</b-taginput>
</div> </div>
</template> </template>
@ -31,7 +45,6 @@
return { return {
selected: [], selected: [],
labels: [], labels: [],
termList: [],
isFetching: false, isFetching: false,
} }
}, },
@ -65,7 +78,6 @@
'getTerms' 'getTerms'
]), ]),
autoCompleteTerm: _.debounce( function(value) { autoCompleteTerm: _.debounce( function(value) {
this.termList = [];
this.labels = []; this.labels = [];
this.isFetching = true; this.isFetching = true;
@ -80,14 +92,16 @@
search: { search: {
searchterm: value searchterm: value
}, },
all: true all: true,
order: 'asc',
offset: 0,
number: 12
}).then((res) => { }).then((res) => {
this.termList = res.terms;
for (let term of this.termList) for (let term of res.terms)
this.labels.push({label: term.name, value: term.id}); this.labels.push({label: term.name, value: term.id});
if (this.termList.length <= 0 && this.allowSelectToCreate) if (res.terms.length <= 0 && this.allowSelectToCreate)
this.labels.push({label: `${value} (${this.$i18n.get('select_to_create')})`, value: value}) this.labels.push({label: `${value} (${this.$i18n.get('select_to_create')})`, value: value})
this.isFetching = false; this.isFetching = false;

6
src/classes/metadata-types/text/Text.vue
View File

@ -3,7 +3,8 @@
:disabled="disabled" :disabled="disabled"
:id="metadatum.metadatum.metadata_type_object.component + '-' + metadatum.metadatum.slug" :id="metadatum.metadatum.metadata_type_object.component + '-' + metadatum.metadatum.slug"
:value="value" :value="value"
@input="onInput($event)"/> @input="onInput($event)"
@blur="onBlur"/>
</template> </template>
<script> <script>
@ -16,6 +17,9 @@
methods: { methods: {
onInput(value) { onInput(value) {
this.$emit('input', value); this.$emit('input', value);
},
onBlur() {
this.$emit('blur');
} }
} }
} }

4
src/classes/metadata-types/textarea/Textarea.vue
View File

@ -4,6 +4,7 @@
:id="metadatum.metadatum.metadata_type_object.component + '-' + metadatum.metadatum.slug" :id="metadatum.metadatum.metadata_type_object.component + '-' + metadatum.metadatum.slug"
:value="value" :value="value"
@input="onInput($event)" @input="onInput($event)"
@blur="onBlur"
type="textarea" /> type="textarea" />
</template> </template>
@ -17,6 +18,9 @@
methods: { methods: {
onInput(value) { onInput(value) {
this.$emit('input', value); this.$emit('input', value);
},
onBlur() {
this.$emit('blur');
} }
} }
} }

3
src/classes/tainacan-creator.php
View File

@ -189,6 +189,9 @@ $Tainacan_Capabilities = \Tainacan\Capabilities::get_instance();
$TainacanPrivateFiles = \Tainacan\Private_Files::get_instance(); $TainacanPrivateFiles = \Tainacan\Private_Files::get_instance();
$TainacanMedia = \Tainacan\Media::get_instance();
if (class_exists('WP_CLI')) { if (class_exists('WP_CLI')) {
$Tainacan_Cli = \Tainacan\Cli::get_instance(); $Tainacan_Cli = \Tainacan\Cli::get_instance();
} }

4
src/gutenberg-blocks/api-client/axios.js
View File

@ -1,9 +1,9 @@
import axios from 'axios'; import axios from 'axios';
const tainacan = axios.create({ const tainacan = axios.create({
baseURL: tainacan_plugin.root baseURL: tainacan_blocks.root
}); });
tainacan.defaults.headers.common['X-WP-Nonce'] = tainacan_plugin.nonce; tainacan.defaults.headers.common['X-WP-Nonce'] = tainacan_blocks.nonce;
export default tainacan; export default tainacan;

18
src/gutenberg-blocks/class-tainacan-gutenberg-block.php
View File

@ -308,13 +308,13 @@ function tainacan_blocks_add_plugin_settings() {
$settings = tainacan_blocks_get_plugin_js_settings(); $settings = tainacan_blocks_get_plugin_js_settings();
wp_localize_script( 'terms-list', 'tainacan_plugin', $settings ); wp_localize_script( 'terms-list', 'tainacan_blocks', $settings );
wp_localize_script( 'items-list', 'tainacan_plugin', $settings ); wp_localize_script( 'items-list', 'tainacan_blocks', $settings );
wp_localize_script( 'dynamic-items-list', 'tainacan_plugin', $settings ); wp_localize_script( 'dynamic-items-list', 'tainacan_blocks', $settings );
wp_localize_script( 'carousel-items-list', 'tainacan_plugin', $settings ); wp_localize_script( 'carousel-items-list', 'tainacan_blocks', $settings );
wp_localize_script( 'carousel-terms-list', 'tainacan_plugin', $settings ); wp_localize_script( 'carousel-terms-list', 'tainacan_blocks', $settings );
wp_localize_script( 'search-bar', 'tainacan_plugin', $settings ); wp_localize_script( 'search-bar', 'tainacan_blocks', $settings );
wp_localize_script( 'collections-list', 'tainacan_plugin', $settings ); wp_localize_script( 'collections-list', 'tainacan_blocks', $settings );
wp_localize_script( 'carousel-collections-list', 'tainacan_plugin', $settings ); wp_localize_script( 'carousel-collections-list', 'tainacan_blocks', $settings );
wp_localize_script( 'facets-list', 'tainacan_plugin', $settings ); wp_localize_script( 'facets-list', 'tainacan_blocks', $settings );
} }

30
src/gutenberg-blocks/gutenberg-blocks-style.scss
View File

@ -5,6 +5,7 @@
} }
.block-control { .block-control {
display: flex; display: flex;
flex-wrap: wrap;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -28,16 +29,25 @@
} }
} }
} }
.components-placeholder__fieldset p { .components-placeholder {
font-size: 0.875rem !important; margin-bottom: 0;
margin-top: -2px; background: #f6f6f6;
fill: #555758;
svg { .components-placeholder__label {
margin-right: 1rem; margin-bottom: 0;
top: 4px; }
position: relative; .components-placeholder__fieldset p {
font-size: 0.875rem !important;
margin: 12px 0;
color: #454647;
fill: #555758; fill: #555758;
svg {
margin-right: 1rem;
top: 4px;
position: relative;
fill: #555758;
}
} }
} }
@ -156,6 +166,10 @@
overflow: hidden; overflow: hidden;
} }
svg.dashicon.components-checkbox-control__checked {
fill: black;
}
.modal-checkbox-list-item, .modal-checkbox-list-item,
.components-radio-control__option { .components-radio-control__option {
display: flex; display: flex;

2
src/gutenberg-blocks/tainacan-collections/carousel-collections-list/carousel-collections-list-theme.vue
View File

@ -250,7 +250,7 @@ export default {
this.collectionsRequestSource = axios.CancelToken.source(); this.collectionsRequestSource = axios.CancelToken.source();
let endpoint = '/collections?'+ qs.stringify({ postin: this.selectedCollections }) + '&fetch_only=name,url,thumbnail'; let endpoint = '/collections?'+ qs.stringify({ postin: this.selectedCollections, perpage: this.selectedCollections.length }) + '&fetch_only=name,url,thumbnail';
this.tainacanAxios.get(endpoint, { cancelToken: this.collectionsRequestSource.token }) this.tainacanAxios.get(endpoint, { cancelToken: this.collectionsRequestSource.token })
.then(response => { .then(response => {

9
src/gutenberg-blocks/tainacan-collections/carousel-collections-list/carousel-collections-list.scss
View File

@ -83,7 +83,7 @@
} }
.wp-block-tainacan-carousel-collections-list { .wp-block-tainacan-carousel-collections-list {
margin: 2rem 0px; margin: 2rem auto;
// Spinner // Spinner
.spinner-container { .spinner-container {
@ -142,7 +142,7 @@
text-decoration: none; text-decoration: none;
padding: 8px 16px; padding: 8px 16px;
display: block; display: block;
line-height: 1.2rem; line-height: 1.2em;
} }
a>img { a>img {
width: 100%; width: 100%;
@ -163,6 +163,7 @@
grid-template-columns: 33% 33% 33%; grid-template-columns: 33% 33% 33%;
grid-template-rows: 50% 50%; grid-template-rows: 50% 50%;
width: 100%; width: 100%;
box-sizing: border-box;
img:first-of-type { img:first-of-type {
flex-basis: 100%; flex-basis: 100%;
@ -206,6 +207,10 @@
} }
} }
&.alignfull .swiper-button-prev, .swiper-button-next {
margin: 0 6px;
}
// Carousel placeholder on editor side ---------------------------------------------------- // Carousel placeholder on editor side ----------------------------------------------------
.collections-list-edit-container, .collections-list-edit-container,
.tainacan-carousel { .tainacan-carousel {

4
src/gutenberg-blocks/tainacan-collections/carousel-collections-list/carousel-collections-modal.js
View File

@ -224,7 +224,7 @@ export default class CollectionsModal extends React.Component {
{ collection.thumbnail ? { collection.thumbnail ?
<img <img
aria-hidden aria-hidden
src={ collection.thumbnail && collection.thumbnail[0] && collection.thumbnail[0].src ? collection.thumbnail[0].src : `${tainacan_plugin.base_url}/admin/images/placeholder_square.png`} src={ collection.thumbnail && collection.thumbnail[0] && collection.thumbnail[0].src ? collection.thumbnail[0].src : `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`}
alt={ collection.thumbnail && collection.thumbnail[0] ? collection.thumbnail[0].alt : collection.name }/> alt={ collection.thumbnail && collection.thumbnail[0] ? collection.thumbnail[0].alt : collection.name }/>
: null : null
} }
@ -257,7 +257,7 @@ export default class CollectionsModal extends React.Component {
{ collection.thumbnail ? { collection.thumbnail ?
<img <img
aria-hidden aria-hidden
src={ collection.thumbnail && collection.thumbnail[0] && collection.thumbnail[0].src ? collection.thumbnail[0].src : `${tainacan_plugin.base_url}/admin/images/placeholder_square.png`} src={ collection.thumbnail && collection.thumbnail[0] && collection.thumbnail[0].src ? collection.thumbnail[0].src : `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`}
alt={ collection.thumbnail && collection.thumbnail[0] ? collection.thumbnail[0].alt : collection.name }/> alt={ collection.thumbnail && collection.thumbnail[0] ? collection.thumbnail[0].alt : collection.name }/>
: null : null
} }

16
src/gutenberg-blocks/tainacan-collections/carousel-collections-list/index.js
View File

@ -150,7 +150,7 @@ registerBlockType('tainacan/carousel-collections-list', {
? ?
collectionItems[0].thumbnail['thumbnail'][0] collectionItems[0].thumbnail['thumbnail'][0]
: :
`${tainacan_plugin.base_url}/admin/images/placeholder_square.png`) `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`)
} }
alt={ collectionItems[0] && collectionItems[0].name ? collectionItems[0].name : __( 'Thumbnail', 'tainacan' ) }/> alt={ collectionItems[0] && collectionItems[0].name ? collectionItems[0].name : __( 'Thumbnail', 'tainacan' ) }/>
<img <img
@ -163,7 +163,7 @@ registerBlockType('tainacan/carousel-collections-list', {
? ?
collectionItems[1].thumbnail['thumbnail'][0] collectionItems[1].thumbnail['thumbnail'][0]
: :
`${tainacan_plugin.base_url}/admin/images/placeholder_square.png`) `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`)
} }
alt={ collectionItems[1] && collectionItems[1].name ? collectionItems[1].name : __( 'Thumbnail', 'tainacan' ) }/> alt={ collectionItems[1] && collectionItems[1].name ? collectionItems[1].name : __( 'Thumbnail', 'tainacan' ) }/>
<img <img
@ -176,7 +176,7 @@ registerBlockType('tainacan/carousel-collections-list', {
? ?
collectionItems[2].thumbnail['thumbnail'][0] collectionItems[2].thumbnail['thumbnail'][0]
: :
`${tainacan_plugin.base_url}/admin/images/placeholder_square.png`) `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`)
} }
alt={ collectionItems[2] && collectionItems[2].name ? collectionItems[2].name : __( 'Thumbnail', 'tainacan' ) }/> alt={ collectionItems[2] && collectionItems[2].name ? collectionItems[2].name : __( 'Thumbnail', 'tainacan' ) }/>
</div> </div>
@ -191,7 +191,7 @@ registerBlockType('tainacan/carousel-collections-list', {
? ?
collection.thumbnail['thumbnail'][0] collection.thumbnail['thumbnail'][0]
: :
`${tainacan_plugin.base_url}/admin/images/placeholder_square.png`) `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`)
} }
alt={ collection.name ? collection.name : __( 'Thumbnail', 'tainacan' ) }/> alt={ collection.name ? collection.name : __( 'Thumbnail', 'tainacan' ) }/>
} }
@ -215,7 +215,7 @@ registerBlockType('tainacan/carousel-collections-list', {
collections = []; collections = [];
let endpoint = '/collections?'+ qs.stringify({ postin: selectedCollections }) + '&fetch_only=name,url,thumbnail'; let endpoint = '/collections?'+ qs.stringify({ postin: selectedCollections, perpage: selectedCollections.length }) + '&fetch_only=name,url,thumbnail';
tainacan.get(endpoint, { cancelToken: itemsRequestSource.token }) tainacan.get(endpoint, { cancelToken: itemsRequestSource.token })
.then(response => { .then(response => {
@ -446,7 +446,7 @@ registerBlockType('tainacan/carousel-collections-list', {
icon={( icon={(
<img <img
width={148} width={148}
src={ `${tainacan_plugin.base_url}/admin/images/tainacan_logo_header.svg` } src={ `${tainacan_blocks.base_url}/admin/images/tainacan_logo_header.svg` }
alt="Tainacan Logo"/> alt="Tainacan Logo"/>
)}> )}>
<p> <p>
@ -542,8 +542,8 @@ registerBlockType('tainacan/carousel-collections-list', {
loop-slides={ '' + loopSlides } loop-slides={ '' + loopSlides }
hide-name={ '' + hideName } hide-name={ '' + hideName }
max-collections-number={ maxCollectionsNumber } max-collections-number={ maxCollectionsNumber }
tainacan-api-root={ tainacan_plugin.root } tainacan-api-root={ tainacan_blocks.root }
tainacan-base-url={ tainacan_plugin.base_url } tainacan-base-url={ tainacan_blocks.base_url }
show-collection-thumbnail={ '' + showCollectionThumbnail } show-collection-thumbnail={ '' + showCollectionThumbnail }
id={ 'wp-block-tainacan-carousel-collections-list_' + blockId }> id={ 'wp-block-tainacan-carousel-collections-list_' + blockId }>
{ content } { content }

10
src/gutenberg-blocks/tainacan-collections/collections-list/collections-list.scss
View File

@ -1,7 +1,7 @@
@import '../../gutenberg-blocks-style.scss'; @import '../../gutenberg-blocks-style.scss';
.wp-block-tainacan-collections-list { .wp-block-tainacan-collections-list {
margin: 2rem 0px; margin: 2rem auto;
// Spinner // Spinner
.components-spinner { .components-spinner {
@ -9,6 +9,14 @@
right: 0; right: 0;
} }
// For all view modes ------------------------------------------------
ul.collections-list li.collection-list-item > button,
ul.collections-list li.collection-list-item > button:hover {
display: none;
visibility: hidden;
opacity: 0;
}
// Grid View Mode ---------------------------------------------------- // Grid View Mode ----------------------------------------------------
ul.collections-list.collections-list-without-margin, ul.collections-list.collections-list-without-margin,
ul.collections-list-edit.collections-list-without-margin { ul.collections-list-edit.collections-list-without-margin {

4
src/gutenberg-blocks/tainacan-collections/collections-list/collections-modal.js
View File

@ -226,7 +226,7 @@ export default class CollectionsModal extends React.Component {
{ collection.thumbnail ? { collection.thumbnail ?
<img <img
aria-hidden aria-hidden
src={ collection.thumbnail && collection.thumbnail[0] && collection.thumbnail[0].src ? collection.thumbnail[0].src : `${tainacan_plugin.base_url}/admin/images/placeholder_square.png`} src={ collection.thumbnail && collection.thumbnail[0] && collection.thumbnail[0].src ? collection.thumbnail[0].src : `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`}
alt={ collection.thumbnail && collection.thumbnail[0] ? collection.thumbnail[0].alt : collection.name }/> alt={ collection.thumbnail && collection.thumbnail[0] ? collection.thumbnail[0].alt : collection.name }/>
: null : null
} }
@ -259,7 +259,7 @@ export default class CollectionsModal extends React.Component {
{ collection.thumbnail ? { collection.thumbnail ?
<img <img
aria-hidden aria-hidden
src={ collection.thumbnail && collection.thumbnail[0] && collection.thumbnail[0].src ? collection.thumbnail[0].src : `${tainacan_plugin.base_url}/admin/images/placeholder_square.png`} src={ collection.thumbnail && collection.thumbnail[0] && collection.thumbnail[0].src ? collection.thumbnail[0].src : `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`}
alt={ collection.thumbnail && collection.thumbnail[0] ? collection.thumbnail[0].alt : collection.name }/> alt={ collection.thumbnail && collection.thumbnail[0] ? collection.thumbnail[0].alt : collection.name }/>
: null : null
} }

4
src/gutenberg-blocks/tainacan-collections/collections-list/index.js
View File

@ -123,7 +123,7 @@ registerBlockType('tainacan/collections-list', {
target="_blank" target="_blank"
className={ (!showName ? 'collection-without-name' : '') + ' ' + (!showImage ? 'collection-without-image' : '') }> className={ (!showName ? 'collection-without-name' : '') + ' ' + (!showImage ? 'collection-without-image' : '') }>
<img <img
src={ collection.thumbnail && collection.thumbnail[0] && collection.thumbnail[0].src ? collection.thumbnail[0].src : `${tainacan_plugin.base_url}/admin/images/placeholder_square.png`} src={ collection.thumbnail && collection.thumbnail[0] && collection.thumbnail[0].src ? collection.thumbnail[0].src : `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`}
alt={ collection.thumbnail && collection.thumbnail[0] ? collection.thumbnail[0].alt : collection.name }/> alt={ collection.thumbnail && collection.thumbnail[0] ? collection.thumbnail[0].alt : collection.name }/>
<span>{ collection.name ? collection.name : '' }</span> <span>{ collection.name ? collection.name : '' }</span>
</a> </a>
@ -304,7 +304,7 @@ registerBlockType('tainacan/collections-list', {
icon={( icon={(
<img <img
width={148} width={148}
src={ `${tainacan_plugin.base_url}/admin/images/tainacan_logo_header.svg` } src={ `${tainacan_blocks.base_url}/admin/images/tainacan_logo_header.svg` }
alt="Tainacan Logo"/> alt="Tainacan Logo"/>
)}> )}>
<p> <p>

139
src/gutenberg-blocks/tainacan-facets/facets-list/facets-list-theme.js
View File

@ -4,72 +4,6 @@ import FacetsListTheme from './facets-list-theme.vue';
// This is rendered on the theme side. // This is rendered on the theme side.
document.addEventListener("DOMContentLoaded", () => { document.addEventListener("DOMContentLoaded", () => {
// Configure Vue logic before passing it to constructor:
let vueOptions = {
data: {
metadatumId: '',
metadatumType: '',
collectionId: '',
collectionSlug: '',
showImage: true,
showItemsCount: true,
showSearchBar: false,
showLoadMore: false,
layout: 'grid',
cloudRate: 1,
gridMargin: 0,
maxFacetsNumber: 12,
tainacanApiRoot: '',
tainacanBaseUrl: '',
tainacanSiteUrl: '',
className: ''
},
render(h){
return h(FacetsListTheme, {
props: {
metadatumId: this.metadatumId,
metadatumType: this.metadatumType,
collectionId: this.collectionId,
collectionSlug: this.collectionSlug,
showImage: this.showImage,
showItemsCount: this.showItemsCount,
showSearchBar: this.showSearchBar,
showLoadMore: this.showLoadMore,
layout: this.layout,
cloudRate: this.cloudRate,
gridMargin: this.gridMargin,
maxFacetsNumber: this.maxFacetsNumber,
tainacanApiRoot: this.tainacanApiRoot,
tainacanBaseUrl: this.tainacanBaseUrl,
tainacanSiteUrl: this.tainacanSiteUrl,
className: this.className
}
});
},
beforeMount () {
this.metadatumId = this.$el.attributes['metadatum-id'] != undefined ? this.$el.attributes['metadatum-id'].value : undefined;
this.metadatumType = this.$el.attributes['metadatum-type'] != undefined ? this.$el.attributes['metadatum-type'].value : undefined;
this.collectionId = this.$el.attributes['collection-id'] != undefined ? this.$el.attributes['collection-id'].value : undefined;
this.collectionSlug = this.$el.attributes['collection-slug'] != undefined ? this.$el.attributes['collection-slug'].value : undefined;
this.showImage = this.$el.attributes['show-image'] != undefined ? this.$el.attributes['show-image'].value == 'true' : true;
this.showItemsCount = this.$el.attributes['show-items-count'] != undefined ? this.$el.attributes['show-items-count'].value == 'true' : true;
this.showSearchBar = this.$el.attributes['show-search-bar'] != undefined ? this.$el.attributes['show-search-bar'].value == 'true' : false;
this.showLoadMore = this.$el.attributes['show-load-more'] != undefined ? this.$el.attributes['show-load-more'].value == 'true' : false;
this.layout = this.$el.attributes['layout'] != undefined ? this.$el.attributes['layout'].value : undefined;
this.cloudRate = this.$el.attributes['cloud-rate'] != undefined ? Number(this.$el.attributes['cloud-rate'].value) : undefined;
this.gridMargin = this.$el.attributes['grid-margin'] != undefined ? Number(this.$el.attributes['grid-margin'].value) : undefined;
this.maxFacetsNumber = this.$el.attributes['max-facets-number'] != undefined ? this.$el.attributes['max-facets-number'].value : undefined;
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
this.tainacanSiteUrl = this.$el.attributes['tainacan-site-url'] != undefined ? this.$el.attributes['tainacan-site-url'].value : undefined;
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
},
methods: {
__(text, domain) {
return wp.i18n.__(text, domain);
}
}
};
// Gets all divs with content created by our block; // Gets all divs with content created by our block;
let blocks = document.getElementsByClassName('wp-block-tainacan-facets-list'); let blocks = document.getElementsByClassName('wp-block-tainacan-facets-list');
@ -78,7 +12,78 @@ document.addEventListener("DOMContentLoaded", () => {
// Creates a new Vue Instance to manage each block isolatelly // Creates a new Vue Instance to manage each block isolatelly
for (let blockId of blockIds) { for (let blockId of blockIds) {
new Vue( Object.assign({ el: '#' + blockId }, jQuery.extend(true, {}, vueOptions)) );
// Configure Vue logic before passing it to constructor:
let vueOptions = {
data: {
metadatumId: '',
metadatumType: '',
collectionId: '',
collectionSlug: '',
parentTermId: null,
showImage: true,
showItemsCount: true,
showSearchBar: false,
showLoadMore: false,
layout: 'grid',
cloudRate: 1,
gridMargin: 0,
maxFacetsNumber: 12,
tainacanApiRoot: '',
tainacanBaseUrl: '',
tainacanSiteUrl: '',
className: ''
},
render(h){
return h(FacetsListTheme, {
props: {
metadatumId: this.metadatumId,
metadatumType: this.metadatumType,
collectionId: this.collectionId,
collectionSlug: this.collectionSlug,
parentTermId: this.parentTermId,
showImage: this.showImage,
showItemsCount: this.showItemsCount,
showSearchBar: this.showSearchBar,
showLoadMore: this.showLoadMore,
layout: this.layout,
cloudRate: this.cloudRate,
gridMargin: this.gridMargin,
maxFacetsNumber: this.maxFacetsNumber,
tainacanApiRoot: this.tainacanApiRoot,
tainacanBaseUrl: this.tainacanBaseUrl,
tainacanSiteUrl: this.tainacanSiteUrl,
className: this.className
}
});
},
beforeMount () {
this.metadatumId = this.$el.attributes['metadatum-id'] != undefined ? this.$el.attributes['metadatum-id'].value : undefined;
this.metadatumType = this.$el.attributes['metadatum-type'] != undefined ? this.$el.attributes['metadatum-type'].value : undefined;
this.collectionId = this.$el.attributes['collection-id'] != undefined ? this.$el.attributes['collection-id'].value : undefined;
this.collectionSlug = this.$el.attributes['collection-slug'] != undefined ? this.$el.attributes['collection-slug'].value : undefined;
this.parentTermId = this.$el.attributes['parent-term-id'] != undefined ? this.$el.attributes['parent-term-id'].value : undefined;
this.showImage = this.$el.attributes['show-image'] != undefined ? this.$el.attributes['show-image'].value == 'true' : true;
this.showItemsCount = this.$el.attributes['show-items-count'] != undefined ? this.$el.attributes['show-items-count'].value == 'true' : true;
this.showSearchBar = this.$el.attributes['show-search-bar'] != undefined ? this.$el.attributes['show-search-bar'].value == 'true' : false;
this.showLoadMore = this.$el.attributes['show-load-more'] != undefined ? this.$el.attributes['show-load-more'].value == 'true' : false;
this.layout = this.$el.attributes['layout'] != undefined ? this.$el.attributes['layout'].value : undefined;
this.cloudRate = this.$el.attributes['cloud-rate'] != undefined ? Number(this.$el.attributes['cloud-rate'].value) : undefined;
this.gridMargin = this.$el.attributes['grid-margin'] != undefined ? Number(this.$el.attributes['grid-margin'].value) : undefined;
this.maxFacetsNumber = this.$el.attributes['max-facets-number'] != undefined ? this.$el.attributes['max-facets-number'].value : undefined;
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
this.tainacanSiteUrl = this.$el.attributes['tainacan-site-url'] != undefined ? this.$el.attributes['tainacan-site-url'].value : undefined;
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
},
methods: {
__(text, domain) {
return wp.i18n.__(text, domain);
}
}
};
new Vue( Object.assign({ el: '#' + blockId }, vueOptions) );
} }
} }
}); });

9
src/gutenberg-blocks/tainacan-facets/facets-list/facets-list-theme.vue
View File

@ -159,6 +159,7 @@ export default {
metadatumType: String, metadatumType: String,
collectionId: String, collectionId: String,
collectionSlug: String, collectionSlug: String,
parentTermId: String,
showImage: Boolean, showImage: Boolean,
showItemsCount: Boolean, showItemsCount: Boolean,
showSearchBar: Boolean, showSearchBar: Boolean,
@ -228,6 +229,14 @@ export default {
if (this.lastTerm != undefined) if (this.lastTerm != undefined)
queryObject.last_term = this.lastTerm; queryObject.last_term = this.lastTerm;
// Set up parentTerm for taxonomies
if (this.parentTermId !== undefined && this.parentTermId !== null && this.parentTermId !== '' && this.metadatumType == 'Taxonomy')
queryObject.parent = this.parentTermId;
else {
delete queryObject.parent;
this.parentTermId = null;
}
// Parameter fo tech entity object with image and url // Parameter fo tech entity object with image and url
queryObject['context'] = 'extended'; queryObject['context'] = 'extended';

7
src/gutenberg-blocks/tainacan-facets/facets-list/facets-list.scss
View File

@ -1,7 +1,7 @@
@import '../../gutenberg-blocks-style.scss'; @import '../../gutenberg-blocks-style.scss';
.wp-block-tainacan-facets-list { .wp-block-tainacan-facets-list {
margin: 2rem 0px; margin: 2rem auto;
// Spinner // Spinner
.spinner-container { .spinner-container {
@ -70,14 +70,15 @@
h3 { h3 {
color: white; color: white;
text-decoration: none; text-decoration: none;
font-size: 1.3rem; font-size: 1.3em;
margin: 0;
&:hover { &:hover {
text-decoration: none; text-decoration: none;
} }
} }
span.label { span.label {
font-weight: normal; font-weight: normal;
font-size: 1rem; font-size: 0.75em;
} }
&.only-collection-name { &.only-collection-name {

258
src/gutenberg-blocks/tainacan-facets/facets-list/index.js
View File

@ -2,11 +2,12 @@ const { registerBlockType } = wp.blocks;
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { RangeControl, Spinner, Button, ToggleControl, Tooltip, Placeholder, Toolbar, PanelBody } = wp.components; const { BaseControl, RangeControl, Spinner, Button, ToggleControl, Tooltip, Placeholder, Toolbar, PanelBody } = wp.components;
const { InspectorControls, BlockControls } = wp.editor; const { InspectorControls, BlockControls } = wp.editor;
import MetadataModal from './metadata-modal.js'; import MetadataModal from './metadata-modal.js';
import ParentTermModal from './parent-term-modal.js';
import tainacan from '../../api-client/axios.js'; import tainacan from '../../api-client/axios.js';
import axios from 'axios'; import axios from 'axios';
import qs from 'qs'; import qs from 'qs';
@ -116,6 +117,14 @@ registerBlockType('tainacan/facets-list', {
type: String, type: String,
default: undefined default: undefined
}, },
parentTerm: {
type: Number,
default: null
},
isParentTermModalOpen: {
type: Boolean,
default: false
}
}, },
supports: { supports: {
align: ['full', 'wide'], align: ['full', 'wide'],
@ -141,7 +150,9 @@ registerBlockType('tainacan/facets-list', {
facetsRequestSource, facetsRequestSource,
maxFacetsNumber, maxFacetsNumber,
searchString, searchString,
isLoading isLoading,
parentTerm,
isParentTermModalOpen
} = attributes; } = attributes;
// Obtains block's client id to render it on save function // Obtains block's client id to render it on save function
@ -165,7 +176,7 @@ registerBlockType('tainacan/facets-list', {
? ?
facet.entity['header_image'] facet.entity['header_image']
: :
`${tainacan_plugin.base_url}/admin/images/placeholder_square.png` `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`
} }
alt={ facet.label ? facet.label : __( 'Thumbnail', 'tainacan' ) }/> alt={ facet.label ? facet.label : __( 'Thumbnail', 'tainacan' ) }/>
: null : null
@ -181,7 +192,7 @@ registerBlockType('tainacan/facets-list', {
? ?
facet.entity.thumbnail['thumbnail'][0] facet.entity.thumbnail['thumbnail'][0]
: :
`${tainacan_plugin.base_url}/admin/images/placeholder_square.png`) `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`)
} }
alt={ facet.label ? facet.label : __( 'Thumbnail', 'tainacan' ) }/> alt={ facet.label ? facet.label : __( 'Thumbnail', 'tainacan' ) }/>
: null : null
@ -231,6 +242,14 @@ registerBlockType('tainacan/facets-list', {
setAttributes({ searchString: undefined }); setAttributes({ searchString: undefined });
} }
// Set up parentTerm for taxonomies
if (parentTerm && parentTerm.id !== undefined && parentTerm.id !== null && parentTerm.id !== '' && metadatumType == 'Taxonomy')
queryObject.parent = parentTerm.id;
else {
delete queryObject.parent;
setAttributes({ parentTerm: null });
}
// Parameter fo tech entity object with image and url // Parameter fo tech entity object with image and url
queryObject['context'] = 'extended'; queryObject['context'] = 'extended';
@ -243,13 +262,13 @@ registerBlockType('tainacan/facets-list', {
if (metadatumType == 'Taxonomy') { if (metadatumType == 'Taxonomy') {
for (let facet of response.data.values) { for (let facet of response.data.values) {
facetsObject.push(Object.assign({ facetsObject.push(Object.assign({
url: facet.entity && facet.entity.url ? facet.entity.url : tainacan_plugin.site_url + '/' + collectionSlug + '/#/?taxquery[0][compare]=IN&taxquery[0][taxonomy]=' + facet.taxonomy + '&taxquery[0][terms][0]=' + facet.value 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
}, facet)); }, facet));
} }
} else { } else {
for (let facet of response.data.values) { for (let facet of response.data.values) {
facetsObject.push(Object.assign({ facetsObject.push(Object.assign({
url: tainacan_plugin.site_url + '/' + collectionSlug + '/#/?metaquery[0][key]=' + metadatumId + '&metaquery[0][value]=' + facet.value url: tainacan_blocks.site_url + '/' + collectionSlug + '/#/?metaquery[0][key]=' + metadatumId + '&metaquery[0][value]=' + facet.value
}, facet)); }, facet));
} }
} }
@ -285,6 +304,13 @@ registerBlockType('tainacan/facets-list', {
} ); } );
} }
function openParentTermModal() {
isParentTermModalOpen = true;
setAttributes( {
isParentTermModalOpen: isParentTermModalOpen
} );
}
function updateLayout(newLayout) { function updateLayout(newLayout) {
layout = newLayout; layout = newLayout;
@ -391,6 +417,25 @@ registerBlockType('tainacan/facets-list', {
max={ 96 } max={ 96 }
/> />
</div> </div>
{ metadatumType == 'Taxonomy' ?
<div>
<BaseControl
id="parent-term-selection"
label={ (parentTerm && (parentTerm.id === '0' || parentTerm.id === 0)) ? __('Showing only:', 'tainacan') : __('Showing children of:', 'tainacan') }
help="Narrow terms to children of a parent term."
>
<span style={{ fontWeight: 'bold' }}>&nbsp;{ parentTerm && parentTerm.name ? parentTerm.name : __('Any term.', 'tainacan') }</span>
<br />
<Button
style={{ margin: '6px auto 16px auto', display: 'block' }}
id="parent-term-selection"
isPrimary
onClick={ () => openParentTermModal() }>
{__('Select parent term', 'tainacan')}
</Button>
</BaseControl>
</div>
: null}
<hr></hr> <hr></hr>
<div> <div>
{ layout == 'list' && (metadatumType == 'Taxonomy' || metadatumType == 'Relationship') ? { layout == 'list' && (metadatumType == 'Taxonomy' || metadatumType == 'Relationship') ?
@ -497,7 +542,8 @@ registerBlockType('tainacan/facets-list', {
setAttributes({ setAttributes({
metadatumId: metadatumId, metadatumId: metadatumId,
metadatumType: metadatumType, metadatumType: metadatumType,
isModalOpen: false isModalOpen: false,
parentTerm: null
}); });
setContent(); setContent();
}} }}
@ -505,6 +551,23 @@ registerBlockType('tainacan/facets-list', {
: null : null
} }
{ isParentTermModalOpen ?
<ParentTermModal
existingFacetId={ parentTerm && parentTerm.id ? parentTerm.id : null }
collectionId={ collectionId }
metadatumId={ metadatumId }
onSelectFacet={ (selectedFacet) => {
parentTerm = selectedFacet.id !== null && selectedFacet.id !== '' && selectedFacet.id !== undefined ? selectedFacet : null
setAttributes({
parentTerm: parentTerm,
isParentTermModalOpen: false
});
setContent();
}}
onCancelSelection={ () => setAttributes({ isParentTermModalOpen: false }) }/>
: null
}
{ facets.length ? ( { facets.length ? (
<div className="block-control"> <div className="block-control">
<p> <p>
@ -523,7 +586,7 @@ registerBlockType('tainacan/facets-list', {
isPrimary isPrimary
type="submit" type="submit"
onClick={ () => openMetadataModal() }> onClick={ () => openMetadataModal() }>
{__('Configure search', 'tainacan')} {__('Select facets', 'tainacan')}
</Button> </Button>
</div> </div>
): null ): null
@ -565,7 +628,7 @@ registerBlockType('tainacan/facets-list', {
icon={( icon={(
<img <img
width={148} width={148}
src={ `${tainacan_plugin.base_url}/admin/images/tainacan_logo_header.svg` } src={ `${tainacan_blocks.base_url}/admin/images/tainacan_logo_header.svg` }
alt="Tainacan Logo"/> alt="Tainacan Logo"/>
)}> )}>
<p> <p>
@ -580,12 +643,32 @@ registerBlockType('tainacan/facets-list', {
</svg> </svg>
{__('List facets from a Tainacan Collection or Repository', 'tainacan')} {__('List facets from a Tainacan Collection or Repository', 'tainacan')}
</p> </p>
<Button {
isPrimary parentTerm && parentTerm.id && metadatumType == 'Taxonomy'?
type="submit" <div style={{ display: 'flex' }}>
onClick={ () => openMetadataModal() }> <Button
{__('Select facets', 'tainacan')} isPrimary
</Button> type="submit"
onClick={ () => openParentTermModal() }>
{__('Change parent term', 'tainacan')}
</Button>
<p style={{ margin: '0 12px' }}>{__('or', 'tainacan')}</p>
<Button
isPrimary
type="submit"
onClick={ () => openMetadataModal() }>
{__('Change facets source', 'tainacan')}
</Button>
</div>
:
<Button
isPrimary
type="submit"
onClick={ () => openMetadataModal() }>
{__('Select facets', 'tainacan')}
</Button>
}
</Placeholder> </Placeholder>
) : null ) : null
} }
@ -638,6 +721,7 @@ registerBlockType('tainacan/facets-list', {
blockId, blockId,
collectionId, collectionId,
collectionSlug, collectionSlug,
parentTerm,
showImage, showImage,
showItemsCount, showItemsCount,
showLoadMore, showLoadMore,
@ -649,13 +733,13 @@ registerBlockType('tainacan/facets-list', {
maxFacetsNumber, maxFacetsNumber,
showSearchBar, showSearchBar,
} = attributes; } = attributes;
return <div return <div
className={ className } className={ className }
metadatum-id={ metadatumId } metadatum-id={ metadatumId }
metadatum-type={ metadatumType } metadatum-type={ metadatumType }
collection-id={ collectionId } collection-id={ collectionId }
collection-slug={ collectionSlug } collection-slug={ collectionSlug }
parent-term-id={ parentTerm ? parentTerm.id : null }
show-image={ '' + showImage } show-image={ '' + showImage }
show-items-count={ '' + showItemsCount } show-items-count={ '' + showItemsCount }
show-search-bar={ '' + showSearchBar } show-search-bar={ '' + showSearchBar }
@ -664,11 +748,145 @@ registerBlockType('tainacan/facets-list', {
cloud-rate={ cloudRate } cloud-rate={ cloudRate }
grid-margin={ gridMargin } grid-margin={ gridMargin }
max-facets-number={ maxFacetsNumber } max-facets-number={ maxFacetsNumber }
tainacan-api-root={ tainacan_plugin.root } tainacan-api-root={ tainacan_blocks.root }
tainacan-base-url={ tainacan_plugin.base_url } tainacan-base-url={ tainacan_blocks.base_url }
tainacan-site-url={ tainacan_plugin.site_url } tainacan-site-url={ tainacan_blocks.site_url }
id={ 'wp-block-tainacan-facets-list_' + blockId }> id={ 'wp-block-tainacan-facets-list_' + blockId }>
{ content } { content }
</div> </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
},
},
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>
}
}
]
}); });

4
src/gutenberg-blocks/tainacan-facets/facets-list/metadata-modal.js
View File

@ -113,7 +113,7 @@ export default class MetadataModal extends React.Component {
let selectedCollection; let selectedCollection;
if (selectedCollectionId == 'default') if (selectedCollectionId == 'default')
selectedCollection = { label: __('Repository items', 'tainacan'), id: 'default', slug: tainacan_plugin.theme_items_list_url.split('/')[tainacan_plugin.theme_items_list_url.split('/').length - 1] }; selectedCollection = { label: __('Repository items', 'tainacan'), id: 'default', slug: tainacan_blocks.theme_items_list_url.split('/')[tainacan_blocks.theme_items_list_url.split('/').length - 1] };
else { else {
selectedCollection = this.state.modalCollections.find((collection) => collection.id == selectedCollectionId) selectedCollection = this.state.modalCollections.find((collection) => collection.id == selectedCollectionId)
if (selectedCollection == undefined) if (selectedCollection == undefined)
@ -387,7 +387,7 @@ export default class MetadataModal extends React.Component {
<RadioControl <RadioControl
className={'repository-radio-option'} className={'repository-radio-option'}
selected={ this.state.temporaryCollectionId } selected={ this.state.temporaryCollectionId }
options={ [{ label: __('Repository items', 'tainacan'), value: 'default', slug: tainacan_plugin.theme_items_list_url.split('/')[tainacan_plugin.theme_items_list_url.split('/').length - 1] }] } options={ [{ label: __('Repository items', 'tainacan'), value: 'default', slug: tainacan_blocks.theme_items_list_url.split('/')[tainacan_blocks.theme_items_list_url.split('/').length - 1] }] }
onChange={ ( aCollectionId ) => { onChange={ ( aCollectionId ) => {
this.setState({ temporaryCollectionId: aCollectionId }); this.setState({ temporaryCollectionId: aCollectionId });
} } /> } } />

276
src/gutenberg-blocks/tainacan-facets/facets-list/parent-term-modal.js Normal file
View File

@ -0,0 +1,276 @@
import tainacan from '../../api-client/axios.js';
import axios from 'axios';
const { __ } = wp.i18n;
const { TextControl, Button, Modal, RadioControl, SelectControl, Spinner } = wp.components;
export default class ParentTermModal extends React.Component {
constructor(props) {
super(props);
// Initialize state
this.state = {
metadatumId: '',
facetsPerPage: 3,
facetId: undefined,
isLoadingFacets: false,
modalFacets: [],
totalModalFacets: 0,
offset: 0,
lastTerm: undefined,
temporaryFacetId: '',
searchFacetName: '',
facets: [],
facetsRequestSource: undefined
};
// Bind events
this.selectFacet = this.selectFacet.bind(this);
this.fetchFacets = this.fetchFacets.bind(this);
this.fetchModalFacets = this.fetchModalFacets.bind(this);
}
componentWillMount() {
this.setState({
collectionId: this.props.collectionId,
metadatumId: this.props.metadatumId,
temporaryFacetId: this.props.existingFacetId,
facetId: this.props.existingFacetId,
offset: 0,
lastTerm: undefined
});
this.fetchModalFacets();
}
// COLLECTIONS RELATED --------------------------------------------------
fetchModalFacets() {
let someModalFacets = this.state.modalFacets;
if (this.state.offset == 0)
someModalFacets = [];
let endpoint = '/facets/' + this.props.metadatumId + '?number=' + this.state.facetsPerPage + '&offset=' + this.state.offset;
if (this.state.collectionId)
endpoint = '/collection/' + this.props.collectionId + endpoint;
if (this.state.lastTerm != undefined)
endpoint += 'last_term=' + this.state.lastTerm
this.setState({
isLoadingFacets: true,
modalFacets: someModalFacets
});
tainacan.get(endpoint)
.then(response => {
let otherModalFacets = this.state.modalFacets;
for (let facet of response.data.values) {
otherModalFacets.push({
name: facet.label,
id: facet.value
});
}
this.setState({
isLoadingFacets: false,
modalFacets: otherModalFacets,
totalModalFacets: response.headers['x-wp-total'],
offset: this.state.offset + response.data.values.length,
lastTerm: response.data.last_term
});
return otherModalFacets;
})
.catch(error => {
console.log('Error trying to fetch facets: ' + error);
});
}
selectFacet(selectedFacetId) {
let selectedFacet;
if (selectedFacetId === null || selectedFacetId === '')
selectedFacet = { name: __('Any term.', 'tainacan'), id: null };
else if (selectedFacetId == '0' || selectedFacet == 0)
selectedFacet = { name: __('Root terms', 'tainacan'), id: '0' };
else {
selectedFacet = this.state.modalFacets.find((facet) => facet.id == selectedFacetId)
if (selectedFacet == undefined)
selectedFacet = this.state.facets.find((facet) => facet.id == selectedFacetId)
}
this.setState({
facetId: selectedFacet.id
});
this.props.onSelectFacet(selectedFacet);
}
fetchFacets(name) {
if (this.state.facetsRequestSource != undefined)
this.state.facetsRequestSource.cancel('Previous facets search canceled.');
let aFacetRequestSource = axios.CancelToken.source();
this.setState({
facetsRequestSource: aFacetRequestSource,
isLoadingFacets: true,
facets: [],
metadata: []
});
let endpoint = '/facets/' + this.props.metadatumId + '?number=' + this.state.facetsPerPage;
if (this.state.collectionId)
endpoint = '/collection/' + this.props.collectionId + endpoint;
if (name != undefined && name != '')
endpoint += '&search=' + name;
tainacan.get(endpoint, { cancelToken: aFacetRequestSource.token })
.then(response => {
let someFacets = response.data.values.map((facet) => ({ name: facet.label, id: facet.value + '' }));
this.setState({
isLoadingFacets: false,
facets: someFacets
});
return someFacets;
})
.catch(error => {
console.log('Error trying to fetch facets: ' + error);
});
}
cancelSelection() {
this.setState({
modalFacets: []
});
this.props.onCancelSelection();
}
render() {
return (
// Facets modal
<Modal
className="wp-block-tainacan-modal"
title={__('Select a parent term to fetch facets from', 'tainacan')}
onRequestClose={ () => this.cancelSelection() }
contentLabel={__('Select term', 'tainacan')}>
<div>
<div className="modal-search-area">
<TextControl
label={__('Search for a term', 'tainacan')}
placeholder={ __('Search by term\'s name', 'tainacan') }
value={ this.state.searchFacetName }
onChange={(value) => {
this.setState({
searchFacetName: value
});
_.debounce(this.fetchFacets(value), 300);
}}/>
</div>
{(
this.state.searchFacetName != '' ? (
this.state.facets.length > 0 ?
(
<div>
<div className="modal-radio-list">
{
<RadioControl
selected={ this.state.temporaryFacetId }
options={
this.state.facets.map((facet) => {
return { label: facet.name, value: '' + facet.id }
})
}
onChange={ ( aFacetId ) => {
this.setState({ temporaryFacetId: aFacetId });
} } />
}
</div>
<br/>
</div>
) :
this.state.isLoadingFacets ? (
<Spinner />
) :
<div className="modal-loadmore-section">
<p>{ __('Sorry, no term found.', 'tainacan') }</p>
</div>
):
this.state.modalFacets.length > 0 ?
(
<div>
<div className="modal-radio-list">
<p class="modal-radio-area-label">{__('Non specific term', 'tainacan')}</p>
<RadioControl
className={'repository-radio-option'}
selected={ this.state.temporaryFacetId }
options={ [
{ label: __('Terms children of any term', 'tainacan'), value: '' },
{ label: __('Terms with no parent (root terms)', 'tainacan'), value: '0' }
] }
onChange={ ( aFacetId ) => {
this.setState({ temporaryFacetId: aFacetId});
} } />
<hr/>
<p class="modal-radio-area-label">{__('Terms', 'tainacan')}</p>
<RadioControl
selected={ this.state.temporaryFacetId }
options={
this.state.modalFacets.map((facet) => {
return { label: facet.name, value: '' + facet.id }
})
}
onChange={ ( aFacetId ) => {
this.setState({ temporaryFacetId: aFacetId });
} } />
</div>
<div className="modal-loadmore-section">
<p>{ __('Showing', 'tainacan') + " " + this.state.modalFacets.length + " " + __('of', 'tainacan') + " " + this.state.totalModalFacets + " " + __('terms', 'tainacan') + "."}</p>
{
this.state.modalFacets.length < this.state.totalModalFacets ? (
<Button
isDefault
isSmall
onClick={ () => this.fetchModalFacets() }>
{__('Load more', 'tainacan')}
</Button>
) : null
}
</div>
</div>
) : this.state.isLoadingFacets ? <Spinner/> :
<div className="modal-loadmore-section">
<p>{ __('Sorry, no terms found.', 'tainacan') }</p>
</div>
)}
<div className="modal-footer-area">
<Button
isDefault
onClick={ () => { this.cancelSelection() }}>
{__('Cancel', 'tainacan')}
</Button>
<Button
isPrimary
onClick={ () => { this.selectFacet(this.state.temporaryFacetId) } }>
{__('Select term', 'tainacan')}
</Button>
</div>
</div>
</Modal>
);
}
}

2
src/gutenberg-blocks/tainacan-items/carousel-items-list/carousel-items-list-theme.vue
View File

@ -261,7 +261,7 @@ export default {
this.itemsRequestSource = axios.CancelToken.source(); this.itemsRequestSource = axios.CancelToken.source();
if (this.loadStrategy == 'selection') { if (this.loadStrategy == 'selection') {
let endpoint = '/collection/' + this.collectionId + '/items?' + qs.stringify({ postin: this.selectedItems }) + '&fetch_only=title,url,thumbnail'; let endpoint = '/collection/' + this.collectionId + '/items?' + qs.stringify({ postin: this.selectedItems, perpage: this.selectedItems.length }) + '&fetch_only=title,url,thumbnail';
this.tainacanAxios.get(endpoint, { cancelToken: this.itemsRequestSource.token }) this.tainacanAxios.get(endpoint, { cancelToken: this.itemsRequestSource.token })
.then(response => { .then(response => {

9
src/gutenberg-blocks/tainacan-items/carousel-items-list/carousel-items-list.scss
View File

@ -1,7 +1,7 @@
@import '../../gutenberg-blocks-style.scss'; @import '../../gutenberg-blocks-style.scss';
.wp-block-tainacan-carousel-items-list { .wp-block-tainacan-carousel-items-list {
margin: 2rem 0px; margin: 2rem auto;
// Spinner // Spinner
.spinner-container { .spinner-container {
@ -72,14 +72,15 @@
h3 { h3 {
color: white; color: white;
text-decoration: none; text-decoration: none;
font-size: 1.3rem; font-size: 1.3em;
margin: 0;
&:hover { &:hover {
text-decoration: none; text-decoration: none;
} }
} }
span.label { span.label {
font-weight: normal; font-weight: normal;
font-size: 1rem; font-size: 0.75em;
} }
&.only-collection-name { &.only-collection-name {
@ -152,7 +153,7 @@
text-decoration: none; text-decoration: none;
padding: 8px 16px; padding: 8px 16px;
display: block; display: block;
line-height: 1.2rem; line-height: 1.2em;
} }
a>img { a>img {
width: 100%; width: 100%;

4
src/gutenberg-blocks/tainacan-items/carousel-items-list/carousel-items-modal.js
View File

@ -47,7 +47,7 @@ export default class CarouselItemsModal extends React.Component {
if (this.props.existingCollectionId != null && this.props.existingCollectionId != undefined) { if (this.props.existingCollectionId != null && this.props.existingCollectionId != undefined) {
this.fetchCollection(this.props.existingCollectionId); this.fetchCollection(this.props.existingCollectionId);
this.setState({ this.setState({
searchURL: this.props.existingSearchURL ? this.props.existingSearchURL : tainacan_plugin.admin_url + 'admin.php?page=tainacan_admin#/collections/'+ this.props.existingCollectionId + (this.props.loadStrategy == 'search' ? '/items/?iframemode=true&readmode=true' : '/items/?iframemode=true') }); searchURL: this.props.existingSearchURL ? this.props.existingSearchURL : tainacan_blocks.admin_url + 'admin.php?page=tainacan_admin#/collections/'+ this.props.existingCollectionId + (this.props.loadStrategy == 'search' ? '/items/?iframemode=true&readmode=true' : '/items/?iframemode=true') });
} else { } else {
this.setState({ collectionPage: 1 }); this.setState({ collectionPage: 1 });
this.fetchModalCollections(); this.fetchModalCollections();
@ -114,7 +114,7 @@ export default class CarouselItemsModal extends React.Component {
selectCollection(selectedCollectionId) { selectCollection(selectedCollectionId) {
this.setState({ this.setState({
collectionId: selectedCollectionId, collectionId: selectedCollectionId,
searchURL: tainacan_plugin.admin_url + 'admin.php?page=tainacan_admin#/collections/' + selectedCollectionId + (this.props.loadStrategy == 'search' ? '/items/?iframemode=true&readmode=true' : '/items/?iframemode=true') searchURL: tainacan_blocks.admin_url + 'admin.php?page=tainacan_admin#/collections/' + selectedCollectionId + (this.props.loadStrategy == 'search' ? '/items/?iframemode=true&readmode=true' : '/items/?iframemode=true')
}); });
this.props.onSelectCollection(selectedCollectionId); this.props.onSelectCollection(selectedCollectionId);

10
src/gutenberg-blocks/tainacan-items/carousel-items-list/index.js
View File

@ -176,7 +176,7 @@ registerBlockType('tainacan/carousel-items-list', {
? ?
item.thumbnail['thumbnail'][0] item.thumbnail['thumbnail'][0]
: :
`${tainacan_plugin.base_url}/admin/images/placeholder_square.png`) `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`)
} }
alt={ item.title ? item.title : __( 'Thumbnail', 'tainacan' ) }/> alt={ item.title ? item.title : __( 'Thumbnail', 'tainacan' ) }/>
{ !hideTitle ? <span>{ item.title ? item.title : '' }</span> : null } { !hideTitle ? <span>{ item.title ? item.title : '' }</span> : null }
@ -200,7 +200,7 @@ registerBlockType('tainacan/carousel-items-list', {
items = []; items = [];
if (loadStrategy == 'selection') { if (loadStrategy == 'selection') {
let endpoint = '/collection/' + collectionId + '/items?'+ qs.stringify({ postin: selectedItems }) + '&fetch_only=title,url,thumbnail'; let endpoint = '/collection/' + collectionId + '/items?'+ qs.stringify({ postin: selectedItems, perpage: selectedItems.length }) + '&fetch_only=title,url,thumbnail';
tainacan.get(endpoint, { cancelToken: itemsRequestSource.token }) tainacan.get(endpoint, { cancelToken: itemsRequestSource.token })
.then(response => { .then(response => {
@ -607,7 +607,7 @@ registerBlockType('tainacan/carousel-items-list', {
icon={( icon={(
<img <img
width={148} width={148}
src={ `${tainacan_plugin.base_url}/admin/images/tainacan_logo_header.svg` } src={ `${tainacan_blocks.base_url}/admin/images/tainacan_logo_header.svg` }
alt="Tainacan Logo"/> alt="Tainacan Logo"/>
)}> )}>
<p> <p>
@ -727,8 +727,8 @@ registerBlockType('tainacan/carousel-items-list', {
collection-background-color={ collectionBackgroundColor } collection-background-color={ collectionBackgroundColor }
collection-text-color={ collectionTextColor } collection-text-color={ collectionTextColor }
max-items-number={ maxItemsNumber } max-items-number={ maxItemsNumber }
tainacan-api-root={ tainacan_plugin.root } tainacan-api-root={ tainacan_blocks.root }
tainacan-base-url={ tainacan_plugin.base_url } tainacan-base-url={ tainacan_blocks.base_url }
id={ 'wp-block-tainacan-carousel-items-list_' + blockId }> id={ 'wp-block-tainacan-carousel-items-list_' + blockId }>
{ content } { content }
</div> </div>

155
src/gutenberg-blocks/tainacan-items/dynamic-items-list/dynamic-items-list-theme.js
View File

@ -4,73 +4,6 @@ import DynamicItemsListTheme from './dynamic-items-list-theme.vue';
// This is rendered on the theme side. // This is rendered on the theme side.
document.addEventListener("DOMContentLoaded", () => { document.addEventListener("DOMContentLoaded", () => {
// Configure Vue logic before passing it to constructor:
let vueOptions = {
data: {
collectionId: '',
showImage: true,
showName: true,
layout: 'grid',
gridMargin: 0,
searchURL: '',
maxItemsNumber: 12,
order: 'asc',
showSearchBar: false,
showCollectionHeader: false,
showCollectionLabel: false,
collectionBackgroundColor: '#454647',
collectionTextColor: '#ffffff',
tainacanApiRoot: '',
tainacanBaseUrl: '',
className: ''
},
render(h){
return h(DynamicItemsListTheme, {
props: {
collectionId: this.collectionId,
showImage: this.showImage,
showName: this.showName,
layout: this.layout,
gridMargin: this.gridMargin,
searchURL: this.searchURL,
maxItemsNumber: this.maxItemsNumber,
order: this.order,
showSearchBar: this.showSearchBar,
showCollectionHeader: this.showCollectionHeader,
showCollectionLabel: this.showCollectionLabel,
collectionBackgroundColor: this.collectionBackgroundColor,
collectionTextColor: this.collectionTextColor,
tainacanApiRoot: this.tainacanApiRoot,
tainacanBaseUrl: this.tainacanBaseUrl,
className: this.className
}
});
},
beforeMount () {
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
this.searchURL = this.$el.attributes['search-url'] != undefined ? this.$el.attributes['search-url'].value : undefined;
this.collectionId = this.$el.attributes['collection-id'] != undefined ? this.$el.attributes['collection-id'].value : undefined;
this.showImage = this.$el.attributes['show-image'] != undefined ? this.$el.attributes['show-image'].value == 'true' : true;
this.showName = this.$el.attributes['show-name'] != undefined ? this.$el.attributes['show-name'].value == 'true' : true;
this.layout = this.$el.attributes['layout'] != undefined ? this.$el.attributes['layout'].value : undefined;
this.gridMargin = this.$el.attributes['grid-margin'] != undefined ? Number(this.$el.attributes['grid-margin'].value) : undefined;
this.maxItemsNumber = this.$el.attributes['max-items-number'] != undefined ? this.$el.attributes['max-items-number'].value : undefined;
this.order = this.$el.attributes['order'] != undefined ? this.$el.attributes['order'].value : undefined;
this.showSearchBar = this.$el.attributes['show-search-bar'] != undefined ? this.$el.attributes['show-search-bar'].value == 'true' : false;
this.showCollectionHeader = this.$el.attributes['show-collection-header'] != undefined ? this.$el.attributes['show-collection-header'].value == 'true' : false;
this.showCollectionLabel = this.$el.attributes['show-collection-label'] != undefined ? this.$el.attributes['show-collection-label'].value == 'true' : false;
this.collectionBackgroundColor = this.$el.attributes['collection-background-color'] != undefined ? this.$el.attributes['collection-background-color'].value : undefined;
this.collectionTextColor = this.$el.attributes['collection-text-color'] != undefined ? this.$el.attributes['collection-text-color'].value : undefined;
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
},
methods: {
__(text, domain) {
return wp.i18n.__(text, domain);
}
}
};
// Gets all divs with content created by our block; // Gets all divs with content created by our block;
let blocks = document.getElementsByClassName('wp-block-tainacan-dynamic-items-list'); let blocks = document.getElementsByClassName('wp-block-tainacan-dynamic-items-list');
@ -79,7 +12,93 @@ document.addEventListener("DOMContentLoaded", () => {
// Creates a new Vue Instance to manage each block isolatelly // Creates a new Vue Instance to manage each block isolatelly
for (let blockId of blockIds) { for (let blockId of blockIds) {
new Vue( Object.assign({ el: '#' + blockId }, jQuery.extend(true, {}, vueOptions)) );
// Configure Vue logic before passing it to constructor:
let vueOptions = {
data: {
collectionId: '',
showImage: true,
showName: true,
layout: 'grid',
gridMargin: 0,
searchURL: '',
maxItemsNumber: 12,
mosaicHeight: 40,
mosaicDensity: 5,
mosaicGridRows: 3,
mosaicGridColumns: 3,
mosaicItemFocalPointX : 0.5,
mosaicItemFocalPointY : 0.5,
order: 'asc',
showSearchBar: false,
showCollectionHeader: false,
showCollectionLabel: false,
collectionBackgroundColor: '#454647',
collectionTextColor: '#ffffff',
tainacanApiRoot: '',
tainacanBaseUrl: '',
className: ''
},
render(h){
return h(DynamicItemsListTheme, {
props: {
collectionId: this.collectionId,
showImage: this.showImage,
showName: this.showName,
layout: this.layout,
gridMargin: this.gridMargin,
mosaicDensity: this.mosaicDensity,
mosaicHeight: this.mosaicHeight,
mosaicGridRows: this.mosaicGridRows,
mosaicGridColumns: this.mosaicGridColumns,
mosaicItemFocalPointX: this.mosaicItemFocalPointX,
mosaicItemFocalPointY: this.mosaicItemFocalPointY,
searchURL: this.searchURL,
maxItemsNumber: this.maxItemsNumber,
order: this.order,
showSearchBar: this.showSearchBar,
showCollectionHeader: this.showCollectionHeader,
showCollectionLabel: this.showCollectionLabel,
collectionBackgroundColor: this.collectionBackgroundColor,
collectionTextColor: this.collectionTextColor,
tainacanApiRoot: this.tainacanApiRoot,
tainacanBaseUrl: this.tainacanBaseUrl,
className: this.className
}
});
},
beforeMount () {
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
this.searchURL = this.$el.attributes['search-url'] != undefined ? this.$el.attributes['search-url'].value : undefined;
this.collectionId = this.$el.attributes['collection-id'] != undefined ? this.$el.attributes['collection-id'].value : undefined;
this.showImage = this.$el.attributes['show-image'] != undefined ? this.$el.attributes['show-image'].value == 'true' : true;
this.showName = this.$el.attributes['show-name'] != undefined ? this.$el.attributes['show-name'].value == 'true' : true;
this.layout = this.$el.attributes['layout'] != undefined ? this.$el.attributes['layout'].value : undefined;
this.gridMargin = this.$el.attributes['grid-margin'] != undefined ? Number(this.$el.attributes['grid-margin'].value) : undefined;
this.mosaicDensity = this.$el.attributes['mosaic-density'] != undefined ? Number(this.$el.attributes['mosaic-density'].value) : undefined;
this.mosaicHeight = this.$el.attributes['mosaic-height'] != undefined ? Number(this.$el.attributes['mosaic-height'].value) : undefined;
this.mosaicGridRows = this.$el.attributes['mosaic-grid-rows'] != undefined ? Number(this.$el.attributes['mosaic-grid-rows'].value) : undefined;
this.mosaicGridColumns = this.$el.attributes['mosaic-grid-columns'] != undefined ? Number(this.$el.attributes['mosaic-grid-columns'].value) : undefined;
this.mosaicItemFocalPointX = this.$el.attributes['mosaic-item-focal-point-x'] != undefined ? Number(this.$el.attributes['mosaic-item-focal-point-x'].value) : undefined;
this.mosaicItemFocalPointY = this.$el.attributes['mosaic-item-focal-point-y'] != undefined ? Number(this.$el.attributes['mosaic-item-focal-point-y'].value) : undefined;
this.maxItemsNumber = this.$el.attributes['max-items-number'] != undefined ? this.$el.attributes['max-items-number'].value : undefined;
this.order = this.$el.attributes['order'] != undefined ? this.$el.attributes['order'].value : undefined;
this.showSearchBar = this.$el.attributes['show-search-bar'] != undefined ? this.$el.attributes['show-search-bar'].value == 'true' : false;
this.showCollectionHeader = this.$el.attributes['show-collection-header'] != undefined ? this.$el.attributes['show-collection-header'].value == 'true' : false;
this.showCollectionLabel = this.$el.attributes['show-collection-label'] != undefined ? this.$el.attributes['show-collection-label'].value == 'true' : false;
this.collectionBackgroundColor = this.$el.attributes['collection-background-color'] != undefined ? this.$el.attributes['collection-background-color'].value : undefined;
this.collectionTextColor = this.$el.attributes['collection-text-color'] != undefined ? this.$el.attributes['collection-text-color'].value : undefined;
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
},
methods: {
__(text, domain) {
return wp.i18n.__(text, domain);
}
}
};
new Vue( Object.assign({ el: '#' + blockId }, vueOptions) );
} }
} }
}); });

144
src/gutenberg-blocks/tainacan-items/dynamic-items-list/dynamic-items-list-theme.vue
View File

@ -147,26 +147,47 @@
</span> </span>
</button> </button>
</div> </div>
<ul <template v-if="isLoading">
v-if="isLoading" <ul
:style="{ v-if="layout !== 'mosaic'"
gridTemplateColumns: layout == 'grid' ? 'repeat(auto-fill, ' + (gridMargin + (showName ? 220 : 185)) + 'px)' : 'inherit', :style="{
marginTop: showSearchBar || showCollectionHeader ? '1.34rem' : '0px' gridTemplateColumns: layout == 'grid' ? 'repeat(auto-fill, ' + (gridMargin + (showName ? 220 : 185)) + 'px)' : 'inherit',
}" marginTop: showSearchBar || showCollectionHeader ? '1.34rem' : '0px'
class="items-list" }"
:class="'items-layout-' + layout + (!showName ? ' items-list-without-margin' : '')"> class="items-list"
<li :class="'items-layout-' + layout + (!showName ? ' items-list-without-margin' : '')">
:key="item" <li
v-for="item in Number(maxItemsNumber)" :key="item"
class="item-list-item skeleton" v-for="item in Number(maxItemsNumber)"
class="item-list-item skeleton"
:style="{
marginBottom: layout == 'grid' ? (showName ? gridMargin + 12 : gridMargin) + 'px' : '',
height: layout == 'grid' ? '230px' : '54px'
}" />
</ul>
<ul
v-if="layout === 'mosaic'"
:style="{
marginTop: showSearchBar || showCollectionHeader ? '-' + (Number(gridMargin)/2) : '0px',
padding: '0 ' + (Number(gridMargin)/4) + 'px',
minHeight: layout === 'mosaic' ? mosaicHeight + 'px' : ''
}"
class="items-list"
:class="'items-layout-' + layout + (!showName ? ' items-list-without-margin' : '')">
<div
:style="{ :style="{
marginBottom: layout == 'grid' ? (showName ? gridMargin + 12 : gridMargin) + 'px' : '', width: 'calc((100% / ' + mosaicPartition(items).length + ') - ' + gridMargin + 'px)',
height: layout == 'grid' ? '230px' : '54px' height: 'calc(((' + (mosaicGridRows - 1) + ' * ' + gridMargin + 'px) + ' + mosaicHeight + 'px))',
}" /> margin: gridMargin + 'px'
</ul> }"
class="mosaic-container skeleton"
:key="mosaicIndex"
v-for="(mosaicGroup, mosaicIndex) of mosaicPartition(items)" />
</ul>
</template>
<div v-else> <div v-else>
<ul <ul
v-if="items.length > 0" v-if="items.length > 0 && layout !== 'mosaic'"
:style="{ :style="{
gridTemplateColumns: layout == 'grid' ? 'repeat(auto-fill, ' + (gridMargin + (showName ? 220 : 185)) + 'px)' : 'inherit', gridTemplateColumns: layout == 'grid' ? 'repeat(auto-fill, ' + (gridMargin + (showName ? 220 : 185)) + 'px)' : 'inherit',
marginTop: showSearchBar || showCollectionHeader ? '1.35rem' : '0px' marginTop: showSearchBar || showCollectionHeader ? '1.35rem' : '0px'
@ -177,31 +198,64 @@
:key="index" :key="index"
v-for="(item, index) of items" v-for="(item, index) of items"
class="item-list-item" class="item-list-item"
:style="{ marginBottom: layout == 'grid' ? (showName ? gridMargin + 12 : gridMargin) + 'px' : ''}"> :style="{ marginBottom: layout == 'grid' ? (showName ? gridMargin + 12 : gridMargin) + 'px' : '' }">
<a <a
:id="isNaN(item.id) ? item.id : 'item-id-' + item.id" :id="isNaN(item.id) ? item.id : 'item-id-' + item.id"
:href="item.url" :href="item.url"
target="_blank" target="_blank"
:class="(!showName ? 'item-without-title' : '') + ' ' + (!showImage ? 'item-without-image' : '')"> :class="(!showName ? 'item-without-title' : '') + ' ' + (!showImage ? 'item-without-image' : '')">
<img <img
:src=" :src="getItemThumbnail(item, 'tainacan-medium')"
item.thumbnail && item.thumbnail['tainacan-medium'][0] && item.thumbnail['tainacan-medium'][0]
?
item.thumbnail['tainacan-medium'][0]
:
(item.thumbnail && item.thumbnail['thumbnail'][0] && item.thumbnail['thumbnail'][0]
?
item.thumbnail['thumbnail'][0]
:
`${tainacanBaseUrl}/admin/images/placeholder_square.png`)
"
:alt="item.title ? item.title : $root.__('Thumbnail', 'tainacan')"> :alt="item.title ? item.title : $root.__('Thumbnail', 'tainacan')">
<span>{{ item.title ? item.title : '' }}</span> <span>{{ item.title ? item.title : '' }}</span>
</a> </a>
</li> </li>
</ul> </ul>
<ul
v-if="items.length > 0 && layout === 'mosaic'"
:style="{
marginTop: showSearchBar || showCollectionHeader ? '-' + (Number(gridMargin)/2) : '0px',
padding: '0 ' + (Number(gridMargin)/4) + 'px',
minHeight: layout === 'mosaic' ? mosaicHeight + 'px' : ''
}"
class="items-list"
:class="'items-layout-' + layout + (!showName ? ' items-list-without-margin' : '')">
<div
:style="{
width: 'calc((100% / ' + mosaicPartition(items).length + ') - ' + gridMargin + 'px)',
height: 'calc(((' + (mosaicGridRows - 1) + ' * ' + gridMargin + 'px) + ' + mosaicHeight + 'px))',
gridTemplateColumns: 'repeat(' + mosaicGridColumns + ', calc((100% / ' + mosaicGridColumns + ') - (' + ((mosaicGridColumns - 1)*Number(gridMargin)) + 'px/' + mosaicGridColumns + ')))',
margin: gridMargin + 'px',
gridGap: gridMargin + 'px',
}"
class="mosaic-container"
:class="'mosaic-container--' + mosaicGroup.length + '-' + mosaicGridRows + 'x' + mosaicGridColumns"
:key="mosaicIndex"
v-for="(mosaicGroup, mosaicIndex) of mosaicPartition(items)">
<li
:key="index"
v-for="(item, index) of mosaicGroup"
class="item-list-item"
:style="{
backgroundImage: layout == 'mosaic' ? `url(${getItemThumbnail(item, 'medium_large')})` : 'none',
backgroundPosition: layout == 'mosaic' ? `${ mosaicItemFocalPointX * 100 }% ${ mosaicItemFocalPointY * 100 }%` : 'none'
}">
<a
:id="isNaN(item.id) ? item.id : 'item-id-' + item.id"
:href="item.url"
target="_blank"
:class="(!showName ? 'item-without-title' : '') + ' ' + (!showImage ? 'item-without-image' : '')">
<img
:src="getItemThumbnail(item, 'tainacan-medium')"
:alt="item.title ? item.title : $root.__('Thumbnail', 'tainacan')">
<span>{{ item.title ? item.title : '' }}</span>
</a>
</li>
</div>
</ul>
<div <div
v-else v-else-if="!isLoading && items.length <= 0"
class="spinner-container"> class="spinner-container">
{{ $root.__(errorMessage, 'tainacan') }} {{ $root.__(errorMessage, 'tainacan') }}
</div> </div>
@ -240,6 +294,12 @@ export default {
gridMargin: Number, gridMargin: Number,
searchURL: String, searchURL: String,
maxItemsNumber: Number, maxItemsNumber: Number,
mosaicDensity: Number,
mosaicHeight: Number,
mosaicGridRows: Number,
mosaicGridColumns: Number,
mosaicItemFocalPointX: Number,
mosaicItemFocalPointY: Number,
order: String, order: String,
showSearchBar: Boolean, showSearchBar: Boolean,
showCollectionHeader: Boolean, showCollectionHeader: Boolean,
@ -348,6 +408,28 @@ export default {
this.isLoadingCollection = false; this.isLoadingCollection = false;
}); });
} }
},
getItemThumbnail(item, size) {
return (
item.thumbnail && item.thumbnail[size][0] && item.thumbnail[size][0]
?
item.thumbnail[size][0]
:
(item.thumbnail && item.thumbnail['large'][0] && item.thumbnail['large'][0]
?
item.thumbnail['large'][0]
:
`${this.tainacanBaseUrl}/admin/images/placeholder_square.png`)
)
},
mosaicPartition(items) {
const partition = _.groupBy(items, (item, i) => {
if (i % 2 == 0)
return Math.floor(i/this.mosaicDensity)
else
return Math.floor(i/(this.mosaicDensity + 1))
});
return _.values(partition);
} }
}, },
created() { created() {
@ -358,7 +440,7 @@ export default {
this.fetchCollectionForHeader(); this.fetchCollectionForHeader();
this.fetchItems(); this.fetchItems();
}, }
} }
</script> </script>

616
src/gutenberg-blocks/tainacan-items/dynamic-items-list/dynamic-items-list.scss
View File

@ -1,7 +1,7 @@
@import '../../gutenberg-blocks-style.scss'; @import '../../gutenberg-blocks-style.scss';
.wp-block-tainacan-dynamic-items-list { .wp-block-tainacan-dynamic-items-list {
margin: 2rem 0px; margin: 2rem auto;
// Spinner // Spinner
.spinner-container { .spinner-container {
@ -13,6 +13,11 @@
color: #555758; color: #555758;
} }
// Resizer
&:hover .components-resizable-box__handle {
display: block;
}
// Skeleton loading // Skeleton loading
@-webkit-keyframes skeleton-animation { @-webkit-keyframes skeleton-animation {
0%{opacity: 1.0} 0%{opacity: 1.0}
@ -70,14 +75,15 @@
h3 { h3 {
color: white; color: white;
text-decoration: none; text-decoration: none;
font-size: 1.3rem; font-size: 1.3em;
margin: 0;
&:hover { &:hover {
text-decoration: none; text-decoration: none;
} }
} }
span.label { span.label {
font-weight: normal; font-weight: normal;
font-size: 1rem; font-size: 0.75em;
} }
&.only-collection-name { &.only-collection-name {
@ -215,9 +221,11 @@
} }
} }
// Grid View Mode ---------------------------------------------------- // Style for both grid and list View Modes ----------------------------------------------------
ul.items-list.items-list-without-margin, ul.items-list.items-layout-list.items-list-without-margin,
ul.items-list-edit.items-list-without-margin { ul.items-list-edit.items-layout-list.items-list-without-margin,
ul.items-list.items-layout-grid.items-list-without-margin,
ul.items-list-edit.items-layout-grid.items-list-without-margin {
grid-template-columns: repeat(auto-fill, 185px); grid-template-columns: repeat(auto-fill, 185px);
justify-content: center !important; justify-content: center !important;
grid-template-rows: auto !important; grid-template-rows: auto !important;
@ -235,47 +243,6 @@
} }
} }
} }
ul.items-list.items-layout-grid,
ul.items-list-edit.items-layout-grid {
padding: 0;
@include display-grid;
-ms-grid-columns: 220px 220px 220px 220px 220px;
grid-template-columns: repeat(auto-fill, 220px);
grid-gap: 0px;
justify-content: space-evenly;
list-style-type: none;
li.item-list-item {
position: relative;
display: block;
margin: 12px 12px 24px 12px;
margin-bottom: 12px;
width: 185px;
a {
color: #454647;
font-weight: bold;
line-height: normal;
}
img {
height: auto;
width: 185px;
min-width: 185px;
padding: 0px;
margin-bottom: 0.5rem;
}
a.item-without-title span {
display: none;
}
&:hover a {
color: #454647;
text-decoration: none;
}
}
}
ul.items-list-edit li.item-list-item { ul.items-list-edit li.item-list-item {
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
@ -311,6 +278,50 @@
border: 1px solid #cbcbcb !important; border: 1px solid #cbcbcb !important;
} }
} }
// Grid View Mode ----------------------------------------------------
ul.items-list.items-layout-grid,
ul.items-list-edit.items-layout-grid {
padding: 0;
@include display-grid;
-ms-grid-columns: 220px 220px 220px 220px 220px;
grid-template-columns: repeat(auto-fill, 220px);
grid-gap: 0px;
justify-content: space-evenly;
list-style-type: none;
margin: 0;
li.item-list-item {
position: relative;
display: block;
margin: 12px 12px 24px 12px;
margin-bottom: 12px;
width: 185px;
a {
color: #454647;
font-weight: bold;
line-height: normal;
}
img {
height: auto;
width: 185px;
min-width: 185px;
padding: 0px;
margin-bottom: 0.5rem;
}
a.item-without-title span {
display: none;
}
&:hover a {
color: #454647;
text-decoration: none;
}
}
}
@media only screen and (max-width: 498px) { @media only screen and (max-width: 498px) {
ul.items-list.items-layout-grid, ul.items-list.items-layout-grid,
@ -332,6 +343,7 @@
flex-wrap: wrap; flex-wrap: wrap;
align-items: center; align-items: center;
list-style-type: none; list-style-type: none;
margin: 0;
li.item-list-item { li.item-list-item {
position: relative; position: relative;
@ -387,5 +399,515 @@
width: calc(100% - 24px); width: calc(100% - 24px);
} }
} }
}
// Mosaic View Mode ----------------------------------------------------
ul.items-list.items-layout-mosaic,
ul.items-list-edit.items-layout-mosaic {
width: auto;
display: flex;
list-style: none;
min-height: 280px;
margin: 0;
.mosaic-container {
padding: 0;
justify-content: stretch; // For flex fallback compatibility
@include display-grid;
-ms-grid-columns: 150px 150px 150px;
grid-template-columns: repeat(3, 150px);
grid-auto-flow: dense;
width: 100%;
list-style-type: none;
&:not(:first-of-type) {
margin-left: 0 !important;
}
li.item-list-item {
flex-grow: 1; // For flex fallback compatibility
justify-self: stretch;
position: relative;
min-width: 100%;
background-size: cover;
background-position: center;
margin: 0;
a {
width: 100%;
height: 100%;
display: block;
color: #454647;
font-weight: bold;
line-height: normal;
}
img {
display: none;
}
a span {
display: block;
position: absolute;
background: rgba(255, 255, 255, 0.75);
bottom: 0;
opacity: 0;
padding: 8px 12px;
word-break: break-word;
transition: opacity 0.5s ease;
}
&:hover a span { opacity: 1 };
a.item-without-title span {
display: none;
}
&:hover a {
color: #454647;
text-decoration: none;
}
}
// 3 x 2 MOSAIC GRID ------------------------
&.mosaic-container--1-2x3 {
li.item-list-item {
grid-row: span 2;
grid-column: span 3;
}
}
&.mosaic-container--2-2x3 {
li.item-list-item {
grid-row: span 1;
grid-column: span 3;
}
}
&.mosaic-container--3-2x3 li.item-list-item {
&:nth-of-type(1) {
grid-row: span 1;
grid-column: span 2;
}
}
&.mosaic-container--4-2x3 li.item-list-item {
&:nth-of-type(1),
&:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2;
}
}
&.mosaic-container--5-2x3 li.item-list-item {
&:nth-of-type(2) {
grid-row: span 2;
grid-column: span 1;
}
}
// 3 x 2 MOSAIC GRID ------------------------
&.mosaic-container--1-3x2 {
li.item-list-item {
grid-row: span 3;
grid-column: span 2;
}
}
&.mosaic-container--2-3x2 {
li.item-list-item {
grid-row: span 3;
grid-column: span 1;
}
}
&.mosaic-container--3-3x2 li.item-list-item {
&:nth-of-type(1) {
grid-row: span 2;
grid-column: span 2;
}
}
&.mosaic-container--4-3x2 li.item-list-item {
&:nth-of-type(1),
&:nth-of-type(3) {
grid-row: span 2;
grid-column: span 1;
}
}
&.mosaic-container--5-3x2 li.item-list-item {
&:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2;
}
}
// 3 x 3 MOSAIC GRID ------------------------
&.mosaic-container--1-3x3 {
li.item-list-item {
grid-row: span 3;
grid-column: span 3;
}
}
&.mosaic-container--2-3x3 {
li.item-list-item:first-of-type {
grid-row: span 1;
grid-column: span 3;
}
li.item-list-item:last-of-type {
grid-row: span 2;
grid-column: span 3;
}
}
&.mosaic-container--3-3x3 li.item-list-item {
&:nth-of-type(1) {
grid-row: span 2;
grid-column: span 3;
}
&:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2;
}
}
&.mosaic-container--4-3x3 li.item-list-item {
&:nth-of-type(1) {
grid-row: span 2;
grid-column: span 1;
}
&:nth-of-type(2) {
grid-row: span 2;
grid-column: span 2;
}
&:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2;
}
}
&.mosaic-container--5-3x3 li.item-list-item {
&:nth-of-type(1) {
grid-row: span 1;
grid-column: span 2;
}
&:nth-of-type(4) {
grid-row: span 2;
grid-column: span 2;
}
}
&.mosaic-container--6-3x3 li.item-list-item {
&:nth-of-type(3) {
grid-row: span 2;
grid-column: span 1;
}
&:nth-of-type(4),
&:nth-of-type(6) {
grid-row: span 1;
grid-column: span 2;
}
}
// 3 x 4 MOSAIC GRID ------------------------
&.mosaic-container--1-3x4 {
li.item-list-item {
grid-row: span 3;
grid-column: span 4;
}
}
&.mosaic-container--2-3x4 {
li.item-list-item {
grid-row: span 3;
grid-column: span 2;
}
}
&.mosaic-container--3-3x4 li.item-list-item {
&:nth-of-type(1) {
grid-row: span 3;
grid-column: span 2;
}
&:nth-of-type(2) {
grid-row: span 2;
grid-column: span 2;
}
&:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2;
}
}
&.mosaic-container--4-3x4 li.item-list-item {
&:nth-of-type(1),
&:nth-of-type(4) {
grid-row: span 2;
grid-column: span 2;
}
&:nth-of-type(2),
&:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2;
}
}
&.mosaic-container--5-3x4 li.item-list-item {
&:nth-of-type(1),
&:nth-of-type(3) {
grid-row: span 2;
grid-column: span 2;
}
&:nth-of-type(2) {
grid-row: span 1;
grid-column: span 2;
}
}
&.mosaic-container--6-3x4 li.item-list-item {
&:nth-of-type(2),
&:nth-of-type(6) {
grid-row: span 1;
grid-column: span 2;
}
&:nth-of-type(3) {
grid-row: span 2;
grid-column: span 1;
}
&:nth-of-type(4) {
grid-row: span 2;
grid-column: span 2;
}
}
// 4 x 3 MOSAIC GRID ------------------------
&.mosaic-container--1-4x3 {
li.item-list-item {
grid-row: span 4;
grid-column: span 3;
}
}
&.mosaic-container--2-4x3 {
li.item-list-item {
grid-row: span 2;
grid-column: span 3;
}
}
&.mosaic-container--3-4x3 li.item-list-item {
&:nth-of-type(1) {
grid-row: span 2;
grid-column: span 3;
}
&:nth-of-type(2) {
grid-row: span 2;
grid-column: span 1;
}
&:nth-of-type(3) {
grid-row: span 2;
grid-column: span 2;
}
}
&.mosaic-container--4-4x3 li.item-list-item {
&:nth-of-type(1) {
grid-row: span 2;
grid-column: span 1;
}
&:nth-of-type(2) {
grid-row: span 1;
grid-column: span 2;
}
&:nth-of-type(4) {
grid-row: span 2;
grid-column: span 2;
}
}
&.mosaic-container--5-4x3 li.item-list-item {
&:nth-of-type(2),
&:nth-of-type(4) {
grid-row: span 2;
grid-column: span 2;
}
&:nth-of-type(5) {
grid-row: span 2;
grid-column: span 1;
}
}
&.mosaic-container--6-4x3 li.item-list-item {
&:nth-of-type(2) {
grid-row: span 2;
grid-column: span 2;
}
&:nth-of-type(3),
&:nth-of-type(6) {
grid-row: span 2;
grid-column: span 1;
}
&:nth-of-type(5) {
grid-row: span 1;
grid-column: span 2;
}
}
// 4 x 5 MOSAIC GRID ------------------------
&.mosaic-container--1-4x5 {
li.item-list-item {
grid-row: span 4;
grid-column: span 5;
}
}
&.mosaic-container--2-4x5 {
li.item-list-item {
grid-row: span 2;
grid-column: span 5;
}
}
&.mosaic-container--3-4x5 li.item-list-item {
&:nth-of-type(1) {
grid-row: span 2;
grid-column: span 5;
}
&:nth-of-type(2) {
grid-row: span 2;
grid-column: span 3;
}
&:nth-of-type(3) {
grid-row: span 2;
grid-column: span 2;
}
}
&.mosaic-container--4-4x5 li.item-list-item {
&:nth-of-type(1),
&:nth-of-type(4) {
grid-row: span 2;
grid-column: span 3;
}
&:nth-of-type(2),
&:nth-of-type(3) {
grid-row: span 2;
grid-column: span 2;
}
}
&.mosaic-container--5-4x5 li.item-list-item {
&:nth-of-type(3),
&:nth-of-type(5) {
grid-row: span 2;
grid-column: span 3;
}
&:nth-of-type(4) {
grid-row: span 3;
grid-column: span 2;
}
}
&.mosaic-container--6-4x5 li.item-list-item {
&:nth-of-type(1) {
grid-row: span 2;
grid-column: span 2;
}
&:nth-of-type(3) {
grid-row: span 3;
grid-column: span 2;
}
&:nth-of-type(5) {
grid-row: span 2;
grid-column: span 3;
}
&:nth-of-type(6) {
grid-row: span 1;
grid-column: span 2;
}
}
// 5 x 4 MOSAIC GRID ------------------------
&.mosaic-container--1-5x4 {
li.item-list-item {
grid-row: span 5;
grid-column: span 4;
}
}
&.mosaic-container--2-5x4 {
li.item-list-item {
grid-row: span 5;
grid-column: span 2;
}
}
&.mosaic-container--3-5x4 li.item-list-item {
&:nth-of-type(1) {
grid-row: span 3;
grid-column: span 2;
}
&:nth-of-type(2) {
grid-row: span 5;
grid-column: span 2;
}
&:nth-of-type(3) {
grid-row: span 2;
grid-column: span 2;
}
}
&.mosaic-container--4-5x4 li.item-list-item {
&:nth-of-type(1),
&:nth-of-type(3) {
grid-row: span 3;
grid-column: span 2;
}
&:nth-of-type(2),
&:nth-of-type(4) {
grid-row: span 2;
grid-column: span 2;
}
}
&.mosaic-container--5-5x4 li.item-list-item {
&:nth-of-type(1),
&:nth-of-type(3),
&:nth-of-type(5) {
grid-row: span 2;
grid-column: span 2;
}
&:nth-of-type(2) {
grid-row: span 1;
grid-column: span 2;
}
&:nth-of-type(4) {
grid-row: span 3;
grid-column: span 2;
}
}
&.mosaic-container--6-5x4 li.item-list-item {
&:nth-of-type(1),
&:nth-of-type(5) {
grid-row: span 2;
grid-column: span 2;
}
&:nth-of-type(2) {
grid-row: span 3;
grid-column: span 2;
}
&:nth-of-type(3) {
grid-row: span 1;
grid-column: span 2;
}
&:nth-of-type(4),
&:nth-of-type(6) {
grid-row: span 2;
grid-column: span 1;
}
}
}
}
@media only screen and (max-width: 1024px) {
ul.items-list.items-layout-mosaic,
ul.items-list-edit.items-layout-mosaic {
overflow-x: auto;
.mosaic-container {
min-width: 240px;
}
}
} }
} }

4
src/gutenberg-blocks/tainacan-items/dynamic-items-list/dynamic-items-modal.js
View File

@ -42,7 +42,7 @@ export default class DynamicItemsModal extends React.Component {
if (this.props.existingCollectionId != null && this.props.existingCollectionId != undefined) { if (this.props.existingCollectionId != null && this.props.existingCollectionId != undefined) {
this.fetchCollection(this.props.existingCollectionId); this.fetchCollection(this.props.existingCollectionId);
this.setState({ searchURL: this.props.existingSearchURL ? this.props.existingSearchURL : tainacan_plugin.admin_url + 'admin.php?page=tainacan_admin#/collections/'+ this.props.existingCollectionId + '/items/?readmode=true&iframemode=true' }); this.setState({ searchURL: this.props.existingSearchURL ? this.props.existingSearchURL : tainacan_blocks.admin_url + 'admin.php?page=tainacan_admin#/collections/'+ this.props.existingCollectionId + '/items/?readmode=true&iframemode=true' });
} else { } else {
this.setState({ collectionPage: 1 }); this.setState({ collectionPage: 1 });
this.fetchModalCollections(); this.fetchModalCollections();
@ -100,7 +100,7 @@ export default class DynamicItemsModal extends React.Component {
selectCollection(selectedCollectionId) { selectCollection(selectedCollectionId) {
this.setState({ this.setState({
collectionId: selectedCollectionId, collectionId: selectedCollectionId,
searchURL: tainacan_plugin.admin_url + 'admin.php?page=tainacan_admin#/collections/' + selectedCollectionId + '/items/?readmode=true&iframemode=true' searchURL: tainacan_blocks.admin_url + 'admin.php?page=tainacan_admin#/collections/' + selectedCollectionId + '/items/?readmode=true&iframemode=true'
}); });
this.props.onSelectCollection(selectedCollectionId); this.props.onSelectCollection(selectedCollectionId);

569
src/gutenberg-blocks/tainacan-items/dynamic-items-list/index.js
View File

@ -2,7 +2,7 @@ const { registerBlockType } = wp.blocks;
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { RangeControl, Spinner, Button, ToggleControl, Tooltip, Placeholder, Toolbar, ColorPicker, ColorPalette, BaseControl, PanelBody } = wp.components; const { ResizableBox, FocalPointPicker, SelectControl, RangeControl, Spinner, Button, ToggleControl, Tooltip, Placeholder, Toolbar, ColorPicker, ColorPalette, BaseControl, PanelBody } = wp.components;
const { InspectorControls, BlockControls } = wp.editor; const { InspectorControls, BlockControls } = wp.editor;
@ -115,6 +115,33 @@ registerBlockType('tainacan/dynamic-items-list', {
collectionTextColor: { collectionTextColor: {
type: String, type: String,
default: "#ffffff" default: "#ffffff"
},
mosaicHeight: {
type: Number,
value: 280
},
mosaicGridColumns: {
type: Number,
value: 3
},
mosaicGridRows: {
type: Number,
value: 3
},
sampleBackgroundImage: {
type: String,
default: ''
},
osaicItemFocalPointm: {
type: Object,
default: {
x: 0.5,
y: 0.5
}
},
mosaicDensity: {
type: Number,
default: 5
} }
}, },
supports: { supports: {
@ -125,6 +152,7 @@ registerBlockType('tainacan/dynamic-items-list', {
let { let {
items, items,
content, content,
collection,
collectionId, collectionId,
showImage, showImage,
showName, showName,
@ -142,7 +170,13 @@ registerBlockType('tainacan/dynamic-items-list', {
showCollectionLabel, showCollectionLabel,
isLoadingCollection, isLoadingCollection,
collectionBackgroundColor, collectionBackgroundColor,
collectionTextColor collectionTextColor,
mosaicHeight,
mosaicGridColumns,
mosaicGridRows,
mosaicItemFocalPoint,
sampleBackgroundImage,
mosaicDensity
} = attributes; } = attributes;
// Obtains block's client id to render it on save function // Obtains block's client id to render it on save function
@ -153,24 +187,22 @@ registerBlockType('tainacan/dynamic-items-list', {
<li <li
key={ item.id } key={ item.id }
className="item-list-item" className="item-list-item"
style={{ marginBottom: layout == 'grid' ? (showName ? gridMargin + 12 : gridMargin) + 'px' : ''}}> style={ {
marginBottom: layout == 'grid' ? (showName ? gridMargin + 12 : gridMargin) + 'px' : '',
backgroundImage: layout == 'mosaic' ? `url(${getItemThumbnail(item, 'medium_large')})` : 'none',
backgroundPosition: layout == 'mosaic' ? `${ (mosaicItemFocalPoint && mosaicItemFocalPoint.x ? mosaicItemFocalPoint.x : 0.5) * 100 }% ${ (mosaicItemFocalPoint && mosaicItemFocalPoint.y ? mosaicItemFocalPoint.y : 0.5) * 100 }%` : 'none'
}}
>
<a <a
id={ isNaN(item.id) ? item.id : 'item-id-' + item.id } id={ isNaN(item.id) ? item.id : 'item-id-' + item.id }
href={ item.url } href={ item.url }
target="_blank" target="_blank"
style={ {
} }
className={ (!showName ? 'item-without-title' : '') + ' ' + (!showImage ? 'item-without-image' : '') }> className={ (!showName ? 'item-without-title' : '') + ' ' + (!showImage ? 'item-without-image' : '') }>
<img <img
src={ src={ getItemThumbnail(item, 'tainacan-medium') }
item.thumbnail && item.thumbnail['tainacan-medium'][0] && item.thumbnail['tainacan-medium'][0]
?
item.thumbnail['tainacan-medium'][0]
:
(item.thumbnail && item.thumbnail['thumbnail'][0] && item.thumbnail['thumbnail'][0]
?
item.thumbnail['thumbnail'][0]
:
`${tainacan_plugin.base_url}/admin/images/placeholder_square.png`)
}
alt={ item.title ? item.title : __( 'Thumbnail', 'tainacan' ) }/> alt={ item.title ? item.title : __( 'Thumbnail', 'tainacan' ) }/>
<span>{ item.title ? item.title : '' }</span> <span>{ item.title ? item.title : '' }</span>
</a> </a>
@ -178,75 +210,126 @@ registerBlockType('tainacan/dynamic-items-list', {
); );
} }
function prepareMosaicItem(mosaicGroup, mosaicGroupsLength) {
return (
<div
style={
{
width: 'calc((100% / ' + mosaicGroupsLength + ') - ' + gridMargin + 'px)',
height: 'calc(((' + (mosaicGridRows - 1) + ' * ' + gridMargin + 'px) + ' + mosaicHeight + 'px))',
gridTemplateColumns: 'repeat(' + mosaicGridColumns + ', calc((100% / ' + mosaicGridColumns + ') - (' + ((mosaicGridColumns - 1)*Number(gridMargin)) + 'px/' + mosaicGridColumns + ')))',
margin: gridMargin + 'px',
gridGap: gridMargin + 'px',
}
}
className={ 'mosaic-container mosaic-container--' + mosaicGroup.length + '-' + mosaicGridRows + 'x' + mosaicGridColumns }>
{ buildMosaic(mosaicGroup) }
</div>
)
}
function setContent(){ function setContent(){
items = []; if (searchURL) {
isLoading = true;
if (itemsRequestSource != undefined && typeof itemsRequestSource == 'function') items = [];
itemsRequestSource.cancel('Previous items search canceled.'); isLoading = true;
itemsRequestSource = axios.CancelToken.source(); if (itemsRequestSource != undefined && typeof itemsRequestSource == 'function')
itemsRequestSource.cancel('Previous items search canceled.');
setAttributes({ itemsRequestSource = axios.CancelToken.source();
isLoading: isLoading
});
let endpoint = '/collection' + searchURL.split('#')[1].split('/collections')[1]; setAttributes({
let query = endpoint.split('?')[1]; isLoading: isLoading
let queryObject = qs.parse(query);
// Set up max items to be shown
if (maxItemsNumber != undefined && maxItemsNumber > 0)
queryObject.perpage = maxItemsNumber;
else if (queryObject.perpage != undefined && queryObject.perpage > 0)
setAttributes({ maxItemsNumber: queryObject.perpage });
else {
queryObject.perpage = 12;
setAttributes({ maxItemsNumber: 12 });
}
// Set up sorting order
if (order != undefined)
queryObject.order = order;
else if (queryObject.order != undefined)
setAttributes({ order: queryObject.order });
else {
queryObject.order = 'asc';
setAttributes({ order: 'asc' });
}
// Set up sorting order
if (searchString != undefined)
queryObject.search = searchString;
else if (queryObject.search != undefined)
setAttributes({ searchString: queryObject.search });
else {
delete queryObject.search;
setAttributes({ searchString: undefined });
}
// Remove unecessary queries
delete queryObject.readmode;
delete queryObject.iframemode;
delete queryObject.admin_view_mode;
delete queryObject.fetch_only_meta;
endpoint = endpoint.split('?')[0] + '?' + qs.stringify(queryObject) + '&fetch_only=title,url,thumbnail';
tainacan.get(endpoint, { cancelToken: itemsRequestSource.token })
.then(response => {
for (let item of response.data.items)
items.push(prepareItem(item));
setAttributes({
content: <div></div>,
items: items,
isLoading: false,
itemsRequestSource: itemsRequestSource
});
}); });
let endpoint = '/collection' + searchURL.split('#')[1].split('/collections')[1];
let query = endpoint.split('?')[1];
let queryObject = qs.parse(query);
// Set up max items to be shown
if (maxItemsNumber != undefined && maxItemsNumber > 0)
queryObject.perpage = maxItemsNumber;
else if (queryObject.perpage != undefined && queryObject.perpage > 0)
setAttributes({ maxItemsNumber: queryObject.perpage });
else {
queryObject.perpage = 12;
setAttributes({ maxItemsNumber: 12 });
}
// Set up sorting order
if (order != undefined)
queryObject.order = order;
else if (queryObject.order != undefined)
setAttributes({ order: queryObject.order });
else {
queryObject.order = 'asc';
setAttributes({ order: 'asc' });
}
// Set up sorting order
if (searchString != undefined)
queryObject.search = searchString;
else if (queryObject.search != undefined)
setAttributes({ searchString: queryObject.search });
else {
delete queryObject.search;
setAttributes({ searchString: undefined });
}
// Remove unecessary queries
delete queryObject.readmode;
delete queryObject.iframemode;
delete queryObject.admin_view_mode;
delete queryObject.fetch_only_meta;
endpoint = endpoint.split('?')[0] + '?' + qs.stringify(queryObject) + '&fetch_only=title,url,thumbnail';
tainacan.get(endpoint, { cancelToken: itemsRequestSource.token })
.then(response => {
if (layout !== 'mosaic') {
for (let item of response.data.items)
items.push(prepareItem(item));
setAttributes({
content: <div></div>,
items: items,
isLoading: false,
itemsRequestSource: itemsRequestSource
});
} else {
// Initializes some variables
mosaicDensity = mosaicDensity ? mosaicDensity : 5;
mosaicGridRows = mosaicGridRows ? mosaicGridRows : 3;
mosaicGridColumns = mosaicGridColumns ? mosaicGridColumns : 3;
mosaicHeight = mosaicHeight ? mosaicHeight : 280;
mosaicItemFocalPoint = mosaicItemFocalPoint ? mosaicItemFocalPoint : { x: 0.5, y: 0.5 };
sampleBackgroundImage = response.data.items && response.data.items[0] && response.data.items[0] ? getItemThumbnail(response.data.items[0], 'tainacan-medium') : '';
const mosaicGroups = mosaicPartition(response.data.items);
for (let mosaicGroup of mosaicGroups)
items.push(prepareMosaicItem(mosaicGroup, mosaicGroups.length));
setAttributes({
content: <div></div>,
items: items,
isLoading: false,
itemsRequestSource: itemsRequestSource,
mosaicDensity: mosaicDensity,
mosaicHeight: mosaicHeight,
mosaicGridRows: mosaicGridRows,
mosaicGridColumns: mosaicGridColumns,
mosaicItemFocalPoint: mosaicItemFocalPoint,
sampleBackgroundImage: sampleBackgroundImage
});
}
});
}
} }
function fetchCollectionForHeader() { function fetchCollectionForHeader() {
@ -283,6 +366,20 @@ registerBlockType('tainacan/dynamic-items-list', {
} }
} }
function getItemThumbnail(item, size) {
return (
item.thumbnail && item.thumbnail[size][0] && item.thumbnail[size][0]
?
item.thumbnail[size][0]
:
(item.thumbnail && item.thumbnail['thumbnail'][0] && item.thumbnail['thumbnail'][0]
?
item.thumbnail['thumbnail'][0]
:
`${tainacan_blocks.base_url}/admin/images/placeholder_square.png`)
)
}
function openDynamicItemsModal() { function openDynamicItemsModal() {
isModalOpen = true; isModalOpen = true;
setAttributes( { setAttributes( {
@ -293,7 +390,7 @@ registerBlockType('tainacan/dynamic-items-list', {
function updateLayout(newLayout) { function updateLayout(newLayout) {
layout = newLayout; layout = newLayout;
if (layout == 'grid' && showImage == false) if ((layout == 'grid' || layout == 'mosaic') && showImage == false)
showImage = true; showImage = true;
if (layout == 'list' && showName == false) if (layout == 'list' && showName == false)
@ -318,6 +415,31 @@ registerBlockType('tainacan/dynamic-items-list', {
} }
} }
function updateMosaicItemFocalPoint(focalPoint) {
if (Math.abs(focalPoint.x - (mosaicItemFocalPoint && mosaicItemFocalPoint.x ? mosaicItemFocalPoint.x : 0.5)) > 0.025 || Math.abs(focalPoint.y - (mosaicItemFocalPoint && mosaicItemFocalPoint.y ? mosaicItemFocalPoint.y : 0.5)) > 0.025) {
mosaicItemFocalPoint = focalPoint;
setAttributes({ mosaicItemFocalPoint: focalPoint });
setContent();
}
}
function mosaicPartition(items) {
const partition = _.groupBy(items, (item, i) => {
if (i % 2 == 0)
return Math.floor(i/mosaicDensity)
else
return Math.floor(i/(mosaicDensity + 1))
});
return _.values(partition);
}
function buildMosaic(mosaicGroup) {
let mosaic = []
for (let item of mosaicGroup)
mosaic.push(prepareItem(item))
return mosaic;
}
// Executed only on the first load of page // Executed only on the first load of page
if(content && content.length && content[0].type) if(content && content.length && content[0].type)
setContent(); setContent();
@ -334,6 +456,12 @@ registerBlockType('tainacan/dynamic-items-list', {
title: __( 'List View' ), title: __( 'List View' ),
onClick: () => updateLayout('list'), onClick: () => updateLayout('list'),
isActive: layout === 'list', isActive: layout === 'list',
},
{
icon: 'layout',
title: __( 'Mosaic View' ),
onClick: () => updateLayout('mosaic'),
isActive: layout === 'mosaic',
} }
]; ];
@ -454,7 +582,7 @@ registerBlockType('tainacan/dynamic-items-list', {
} }
/> />
: null } : null }
{ layout == 'grid' ? { layout == 'grid' || layout == 'mosaic' ?
<div> <div>
<ToggleControl <ToggleControl
label={__("Item's title", 'tainacan')} label={__("Item's title", 'tainacan')}
@ -470,10 +598,10 @@ registerBlockType('tainacan/dynamic-items-list', {
<div style={{ marginTop: '16px'}}> <div style={{ marginTop: '16px'}}>
<RangeControl <RangeControl
label={__('Margin between items in pixels', 'tainacan')} label={__('Margin between items in pixels', 'tainacan')}
value={ gridMargin } value={ gridMargin ? gridMargin : 0 }
onChange={ ( margin ) => { onChange={ ( margin ) => {
gridMargin = margin; gridMargin = margin;
setAttributes( { gridMargin: margin } ) setAttributes( { gridMargin: margin } );
setContent(); setContent();
}} }}
min={ 0 } min={ 0 }
@ -484,6 +612,75 @@ registerBlockType('tainacan/dynamic-items-list', {
: null } : null }
</div> </div>
</PanelBody> </PanelBody>
{ layout == 'mosaic' ?
<PanelBody
title={__('Mosaic', 'tainacan')}
initialOpen={ true }
>
<div>
<RangeControl
label={__('Container height (px)', 'tainacan')}
value={ mosaicHeight ? mosaicHeight : 280 }
onChange={ ( height ) => {
mosaicHeight = height;
setAttributes( { mosaicHeight: height } );
setContent();
}}
min={ 100 }
max={ 2000 }
/>
</div>
<div>
<RangeControl
label={__('Group Grid Density', 'tainacan')}
value={ mosaicDensity ? mosaicDensity : 5 }
onChange={ ( value ) => {
mosaicDensity = value;
setAttributes( { mosaicDensity: mosaicDensity } );
setContent();
}}
min={ 1 }
max={ 5 }
/>
</div>
<div>
<SelectControl
label={__('Group Grid Dimensions', 'tainacan')}
value={ mosaicGridRows + 'x' + mosaicGridColumns }
options={ [
{ label: '2 x 3', value: '2x3' },
{ label: '3 x 2', value: '3x2' },
{ label: '3 x 3', value: '3x3' },
{ label: '3 x 4', value: '3x4' },
{ label: '4 x 3', value: '4x3' },
{ label: '4 x 5', value: '4x5' },
{ label: '5 x 4', value: '5x4' },
] }
onChange={ ( aGrid ) => {
mosaicGridRows = aGrid.split('x')[0];
mosaicGridColumns = aGrid.split('x')[1];
setAttributes({
mosaicGridRows: mosaicGridRows,
mosaicGridColumns: mosaicGridColumns
});
setContent();
}}/>
</div>
<div>
<FocalPointPicker
label={ __('Item focal point for background image', 'tainacan') }
url={ sampleBackgroundImage }
dimensions={ {
width: 400,
height: 400
} }
value={ mosaicItemFocalPoint }
onChange={ ( focalPoint ) =>_.debounce( updateMosaicItemFocalPoint(focalPoint), 700) }
/>
</div>
</PanelBody>
: null}
</InspectorControls> </InspectorControls>
</div> </div>
@ -684,7 +881,7 @@ registerBlockType('tainacan/dynamic-items-list', {
icon={( icon={(
<img <img
width={148} width={148}
src={ `${tainacan_plugin.base_url}/admin/images/tainacan_logo_header.svg` } src={ `${tainacan_blocks.base_url}/admin/images/tainacan_logo_header.svg` }
alt="Tainacan Logo"/> alt="Tainacan Logo"/>
)}> )}>
<p> <p>
@ -701,7 +898,7 @@ registerBlockType('tainacan/dynamic-items-list', {
isPrimary isPrimary
type="submit" type="submit"
onClick={ () => openDynamicItemsModal() }> onClick={ () => openDynamicItemsModal() }>
{__('Select items', 'tainacan')} {__('Configure search', 'tainacan')}
</Button> </Button>
</Placeholder> </Placeholder>
) : null ) : null
@ -712,14 +909,54 @@ registerBlockType('tainacan/dynamic-items-list', {
<Spinner /> <Spinner />
</div> : </div> :
<div> <div>
<ul { layout !== 'mosaic' ? (
style={{ <ul
gridTemplateColumns: layout == 'grid' ? 'repeat(auto-fill, ' + (gridMargin + (showName ? 220 : 185)) + 'px)' : 'inherit', style={{
marginTop: showSearchBar || showCollectionHeader ? '1.5rem' : '0px' gridTemplateColumns: layout == 'grid' ? 'repeat(auto-fill, ' + (gridMargin + (showName ? 220 : 185)) + 'px)' : 'inherit',
}} marginTop: showSearchBar || showCollectionHeader ? '-' + (Number(gridMargin)/2) : '0px',
className={'items-list-edit items-layout-' + layout + (!showName ? ' items-list-without-margin' : '')}> padding: (Number(gridMargin)/4) + 'px',
{ items } }}
</ul> className={'items-list-edit items-layout-' + layout + (!showName ? ' items-list-without-margin' : '')}>
{ items }
</ul>
) :
<ResizableBox
size={ {
height: mosaicHeight ? mosaicHeight + (3 * gridMargin) : 280 + (3 * gridMargin),
width: '100%'
} }
minHeight="80"
maxHeight="2000"
minWidth="100%"
maxWidth="100%"
showHandle={ true }
enable={ {
top: false,
right: false,
bottom: true,
left: false,
topRight: false,
bottomRight: true,
bottomLeft: true,
topLeft: false,
} }
onResizeStop={ ( event, direction, elt, delta ) => {
mosaicHeight = delta.height ? parseInt(delta.height) + parseInt(mosaicHeight) : 280;
setAttributes({ mosaicHeight: parseInt(mosaicHeight) });
setContent();
} }
>
<ul
style={{
marginTop: showSearchBar || showCollectionHeader ? '-' + (Number(gridMargin)/2) : '0px',
padding: (Number(gridMargin)/4) + 'px',
minHeight: mosaicHeight + 'px'
}}
className={'items-list-edit items-layout-' + layout + (!showName ? ' items-list-without-margin' : '')}>
{ items }
</ul>
</ResizableBox>
}
</div> </div>
} }
</div> </div>
@ -741,7 +978,12 @@ registerBlockType('tainacan/dynamic-items-list', {
showCollectionHeader, showCollectionHeader,
showCollectionLabel, showCollectionLabel,
collectionBackgroundColor, collectionBackgroundColor,
collectionTextColor collectionTextColor,
mosaicHeight,
mosaicGridRows,
mosaicGridColumns,
mosaicItemFocalPoint,
mosaicDensity
} = attributes; } = attributes;
return <div return <div
@ -754,15 +996,156 @@ registerBlockType('tainacan/dynamic-items-list', {
show-collection-header={ '' + showCollectionHeader } show-collection-header={ '' + showCollectionHeader }
show-collection-label={ '' + showCollectionLabel } show-collection-label={ '' + showCollectionLabel }
layout={ layout } layout={ layout }
mosaic-height={ mosaicHeight }
mosaic-density={ mosaicDensity }
mosaic-grid-rows={ mosaicGridRows }
mosaic-grid-columns={ mosaicGridColumns }
mosaic-item-focal-point-x={ (mosaicItemFocalPoint && mosaicItemFocalPoint.x ? mosaicItemFocalPoint.x : 0.5) }
mosaic-item-focal-point-y={ (mosaicItemFocalPoint && mosaicItemFocalPoint.y ? mosaicItemFocalPoint.y : 0.5) }
collection-background-color={ collectionBackgroundColor } collection-background-color={ collectionBackgroundColor }
collection-text-color={ collectionTextColor } collection-text-color={ collectionTextColor }
grid-margin={ gridMargin } grid-margin={ gridMargin }
max-items-number={ maxItemsNumber } max-items-number={ maxItemsNumber }
order={ order } order={ order }
tainacan-api-root={ tainacan_plugin.root } tainacan-api-root={ tainacan_blocks.root }
tainacan-base-url={ tainacan_plugin.base_url } tainacan-base-url={ tainacan_blocks.base_url }
id={ 'wp-block-tainacan-dynamic-items-list_' + blockId }> id={ 'wp-block-tainacan-dynamic-items-list_' + blockId }>
{ content } { content }
</div> </div>
},
deprecated: [
{
attributes: {
content: {
type: 'array',
source: 'children',
selector: 'div'
},
collectionId: {
type: String,
default: undefined
},
items: {
type: Array,
default: []
},
showImage: {
type: Boolean,
default: true
},
showName: {
type: Boolean,
default: true
},
layout: {
type: String,
default: 'grid'
},
isModalOpen: {
type: Boolean,
default: false
},
gridMargin: {
type: Number,
default: 0
},
searchURL: {
type: String,
default: undefined
},
itemsRequestSource: {
type: String,
default: undefined
},
maxItemsNumber: {
type: Number,
value: undefined
},
isLoading: {
type: Boolean,
value: false
},
isLoadingCollection: {
type: Boolean,
value: false
},
showSearchBar: {
type: Boolean,
value: false
},
showCollectionHeader: {
type: Boolean,
value: false
},
showCollectionLabel: {
type: Boolean,
value: false
},
collection: {
type: Object,
value: undefined
},
searchString: {
type: String,
default: undefined
},
order: {
type: String,
default: undefined
},
blockId: {
type: String,
default: undefined
},
collectionBackgroundColor: {
type: String,
default: "#454647"
},
collectionTextColor: {
type: String,
default: "#ffffff"
}
},
save({ attributes, className }){
const {
content,
blockId,
collectionId,
showImage,
showName,
layout,
gridMargin,
searchURL,
maxItemsNumber,
order,
showSearchBar,
showCollectionHeader,
showCollectionLabel,
collectionBackgroundColor,
collectionTextColor
} = attributes;
return <div
search-url={ searchURL }
className={ className }
collection-id={ collectionId }
show-image={ '' + showImage }
show-name={ '' + showName }
show-search-bar={ '' + showSearchBar }
show-collection-header={ '' + showCollectionHeader }
show-collection-label={ '' + showCollectionLabel }
layout={ layout }
collection-background-color={ collectionBackgroundColor }
collection-text-color={ collectionTextColor }
grid-margin={ gridMargin }
max-items-number={ maxItemsNumber }
order={ order }
tainacan-api-root={ tainacan_blocks.root }
tainacan-base-url={ tainacan_blocks.base_url }
id={ 'wp-block-tainacan-dynamic-items-list_' + blockId }>
{ content }
</div>
}
} }
]
}); });

4
src/gutenberg-blocks/tainacan-items/items-list/index.js
View File

@ -128,7 +128,7 @@ registerBlockType('tainacan/items-list', {
target="_blank" target="_blank"
className={ (!showName ? 'item-without-title' : '') + ' ' + (!showImage ? 'item-without-image' : '') }> className={ (!showName ? 'item-without-title' : '') + ' ' + (!showImage ? 'item-without-image' : '') }>
<img <img
src={ item.thumbnail && item.thumbnail[0] && item.thumbnail[0].src ? item.thumbnail[0].src : `${tainacan_plugin.base_url}/admin/images/placeholder_square.png`} src={ item.thumbnail && item.thumbnail[0] && item.thumbnail[0].src ? item.thumbnail[0].src : `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`}
alt={ item.thumbnail && item.thumbnail[0] ? item.thumbnail[0].alt : item.title }/> alt={ item.thumbnail && item.thumbnail[0] ? item.thumbnail[0].alt : item.title }/>
<span>{ item.title ? item.title : '' }</span> <span>{ item.title ? item.title : '' }</span>
</a> </a>
@ -313,7 +313,7 @@ registerBlockType('tainacan/items-list', {
icon={( icon={(
<img <img
width={148} width={148}
src={ `${tainacan_plugin.base_url}/admin/images/tainacan_logo_header.svg` } src={ `${tainacan_blocks.base_url}/admin/images/tainacan_logo_header.svg` }
alt="Tainacan Logo"/> alt="Tainacan Logo"/>
)}> )}>
<p> <p>

10
src/gutenberg-blocks/tainacan-items/items-list/items-list.scss
View File

@ -1,7 +1,7 @@
@import '../../gutenberg-blocks-style.scss'; @import '../../gutenberg-blocks-style.scss';
.wp-block-tainacan-items-list { .wp-block-tainacan-items-list {
margin: 2rem 0px; margin: 2rem auto;
// Spinner // Spinner
.components-spinner { .components-spinner {
@ -9,6 +9,14 @@
right: 0; right: 0;
} }
// For all view modes ------------------------------------------------
ul.items-list li.item-list-item > button,
ul.items-list li.item-list-item > button:hover {
display: none;
visibility: hidden;
opacity: 0;
}
// Grid View Mode ---------------------------------------------------- // Grid View Mode ----------------------------------------------------
ul.items-list.items-list-without-margin, ul.items-list.items-list-without-margin,
ul.items-list-edit.items-list-without-margin { ul.items-list-edit.items-list-without-margin {

6
src/gutenberg-blocks/tainacan-items/items-list/items-modal.js
View File

@ -49,7 +49,7 @@ export default class ItemsModal extends React.Component {
if (this.props.existingCollectionId != null && this.props.existingCollectionId != undefined) { if (this.props.existingCollectionId != null && this.props.existingCollectionId != undefined) {
this.fetchCollection(this.props.existingCollectionId); this.fetchCollection(this.props.existingCollectionId);
this.setState({ this.setState({
searchURL: this.props.existingSearchURL ? this.props.existingSearchURL : tainacan_plugin.admin_url + 'admin.php?page=tainacan_admin#/collections/'+ this.props.existingCollectionId + '/items/?iframemode=true' }); searchURL: this.props.existingSearchURL ? this.props.existingSearchURL : tainacan_blocks.admin_url + 'admin.php?page=tainacan_admin#/collections/'+ this.props.existingCollectionId + '/items/?iframemode=true' });
} else { } else {
this.setState({ collectionPage: 1 }); this.setState({ collectionPage: 1 });
this.fetchModalCollections(); this.fetchModalCollections();
@ -85,7 +85,7 @@ export default class ItemsModal extends React.Component {
let anItemsRequestSource = axios.CancelToken.source(); let anItemsRequestSource = axios.CancelToken.source();
let endpoint = '/collection/' + this.state.collectionId + '/items?'+ qs.stringify({ postin: selectedItems }) + '&fetch_only=title,url,thumbnail'; let endpoint = '/collection/' + this.state.collectionId + '/items?'+ qs.stringify({ postin: selectedItems, perpage: selectedItems.length }) + '&fetch_only=title,url,thumbnail';
tainacan.get(endpoint, { cancelToken: anItemsRequestSource.token }) tainacan.get(endpoint, { cancelToken: anItemsRequestSource.token })
.then(response => { .then(response => {
@ -174,7 +174,7 @@ export default class ItemsModal extends React.Component {
selectCollection(selectedCollectionId) { selectCollection(selectedCollectionId) {
this.setState({ this.setState({
collectionId: selectedCollectionId, collectionId: selectedCollectionId,
searchURL: tainacan_plugin.admin_url + 'admin.php?page=tainacan_admin#/collections/' + selectedCollectionId + '/items/?iframemode=true' searchURL: tainacan_blocks.admin_url + 'admin.php?page=tainacan_admin#/collections/' + selectedCollectionId + '/items/?iframemode=true'
}); });
this.props.onSelectCollection(selectedCollectionId); this.props.onSelectCollection(selectedCollectionId);

32
src/gutenberg-blocks/tainacan-items/search-bar/index.js
View File

@ -57,7 +57,7 @@ registerBlockType('tainacan/search-bar', {
}, },
placeholderText: { placeholderText: {
type: String, type: String,
default: __('Search', 'taincan') default: __('Search', 'tainacan')
}, },
showCollectionHeader: { showCollectionHeader: {
type: Boolean, type: Boolean,
@ -169,13 +169,13 @@ registerBlockType('tainacan/search-bar', {
(alignment == 'left' ? ' is-aligned-left' : '') + (alignment == 'left' ? ' is-aligned-left' : '') +
(alignment == 'right' ? ' is-aligned-right' : '') (alignment == 'right' ? ' is-aligned-right' : '')
} }
id="taincan-search-bar-block" id="tainacan-search-bar-block"
action={ tainacan_plugin.site_url + '/' + collectionSlug + '/#/' } action={ tainacan_blocks.site_url + '/' + collectionSlug + '/#/' }
method='get'> method='get'>
<input <input
style={{ borderColor: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }} style={{ borderColor: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }}
id="taincan-search-bar-block_input" id="tainacan-search-bar-block_input"
label={ __('Search', 'taincan')} label={ __('Search', 'tainacan')}
name='search' name='search'
placeholder={ placeholderText } placeholder={ placeholderText }
/> />
@ -214,13 +214,13 @@ registerBlockType('tainacan/search-bar', {
(alignment == 'left' ? ' is-aligned-left' : '') + (alignment == 'left' ? ' is-aligned-left' : '') +
(alignment == 'right' ? ' is-aligned-right' : '') (alignment == 'right' ? ' is-aligned-right' : '')
} }
id="taincan-search-bar-block" id="tainacan-search-bar-block"
action={ tainacan_plugin.site_url + '/' + collectionSlug + '/#/' } action={ tainacan_blocks.site_url + '/' + collectionSlug + '/#/' }
method='get'> method='get'>
<input <input
style={{ borderColor: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }} style={{ borderColor: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }}
id="taincan-search-bar-block_input" id="tainacan-search-bar-block_input"
label={ __('Search', 'taincan')} label={ __('Search', 'tainacan')}
name='search' name='search'
placeholder={ placeholderText } placeholder={ placeholderText }
/> />
@ -494,7 +494,7 @@ registerBlockType('tainacan/search-bar', {
icon={( icon={(
<img <img
width={148} width={148}
src={ `${tainacan_plugin.base_url}/admin/images/tainacan_logo_header.svg` } src={ `${tainacan_blocks.base_url}/admin/images/tainacan_logo_header.svg` }
alt="Tainacan Logo"/> alt="Tainacan Logo"/>
)}> )}>
<p> <p>
@ -560,11 +560,11 @@ registerBlockType('tainacan/search-bar', {
(alignment == 'left' ? ' is-aligned-left' : '') + (alignment == 'left' ? ' is-aligned-left' : '') +
(alignment == 'right' ? ' is-aligned-right' : '') (alignment == 'right' ? ' is-aligned-right' : '')
} }
id="taincan-search-bar-block"> id="tainacan-search-bar-block">
<input <input
style={{ borderColor: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }} style={{ borderColor: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }}
id="taincan-search-bar-block_input" id="tainacan-search-bar-block_input"
label={ __('Search', 'taincan')} label={ __('Search', 'tainacan')}
name='search' name='search'
placeholder={ placeholderText } placeholder={ placeholderText }
/> />
@ -606,11 +606,11 @@ registerBlockType('tainacan/search-bar', {
(alignment == 'left' ? ' is-aligned-left' : '') + (alignment == 'left' ? ' is-aligned-left' : '') +
(alignment == 'right' ? ' is-aligned-right' : '') (alignment == 'right' ? ' is-aligned-right' : '')
} }
id="taincan-search-bar-block"> id="tainacan-search-bar-block">
<input <input
style={{ borderColor: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }} style={{ borderColor: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }}
id="taincan-search-bar-block_input" id="tainacan-search-bar-block_input"
label={ __('Search', 'taincan')} label={ __('Search', 'tainacan')}
name='search' name='search'
placeholder={ placeholderText } placeholder={ placeholderText }
/> />

4
src/gutenberg-blocks/tainacan-items/search-bar/search-bar-modal.js
View File

@ -106,7 +106,7 @@ export default class SearchBarModal extends React.Component {
label: __('Repository items', 'tainacan'), label: __('Repository items', 'tainacan'),
name: __('Repository items', 'tainacan'), name: __('Repository items', 'tainacan'),
id: 'default', id: 'default',
slug: tainacan_plugin.theme_items_list_url.split('/')[tainacan_plugin.theme_items_list_url.split('/').length - 1] slug: tainacan_blocks.theme_items_list_url.split('/')[tainacan_blocks.theme_items_list_url.split('/').length - 1]
}; };
else { else {
selectedCollection = this.state.modalCollections.find((collection) => collection.id == selectedCollectionId) selectedCollection = this.state.modalCollections.find((collection) => collection.id == selectedCollectionId)
@ -269,7 +269,7 @@ export default class SearchBarModal extends React.Component {
<RadioControl <RadioControl
className={'repository-radio-option'} className={'repository-radio-option'}
selected={ this.state.temporaryCollectionId } selected={ this.state.temporaryCollectionId }
options={ [{ label: __('Repository items', 'tainacan'), value: 'default', slug: tainacan_plugin.theme_items_list_url.split('/')[tainacan_plugin.theme_items_list_url.split('/').length - 1] }] } options={ [{ label: __('Repository items', 'tainacan'), value: 'default', slug: tainacan_blocks.theme_items_list_url.split('/')[tainacan_blocks.theme_items_list_url.split('/').length - 1] }] }
onChange={ ( aCollectionId ) => { onChange={ ( aCollectionId ) => {
this.setState({ temporaryCollectionId: aCollectionId }); this.setState({ temporaryCollectionId: aCollectionId });
} } /> } } />

4
src/gutenberg-blocks/tainacan-items/search-bar/search-bar-theme-script.js
View File

@ -1,9 +1,9 @@
document.addEventListener("DOMContentLoaded",() => { document.addEventListener("DOMContentLoaded",() => {
let form = document.getElementById('taincan-search-bar-block'); let form = document.getElementById('tainacan-search-bar-block');
if (form) { if (form) {
form.addEventListener('submit', ((e) => { form.addEventListener('submit', ((e) => {
e.preventDefault(); e.preventDefault();
let input = document.getElementById('taincan-search-bar-block_input'); let input = document.getElementById('tainacan-search-bar-block_input');
if (input) { if (input) {
if (input.value) if (input.value)
window.location.href = e.target.action + '?search=' + input.value; window.location.href = e.target.action + '?search=' + input.value;

43
src/gutenberg-blocks/tainacan-items/search-bar/search-bar.scss
View File

@ -5,12 +5,12 @@
justify-content: center; justify-content: center;
} }
.wp-block-tainacan-search-bar { .wp-block-tainacan-search-bar {
margin: 2rem 0px; margin: 2rem auto;
.tainacan-search-container { .tainacan-search-container {
width: 100%; width: 100%;
#taincan-search-bar-block { #tainacan-search-bar-block {
height: 32px; height: 32px;
max-width: 100%; max-width: 100%;
display: flex; display: flex;
@ -34,7 +34,7 @@
border: 1px solid #545758; border: 1px solid #545758;
} }
input#taincan-search-bar-block_input { input#tainacan-search-bar-block_input {
width: 100%; width: 100%;
min-width: 28px; min-width: 28px;
margin: 0; margin: 0;
@ -66,13 +66,18 @@
margin-right: 0px; margin-right: 0px;
max-width: 100% !important; max-width: 100% !important;
input#taincan-search-bar-block_input { input#tainacan-search-bar-block_input {
width: 100% !important; width: 100% !important;
} }
} }
} }
} }
.search-bar-collection-header-container { .search-bar-collection-header-container {
.search-bar-collection-header-title {
max-width: 1400px;
margin-left: auto;
margin-right: auto;
}
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
flex-wrap: wrap !important; flex-wrap: wrap !important;
@ -83,7 +88,7 @@
} }
&.is-style-alternate { &.is-style-alternate {
#taincan-search-bar-block { #tainacan-search-bar-block {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: row-reverse; flex-direction: row-reverse;
@ -102,7 +107,7 @@
&:hover { &:hover {
border: none; border: none;
} }
input#taincan-search-bar-block_input { input#tainacan-search-bar-block_input {
width: 35%; width: 35%;
border-radius: 0; border-radius: 0;
margin-left: -52px; margin-left: -52px;
@ -119,6 +124,9 @@
background:rgba(250, 250, 250, 1); background:rgba(250, 250, 250, 1);
box-shadow: none; box-shadow: none;
} }
&::placeholder {
color: #cbcbcb;
}
} }
button { button {
@ -146,7 +154,7 @@
margin-right: 0px; margin-right: 0px;
max-width: 100% !important; max-width: 100% !important;
input#taincan-search-bar-block_input { input#tainacan-search-bar-block_input {
width: 100% !important; width: 100% !important;
} }
} }
@ -155,7 +163,7 @@
// This style has particular alignments properties. // This style has particular alignments properties.
.search-bar-collection-header-container { .search-bar-collection-header-container {
.tainacan-search-container { .tainacan-search-container {
#taincan-search-bar-block { #tainacan-search-bar-block {
&:focus, &:focus,
&:active, &:active,
&:hover { &:hover {
@ -171,9 +179,8 @@
} }
} }
input#taincan-search-bar-block_input { input#tainacan-search-bar-block_input {
color: white; color: white;
&::placeholder { color: white; }
&:focus, &:focus,
&:active, &:active,
@ -196,7 +203,7 @@
} }
&.is-style-stylish { &.is-style-stylish {
#taincan-search-bar-block { #tainacan-search-bar-block {
width: 100%; width: 100%;
height: 53px; height: 53px;
display: flex; display: flex;
@ -209,14 +216,14 @@
border: none; border: none;
} }
&:hover input#taincan-search-bar-block_input { &:hover input#tainacan-search-bar-block_input {
width: 100%; width: 100%;
padding-right: 52px; padding-right: 52px;
padding-left: 24px; padding-left: 24px;
border-width: 0; border-width: 0;
} }
input#taincan-search-bar-block_input { input#tainacan-search-bar-block_input {
width: 0%; width: 0%;
min-width: 0%; min-width: 0%;
border-radius: 28px; border-radius: 28px;
@ -226,7 +233,7 @@
font-size: 1rem; font-size: 1rem;
border-width: 0; border-width: 0;
background: #f2f2f2; background: #f2f2f2;
transition: width 0.5s ease-in; transition: width 0.5s ease-in, padding 0.5s ease-in;
&:focus, &:focus,
&:active, &:active,
@ -299,7 +306,7 @@
} }
} }
.tainacan-search-container #taincan-search-bar-block input#taincan-search-bar-block_input { .tainacan-search-container #tainacan-search-bar-block input#tainacan-search-bar-block_input {
background: white; background: white;
border-width: 3px; border-width: 3px;
border-style: solid; border-style: solid;
@ -352,7 +359,7 @@
text-decoration: none !important; text-decoration: none !important;
&.is-aligned-left { &.is-aligned-left {
min-height: 100px; min-height: 115px;
text-align: left; text-align: left;
flex-direction: row-reverse; flex-direction: row-reverse;
flex-wrap: nowrap; flex-wrap: nowrap;
@ -361,7 +368,7 @@
.search-bar-collection-header-title { text-align: right; } .search-bar-collection-header-title { text-align: right; }
} }
&.is-aligned-right { &.is-aligned-right {
min-height: 100px; min-height: 115px;
text-align: right; text-align: right;
flex-direction: row; flex-direction: row;
flex-wrap: nowrap; flex-wrap: nowrap;
@ -388,7 +395,7 @@
span.label { span.label {
width: 100%; width: 100%;
display: block; display: block;
margin-top: -12px; margin-top: -8px;
font-weight: normal; font-weight: normal;
font-size: 1rem; font-size: 1rem;
} }

7
src/gutenberg-blocks/tainacan-terms/carousel-terms-list/carousel-terms-list.scss
View File

@ -83,7 +83,7 @@
} }
.wp-block-tainacan-carousel-terms-list { .wp-block-tainacan-carousel-terms-list {
margin: 2rem 0px; margin: 2rem auto;
// Spinner // Spinner
.spinner-container { .spinner-container {
@ -142,7 +142,7 @@
text-decoration: none; text-decoration: none;
padding: 8px 16px; padding: 8px 16px;
display: block; display: block;
line-height: 1.2rem; line-height: 1.2em;
} }
a>img { a>img {
width: 100%; width: 100%;
@ -205,6 +205,9 @@
fill: #298596; fill: #298596;
} }
} }
&.alignfull .swiper-button-prev, .swiper-button-next {
margin: 0 6px;
}
// Carousel placeholder on editor side ---------------------------------------------------- // Carousel placeholder on editor side ----------------------------------------------------
.terms-list-edit-container, .terms-list-edit-container,

14
src/gutenberg-blocks/tainacan-terms/carousel-terms-list/index.js
View File

@ -155,7 +155,7 @@ registerBlockType('tainacan/carousel-terms-list', {
? ?
termItems[0].thumbnail['thumbnail'][0] termItems[0].thumbnail['thumbnail'][0]
: :
`${tainacan_plugin.base_url}/admin/images/placeholder_square.png`) `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`)
} }
alt={ termItems[0] && termItems[0].name ? termItems[0].name : __( 'Thumbnail', 'tainacan' ) }/> alt={ termItems[0] && termItems[0].name ? termItems[0].name : __( 'Thumbnail', 'tainacan' ) }/>
<img <img
@ -168,7 +168,7 @@ registerBlockType('tainacan/carousel-terms-list', {
? ?
termItems[1].thumbnail['thumbnail'][0] termItems[1].thumbnail['thumbnail'][0]
: :
`${tainacan_plugin.base_url}/admin/images/placeholder_square.png`) `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`)
} }
alt={ termItems[1] && termItems[1].name ? termItems[1].name : __( 'Thumbnail', 'tainacan' ) }/> alt={ termItems[1] && termItems[1].name ? termItems[1].name : __( 'Thumbnail', 'tainacan' ) }/>
<img <img
@ -181,13 +181,13 @@ registerBlockType('tainacan/carousel-terms-list', {
? ?
termItems[2].thumbnail['thumbnail'][0] termItems[2].thumbnail['thumbnail'][0]
: :
`${tainacan_plugin.base_url}/admin/images/placeholder_square.png`) `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`)
} }
alt={ termItems[2] && termItems[2].name ? termItems[2].name : __( 'Thumbnail', 'tainacan' ) }/> alt={ termItems[2] && termItems[2].name ? termItems[2].name : __( 'Thumbnail', 'tainacan' ) }/>
</div> </div>
: :
<img <img
src={ term.header_image ? term.header_image : `${tainacan_plugin.base_url}/admin/images/placeholder_square.png`} src={ term.header_image ? term.header_image : `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`}
alt={ term.name ? term.name : __( 'Thumbnail', 'tainacan' )}/> alt={ term.name ? term.name : __( 'Thumbnail', 'tainacan' )}/>
} }
{ !hideName ? <span>{ term.name ? term.name : '' }</span> : null } { !hideName ? <span>{ term.name ? term.name : '' }</span> : null }
@ -447,7 +447,7 @@ registerBlockType('tainacan/carousel-terms-list', {
icon={( icon={(
<img <img
width={148} width={148}
src={ `${tainacan_plugin.base_url}/admin/images/tainacan_logo_header.svg` } src={ `${tainacan_blocks.base_url}/admin/images/tainacan_logo_header.svg` }
alt="Tainacan Logo"/> alt="Tainacan Logo"/>
)}> )}>
<p> <p>
@ -545,8 +545,8 @@ registerBlockType('tainacan/carousel-terms-list', {
hide-name={ '' + hideName } hide-name={ '' + hideName }
max-terms-number={ maxTermsNumber } max-terms-number={ maxTermsNumber }
taxonomy-id={ taxonomyId } taxonomy-id={ taxonomyId }
tainacan-api-root={ tainacan_plugin.root } tainacan-api-root={ tainacan_blocks.root }
tainacan-base-url={ tainacan_plugin.base_url } tainacan-base-url={ tainacan_blocks.base_url }
show-term-thumbnail={ '' + showTermThumbnail } show-term-thumbnail={ '' + showTermThumbnail }
id={ 'wp-block-tainacan-carousel-terms-list_' + blockId }> id={ 'wp-block-tainacan-carousel-terms-list_' + blockId }>
{ content } { content }

4
src/gutenberg-blocks/tainacan-terms/terms-list/index.js
View File

@ -121,7 +121,7 @@ registerBlockType('tainacan/terms-list', {
target="_blank" target="_blank"
className={ (!showName ? 'term-without-name' : '') + ' ' + (!showImage ? 'term-without-image' : '') }> className={ (!showName ? 'term-without-name' : '') + ' ' + (!showImage ? 'term-without-image' : '') }>
<img <img
src={ term.header_image && term.header_image[0] && term.header_image[0].src ? term.header_image[0].src : `${tainacan_plugin.base_url}/admin/images/placeholder_square.png`} src={ term.header_image && term.header_image[0] && term.header_image[0].src ? term.header_image[0].src : `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`}
alt={ term.header_image && term.header_image[0] ? term.header_image[0].alt : term.name }/> alt={ term.header_image && term.header_image[0] ? term.header_image[0].alt : term.name }/>
<span>{ term.name ? term.name : '' }</span> <span>{ term.name ? term.name : '' }</span>
</a> </a>
@ -290,7 +290,7 @@ registerBlockType('tainacan/terms-list', {
icon={( icon={(
<img <img
width={148} width={148}
src={ `${tainacan_plugin.base_url}/admin/images/tainacan_logo_header.svg` } src={ `${tainacan_blocks.base_url}/admin/images/tainacan_logo_header.svg` }
alt="Tainacan Logo"/> alt="Tainacan Logo"/>
)}> )}>
<p> <p>

10
src/gutenberg-blocks/tainacan-terms/terms-list/terms-list.scss
View File

@ -1,7 +1,7 @@
@import '../../gutenberg-blocks-style.scss'; @import '../../gutenberg-blocks-style.scss';
.wp-block-tainacan-terms-list { .wp-block-tainacan-terms-list {
margin: 2rem 0px; margin: 2rem auto;
// Spinner // Spinner
.components-spinner { .components-spinner {
@ -9,6 +9,14 @@
right: 0; right: 0;
} }
// For all view modes ------------------------------------------------
ul.terms-list li.term-list-item > button,
ul.terms-list li.term-list-item > button:hover {
display: none;
visibility: hidden;
opacity: 0;
}
// Grid View Mode ---------------------------------------------------- // Grid View Mode ----------------------------------------------------
ul.terms-list.terms-layout-grid, ul.terms-list.terms-layout-grid,
ul.terms-list-edit.terms-layout-grid { ul.terms-list-edit.terms-layout-grid {

4
src/gutenberg-blocks/tainacan-terms/terms-list/terms-modal.js
View File

@ -363,7 +363,7 @@ export default class TermsModal extends React.Component {
{ term.header_image ? { term.header_image ?
<img <img
aria-hidden aria-hidden
src={ term.header_image && term.header_image[0] && term.header_image[0].src ? term.header_image[0].src : `${tainacan_plugin.base_url}/admin/images/placeholder_square.png`} src={ term.header_image && term.header_image[0] && term.header_image[0].src ? term.header_image[0].src : `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`}
alt={ term.header_image && term.header_image[0] ? term.header_image[0].alt : term.name }/> alt={ term.header_image && term.header_image[0] ? term.header_image[0].alt : term.name }/>
: null : null
} }
@ -396,7 +396,7 @@ export default class TermsModal extends React.Component {
{ term.header_image ? { term.header_image ?
<img <img
aria-hidden aria-hidden
src={ term.header_image && term.header_image[0] && term.header_image[0].src ? term.header_image[0].src : `${tainacan_plugin.base_url}/admin/images/placeholder_square.png`} src={ term.header_image && term.header_image[0] && term.header_image[0].src ? term.header_image[0].src : `${tainacan_blocks.base_url}/admin/images/placeholder_square.png`}
alt={ term.header_image && term.header_image[0] ? term.header_image[0].alt : term.name }/> alt={ term.header_image && term.header_image[0] ? term.header_image[0].alt : term.name }/>
: null : null
} }

16
src/js/event-bus-web-components.js
View File

@ -34,8 +34,10 @@ export const eventBus = new Vue({
.then(() => { .then(() => {
this.$emit('isUpdatingValue', false); this.$emit('isUpdatingValue', false);
let index = this.errors.findIndex( errorItem => errorItem.metadatum_id == metadatumId ); let index = this.errors.findIndex( errorItem => errorItem.metadatum_id == metadatumId );
if (index >= 0) if (index >= 0) {
this.errors.splice( index, 1); this.errors.splice( index, 1);
}
this.$emit('updateErrorMessageOf#' + metadatumId, this.errors[index]);
}) })
.catch((error) => { .catch((error) => {
this.$emit('isUpdatingValue', false); this.$emit('isUpdatingValue', false);
@ -45,17 +47,17 @@ export const eventBus = new Vue({
for (let index in error) for (let index in error)
messages.push(error[index]); messages.push(error[index]);
if ( index >= 0) if ( index >= 0) {
Vue.set( this.errors, index, { metadatum_id: metadatumId, errors: messages }); Vue.set( this.errors, index, { metadatum_id: metadatumId, errors: messages });
else this.$emit('updateErrorMessage', this.errors[index]);
} else {
this.errors.push( { metadatum_id: metadatumId, errors: messages } ); this.errors.push( { metadatum_id: metadatumId, errors: messages } );
this.$emit('updateErrorMessageOf#' + metadatumId, this.errors[0]);
}
}); });
} }
}, },
getErrors(metadatum_id) {
let error = this.errors.find(errorItem => errorItem.metadatum_id == metadatum_id);
return error ? error.errors : false
},
clearAllErrors() { clearAllErrors() {
this.errors = []; this.errors = [];
} }

12
src/js/store/modules/taxonomy/actions.js
View File

@ -174,9 +174,9 @@ export const updateTerm = ({ commit }, { taxonomyId, id, name, description, pare
export const fetchTerms = ({ commit }, {taxonomyId, fetchOnly, search, all, order, offset, number}) => { export const fetchTerms = ({ commit }, {taxonomyId, fetchOnly, search, all, order, offset, number}) => {
let query = ''; let query = '';
if (order == undefined) {
if (order == undefined)
order = 'asc'; order = 'asc';
}
if(fetchOnly && search && !all ){ if(fetchOnly && search && !all ){
query = `?order=${order}&${qs.stringify(fetchOnly)}&${qs.stringify(search)}`; query = `?order=${order}&${qs.stringify(fetchOnly)}&${qs.stringify(search)}`;
@ -188,9 +188,11 @@ export const fetchTerms = ({ commit }, {taxonomyId, fetchOnly, search, all, orde
query =`?hideempty=0&order=${order}`; query =`?hideempty=0&order=${order}`;
} }
if (offset != undefined && number != undefined) { if (number != undefined)
query += '&offset=' + offset + '&number=' + number; query += '&number=' + number;
}
if (offset != undefined)
query += '&offset=' + offset;
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
axios.tainacan.get(`/taxonomy/${taxonomyId}/terms${query}`) axios.tainacan.get(`/taxonomy/${taxonomyId}/terms${query}`)

5
src/migrations.php
View File

@ -424,6 +424,11 @@ class Migrations {
$wpdb->query( "UPDATE $wpdb->postmeta SET meta_key = 'document_content_index' WHERE meta_key = '_document_content_index'"); $wpdb->query( "UPDATE $wpdb->postmeta SET meta_key = 'document_content_index' WHERE meta_key = '_document_content_index'");
} }
static function refresh_rewrite_rules_attachment_pages() {
// needed after we added the /tainacan_attachments url
flush_rewrite_rules(false);
}
} }

Some files were not shown because too many files have changed in this diff Show More