Merge branch 'develop' into feature/200

This commit is contained in:
Vinícius Nunes 2019-12-05 11:32:24 -03:00
commit f2c43d248a
113 changed files with 3825 additions and 1224 deletions

67
package-lock.json generated
View File

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

View File

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

View File

@ -49,15 +49,15 @@
</template>
<div
class="source-metadatum"
v-for="(source_metadatum, index) of importerSourceInfo.source_metadata"
v-for="(sourceMetadatum, index) of importerSourceInfo.source_metadata"
:key="index">
<p>{{ source_metadatum }}</p>
<p>{{ sourceMetadatum }}</p>
<b-select
v-if="collectionMetadata != undefined &&
collectionMetadata.length > 0 &&
!isFetchingCollectionMetadata"
:value="checkCurrentSelectedCollectionMetadatum(source_metadatum)"
@input="onSelectCollectionMetadata($event, source_metadatum)"
:value="checkCurrentSelectedCollectionMetadatum(sourceMetadatum)"
@input="onSelectCollectionMetadata($event, sourceMetadatum)"
:placeholder="$i18n.get('label_select_metadatum')">
<option :value="undefined">
{{ $i18n.get('label_select_metadatum') }}
@ -193,6 +193,88 @@
</div>
</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
:active.sync="isLoading"
:can-cancel="false"/>
@ -229,7 +311,9 @@ export default {
metadatum: {},
editedMetadatum: {},
backgroundProcess: undefined,
metadataSearchCancel: undefined
metadataSearchCancel: undefined,
showTitlePromptModal: false,
selectedTitle: undefined
}
},
components: {
@ -286,6 +370,8 @@ export default {
.then(importerSourceInfo => {
this.importerSourceInfo = importerSourceInfo;
this.mappedCollection['total_items'] = this.importerSourceInfo.source_total_items;
this.loadMetadata();
})
.catch((errors) => {
this.$console.log(errors);
@ -307,25 +393,24 @@ export default {
isRepositoryLevel: false,
isContextEdit: false
}).then((resp) => {
resp.request
.then((metadata) => {
this.collectionMetadata = JSON.parse(JSON.stringify(metadata));
this.isFetchingCollectionMetadata = false;
resp.request
.then((metadata) => {
this.collectionMetadata = JSON.parse(JSON.stringify(metadata));
this.isFetchingCollectionMetadata = false;
this.fetchMappingImporter({ collection: this.collectionId, sessionId: this.sessionId })
.then(res => {
if( res ) {
this.mappedCollection['mapping'] = res;
}
})
})
.catch((error) => {
this.$console.error(error);
this.isFetchingCollectionMetadata = false;
});
// Search Request Token for cancelling
this.metadataSearchCancel = resp.source;
this.fetchMappingImporter({ collection: this.collectionId, sessionId: this.sessionId })
.then(res => {
if (res)
this.mappedCollection['mapping'] = res;
});
})
.catch((error) => {
this.$console.error(error);
this.isFetchingCollectionMetadata = false;
});
// Search Request Token for cancelling
this.metadataSearchCancel = resp.source;
})
.catch(() => this.isFetchingCollectionMetadata = false);
},
@ -339,21 +424,33 @@ export default {
let val = this.mappedCollection['mapping'][metadatumId];
const { source_metadata } = this.importerSourceInfo;
if(source_metadata && source_metadata.indexOf(val) >= 0) {
if (source_metadata && source_metadata.indexOf(val) >= 0)
return true;
}
}
return false;
},
checkCurrentSelectedCollectionMetadatum(sourceMetadatum) {
for (let key in this.mappedCollection['mapping']) {
if(this.mappedCollection['mapping'][key] == sourceMetadatum)
if (this.mappedCollection['mapping'][key] == sourceMetadatum)
return key;
}
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.updateImporterCollection({ sessionId: this.sessionId, collection: this.mappedCollection })
.then(updatedImporter => {
@ -433,17 +530,31 @@ export default {
this.isNewMetadatumModalActive = false;
this.selectedMetadatumType = undefined;
// Generates options for metadata listing
// Updates options for metadata listing
this.isFetchingCollectionMetadata = true;
this.fetchMetadata({collectionId: this.collectionId, isRepositoryLevel: false, isContextEdit: false })
.then((metadata) => {
this.collectionMetadata = JSON.parse(JSON.stringify(metadata));
this.isFetchingCollectionMetadata = false;
})
.catch((error) => {
this.$console.error(error);
this.isFetchingCollectionMetadata = false;
});
// Cancels previous Request
if (this.metadataSearchCancel != undefined)
this.metadataSearchCancel.cancel('Metadata search Canceled.');
this.fetchMetadata({
collectionId: this.collectionId,
isRepositoryLevel: false,
isContextEdit: false
}).then((resp) => {
resp.request
.then((metadata) => {
this.collectionMetadata = JSON.parse(JSON.stringify(metadata));
this.isFetchingCollectionMetadata = false;
})
.catch((error) => {
this.$console.error(error);
this.isFetchingCollectionMetadata = false;
});
// Search Request Token for cancelling
this.metadataSearchCancel = resp.source;
})
.catch(() => this.isFetchingCollectionMetadata = false);
},
onMetadatumEditionCanceled() {
// Reset variables for metadatum creation
@ -454,6 +565,15 @@ export default {
this.isEditingMetadatum = false;
this.isNewMetadatumModalActive = false;
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() {
@ -468,8 +588,7 @@ export default {
this.importerName = importerTypes[this.importerType].name;
});
this.loadImporter();
this.loadMetadata();
this.loadImporter();
},
beforeDestroy() {
// Cancels previous Request
@ -552,6 +671,7 @@ export default {
.source-metadatum {
padding: 2px 0;
min-height: 35px;
border-bottom: 1px solid $gray2;
width: 100%;
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>

View File

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

View File

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

View File

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

View File

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

View File

@ -236,18 +236,19 @@ export default {
this.showProcessesList = false;
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);
});
if (jQuery && jQuery( document )) {
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);
});
}
},
beforeDestroy() {
jQuery( document ).unbind( 'heartbeat-tick-popup')
if (jQuery && jQuery( document ))
jQuery( document ).unbind( 'heartbeat-tick-popup')
}
}
</script>

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 FilterTaxonomyCheckbox from '../../classes/filter-types/taxonomy/Checkbox.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 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-taxonomy-checkbox', FilterTaxonomyCheckbox);
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-list-interval', FilterNumericListInterval);
@ -116,7 +118,8 @@ function listen(evnt, elem, func) {
return r;
}
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() {

View File

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

View File

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

View File

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

View File

@ -97,6 +97,9 @@
max-height: unset !important;
}
}
.taginput.is-expanded {
width: 100%;
}
.taginput-container .mdi-magnify::before,
.autocomplete .mdi-magnify::before {
content: 'search';
@ -109,11 +112,12 @@
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 20px;
text-transform: none !important;
}
.taginput-container {
padding: 0px !important;
background-color: white !important;
background-color: transparent !important;
&:focus, &:active {
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 {
background: transparent;
border: none;
@ -224,6 +245,8 @@
line-height: inherit;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-transform: none !important;
letter-spacing: normal !important;
color: $secondary;
}

View File

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

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;
border-radius: 1px !important;
box-shadow: none !important;
background-color: white;
border: 1px solid $gray2;
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 {
box-shadow: none !important;
background-color: white;
border: 1px solid $gray4 !important;
}
&:hover {
border: 1px solid $gray3;
}
&[disabled] {
color: $gray4 !important;
background-color: $gray2 !important;

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@ -84,6 +84,7 @@ return apply_filters( 'tainacan-admin-i18n', [
'clear_radio' => __( 'Clear selected radio', 'tainacan' ),
'undo' => __( 'Undo', 'tainacan' ),
'delete' => __( 'Delete', 'tainacan' ),
'skip' => __( 'Skip', 'tainacan' ),
// Wordpress Status
'status_publish' => __( 'Publish', 'tainacan' ),
@ -492,7 +493,7 @@ return apply_filters( 'tainacan-admin-i18n', [
'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_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_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_final_value' => __( 'Final value', '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_month_january' => __( 'January', 'tainacan' ),

View File

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

View File

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

File diff suppressed because one or more lines are too long

View File

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

File diff suppressed because one or more lines are too long

View File

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

File diff suppressed because one or more lines are too long

View File

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

File diff suppressed because one or more lines are too long

View File

@ -3,6 +3,7 @@
.block-control {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: center;
align-items: center;
@ -22,15 +23,21 @@
position: relative;
fill: #555758; }
.components-placeholder__fieldset p {
font-size: 0.875rem !important;
margin-top: -2px;
fill: #555758; }
.components-placeholder__fieldset p svg {
margin-right: 1rem;
top: 4px;
position: relative;
.components-placeholder {
margin-bottom: 0;
background: #f6f6f6; }
.components-placeholder .components-placeholder__label {
margin-bottom: 0; }
.components-placeholder .components-placeholder__fieldset p {
font-size: 0.875rem !important;
margin: 12px 0;
color: #454647;
fill: #555758; }
.components-placeholder .components-placeholder__fieldset p svg {
margin-right: 1rem;
top: 4px;
position: relative;
fill: #555758; }
.wp-block-tainacan-modal {
width: 50%; }
@ -111,6 +118,9 @@
.wp-block-tainacan-modal .modal-checkbox-list .components-base-control,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .components-base-control {
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 .components-radio-control__option,
.wp-block-tainacan-modal .modal-radio-list .components-base-control__field .modal-checkbox-list-item,
@ -159,7 +169,7 @@
color: #454647; }
.wp-block-tainacan-dynamic-items-list {
margin: 2rem 0px; }
margin: 2rem auto; }
.wp-block-tainacan-dynamic-items-list .spinner-container {
min-height: 56px;
padding: 1rem;
@ -167,6 +177,8 @@
justify-content: center;
align-items: center;
color: #555758; }
.wp-block-tainacan-dynamic-items-list:hover .components-resizable-box__handle {
display: block; }
@-webkit-keyframes skeleton-animation {
0% {
opacity: 1.0; }
@ -224,12 +236,13 @@
.wp-block-tainacan-dynamic-items-list .dynamic-items-collection-header .collection-name h3 {
color: white;
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 {
text-decoration: none; }
.wp-block-tainacan-dynamic-items-list .dynamic-items-collection-header .collection-name span.label {
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 {
justify-content: center;
padding: 1rem; }
@ -337,60 +350,28 @@
width: 100%;
border: 1px solid #cbcbcb;
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-edit.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-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);
justify-content: center !important;
grid-template-rows: auto !important;
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-edit.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-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-right: 0 !important;
margin-left: 0 !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-edit.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-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;
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 {
display: flex;
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 {
background-color: white !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) {
.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 {
@ -436,7 +456,8 @@
display: flex;
flex-wrap: wrap;
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-edit.items-layout-list li.item-list-item {
position: relative;
@ -487,5 +508,389 @@
.wp-block-tainacan-dynamic-items-list ul.items-list-edit.items-layout-list li.item-list-item {
min-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 */

File diff suppressed because one or more lines are too long

View File

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

File diff suppressed because one or more lines are too long

View File

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

File diff suppressed because one or more lines are too long

View File

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

File diff suppressed because one or more lines are too long

View File

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

File diff suppressed because one or more lines are too long

View File

@ -59,7 +59,7 @@ class Elastic_Press {
$array_dynamic_templates = $mapping["mappings"]["post"]["dynamic_templates"];
foreach ($array_dynamic_templates as $key => $dynamic_templates) {
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] =
// ['type' => 'nested',
// 'properties' => [
@ -229,7 +229,7 @@ class Elastic_Press {
if( isset($args['meta_query']) ) {
foreach( $args['meta_query'] as $metaquery ) {
if( $metaquery['key'] == $metadatum_id ){
if( isset($metaquery['key']) && $metaquery['key'] == $metadatum_id ){
$include = is_array($metaquery['value']) ? $metaquery['value'] : [$metaquery['value']];
}
}
@ -284,8 +284,8 @@ class Elastic_Press {
$new_sort["post_name.raw"] = $value;
} elseif ($key == 'post_type') {
$new_sort["post_type.raw"] = $value;
} elseif( !in_array("long", $parts) && in_array("meta", $parts) ) {
$new_sort["$key.sortable"] = $value;
// } elseif( !in_array("long", $parts) && in_array("meta", $parts) ) {
// $new_sort["$key.sortable"] = $value;
} else {
$new_sort[$key] = $value;
}
@ -434,7 +434,8 @@ class Elastic_Press {
//"size" => $filter['max_options'],
"script" => [
"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] == $parent) { 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(
"script" => [
"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;"
]
)
)
@ -500,7 +502,8 @@ class Elastic_Press {
}
}
$formatted_args['aggs'] = $aggs;
if(!empty($aggs))
$formatted_args['aggs'] = $aggs;
return $formatted_args;
}
@ -559,7 +562,8 @@ class Elastic_Press {
"terms" => [
"script" => [
"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] == $parent) { 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 +579,8 @@ class Elastic_Press {
"terms" => array(
"script" => [
"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] == $parent) { 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;"
]
)
)
@ -621,7 +626,8 @@ class Elastic_Press {
$aggs[$id]['composite']['after'] = [$id => $filter['last_term'] ];
}
$formatted_args['aggs'] = $aggs;
if(!empty($aggs))
$formatted_args['aggs'] = $aggs;
return $formatted_args;
}
@ -631,6 +637,10 @@ class Elastic_Press {
private function format_aggregations_items($aggregations) {
global $wpdb;
$formated_aggs = [];
if( empty($aggregations) )
return $formated_aggs;
foreach($aggregations as $key => $aggregation) {
$description_types = \explode(".", $key);
$filter_id = $description_types[0];
@ -701,6 +711,10 @@ class Elastic_Press {
private function format_aggregations_facet($aggregations) {
global $wpdb;
$formated_aggs = ['values'=>[]];
if( empty($aggregations) )
return $formated_aggs;
foreach($aggregations as $key => $aggregation) {
$description_types = \explode(".", $key);
if($description_types[0] == 'taxonomy') {

View File

@ -5,58 +5,78 @@ namespace Tainacan;
* Class withe helpful methods to handle media in Tainacan
*/
class Media {
private static $instance = null;
private static $file_handle = null;
private static $file_name = null;
private $attachment_html_url_base = 'tainacan_attachment_html';
public static function get_instance() {
if(!isset(self::$instance)) {
self::$instance = new self();
}
public static function get_instance() {
if(!isset(self::$instance)) {
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.
*
* @param String $url
* @param String $url
* @param Int $post_id (optional) the post this attachement should be attached to. empty for none
* @return Int|false Attachment ID. False on failure
*/
public function insert_attachment_from_url($url, $post_id = null) {
$filename = $this->save_remote_file($url);
if( !file_exists($filename) ) {
return false;
}
$file = fopen($filename,'r');
$file = file_get_contents($filename);
if (false === $file) {
return false;
}
return $this->insert_attachment_from_blob($file, basename($url), $post_id);
}
/**
* Insert an attachment from a local file.
*
* @param String $filename The path to the file
* @param String $filename The path to the file
* @param Int $post_id (optional) the post this attachement should be attached to. empty for none
* @return Int|false Attachment ID. False on failure
*/
public function insert_attachment_from_file($filename, $post_id = null) {
if( !file_exists($filename) ) {
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);
}
/**
@ -121,7 +141,7 @@ class Media {
public function insert_attachment_from_blob($blob, $filename, $post_id = null) {
do_action('tainacan-pre-insert-attachment', $blob, $filename, $post_id);
$upload = wp_upload_bits( $filename, null, $blob );
if( !empty( $upload['error'] ) ) {
return false;
@ -130,7 +150,7 @@ class Media {
if( @filesize($upload['file']) == 0 && is_resource($blob) ){
$file_wordpress_stream = fopen( $upload['file'], 'r+');
stream_copy_to_stream($blob, $file_wordpress_stream);
if( file_exists(self::$file_name) ) unlink(self::$file_name);
}
@ -139,12 +159,12 @@ class Media {
$file_type = wp_check_filetype( $file_name, null );
$attachment_title = sanitize_file_name( pathinfo( $file_name, PATHINFO_FILENAME ) );
$wp_upload_dir = wp_upload_dir();
$guid = \str_replace($wp_upload_dir['basedir'], '', $file_path);
$guid = $wp_upload_dir['baseurl'] . $guid;
$post_info = array(
'guid' => $guid,
'guid' => $guid,
'post_mime_type' => $file_type['type'],
'post_title' => $attachment_title,
'post_content' => '',
@ -162,12 +182,12 @@ class Media {
// Assign metadata to attachment
wp_update_attachment_metadata( $attach_id, $attach_data );
do_action('tainacan-post-insert-attachment', $attach_id, $attach_data, $post_id);
return $attach_id;
}
/**
* Add support to get mime type content even when mime_content_type function is not available
* @param string $filename The file name to check the mime type
@ -183,10 +203,10 @@ class Media {
return $mime_type;
}
}
/**
* Extract an image from the first page of a pdf file
*
*
* @param string $filepath The pdf filepath in the server
* @return blob bitstream of the image in jpg format
*/
@ -195,11 +215,11 @@ class Media {
if ($blob) {
return $blob;
}
if (!class_exists('\Imagick')) {
return null;
}
if ( $this->get_mime_content_type($filepath) != 'application/pdf') {
return null;
}
@ -207,10 +227,10 @@ class Media {
if ( !is_readable( realpath($filepath) ) ) {
return null;
}
try {
register_shutdown_function(array($this, 'shutdown_function'));
$this->THROW_EXCPTION_ON_FATAL_ERROR = true;
$this->THROW_EXCPTION_ON_FATAL_ERROR = true;
$imagick = new \Imagick();
$imagick->setResolution(72,72);
$imagick->readImage($filepath . '[0]');
@ -227,23 +247,23 @@ class Media {
private $THROW_EXCPTION_ON_FATAL_ERROR = false;
public function shutdown_function() {
if( $this->THROW_EXCPTION_ON_FATAL_ERROR )
if( $this->THROW_EXCPTION_ON_FATAL_ERROR )
throw new \Exception("fatal error");
}
public function index_pdf_content($file, $item_id) {
if ( ! defined('TAINACAN_INDEX_PDF_CONTENT') || true !== TAINACAN_INDEX_PDF_CONTENT ) {
return;
}
$content_index_meta = 'document_content_index';
if ($file == null) {
$meta_id = update_post_meta( $item_id, $content_index_meta, null );
return true;
}
if ( ! \file_exists($file) ) {
return false;
}
@ -251,8 +271,8 @@ class Media {
if ( $this->get_mime_content_type($file) != 'application/pdf') {
return null;
}
// Allow plugins to implement other approach to index pdf contents
// Allow plugins to implement other approach to index pdf contents
$alternate = apply_filters('tainacan-index-pdf', null, $file, $item_id);
if ( ! \is_null($alternate) ) {
return $alternate;
@ -272,5 +292,71 @@ class Media {
return false;
}
}
}
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();
}
}

View File

@ -235,6 +235,7 @@ class Private_Files {
$mime_type = \Tainacan\Media::get_instance()->get_mime_content_type($existing_file);
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-Type: application/octet-stream');
header("Content-type: " . $mime_type);

View File

@ -100,7 +100,7 @@ class Item extends Entity {
];
$attachments = get_posts( $attachments_query );
return apply_filters("tainacan-item-get-attachments", $attachments, $exclude, $this);
}
@ -123,11 +123,11 @@ class Item extends Entity {
* @return array
*/
function get_thumbnail() {
$sizes = get_intermediate_image_sizes();
array_unshift($sizes, 'full');
foreach ( $sizes as $size ) {
$thumbs[$size] = wp_get_attachment_image_src( $this->get__thumbnail_id(), $size );
}
@ -226,7 +226,7 @@ class Item extends Entity {
function get_description() {
return $this->get_mapped_property( 'description' );
}
/**
* Return the item document type
*
@ -235,7 +235,7 @@ class Item extends Entity {
function get_document_type() {
return $this->get_mapped_property( 'document_type' );
}
/**
* Return the item document
*
@ -263,7 +263,7 @@ class Item extends Entity {
public function get_capabilities() {
return $this->get_collection()->get_items_capabilities();
}
/**
* Checks if comments are allowed for the current Collection.
* @return string "open"|"closed"
@ -294,6 +294,17 @@ class Item extends Entity {
$this->set_mapped_property( 'order', $value );
}
/**
* Define the creation date
*
* @param [string] $value
*
* @return void
*/
function set_creation_date( $value ) {
$this->set_mapped_property( 'creation_date', $value );
}
/**
* Define the parent ID
*
@ -315,7 +326,7 @@ class Item extends Entity {
function set_document_type( $value ) {
$this->set_mapped_property( 'document_type', $value );
}
/**
* Define the document
*
@ -326,7 +337,7 @@ class Item extends Entity {
function set_document( $value ) {
$this->set_mapped_property( 'document', $value );
}
/**
* Define the description
*
@ -363,7 +374,7 @@ class Item extends Entity {
$this->cap = $item_collection->get_items_capabilities();
}
}
/**
* Sets if comments are allowed for the current Item.
*
@ -397,7 +408,7 @@ class Item extends Entity {
$arrayItemMetadata = $this->get_metadata();
if ( $arrayItemMetadata ) {
foreach ( $arrayItemMetadata as $itemMetadata ) {
// skip validation for Compound Metadata
if ( $itemMetadata->get_metadatum()->get_metadata_type() == 'Tainacan\Metadata_Types\Compound' ) {
continue;
@ -435,29 +446,29 @@ class Item extends Entity {
return parent::validate();
}
public function _toHtml() {
$return = '';
$id = $this->get_id();
if ( $id ) {
$link = get_permalink( (int) $id );
if (is_string($link)) {
$return = "<a data-linkto='item' data-id='$id' href='$link'>";
$return.= $this->get_title();
$return .= "</a>";
}
}
return $return;
}
/**
@ -470,25 +481,25 @@ class Item extends Entity {
*
* @param array|string $args {
* Optional. Array or string of arguments.
*
*
* @type mixed $metadata Metadatum object, ID or slug to retrieve only one metadatum. empty returns all metadata
*
*
* @type array $metadata__in Array of metadata IDs or Slugs to be retrieved. Default none
*
*
* @type array $metadata__not_in Array of metadata IDs (slugs not accepted) to excluded. Default none
*
*
* @type bool $exclude_title Exclude the Core Title Metadata from result. Default false
*
*
* @type bool $exclude_description Exclude the Core Description Metadata from result. Default false
*
*
* @type bool $exclude_core Exclude Core Metadata (title and description) from result. Default false
*
*
* @type bool $hide_empty Wether to hide or not metadata the item has no value to
* Default: true
* @type string $before String to be added before each metadata block
* Default '<div class="metadata-type-$type">' where $type is the metadata type slug
* @type string $after String to be added after each metadata block
* Default '</div>'
* Default '</div>'
* @type string $before_title String to be added before each metadata title
* Default '<h3>'
* @type string $after_title String to be added after each metadata title
@ -503,12 +514,12 @@ class Item extends Entity {
* @throws \Exception
*/
public function get_metadata_as_html($args = array()) {
$Tainacan_Item_Metadata = \Tainacan\Repositories\Item_Metadata::get_instance();
$Tainacan_Metadata = \Tainacan\Repositories\Metadata::get_instance();
$return = '';
$defaults = array(
'metadata' => null,
'metadata__in' => null,
@ -527,9 +538,9 @@ class Item extends Entity {
$args = wp_parse_args($args, $defaults);
if (!is_null($args['metadata'])) {
$metadatum_object = null;
if ( $metadatum instanceof \Tainacan\Entities\Metadatum ) {
$metadatum_object = $metadatum;
} elseif ( is_int($metadatum) ) {
@ -540,10 +551,10 @@ class Item extends Entity {
$metadatum_object = $metadatum[0];
}
}
if ( $metadatum_object instanceof \Tainacan\Entities\Metadatum ) {
if ( is_array($args['metadata__not_in'])
if ( is_array($args['metadata__not_in'])
&& (
in_array($metadatum_object->get_slug(), $args['metadata__not_in']) ||
in_array($metadatum_object->get_id(), $args['metadata__not_in'])
@ -551,23 +562,23 @@ class Item extends Entity {
) {
return $return;
}
$mto = $metadatum_object->get_metadata_type_object();
$before = str_replace('$type', $mto->get_slug(), $args['before']);
$return .= $before;
$item_meta = new \Tainacan\Entities\Item_Metadata_Entity($this, $metadatum_object);
if ($item_meta->has_value() || !$args['hide_empty']) {
$return .= $args['before_title'] . $metadatum_object->get_name() . $args['after_title'];
$return .= $args['before_value'] . $item_meta->get_value_as_html() . $args['after_value'];
}
$return .= $args['after'];
}
return $return;
}
@ -604,13 +615,13 @@ class Item extends Entity {
$query_args['post__name_in'] = $post__name_in;
}
$metadata = $this->get_metadata($query_args);
foreach ( $metadata as $item_meta ) {
$fto = $item_meta->get_metadatum()->get_metadata_type_object();
$before = str_replace('$type', $fto->get_slug(), $args['before']);
$return .= $before;
@ -628,21 +639,21 @@ class Item extends Entity {
$return .= $args['before_title'] . $item_meta->get_metadatum()->get_name() . $args['after_title'];
$return .= $args['before_value'] . $item_meta->get_value_as_html() . $args['after_value'];
}
$return .= $args['after'];
}
return $return;
}
public function get_document_as_html($img_size = 'large') {
$type = $this->get_document_type();
$output = '';
if ( $type == 'url' ) {
global $wp_embed;
$_embed = $wp_embed->autoembed($this->get_document());
@ -653,47 +664,47 @@ class Item extends Entity {
} elseif ( $type == 'text' ) {
$output .= $this->get_document();
} elseif ( $type == 'attachment' ) {
if ( wp_attachment_is_image($this->get_document()) ) {
$img = wp_get_attachment_image($this->get_document(), $img_size);
$img_full = wp_get_attachment_url($this->get_document());
$image_attributes = wp_get_attachment_image_src( $this->get_document(), $img_size );
$img = "<img style='max-width: 100%;' src='" . $image_attributes[0] . "' />";
$output .= sprintf("<a href='%s' target='blank'>%s</a>", $img_full, $img);
} else {
global $wp_embed;
$url = wp_get_attachment_url($this->get_document());
$embed = $wp_embed->autoembed($url);
if ( $embed == $url ) {
$output .= sprintf("<a href='%s' target='blank'>%s</a>", $url, $url);
} else {
$output .= $embed;
}
}
}
return apply_filters("tainacan-item-get-document-as-html", $output, $img_size, $this);
}
/**
* Gets the url to the edit page for this item
* Gets the url to the edit page for this item
*/
public function get_edit_url() {
$collection_id = $this->get_collection_id();
$id = $this->get_id();
return admin_url("?page=tainacan_admin#/collections/$collection_id/items/$id/edit");
}
}
}

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@ -1,8 +1,9 @@
<template>
<div class="block">
<b-taginput
:id="metadatumComponentId"
expanded
:disabled="disabled"
:id="metadatumComponentId"
size="is-small"
icon="magnify"
:allow-new="false"
@ -19,7 +20,20 @@
:loading="isFetching"
:class="{'has-selected': selected != undefined && selected != []}"
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>
</template>
@ -31,7 +45,6 @@
return {
selected: [],
labels: [],
termList: [],
isFetching: false,
}
},
@ -65,7 +78,6 @@
'getTerms'
]),
autoCompleteTerm: _.debounce( function(value) {
this.termList = [];
this.labels = [];
this.isFetching = true;
@ -80,17 +92,19 @@
search: {
searchterm: value
},
all: true
all: true,
order: 'asc',
offset: 0,
number: 12
}).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});
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.isFetching = false;
this.isFetching = false;
}).catch((error) => {
this.isFetching = false;
throw error;

View File

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

View File

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

View File

@ -172,16 +172,16 @@ class Items extends Repository {
$collection->register_collection_item_post_type();
}
// register taxonomies
// register taxonomies
if ( is_array( $taxonomies ) && sizeof( $taxonomies ) > 0 ) {
foreach ( $taxonomies as $taxonomy ) {
$taxonomy->tainacan_register_taxonomy();
}
}
// register taxonomies to collections considering metadata inheritance
$Tainacan_Taxonomies->register_taxonomies_for_all_collections();
}
public function insert( $item ) {
@ -195,7 +195,7 @@ class Items extends Repository {
* to learn all args accepted in the $args parameter (@see https://developer.wordpress.org/reference/classes/wp_query/)
* You can also use a mapped property, such as name and description, as an argument and it will be mapped to the
* appropriate WP_Query argument
*
*
* If a number is passed to $args, it will return a \Tainacan\Entities\Item object. But if the post is not found or
* does not match the entity post type, it will return an empty array
*
@ -213,7 +213,7 @@ class Items extends Repository {
$Tainacan_Collections = \Tainacan\Repositories\Collections::get_instance();
if ( is_numeric( $args ) ) {
$existing_post = get_post( $args );
if ( $existing_post instanceof \WP_Post ) {
try {
@ -285,7 +285,24 @@ class Items extends Repository {
$args = $this->parse_fetch_args( $args );
$args['post_type'] = $cpt;
// If no orderby was passed, or if only one orderby parameter is passed
// we add a second criteria to order by ID and make sure items are always returned in the same order
// See #337
if ( ! isset($args['orderby']) ) {
$args['orderby'] = 'post_date';
}
if ( ! isset($args['order']) ) {
$args['order'] = 'DESC';
}
if ( is_string( $args['orderby'] ) ) {
$new_order = [
$args['orderby'] => $args['order'],
'ID' => 'DESC'
];
$args['orderby'] = $new_order;
}
$args = apply_filters( 'tainacan_fetch_args', $args, 'items' );
$wp_query = new \WP_Query( $args );
@ -375,7 +392,7 @@ class Items extends Repository {
return $where;
}
/**
* generate a content of document to index.
*
@ -480,23 +497,23 @@ class Items extends Repository {
}
/**
* Return if comment are open for this item (post_id) and the collection too
*
* Return if comment are open for this item (post_id) and the collection too
*
* @param bool $open_comment
* @param integer $post_id Item id
* @return bool
*/
public function hook_comments_open($open_comment, $post_id) {
$item = self::get_entity_by_post($post_id);
if($item != false && $item instanceof Entities\Item) {
$collection = $item->get_collection();
if( $collection->get_allow_comments() !== 'open' ) return false;
}
return $open_comment;
}
/**
* Filter to handle special permissions
*
@ -506,9 +523,9 @@ class Items extends Repository {
public function map_meta_cap( $caps, $cap, $user_id, $args ) {
// Filters meta caps edit_tainacan-collection and check if user is moderator
if ( $cap == 'read_post' && is_array( $args ) && array_key_exists( 0, $args ) ) {
if ( $cap == 'read_post' && is_array( $args ) && array_key_exists( 0, $args ) ) {
$entity = $args[0];
if ( is_numeric( $entity ) || $entity instanceof Entities\Item ) {
@ -518,24 +535,24 @@ class Items extends Repository {
}
if ( $entity instanceof Entities\Item ) {
$collection = $entity->get_collection();
if ( $collection instanceof Entities\Collection ) {
$status_obj = get_post_status_object( $collection->get_status() );
if ( ! $status_obj->public ) {
$caps[] = $entity->get_capabilities()->read_private_posts;
}
}
}
}
}
return $caps;
}
/**
* Check if $user can read the item based on the colletion
*
@ -546,37 +563,37 @@ class Items extends Repository {
* @throws \Exception
*/
public function can_read( Entities\Entity $entity, $user = null ) {
if ( ! $entity instanceof Entities\Item) {
throw new InvalidArgumentException('Items::can_read() expects an Item entity as the first parameter');
}
// can read the item looking only to the item
$can_read = parent::can_read($entity, $user);
if ( $can_read ) {
$collection = $entity->get_collection();
$status_obj = get_post_status_object( $collection->get_status() );
if ( $status_obj->public ) {
return $can_read;
}
}
if ( is_null($user) ) {
$user = get_current_user_id();
}
if ( ! $user ) {
return false;
} elseif ( is_object( $user ) ) {
$user = $user->ID;
}
$entity_cap = $entity->get_capabilities();
return user_can( $user, $entity_cap->read_private_posts, $entity->get_id() );
}
}

View File

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

View File

@ -15,21 +15,19 @@ defined( 'ABSPATH' ) or die( 'No script kiddies please!' );
trait Entity_Collection_Relation {
/**
*
*
* @return int collection item ID
*/
public function get_collection_id() {
return $this->get_mapped_property('collection_id');
}
/**
* Return Collection from relation
* @return Entities\Collection|NULL Return Collection or null on errors
*/
public function get_collection() {
if (isset($this->collection) && $this->collection instanceof Entities\Collection)
return $this->collection;
if (is_numeric($this->get_collection_id())) {
$Tainacan_Collections = \Tainacan\Repositories\Collections::get_instance();
@ -39,19 +37,19 @@ trait Entity_Collection_Relation {
return $this->collection;
}
}
return null;
}
/**
* Set collection ID
* @param int $value
*/
public function set_collection_id($value) {
$this->collection = null;
$this->set_mapped_property('collection_id', $value);
$this->set_mapped_property('collection_id', $value);
}
/**
* set collection object and id
* @param Entities\Collection $collection
@ -61,4 +59,4 @@ trait Entity_Collection_Relation {
$this->set_collection_id($collection->get_id());
}
}
}

View File

@ -10,16 +10,14 @@ trait Entity_Collections_Relation {
public function get_collections_ids() {
return $this->get_mapped_property('collections_ids');
}
public function get_collections() {
if (isset($this->collections))
return $this->collections;
if (is_array($this->get_collections_ids()) && !empty($this->get_collections_ids())) {
$Tainacan_Collections = \Tainacan\Repositories\Collections::get_instance();
$this->collections = [];
foreach ($this->get_collections_ids() as $col_id) {
$collection = $Tainacan_Collections->fetch($col_id);
@ -27,28 +25,28 @@ trait Entity_Collections_Relation {
$this->collections[] = $collection;
}
}
return $this->collections;
}
return null;
}
public function set_collections_ids(Array $value) {
$this->set_mapped_property('collections_ids', $value);
$this->collections = null;
}
public function set_collections(Array $collections) {
$collections_ids = [];
$this->collections = $collections;
foreach ($collections as $collection){
$collections_ids[] = $collection->get_id();
}
$this->set_collections_ids($collections_ids);
}
@ -59,7 +57,7 @@ trait Entity_Collections_Relation {
$this->set_collections_ids($collections);
}
public function remove_collection_id($collection_id){
$collections = $this->get_mapped_property('collections_ids');
@ -70,4 +68,4 @@ trait Entity_Collections_Relation {
$this->set_collections_ids($collections);
}
}
}

View File

@ -1,9 +1,9 @@
import axios from 'axios';
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;

View File

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

View File

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

View File

@ -250,7 +250,7 @@ export default {
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 })
.then(response => {

View File

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

View File

@ -224,7 +224,7 @@ export default class CollectionsModal extends React.Component {
{ collection.thumbnail ?
<img
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 }/>
: null
}
@ -257,7 +257,7 @@ export default class CollectionsModal extends React.Component {
{ collection.thumbnail ?
<img
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 }/>
: null
}

View File

@ -150,7 +150,7 @@ registerBlockType('tainacan/carousel-collections-list', {
?
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' ) }/>
<img
@ -163,7 +163,7 @@ registerBlockType('tainacan/carousel-collections-list', {
?
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' ) }/>
<img
@ -176,7 +176,7 @@ registerBlockType('tainacan/carousel-collections-list', {
?
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' ) }/>
</div>
@ -191,7 +191,7 @@ registerBlockType('tainacan/carousel-collections-list', {
?
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' ) }/>
}
@ -215,7 +215,7 @@ registerBlockType('tainacan/carousel-collections-list', {
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 })
.then(response => {
@ -446,7 +446,7 @@ registerBlockType('tainacan/carousel-collections-list', {
icon={(
<img
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"/>
)}>
<p>
@ -542,8 +542,8 @@ registerBlockType('tainacan/carousel-collections-list', {
loop-slides={ '' + loopSlides }
hide-name={ '' + hideName }
max-collections-number={ maxCollectionsNumber }
tainacan-api-root={ tainacan_plugin.root }
tainacan-base-url={ tainacan_plugin.base_url }
tainacan-api-root={ tainacan_blocks.root }
tainacan-base-url={ tainacan_blocks.base_url }
show-collection-thumbnail={ '' + showCollectionThumbnail }
id={ 'wp-block-tainacan-carousel-collections-list_' + blockId }>
{ content }

View File

@ -1,7 +1,7 @@
@import '../../gutenberg-blocks-style.scss';
.wp-block-tainacan-collections-list {
margin: 2rem 0px;
margin: 2rem auto;
// Spinner
.components-spinner {
@ -9,6 +9,14 @@
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 ----------------------------------------------------
ul.collections-list.collections-list-without-margin,
ul.collections-list-edit.collections-list-without-margin {

View File

@ -226,7 +226,7 @@ export default class CollectionsModal extends React.Component {
{ collection.thumbnail ?
<img
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 }/>
: null
}
@ -259,7 +259,7 @@ export default class CollectionsModal extends React.Component {
{ collection.thumbnail ?
<img
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 }/>
: null
}

View File

@ -123,7 +123,7 @@ registerBlockType('tainacan/collections-list', {
target="_blank"
className={ (!showName ? 'collection-without-name' : '') + ' ' + (!showImage ? 'collection-without-image' : '') }>
<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 }/>
<span>{ collection.name ? collection.name : '' }</span>
</a>
@ -304,7 +304,7 @@ registerBlockType('tainacan/collections-list', {
icon={(
<img
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"/>
)}>
<p>

View File

@ -4,81 +4,86 @@ import FacetsListTheme from './facets-list-theme.vue';
// This is rendered on the theme side.
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;
let blocks = document.getElementsByClassName('wp-block-tainacan-facets-list');
if (blocks) {
let blockIds = Object.values(blocks).map((block) => block.id);
// Creates a new Vue Instance to manage each block isolatelly
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) );
}
}
});

View File

@ -158,7 +158,8 @@ export default {
metadatumId: String,
metadatumType: String,
collectionId: String,
collectionSlug: String,
collectionSlug: String,
parentTermId: String,
showImage: Boolean,
showItemsCount: Boolean,
showSearchBar: Boolean,
@ -227,7 +228,15 @@ export default {
queryObject.offset = this.offset;
if (this.lastTerm != undefined)
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
queryObject['context'] = 'extended';

View File

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

View File

@ -2,11 +2,12 @@ const { registerBlockType } = wp.blocks;
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;
import MetadataModal from './metadata-modal.js';
import ParentTermModal from './parent-term-modal.js';
import tainacan from '../../api-client/axios.js';
import axios from 'axios';
import qs from 'qs';
@ -116,6 +117,14 @@ registerBlockType('tainacan/facets-list', {
type: String,
default: undefined
},
parentTerm: {
type: Number,
default: null
},
isParentTermModalOpen: {
type: Boolean,
default: false
}
},
supports: {
align: ['full', 'wide'],
@ -141,7 +150,9 @@ registerBlockType('tainacan/facets-list', {
facetsRequestSource,
maxFacetsNumber,
searchString,
isLoading
isLoading,
parentTerm,
isParentTermModalOpen
} = attributes;
// Obtains block's client id to render it on save function
@ -165,7 +176,7 @@ registerBlockType('tainacan/facets-list', {
?
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' ) }/>
: null
@ -181,7 +192,7 @@ registerBlockType('tainacan/facets-list', {
?
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' ) }/>
: null
@ -231,6 +242,14 @@ registerBlockType('tainacan/facets-list', {
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
queryObject['context'] = 'extended';
@ -243,13 +262,13 @@ registerBlockType('tainacan/facets-list', {
if (metadatumType == 'Taxonomy') {
for (let facet of response.data.values) {
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));
}
} else {
for (let facet of response.data.values) {
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));
}
}
@ -284,6 +303,13 @@ registerBlockType('tainacan/facets-list', {
isModalOpen: isModalOpen
} );
}
function openParentTermModal() {
isParentTermModalOpen = true;
setAttributes( {
isParentTermModalOpen: isParentTermModalOpen
} );
}
function updateLayout(newLayout) {
layout = newLayout;
@ -391,6 +417,25 @@ registerBlockType('tainacan/facets-list', {
max={ 96 }
/>
</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>
<div>
{ layout == 'list' && (metadatumType == 'Taxonomy' || metadatumType == 'Relationship') ?
@ -497,13 +542,31 @@ registerBlockType('tainacan/facets-list', {
setAttributes({
metadatumId: metadatumId,
metadatumType: metadatumType,
isModalOpen: false
isModalOpen: false,
parentTerm: null
});
setContent();
}}
onCancelSelection={ () => setAttributes({ isModalOpen: false }) }/>
: 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 ? (
<div className="block-control">
@ -523,7 +586,7 @@ registerBlockType('tainacan/facets-list', {
isPrimary
type="submit"
onClick={ () => openMetadataModal() }>
{__('Configure search', 'tainacan')}
{__('Select facets', 'tainacan')}
</Button>
</div>
): null
@ -565,7 +628,7 @@ registerBlockType('tainacan/facets-list', {
icon={(
<img
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"/>
)}>
<p>
@ -580,12 +643,32 @@ registerBlockType('tainacan/facets-list', {
</svg>
{__('List facets from a Tainacan Collection or Repository', 'tainacan')}
</p>
<Button
isPrimary
type="submit"
onClick={ () => openMetadataModal() }>
{__('Select facets', 'tainacan')}
</Button>
{
parentTerm && parentTerm.id && metadatumType == 'Taxonomy'?
<div style={{ display: 'flex' }}>
<Button
isPrimary
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>
) : null
}
@ -637,7 +720,8 @@ registerBlockType('tainacan/facets-list', {
content,
blockId,
collectionId,
collectionSlug,
collectionSlug,
parentTerm,
showImage,
showItemsCount,
showLoadMore,
@ -649,13 +733,13 @@ registerBlockType('tainacan/facets-list', {
maxFacetsNumber,
showSearchBar,
} = attributes;
return <div
className={ className }
metadatum-id={ metadatumId }
metadatum-type={ metadatumType }
collection-id={ collectionId }
collection-slug={ collectionSlug }
collection-slug={ collectionSlug }
parent-term-id={ parentTerm ? parentTerm.id : null }
show-image={ '' + showImage }
show-items-count={ '' + showItemsCount }
show-search-bar={ '' + showSearchBar }
@ -664,11 +748,145 @@ registerBlockType('tainacan/facets-list', {
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 }
tainacan-api-root={ tainacan_blocks.root }
tainacan-base-url={ tainacan_blocks.base_url }
tainacan-site-url={ tainacan_blocks.site_url }
id={ 'wp-block-tainacan-facets-list_' + blockId }>
{ content }
</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>
}
}
]
});

View File

@ -113,7 +113,7 @@ export default class MetadataModal extends React.Component {
let selectedCollection;
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 {
selectedCollection = this.state.modalCollections.find((collection) => collection.id == selectedCollectionId)
if (selectedCollection == undefined)
@ -387,7 +387,7 @@ export default class MetadataModal extends React.Component {
<RadioControl
className={'repository-radio-option'}
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 ) => {
this.setState({ temporaryCollectionId: aCollectionId });
} } />

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>
);
}
}

View File

@ -261,7 +261,7 @@ export default {
this.itemsRequestSource = axios.CancelToken.source();
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 })
.then(response => {

View File

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

View File

@ -47,7 +47,7 @@ export default class CarouselItemsModal extends React.Component {
if (this.props.existingCollectionId != null && this.props.existingCollectionId != undefined) {
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 + (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 {
this.setState({ collectionPage: 1 });
this.fetchModalCollections();
@ -114,7 +114,7 @@ export default class CarouselItemsModal extends React.Component {
selectCollection(selectedCollectionId) {
this.setState({
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);

View File

@ -176,7 +176,7 @@ registerBlockType('tainacan/carousel-items-list', {
?
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' ) }/>
{ !hideTitle ? <span>{ item.title ? item.title : '' }</span> : null }
@ -200,7 +200,7 @@ registerBlockType('tainacan/carousel-items-list', {
items = [];
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 })
.then(response => {
@ -607,7 +607,7 @@ registerBlockType('tainacan/carousel-items-list', {
icon={(
<img
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"/>
)}>
<p>
@ -727,8 +727,8 @@ registerBlockType('tainacan/carousel-items-list', {
collection-background-color={ collectionBackgroundColor }
collection-text-color={ collectionTextColor }
max-items-number={ maxItemsNumber }
tainacan-api-root={ tainacan_plugin.root }
tainacan-base-url={ tainacan_plugin.base_url }
tainacan-api-root={ tainacan_blocks.root }
tainacan-base-url={ tainacan_blocks.base_url }
id={ 'wp-block-tainacan-carousel-items-list_' + blockId }>
{ content }
</div>

View File

@ -3,74 +3,7 @@ import DynamicItemsListTheme from './dynamic-items-list-theme.vue';
// This is rendered on the theme side.
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;
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
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) );
}
}
});

View File

@ -147,26 +147,47 @@
</span>
</button>
</div>
<ul
v-if="isLoading"
:style="{
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' : '')">
<li
:key="item"
v-for="item in Number(maxItemsNumber)"
class="item-list-item skeleton"
<template v-if="isLoading">
<ul
v-if="layout !== 'mosaic'"
:style="{
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' : '')">
<li
:key="item"
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="{
marginBottom: layout == 'grid' ? (showName ? gridMargin + 12 : gridMargin) + 'px' : '',
height: layout == 'grid' ? '230px' : '54px'
}" />
</ul>
width: 'calc((100% / ' + mosaicPartition(items).length + ') - ' + gridMargin + 'px)',
height: 'calc(((' + (mosaicGridRows - 1) + ' * ' + gridMargin + 'px) + ' + mosaicHeight + 'px))',
margin: gridMargin + 'px'
}"
class="mosaic-container skeleton"
:key="mosaicIndex"
v-for="(mosaicGroup, mosaicIndex) of mosaicPartition(items)" />
</ul>
</template>
<div v-else>
<ul
v-if="items.length > 0"
v-if="items.length > 0 && layout !== 'mosaic'"
:style="{
gridTemplateColumns: layout == 'grid' ? 'repeat(auto-fill, ' + (gridMargin + (showName ? 220 : 185)) + 'px)' : 'inherit',
marginTop: showSearchBar || showCollectionHeader ? '1.35rem' : '0px'
@ -177,31 +198,64 @@
:key="index"
v-for="(item, index) of items"
class="item-list-item"
:style="{ marginBottom: layout == 'grid' ? (showName ? gridMargin + 12 : gridMargin) + 'px' : ''}">
:style="{ marginBottom: layout == 'grid' ? (showName ? gridMargin + 12 : gridMargin) + 'px' : '' }">
<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="
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`)
"
:src="getItemThumbnail(item, 'tainacan-medium')"
:alt="item.title ? item.title : $root.__('Thumbnail', 'tainacan')">
<span>{{ item.title ? item.title : '' }}</span>
</a>
</li>
</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
v-else
v-else-if="!isLoading && items.length <= 0"
class="spinner-container">
{{ $root.__(errorMessage, 'tainacan') }}
</div>
@ -240,6 +294,12 @@ export default {
gridMargin: Number,
searchURL: String,
maxItemsNumber: Number,
mosaicDensity: Number,
mosaicHeight: Number,
mosaicGridRows: Number,
mosaicGridColumns: Number,
mosaicItemFocalPointX: Number,
mosaicItemFocalPointY: Number,
order: String,
showSearchBar: Boolean,
showCollectionHeader: Boolean,
@ -348,6 +408,28 @@ export default {
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() {
@ -356,9 +438,9 @@ export default {
if (this.showCollectionHeader)
this.fetchCollectionForHeader();
this.fetchItems();
},
}
}
</script>

View File

@ -1,7 +1,7 @@
@import '../../gutenberg-blocks-style.scss';
.wp-block-tainacan-dynamic-items-list {
margin: 2rem 0px;
margin: 2rem auto;
// Spinner
.spinner-container {
@ -13,6 +13,11 @@
color: #555758;
}
// Resizer
&:hover .components-resizable-box__handle {
display: block;
}
// Skeleton loading
@-webkit-keyframes skeleton-animation {
0%{opacity: 1.0}
@ -70,14 +75,15 @@
h3 {
color: white;
text-decoration: none;
font-size: 1.3rem;
font-size: 1.3em;
margin: 0;
&:hover {
text-decoration: none;
}
}
span.label {
font-weight: normal;
font-size: 1rem;
font-size: 0.75em;
}
&.only-collection-name {
@ -215,9 +221,11 @@
}
}
// Grid View Mode ----------------------------------------------------
ul.items-list.items-list-without-margin,
ul.items-list-edit.items-list-without-margin {
// Style for both grid and list View Modes ----------------------------------------------------
ul.items-list.items-layout-list.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);
justify-content: center !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 {
display: flex;
align-items: flex-start;
@ -311,6 +278,50 @@
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) {
ul.items-list.items-layout-grid,
@ -332,6 +343,7 @@
flex-wrap: wrap;
align-items: center;
list-style-type: none;
margin: 0;
li.item-list-item {
position: relative;
@ -386,6 +398,516 @@
min-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;
}
}
}
}

View File

@ -42,7 +42,7 @@ export default class DynamicItemsModal extends React.Component {
if (this.props.existingCollectionId != null && this.props.existingCollectionId != undefined) {
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 {
this.setState({ collectionPage: 1 });
this.fetchModalCollections();
@ -100,7 +100,7 @@ export default class DynamicItemsModal extends React.Component {
selectCollection(selectedCollectionId) {
this.setState({
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);

View File

@ -2,7 +2,7 @@ const { registerBlockType } = wp.blocks;
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;
@ -115,6 +115,33 @@ registerBlockType('tainacan/dynamic-items-list', {
collectionTextColor: {
type: String,
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: {
@ -125,6 +152,7 @@ registerBlockType('tainacan/dynamic-items-list', {
let {
items,
content,
collection,
collectionId,
showImage,
showName,
@ -142,7 +170,13 @@ registerBlockType('tainacan/dynamic-items-list', {
showCollectionLabel,
isLoadingCollection,
collectionBackgroundColor,
collectionTextColor
collectionTextColor,
mosaicHeight,
mosaicGridColumns,
mosaicGridRows,
mosaicItemFocalPoint,
sampleBackgroundImage,
mosaicDensity
} = attributes;
// Obtains block's client id to render it on save function
@ -153,24 +187,22 @@ registerBlockType('tainacan/dynamic-items-list', {
<li
key={ item.id }
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
id={ isNaN(item.id) ? item.id : 'item-id-' + item.id }
href={ item.url }
target="_blank"
style={ {
} }
className={ (!showName ? 'item-without-title' : '') + ' ' + (!showImage ? 'item-without-image' : '') }>
<img
src={
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`)
}
src={ getItemThumbnail(item, 'tainacan-medium') }
alt={ item.title ? item.title : __( 'Thumbnail', 'tainacan' ) }/>
<span>{ item.title ? item.title : '' }</span>
</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(){
items = [];
isLoading = true;
if (itemsRequestSource != undefined && typeof itemsRequestSource == 'function')
itemsRequestSource.cancel('Previous items search canceled.');
if (searchURL) {
itemsRequestSource = axios.CancelToken.source();
setAttributes({
isLoading: isLoading
});
items = [];
isLoading = true;
if (itemsRequestSource != undefined && typeof itemsRequestSource == 'function')
itemsRequestSource.cancel('Previous items search canceled.');
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 => {
for (let item of response.data.items)
items.push(prepareItem(item));
setAttributes({
content: <div></div>,
items: items,
isLoading: false,
itemsRequestSource: itemsRequestSource
});
itemsRequestSource = axios.CancelToken.source();
setAttributes({
isLoading: isLoading
});
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() {
@ -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() {
isModalOpen = true;
setAttributes( {
@ -293,7 +390,7 @@ registerBlockType('tainacan/dynamic-items-list', {
function updateLayout(newLayout) {
layout = newLayout;
if (layout == 'grid' && showImage == false)
if ((layout == 'grid' || layout == 'mosaic') && showImage == false)
showImage = true;
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
if(content && content.length && content[0].type)
setContent();
@ -334,6 +456,12 @@ registerBlockType('tainacan/dynamic-items-list', {
title: __( 'List View' ),
onClick: () => updateLayout('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 }
{ layout == 'grid' ?
{ layout == 'grid' || layout == 'mosaic' ?
<div>
<ToggleControl
label={__("Item's title", 'tainacan')}
@ -470,10 +598,10 @@ registerBlockType('tainacan/dynamic-items-list', {
<div style={{ marginTop: '16px'}}>
<RangeControl
label={__('Margin between items in pixels', 'tainacan')}
value={ gridMargin }
value={ gridMargin ? gridMargin : 0 }
onChange={ ( margin ) => {
gridMargin = margin;
setAttributes( { gridMargin: margin } )
setAttributes( { gridMargin: margin } );
setContent();
}}
min={ 0 }
@ -484,6 +612,75 @@ registerBlockType('tainacan/dynamic-items-list', {
: null }
</div>
</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>
</div>
@ -684,7 +881,7 @@ registerBlockType('tainacan/dynamic-items-list', {
icon={(
<img
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"/>
)}>
<p>
@ -701,7 +898,7 @@ registerBlockType('tainacan/dynamic-items-list', {
isPrimary
type="submit"
onClick={ () => openDynamicItemsModal() }>
{__('Select items', 'tainacan')}
{__('Configure search', 'tainacan')}
</Button>
</Placeholder>
) : null
@ -712,14 +909,54 @@ registerBlockType('tainacan/dynamic-items-list', {
<Spinner />
</div> :
<div>
<ul
style={{
gridTemplateColumns: layout == 'grid' ? 'repeat(auto-fill, ' + (gridMargin + (showName ? 220 : 185)) + 'px)' : 'inherit',
marginTop: showSearchBar || showCollectionHeader ? '1.5rem' : '0px'
}}
className={'items-list-edit items-layout-' + layout + (!showName ? ' items-list-without-margin' : '')}>
{ items }
</ul>
{ layout !== 'mosaic' ? (
<ul
style={{
gridTemplateColumns: layout == 'grid' ? 'repeat(auto-fill, ' + (gridMargin + (showName ? 220 : 185)) + 'px)' : 'inherit',
marginTop: showSearchBar || showCollectionHeader ? '-' + (Number(gridMargin)/2) : '0px',
padding: (Number(gridMargin)/4) + 'px',
}}
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>
@ -741,9 +978,14 @@ registerBlockType('tainacan/dynamic-items-list', {
showCollectionHeader,
showCollectionLabel,
collectionBackgroundColor,
collectionTextColor
collectionTextColor,
mosaicHeight,
mosaicGridRows,
mosaicGridColumns,
mosaicItemFocalPoint,
mosaicDensity
} = attributes;
return <div
search-url={ searchURL }
className={ className }
@ -754,15 +996,156 @@ registerBlockType('tainacan/dynamic-items-list', {
show-collection-header={ '' + showCollectionHeader }
show-collection-label={ '' + showCollectionLabel }
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-text-color={ collectionTextColor }
grid-margin={ gridMargin }
max-items-number={ maxItemsNumber }
order={ order }
tainacan-api-root={ tainacan_plugin.root }
tainacan-base-url={ tainacan_plugin.base_url }
tainacan-api-root={ tainacan_blocks.root }
tainacan-base-url={ tainacan_blocks.base_url }
id={ 'wp-block-tainacan-dynamic-items-list_' + blockId }>
{ content }
</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>
}
}
]
});

View File

@ -128,7 +128,7 @@ registerBlockType('tainacan/items-list', {
target="_blank"
className={ (!showName ? 'item-without-title' : '') + ' ' + (!showImage ? 'item-without-image' : '') }>
<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 }/>
<span>{ item.title ? item.title : '' }</span>
</a>
@ -313,7 +313,7 @@ registerBlockType('tainacan/items-list', {
icon={(
<img
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"/>
)}>
<p>

View File

@ -1,7 +1,7 @@
@import '../../gutenberg-blocks-style.scss';
.wp-block-tainacan-items-list {
margin: 2rem 0px;
margin: 2rem auto;
// Spinner
.components-spinner {
@ -9,6 +9,14 @@
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 ----------------------------------------------------
ul.items-list.items-list-without-margin,
ul.items-list-edit.items-list-without-margin {

View File

@ -49,7 +49,7 @@ export default class ItemsModal extends React.Component {
if (this.props.existingCollectionId != null && this.props.existingCollectionId != undefined) {
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/?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 {
this.setState({ collectionPage: 1 });
this.fetchModalCollections();
@ -85,7 +85,7 @@ export default class ItemsModal extends React.Component {
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 })
.then(response => {
@ -174,7 +174,7 @@ export default class ItemsModal extends React.Component {
selectCollection(selectedCollectionId) {
this.setState({
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);

View File

@ -57,7 +57,7 @@ registerBlockType('tainacan/search-bar', {
},
placeholderText: {
type: String,
default: __('Search', 'taincan')
default: __('Search', 'tainacan')
},
showCollectionHeader: {
type: Boolean,
@ -169,13 +169,13 @@ registerBlockType('tainacan/search-bar', {
(alignment == 'left' ? ' is-aligned-left' : '') +
(alignment == 'right' ? ' is-aligned-right' : '')
}
id="taincan-search-bar-block"
action={ tainacan_plugin.site_url + '/' + collectionSlug + '/#/' }
id="tainacan-search-bar-block"
action={ tainacan_blocks.site_url + '/' + collectionSlug + '/#/' }
method='get'>
<input
style={{ borderColor: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }}
id="taincan-search-bar-block_input"
label={ __('Search', 'taincan')}
id="tainacan-search-bar-block_input"
label={ __('Search', 'tainacan')}
name='search'
placeholder={ placeholderText }
/>
@ -214,13 +214,13 @@ registerBlockType('tainacan/search-bar', {
(alignment == 'left' ? ' is-aligned-left' : '') +
(alignment == 'right' ? ' is-aligned-right' : '')
}
id="taincan-search-bar-block"
action={ tainacan_plugin.site_url + '/' + collectionSlug + '/#/' }
id="tainacan-search-bar-block"
action={ tainacan_blocks.site_url + '/' + collectionSlug + '/#/' }
method='get'>
<input
style={{ borderColor: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }}
id="taincan-search-bar-block_input"
label={ __('Search', 'taincan')}
id="tainacan-search-bar-block_input"
label={ __('Search', 'tainacan')}
name='search'
placeholder={ placeholderText }
/>
@ -494,7 +494,7 @@ registerBlockType('tainacan/search-bar', {
icon={(
<img
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"/>
)}>
<p>
@ -560,11 +560,11 @@ registerBlockType('tainacan/search-bar', {
(alignment == 'left' ? ' is-aligned-left' : '') +
(alignment == 'right' ? ' is-aligned-right' : '')
}
id="taincan-search-bar-block">
id="tainacan-search-bar-block">
<input
style={{ borderColor: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }}
id="taincan-search-bar-block_input"
label={ __('Search', 'taincan')}
id="tainacan-search-bar-block_input"
label={ __('Search', 'tainacan')}
name='search'
placeholder={ placeholderText }
/>
@ -606,11 +606,11 @@ registerBlockType('tainacan/search-bar', {
(alignment == 'left' ? ' is-aligned-left' : '') +
(alignment == 'right' ? ' is-aligned-right' : '')
}
id="taincan-search-bar-block">
id="tainacan-search-bar-block">
<input
style={{ borderColor: showCollectionHeader && collectionBackgroundColor ? collectionBackgroundColor : '' }}
id="taincan-search-bar-block_input"
label={ __('Search', 'taincan')}
id="tainacan-search-bar-block_input"
label={ __('Search', 'tainacan')}
name='search'
placeholder={ placeholderText }
/>

View File

@ -106,7 +106,7 @@ export default class SearchBarModal extends React.Component {
label: __('Repository items', 'tainacan'),
name: __('Repository items', 'tainacan'),
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 {
selectedCollection = this.state.modalCollections.find((collection) => collection.id == selectedCollectionId)
@ -269,7 +269,7 @@ export default class SearchBarModal extends React.Component {
<RadioControl
className={'repository-radio-option'}
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 ) => {
this.setState({ temporaryCollectionId: aCollectionId });
} } />

View File

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

View File

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

View File

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

View File

@ -155,7 +155,7 @@ registerBlockType('tainacan/carousel-terms-list', {
?
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' ) }/>
<img
@ -168,7 +168,7 @@ registerBlockType('tainacan/carousel-terms-list', {
?
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' ) }/>
<img
@ -181,13 +181,13 @@ registerBlockType('tainacan/carousel-terms-list', {
?
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' ) }/>
</div>
:
<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' )}/>
}
{ !hideName ? <span>{ term.name ? term.name : '' }</span> : null }
@ -447,7 +447,7 @@ registerBlockType('tainacan/carousel-terms-list', {
icon={(
<img
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"/>
)}>
<p>
@ -545,8 +545,8 @@ registerBlockType('tainacan/carousel-terms-list', {
hide-name={ '' + hideName }
max-terms-number={ maxTermsNumber }
taxonomy-id={ taxonomyId }
tainacan-api-root={ tainacan_plugin.root }
tainacan-base-url={ tainacan_plugin.base_url }
tainacan-api-root={ tainacan_blocks.root }
tainacan-base-url={ tainacan_blocks.base_url }
show-term-thumbnail={ '' + showTermThumbnail }
id={ 'wp-block-tainacan-carousel-terms-list_' + blockId }>
{ content }

View File

@ -121,7 +121,7 @@ registerBlockType('tainacan/terms-list', {
target="_blank"
className={ (!showName ? 'term-without-name' : '') + ' ' + (!showImage ? 'term-without-image' : '') }>
<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 }/>
<span>{ term.name ? term.name : '' }</span>
</a>
@ -290,7 +290,7 @@ registerBlockType('tainacan/terms-list', {
icon={(
<img
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"/>
)}>
<p>

View File

@ -1,7 +1,7 @@
@import '../../gutenberg-blocks-style.scss';
.wp-block-tainacan-terms-list {
margin: 2rem 0px;
margin: 2rem auto;
// Spinner
.components-spinner {
@ -9,6 +9,14 @@
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 ----------------------------------------------------
ul.terms-list.terms-layout-grid,
ul.terms-list-edit.terms-layout-grid {

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