Merge pull request #834 from tainacan/feature/830
Changes enabledMetadata attribute from array to object of ids in Item…
This commit is contained in:
commit
9ce0da6317
|
@ -94,8 +94,8 @@
|
|||
"default": "#187181"
|
||||
},
|
||||
"enabledMetadata": {
|
||||
"type": "array",
|
||||
"default": []
|
||||
"type": "object",
|
||||
"default": {}
|
||||
},
|
||||
"collectionMetadata": {
|
||||
"type": "array",
|
||||
|
|
|
@ -2,6 +2,253 @@ const { __ } = wp.i18n;
|
|||
const { RichText, useBlockProps } = (tainacan_blocks.wp_version < '5.2' ? wp.editor : wp.blockEditor );
|
||||
|
||||
export default [
|
||||
/* Deprecated in version 0.20.7 due to the change of enabledMetadata from array to object with IDs */
|
||||
{
|
||||
migrate( attributes ) {
|
||||
if ( Array.isArray(attributes.enabledMetadata) ) {
|
||||
attributes.enabledMetadata = {};
|
||||
attributes.collectionMetadata.forEach( metadatum => {
|
||||
attributes.enabledMetadata[ metadatum.id ] = true;
|
||||
});
|
||||
}
|
||||
console.log('migrated to ' + attributes.enabledMetadata)
|
||||
return attributes;
|
||||
},
|
||||
"attributes": {
|
||||
"collectionId": {
|
||||
"type": "string",
|
||||
"default": ""
|
||||
},
|
||||
"isCollectionModalOpen": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"hideFileModalButton": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"hideTextModalButton": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"hideLinkModalButton": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"hideThumbnailSection": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"hideAttachmentsSection": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"hideHelpButtons": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"hideMetadataTypes": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"showAllowCommentsSection": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"hideCollapses": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"backgroundColor": {
|
||||
"type": "string",
|
||||
"default": "rgba(255,255,255,0)"
|
||||
},
|
||||
"baseFontSize": {
|
||||
"type": "number",
|
||||
"default": 16
|
||||
},
|
||||
"inputColor": {
|
||||
"type": "string",
|
||||
"default": "#1d1d1d"
|
||||
},
|
||||
"inputBackgroundColor": {
|
||||
"type": "string",
|
||||
"default": "#ffffff"
|
||||
},
|
||||
"inputBorderColor": {
|
||||
"type": "string",
|
||||
"default": "#dbdbdb"
|
||||
},
|
||||
"labelColor": {
|
||||
"type": "string",
|
||||
"default": "#373839"
|
||||
},
|
||||
"infoColor": {
|
||||
"type": "string",
|
||||
"default": "#505253"
|
||||
},
|
||||
"primaryColor": {
|
||||
"type": "string",
|
||||
"default": "#d9eced"
|
||||
},
|
||||
"secondaryColor": {
|
||||
"type": "string",
|
||||
"default": "#187181"
|
||||
},
|
||||
"enabledMetadata": {
|
||||
"type": "array",
|
||||
"default": []
|
||||
},
|
||||
"collectionMetadata": {
|
||||
"type": "array",
|
||||
"default": []
|
||||
},
|
||||
"isLoadingCollectionMetadata": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"sentFormHeading": {
|
||||
"type": "string",
|
||||
"default": "Form submitted!"
|
||||
},
|
||||
"sentFormMessage": {
|
||||
"type": "string",
|
||||
"default": "Thank you. Your item was submitted to the collection."
|
||||
},
|
||||
"documentSectionLabel": {
|
||||
"type": "string",
|
||||
"default": "Document"
|
||||
},
|
||||
"attachmentsSectionLabel": {
|
||||
"type": "string",
|
||||
"default": "Attachments"
|
||||
},
|
||||
"thumbnailSectionLabel": {
|
||||
"type": "string",
|
||||
"default": "Thumbnail"
|
||||
},
|
||||
"metadataSectionLabel": {
|
||||
"type": "string",
|
||||
"default": "Metadata"
|
||||
},
|
||||
"showItemLinkButton": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"itemLinkButtonLabel": {
|
||||
"type": "string",
|
||||
"default": "Go to the item page"
|
||||
},
|
||||
"helpInfoBellowLabel": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"showTermsAgreementCheckbox": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"termsAgreementMessage": {
|
||||
"type": "string",
|
||||
"default": "I agree to submit this item information."
|
||||
},
|
||||
"isLayoutSteps": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
}
|
||||
},
|
||||
save: function({ attributes }) {
|
||||
const {
|
||||
collectionId,
|
||||
backgroundColor,
|
||||
hideFileModalButton,
|
||||
hideTextModalButton,
|
||||
hideLinkModalButton,
|
||||
hideThumbnailSection,
|
||||
hideAttachmentsSection,
|
||||
showAllowCommentsSection,
|
||||
hideHelpButtons,
|
||||
hideMetadataTypes,
|
||||
hideCollapses,
|
||||
documentSectionLabel,
|
||||
thumbnailSectionLabel,
|
||||
attachmentsSectionLabel,
|
||||
metadataSectionLabel,
|
||||
baseFontSize,
|
||||
inputColor,
|
||||
inputBackgroundColor,
|
||||
inputBorderColor,
|
||||
labelColor,
|
||||
infoColor,
|
||||
primaryColor,
|
||||
secondaryColor,
|
||||
enabledMetadata,
|
||||
sentFormHeading,
|
||||
sentFormMessage,
|
||||
showItemLinkButton,
|
||||
itemLinkButtonLabel,
|
||||
helpInfoBellowLabel,
|
||||
showTermsAgreementCheckbox,
|
||||
termsAgreementMessage,
|
||||
isLayoutSteps
|
||||
} = attributes;
|
||||
|
||||
const blockProps = useBlockProps.save();
|
||||
const className = blockProps.className;
|
||||
|
||||
let termsAgreementMessageHTML = <RichText.Content { ...blockProps } tagName="p" value={ termsAgreementMessage } />;
|
||||
termsAgreementMessageHTML = (termsAgreementMessageHTML && termsAgreementMessageHTML.props && termsAgreementMessageHTML.props.value) ? termsAgreementMessageHTML.props.value : '';
|
||||
|
||||
if (backgroundColor.rgb != undefined) {
|
||||
if (backgroundColor.rgb.a)
|
||||
backgroundColor = 'rgba(' + backgroundColor.rgb.r + ',' + backgroundColor.rgb.g + ',' + backgroundColor.rgb.b + ',' + backgroundColor.rgb.a + ')';
|
||||
else
|
||||
backgroundColor = 'rgb(' + backgroundColor.rgb.r + ',' + backgroundColor.rgb.g + ',' + backgroundColor.rgb.b + ')';
|
||||
}
|
||||
|
||||
return <div
|
||||
style={{
|
||||
'font-size': baseFontSize + 'px',
|
||||
'--tainacan-base-font-size': baseFontSize + 'px',
|
||||
'--tainacan-background-color': backgroundColor,
|
||||
'--tainacan-input-color': inputColor,
|
||||
'--tainacan-input-background-color': inputBackgroundColor,
|
||||
'--tainacan-input-border-color': inputBorderColor,
|
||||
'--tainacan-label-color': labelColor,
|
||||
'--tainacan-info-color': infoColor,
|
||||
'--tainacan-primary': primaryColor,
|
||||
'--tainacan-secondary': secondaryColor
|
||||
}}
|
||||
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() }
|
||||
hide-link-modal-button={ hideLinkModalButton.toString() }
|
||||
hide-thumbnail-section={ hideThumbnailSection.toString() }
|
||||
hide-attachments-section={ hideAttachmentsSection.toString() }
|
||||
show-allow-comments-section={ showAllowCommentsSection.toString() }
|
||||
hide-help-buttons={ hideHelpButtons.toString() }
|
||||
hide-metadata-types={ hideMetadataTypes.toString() }
|
||||
hide-collapses={ hideCollapses.toString() }
|
||||
enabled-metadata={ enabledMetadata.toString() }
|
||||
sent-form-heading={ sentFormHeading }
|
||||
sent-form-message={ sentFormMessage }
|
||||
document-section-label={ documentSectionLabel }
|
||||
thumbnail-section-label={ thumbnailSectionLabel }
|
||||
attachments-section-label={ attachmentsSectionLabel }
|
||||
metadata-section-label={ metadataSectionLabel }
|
||||
show-item-link-button={ showItemLinkButton ? showItemLinkButton.toString() : 'false' }
|
||||
show-terms-agreement-checkbox={ showTermsAgreementCheckbox ? showTermsAgreementCheckbox.toString() : 'false' }
|
||||
terms-agreement-message={ termsAgreementMessageHTML }
|
||||
item-link-button-label={ itemLinkButtonLabel ? itemLinkButtonLabel : __( 'Go to the item page', 'tainacan' ) }
|
||||
help-info-bellow-label={ helpInfoBellowLabel ? helpInfoBellowLabel.toString() : 'false' }
|
||||
is-layout-steps={ isLayoutSteps !== undefined ? isLayoutSteps.toString() : 'false' } >
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
},
|
||||
/* Deprecated in version 0.20.4 due to changes on labelColor, infoColor and secondaryColor default values */
|
||||
{
|
||||
"attributes": {
|
||||
|
|
|
@ -14,7 +14,7 @@ const {
|
|||
Placeholder,
|
||||
PanelBody
|
||||
} = wp.components;
|
||||
|
||||
const { useEffect } = wp.element;
|
||||
const { InspectorControls, BlockControls, RichText, useBlockProps } = wp.blockEditor;
|
||||
|
||||
import tainacan from '../../js/axios.js';
|
||||
|
@ -104,6 +104,12 @@ export default function ({ attributes, setAttributes }) {
|
|||
setAttributes({ isLayoutSteps: isLayoutSteps });
|
||||
}
|
||||
|
||||
// Fill the enabledMetadata object with the metadata that are enabled initially
|
||||
useEffect(() => {
|
||||
if ( collectionId && collectionId != 'preview' )
|
||||
loadCollectionMetadata(collectionId)
|
||||
}, []);
|
||||
|
||||
function openCollectionModal() {
|
||||
isCollectionModalOpen = true;
|
||||
setAttributes( {
|
||||
|
@ -111,10 +117,8 @@ export default function ({ attributes, setAttributes }) {
|
|||
} );
|
||||
}
|
||||
|
||||
function toggleIsEnabledMetadatum(isEnabled, index) {
|
||||
|
||||
enabledMetadata.splice(index, 1, isEnabled);
|
||||
|
||||
function toggleIsEnabledMetadatum(isEnabled, metadatumId) {
|
||||
enabledMetadata[metadatumId] = isEnabled;
|
||||
setAttributes({
|
||||
enabledMetadata: JSON.parse(JSON.stringify(enabledMetadata))
|
||||
});
|
||||
|
@ -127,10 +131,11 @@ export default function ({ attributes, setAttributes }) {
|
|||
tainacan.get('/collection/' + selectedCollectionId + '/metadata/?nopaging=1&include_disabled=false&parent=0')
|
||||
.then(response => {
|
||||
collectionMetadata = response.data;
|
||||
enabledMetadata = new Array(response.data.length).fill(true);
|
||||
|
||||
collectionMetadata.forEach(aMetadatum => {
|
||||
if ( enabledMetadata[aMetadatum.id] === undefined )
|
||||
enabledMetadata[aMetadatum.id] = true;
|
||||
});
|
||||
isLoadingCollectionMetadata = false;
|
||||
|
||||
setAttributes({
|
||||
isLoadingCollectionMetadata : isLoadingCollectionMetadata,
|
||||
collectionMetadata: collectionMetadata,
|
||||
|
@ -262,16 +267,17 @@ export default function ({ attributes, setAttributes }) {
|
|||
help={ __('Uncheck the metadata that you do not want to be shown on the form', 'tainacan') }
|
||||
>
|
||||
<ul id="metadata-checkbox-list">
|
||||
{ enabledMetadata.length ?
|
||||
enabledMetadata.map((isMetadatumEnabled, index) => {
|
||||
{
|
||||
collectionMetadata.length ?
|
||||
collectionMetadata.map(metadatum => {
|
||||
return (
|
||||
<li>
|
||||
<CheckboxControl
|
||||
label={ collectionMetadata[index].name + (collectionMetadata[index].required == 'yes' ? ' *' : '') }
|
||||
disabled={ collectionMetadata[index].required == 'yes' }
|
||||
checked={ isMetadatumEnabled ? true : false }
|
||||
help={ collectionMetadata[index].metadata_type_object.name + (collectionMetadata[index].required == 'yes' ? (', ' + __('Required', 'tainacan')) : '' ) + (collectionMetadata[index].collection_id != collectionId ? (' (' + __('Inherited', 'tainacan') + ')' ) : '') }
|
||||
onChange={ (isEnabled) => toggleIsEnabledMetadatum(isEnabled, index) }
|
||||
label={ metadatum.name + (metadatum.required == 'yes' ? ' *' : '') }
|
||||
disabled={ metadatum.required == 'yes' }
|
||||
checked={ enabledMetadata[metadatum.id] ? true : false }
|
||||
help={ metadatum.metadata_type_object.name + (metadatum.required == 'yes' ? (', ' + __('Required', 'tainacan')) : '' ) + (metadatum.collection_id != collectionId ? (' (' + __('Inherited', 'tainacan') + ')' ) : '') }
|
||||
onChange={ (isEnabled) => toggleIsEnabledMetadatum(isEnabled, metadatum.id) }
|
||||
/>
|
||||
</li>
|
||||
)
|
||||
|
|
|
@ -506,7 +506,7 @@
|
|||
|
||||
<tainacan-form-item
|
||||
:key="index"
|
||||
v-if="enabledMetadata[index] == 'true'"
|
||||
v-if="Object.keys(enabledMetadata).length == 0 || enabledMetadata[itemMetadatum.metadatum.id]"
|
||||
:item-metadatum="itemMetadatum"
|
||||
:hide-collapses="hideCollapses"
|
||||
:hide-metadata-types="hideMetadataTypes"
|
||||
|
@ -774,7 +774,7 @@ export default {
|
|||
hideCollapses: Boolean,
|
||||
hideHelpButtons: Boolean,
|
||||
hideMetadataTypes: Boolean,
|
||||
enabledMetadata: Array,
|
||||
enabledMetadata: Object,
|
||||
sentFormHeading: String,
|
||||
sentFormMessage: String,
|
||||
documentSectionLabel: String,
|
||||
|
@ -872,6 +872,7 @@ export default {
|
|||
};
|
||||
|
||||
});
|
||||
|
||||
return tweakedItemMetadata;
|
||||
},
|
||||
metadataSections() {
|
||||
|
@ -923,7 +924,6 @@ export default {
|
|||
|
||||
// CREATING NEW ITEM SUBMISSION
|
||||
this.createNewItem();
|
||||
|
||||
eventBusItemMetadata.$on('hasErrorsOnForm', (hasErrors) => {
|
||||
if (hasErrors) {
|
||||
if (Array.isArray(this.formErrors)) {
|
||||
|
@ -1217,13 +1217,13 @@ export default {
|
|||
if ( !Array.isArray(this.collection['metadata_section_order']) || !this.collection['metadata_section_order'][sectionIndex] || !Array.isArray(this.collection['metadata_section_order'][sectionIndex]['metadata_order']) )
|
||||
return -1;
|
||||
|
||||
let enabledMetadata = [];
|
||||
let enabledMetadataInSection = [];
|
||||
for (let metadatum of this.collection['metadata_section_order'][sectionIndex]['metadata_order']) {
|
||||
if ( metadatum.enabled )
|
||||
enabledMetadata.push(metadatum.id);
|
||||
enabledMetadataInSection.push(metadatum.id);
|
||||
}
|
||||
|
||||
return enabledMetadata.indexOf(metadatum.id);
|
||||
return enabledMetadataInSection.indexOf(metadatum.id);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -76,7 +76,7 @@ export default function({ attributes }) {
|
|||
hide-help-buttons={ hideHelpButtons.toString() }
|
||||
hide-metadata-types={ hideMetadataTypes.toString() }
|
||||
hide-collapses={ hideCollapses.toString() }
|
||||
enabled-metadata={ enabledMetadata.toString() }
|
||||
enabled-metadata={ JSON.stringify(enabledMetadata) }
|
||||
sent-form-heading={ sentFormHeading }
|
||||
sent-form-message={ sentFormMessage }
|
||||
document-section-label={ documentSectionLabel }
|
||||
|
|
|
@ -157,7 +157,7 @@ export default (element) => {
|
|||
hideHelpButtons: false,
|
||||
hideMetadataTypes: false,
|
||||
hideCollapses: false,
|
||||
enabledMetadata: [],
|
||||
enabledMetadata: {},
|
||||
sentFormHeading: '',
|
||||
sentFormMessage: '',
|
||||
documentSectionLabel: '',
|
||||
|
@ -227,8 +227,13 @@ export default (element) => {
|
|||
this.termsAgreementMessage = this.$el.attributes['terms-agreement-message'].value;
|
||||
|
||||
// List of metadata
|
||||
if (this.$el.attributes['enabled-metadata'] != undefined && this.$el.attributes['enabled-metadata'].value)
|
||||
this.enabledMetadata = this.$el.attributes['enabled-metadata'].value.split(',');
|
||||
if (this.$el.attributes['enabled-metadata'] != undefined && this.$el.attributes['enabled-metadata'].value) {
|
||||
try {
|
||||
this.enabledMetadata = JSON.parse(this.$el.attributes['enabled-metadata'].value);
|
||||
} catch {
|
||||
this.enabledMetadata = {};
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
:hide-collapses="$root.hideCollapses ? $root.hideCollapses : false"
|
||||
:hide-help-buttons="$root.hideHelpButtons ? $root.hideHelpButtons : false"
|
||||
:hide-metadata-types="$root.hideMetadataTypes ? $root.hideMetadataTypes : false"
|
||||
:enabled-metadata="$root.enabledMetadata ? $root.enabledMetadata : []"
|
||||
:enabled-metadata="$root.enabledMetadata ? $root.enabledMetadata : {}"
|
||||
:sent-form-heading="$root.sentFormHeading"
|
||||
:sent-form-message="$root.sentFormMessage"
|
||||
:document-section-label="$root.documentSectionLabel"
|
||||
|
|
Loading…
Reference in New Issue