Fixes factes list and items submission js load using new data-module #580.

This commit is contained in:
mateuswetah 2021-07-26 22:07:17 -03:00
parent 641211d7e2
commit c1d4f67a25
8 changed files with 26 additions and 76 deletions

View File

@ -48,8 +48,8 @@ export default function({ attributes, className }) {
if (updatedListType === '' && collectionId)
updatedListType = 'collection';
else if (updatedListType === '' && termId && taxonomyId)
updatedListType = 'term'
updatedListType = 'term';
return <div
style={{
'font-size': baseFontSize + 'px',
@ -69,15 +69,15 @@ export default function({ attributes, className }) {
'--tainacan-primary': primaryColor,
'--tainacan-secondary': secondaryColor
}}
className={ className }
data-module="faceted-search">
className={ className }>
<main
id="tainacan-items-page"
data-module="faceted-search"
term-id={ updatedListType == 'term' ? termId : null }
taxonomy={ updatedListType == 'term' ? 'tnc_tax_' + taxonomyId : null }
collection-id={ updatedListType == 'collection' ? collectionId : null }
default-view-mode={ defaultViewMode != 'none' ? defaultViewMode : (updatedListType == 'collection' ? collectionDefaultViewMode : (hideItemsThumbnail ? 'table' : 'masonry') ) }
is-forced-view-mode={ defaultViewMode == 'none' ? true : false }
is-forced-view-mode={ defaultViewMode == 'none' ? 'true' : 'false' }
enabled-view-modes={ enabledViewModes.toString() }
hide-filters = { hideFilters.toString() }
hide-hide-filters-button= { hideHideFiltersButton.toString() }

View File

@ -52,26 +52,11 @@ export default (element) => {
function renderTainacanItemsListComponent() {
// Mount only if the div exists
if (element || document.getElementById('tainacan-items-page')) {
// Gets the div with the content of the block
let blockElement = element ? element : document.getElementById('tainacan-items-page');
// Display Icons only once everything is loaded
function listen(evnt, elem, func) {
if (elem.addEventListener) // W3C DOM
elem.addEventListener(evnt,func,false);
else if (elem.attachEvent) { // IE DOM
var r = elem.attachEvent("on"+evnt, func);
return r;
} else if (document.head) {
var iconHideStyle = document.createElement("style");
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
document.head.appendChild(iconHideStyle);
} else {
var iconHideStyle = document.createElement("style");
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
document.getElementsByTagName("head")[0].appendChild(iconHideStyle);
}
}
// Mount only if the div exists
if ( blockElement && blockElement.classList && !blockElement.classList.contains('has-mounted') ) {
/* Registers Extra Vue Plugins passed to the window.tainacan_extra_plugins */
if (typeof window.tainacan_extra_plugins != "undefined") {
@ -230,9 +215,6 @@ export default (element) => {
isParameterTrue(parameter) {
const value = this.$el.attributes[parameter].value;
return (value == true || value == 'true' || value == '1' || value == 1) ? true : false;
},
createSwiperInstance(target, options) {
return new Swiper(target, options);
}
},
render: h => h(ThemeSearch)
@ -240,13 +222,6 @@ export default (element) => {
VueItemsList.$mount('#tainacan-items-page');
listen("load", window, function() {
var iconsStyle = document.createElement("style");
iconsStyle.setAttribute('type', 'text/css');
iconsStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
document.head.appendChild(iconsStyle);
});
// Initialize Ponyfill for Custom CSS properties
cssVars({
// Options...

View File

@ -44,10 +44,10 @@ export default function({ attributes, className }) {
'--tainacan-primary': primaryColor,
'--tainacan-secondary': secondaryColor
}}
className={ className }
data-module="item-submission-form">
className={ className }>
<div
id="tainacan-item-submission-form"
data-module="item-submission-form"
collection-id={ collectionId }
hide-file-modal-button={ hideFileModalButton.toString() }
hide-text-modal-button={ hideTextModalButton.toString() }

View File

@ -32,27 +32,11 @@ export default (element) => {
// Vue Dev Tools!
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
// Gets the div with the content of the block
let blockElement = element ? element : document.getElementById('tainacan-item-submission-form');
// Mount only if the div exists
if (element || document.getElementById('tainacan-item-submission-form')) {
// Display Icons only once everything is loaded
function listen(evnt, elem, func) {
if (elem.addEventListener) // W3C DOM
elem.addEventListener(evnt,func,false);
else if (elem.attachEvent) { // IE DOM
var r = elem.attachEvent("on"+evnt, func);
return r;
} else if (document.head) {
var iconHideStyle = document.createElement("style");
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
document.head.appendChild(iconHideStyle);
} else {
var iconHideStyle = document.createElement("style");
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
document.getElementsByTagName("head")[0].appendChild(iconHideStyle);
}
}
if ( blockElement && blockElement.classList && !blockElement.classList.contains('has-mounted') ) {
/* Registers Extra Vue Plugins passed to the window.tainacan_extra_plugins */
if (typeof window.tainacan_extra_plugins != "undefined") {
@ -186,13 +170,6 @@ export default (element) => {
VueItemSubmission.$mount('#tainacan-item-submission-form');
listen("load", window, function() {
var iconsStyle = document.createElement("style");
iconsStyle.setAttribute('type', 'text/css');
iconsStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
document.head.appendChild(iconsStyle);
});
// Initialize Ponyfill for Custom CSS properties
cssVars({
// Options...

View File

@ -11,8 +11,8 @@ const performWhenDocumentIsLoaded = callback => {
// Adds data-module to blocks inserted previous to Tainacan 0.18.4
const addDataModuleToOldBlocks = () => {
const tainacanBlocks = [
'faceted-search',
'item-submission-form',
//'faceted-search',
//'item-submission-form',
'items-list',
'collections-list',
'terms-list',
@ -32,10 +32,15 @@ const addDataModuleToOldBlocks = () => {
});
});
// Extra case for the items list, as the theme wrapper does not uses gutenberg classes
// Extra case for the items list and item submission, as their
// theme wrapper does not uses gutenberg classes, but the div ID
let existingItemListOnPage = document.getElementById('tainacan-items-page');
if ( existingItemListOnPage && !existingItemListOnPage.getAttribute('data-module') )
existingItemListOnPage.setAttribute('data-module', 'faceted-search');
let existingItemSubmissionFormOnPage = document.getElementById('tainacan-item-submission-form');
if ( existingItemSubmissionFormOnPage && !existingItemSubmissionFormOnPage.getAttribute('data-module') )
existingItemSubmissionFormOnPage.setAttribute('data-module', 'item-submission-form');
}
performWhenDocumentIsLoaded(() => {

View File

@ -81,10 +81,6 @@ export default {
@import "../admin/scss/_control.scss";
@import "../admin/scss/_upload.scss";
.tainacan-icon {
opacity: 0; // Will make it 1 once window.load is done;
}
a, a:not([href]) {
color: var(--tainacan-secondary);
}

View File

@ -712,7 +712,6 @@
}
},
created() {
this.isRepositoryLevel = (this.collectionId == undefined || this.collectionId == '' || this.collectionId == null);
if (this.collectionId != undefined)
@ -763,6 +762,7 @@
});
},
mounted() {
this.prepareMetadata();
this.localDisplayedMetadata = JSON.parse(JSON.stringify(this.displayedMetadata));
@ -781,6 +781,7 @@
else
this.$eventBusSearch.setInitialViewMode(this.defaultViewMode);
}
// For view modes such as slides, we force pagination to request only 24 per page
let existingViewModeIndex = Object.keys(this.registeredViewModes).findIndex(viewMode => viewMode == this.$userPrefs.get(prefsViewMode));
if (existingViewModeIndex >= 0) {

View File

@ -1,6 +1,6 @@
<template>
<theme-items-page
class="theme-items-list"
class="theme-items-list has-mounted"
:collection-id="$root.collectionId"
:term-id="$root.termId ? $root.termId : null"
:taxonomy="$root.taxonomy ? $root.taxonomy : null"
@ -121,10 +121,6 @@ export default {
margin: 0;
}
.tainacan-icon {
opacity: 0; // Will make it 1 once window.load is done;
}
a, a:not([href]) {
color: var(--tainacan-secondary);
}