Merge branch 'develop' into feature/646

This commit is contained in:
mateuswetah 2022-01-13 17:54:34 -03:00
commit b00400ac86
17 changed files with 437 additions and 141 deletions

View File

@ -49,15 +49,20 @@
width: 80vw;
height: 80vh; }
.wp-block-tainacan-modal.dynamic-modal iframe {
width: calc(100% + 32px);
height: calc(100% - 132px);
margin-left: -16px; }
width: 100%;
height: calc(100% - 96px); }
.wp-block-tainacan-modal.dynamic-modal.wp-version-smaller-than-5-9 iframe {
height: calc(100% - 156px); }
.wp-block-tainacan-modal.dynamic-modal .modal-footer-area {
height: 68px;
width: calc(100% + 32px);
margin-left: -16px !important;
padding: 1.2em 1.2em !important;
border-top: 1px solid var(--tainacan-block-gray3, #cbcbcb); }
width: 100%;
border-top: 1px solid var(--tainacan-block-gray3, #cbcbcb);
padding: 15px 32px; }
.wp-block-tainacan-modal.dynamic-modal .components-modal__content {
padding: 0; }
.wp-block-tainacan-modal.dynamic-modal .components-modal__content .components-modal__header {
margin-left: 0;
margin-right: 0; }
.wp-block-tainacan-modal .spinner-container {
min-height: 56px;
padding: 1em;
@ -173,8 +178,7 @@
display: flex;
align-items: baseline;
justify-content: space-between;
padding: 15px 16px 0 16px;
margin: 0 -16px; }
padding: 15px 0 0 0; }
.wp-block-tainacan-modal .modal-footer-area p {
padding: 0 12px;
color: var(--tainacan-block-gray5, #454647); }

View File

@ -1,6 +1,6 @@
{
"version": 3,
"mappings": "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",
"mappings": "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",
"sources": ["../../views/gutenberg-blocks/scss/gutenberg-blocks-editor-style.scss","../../views/gutenberg-blocks/scss/gutenberg-blocks-variables.scss"],
"names": [],
"file": "tainacan-gutenberg-block-common-editor-styles.css"

View File

@ -4,6 +4,7 @@ import axios from 'axios';
const { __ } = wp.i18n;
const { TextControl, Button, Modal, RadioControl, SelectControl, Spinner } = wp.components;
const currentWPVersion = (typeof tainacan_blocks != 'undefined') ? tainacan_blocks.wp_version : tainacan_plugin.wp_version;
export default class CarouselItemsModal extends React.Component {
constructor(props) {
@ -204,7 +205,7 @@ export default class CarouselItemsModal extends React.Component {
return this.state.collectionId ? (
// Items modal
<Modal
className="wp-block-tainacan-modal dynamic-modal"
className={ 'wp-block-tainacan-modal dynamic-modal ' + (currentWPVersion < 5.9 ? 'wp-version-smaller-than-5-9' : '') }
title={ this.props.loadStrategy == 'selection' ? __('Select items to add on block', 'tainacan') : __('Configure the items search to be used on block', 'tainacan')}
onRequestClose={ () => this.cancelSelection() }
shouldCloseOnClickOutside={ false }

View File

@ -1,6 +1,6 @@
const { __ } = wp.i18n;
const { RangeControl, Spinner, Button, ToggleControl, SelectControl, Placeholder, IconButton, ColorPicker, ColorPalette, BaseControl, PanelBody } = wp.components;
const { RangeControl, Spinner, Button, ToggleControl, SelectControl, Placeholder, IconButton, ColorPalette, BaseControl, PanelBody } = wp.components;
const { InspectorControls, BlockControls, useBlockProps } = (tainacan_blocks.wp_version < '5.2' ? wp.editor : wp.blockEditor );
@ -10,6 +10,7 @@ import axios from 'axios';
import qs from 'qs';
import { ThumbnailHelperFunctions } from '../../../admin/js/utilities.js';
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
import TainacanBlocksCompatColorPicker from '../../js/tainacan-blocks-compat-colorpicker.js';
import 'swiper/css/swiper.min.css';
export default function({ attributes, setAttributes, className, isSelected, clientId }){
@ -322,20 +323,20 @@ export default function({ attributes, setAttributes, className, isSelected, clie
/>
<BaseControl
id="colorpicker"
id="backgroundcolorpicker"
label={ __('Background color', 'tainacan')}>
<ColorPicker
color={ collectionBackgroundColor }
onChangeComplete={ ( value ) => {
collectionBackgroundColor = value.hex;
<TainacanBlocksCompatColorPicker
value={ collectionBackgroundColor }
onChange={ ( color ) => {
collectionBackgroundColor = color;
setAttributes({ collectionBackgroundColor: collectionBackgroundColor })
}}
disableAlpha
/>
disableAlpha
/>
</BaseControl>
<BaseControl
id="colorpallete"
id="textcolorpicker"
label={ __('Collection name color', 'tainacan')}>
<ColorPalette
colors={ [{ name: __('Black', 'tainacan'), color: '#000000'}, { name: __('White', 'tainacan'), color: '#ffffff'} ] }

View File

@ -1,6 +1,6 @@
const { __ } = wp.i18n;
const { ResizableBox, FocalPointPicker, SelectControl, RangeControl, Spinner, Button, ToggleControl, Placeholder, ColorPicker, ColorPalette, BaseControl, PanelBody } = wp.components;
const { ResizableBox, FocalPointPicker, SelectControl, RangeControl, Spinner, Button, ToggleControl, Placeholder, ColorPalette, BaseControl, PanelBody } = wp.components;
const { InspectorControls, BlockControls, useBlockProps } = (tainacan_blocks.wp_version < '5.2' ? wp.editor : wp.blockEditor );
@ -10,6 +10,7 @@ import axios from 'axios';
import qs from 'qs';
import { ThumbnailHelperFunctions } from '../../../admin/js/utilities.js';
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
import TainacanBlocksCompatColorPicker from '../../js/tainacan-blocks-compat-colorpicker.js';
export default function({ attributes, setAttributes, className, isSelected, clientId }){
let {
@ -569,20 +570,20 @@ export default function({ attributes, setAttributes, className, isSelected, clie
/>
<BaseControl
id="colorpicker"
label={ __('Background color', 'tainacan')}>
<ColorPicker
color={ collectionBackgroundColor }
onChangeComplete={ ( value ) => {
collectionBackgroundColor = value.hex;
id="backgroundcolorpicker"
label={ __('Background color', 'tainacan') }>
<TainacanBlocksCompatColorPicker
value={ collectionBackgroundColor }
onChange={ ( color ) => {
collectionBackgroundColor = color;
setAttributes({ collectionBackgroundColor: collectionBackgroundColor })
}}
disableAlpha
/>
/>
</BaseControl>
<BaseControl
id="colorpallete"
id="colorpicker"
label={ __('Collection name color', 'tainacan')}>
<ColorPalette
colors={ [{ name: __('Black', 'tainacan'), color: '#000000'}, { name: __('White', 'tainacan'), color: '#ffffff'} ] }

View File

@ -2,7 +2,7 @@ const { __ } = wp.i18n;
const {
Button,
ColorPicker,
ColorPalette,
BaseControl,
CheckboxControl,
RangeControl,
@ -24,6 +24,7 @@ const { InspectorControls, BlockControls } = (tainacan_blocks.wp_version < '5.2'
import CollectionModal from './collection-modal.js';
import TermModal from './term-modal.js';
import TainacanBlocksCompatColorPicker from '../../js/tainacan-blocks-compat-colorpicker.js';
export default function({ attributes, setAttributes, className, isSelected, clientId }) {
let {
@ -586,10 +587,10 @@ export default function({ attributes, setAttributes, className, isSelected, clie
id="backgroundColorPicker"
label={ __('Background color', 'tainacan')}
help={ __('The background color of the entire items list', 'tainacan') }>
<ColorPicker
color={ backgroundColor }
onChangeComplete={ (colorValue ) => {
backgroundColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ backgroundColor }
onChange={ ( colorValue ) => {
backgroundColor = colorValue;
setAttributes({ backgroundColor: backgroundColor });
}}
disableAlpha
@ -600,10 +601,10 @@ export default function({ attributes, setAttributes, className, isSelected, clie
id="secondaryColorPicker"
label={ __('Link and Active Main color', 'tainacan')}
help={ __('The text color links and other action or active state elements, such as select arrows, tooltip contents, etc', 'tainacan') }>
<ColorPicker
color={ secondaryColor }
onChangeComplete={ (colorValue ) => {
secondaryColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ secondaryColor }
onChange={ (colorValue ) => {
secondaryColor = colorValue;
setAttributes({ secondaryColor: secondaryColor });
}}
disableAlpha
@ -614,10 +615,10 @@ export default function({ attributes, setAttributes, className, isSelected, clie
id="primaryColorPicker"
label={ __('Tooltips background color', 'tainacan')}
help={ __('The tooltips background color and other elements, such as the hide filters button', 'tainacan') }>
<ColorPicker
color={ primaryColor }
onChangeComplete={ (colorValue ) => {
primaryColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ primaryColor }
onChange={ (colorValue ) => {
primaryColor = colorValue;
setAttributes({ primaryColor: primaryColor });
}}
disableAlpha
@ -628,10 +629,10 @@ export default function({ attributes, setAttributes, className, isSelected, clie
id="inputBackgroundColorPicker"
label={ __('Input Background color', 'tainacan')}
help={ __('The background color for input fields', 'tainacan') }>
<ColorPicker
color={ inputBackgroundColor }
onChangeComplete={ (colorValue ) => {
inputBackgroundColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ inputBackgroundColor }
onChange={ (colorValue ) => {
inputBackgroundColor = colorValue;
setAttributes({ inputBackgroundColor: inputBackgroundColor });
}}
disableAlpha
@ -642,10 +643,10 @@ export default function({ attributes, setAttributes, className, isSelected, clie
id="inputColorPicker"
label={ __('Input Text color', 'tainacan')}
help={ __('The text color for input fields, including dropdowns and buttons', 'tainacan') }>
<ColorPicker
color={ inputColor }
onChangeComplete={ (colorValue ) => {
inputColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ inputColor }
onChange={ (colorValue ) => {
inputColor = colorValue;
setAttributes({ inputColor: inputColor });
}}
disableAlpha
@ -656,10 +657,10 @@ export default function({ attributes, setAttributes, className, isSelected, clie
id="inputBorderColorPicker"
label={ __('Input Border color', 'tainacan')}
help={ __('The border color for input fields', 'tainacan') }>
<ColorPicker
color={ inputBorderColor }
onChangeComplete={ (colorValue ) => {
inputBorderColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ inputBorderColor }
onChange={ (colorValue ) => {
inputBorderColor = colorValue;
setAttributes({ inputBorderColor: inputBorderColor });
}}
disableAlpha
@ -670,10 +671,10 @@ export default function({ attributes, setAttributes, className, isSelected, clie
id="labelColorPicker"
label={ __('Label Text color', 'tainacan')}
help={ __('The text color for field labels', 'tainacan') }>
<ColorPicker
color={ labelColor }
onChangeComplete={ (colorValue ) => {
labelColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ labelColor }
onChange={ (colorValue ) => {
labelColor = colorValue;
setAttributes({ labelColor: labelColor });
}}
disableAlpha
@ -684,10 +685,10 @@ export default function({ attributes, setAttributes, className, isSelected, clie
id="headingColorPicker"
label={ __('Headings Text color', 'tainacan')}
help={ __('The text color for headings such as items title and filters menu header', 'tainacan') }>
<ColorPicker
color={ headingColor }
onChangeComplete={ (colorValue ) => {
headingColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ headingColor }
onChange={ (colorValue ) => {
headingColor = colorValue;
setAttributes({ headingColor: headingColor });
}}
disableAlpha
@ -698,10 +699,10 @@ export default function({ attributes, setAttributes, className, isSelected, clie
id="infoColorPicker"
label={ __('General Info Text color', 'tainacan')}
help={ __('The text color for other information such as item metadata, icons, number of pages, etc', 'tainacan') }>
<ColorPicker
color={ infoColor }
onChangeComplete={ (colorValue ) => {
infoColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ infoColor }
onChange={ (colorValue ) => {
infoColor = colorValue;
setAttributes({ infoColor: infoColor });
}}
disableAlpha
@ -711,10 +712,10 @@ export default function({ attributes, setAttributes, className, isSelected, clie
id="itemBackgroundColorPicker"
label={ __('Item Background color', 'tainacan')}
help={ __('The background color for an item on the list', 'tainacan') }>
<ColorPicker
color={ itemBackgroundColor }
onChangeComplete={ (colorValue ) => {
itemBackgroundColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ itemBackgroundColor }
onChange={ (colorValue ) => {
itemBackgroundColor = colorValue;
setAttributes({ itemBackgroundColor: itemBackgroundColor });
}}
disableAlpha
@ -725,11 +726,11 @@ export default function({ attributes, setAttributes, className, isSelected, clie
id="itemHoverBackgroundColorPicker"
label={ __('Item Hover Background color', 'tainacan')}
help={ __('The background color for an item on the list, when hovered', 'tainacan') }>
<ColorPicker
color={ itemHoverBackgroundColor }
onChangeComplete={ (colorValue ) => {
itemHoverBackgroundColor = colorValue.hex;
skeletonColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ itemHoverBackgroundColor }
onChange={ (colorValue ) => {
itemHoverBackgroundColor = colorValue;
skeletonColor = colorValue;
setAttributes({
itemHoverBackgroundColor: itemHoverBackgroundColor,
skeletonColor: skeletonColor
@ -743,10 +744,10 @@ export default function({ attributes, setAttributes, className, isSelected, clie
id="itemHeadingHoverBackgroundColorPicker"
label={ __('Item Heading Hover Background color', 'tainacan')}
help={ __('The background color for the item heading (where the title is), when hovered', 'tainacan') }>
<ColorPicker
color={ itemHeadingHoverBackgroundColor }
onChangeComplete={ (colorValue ) => {
itemHeadingHoverBackgroundColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ itemHeadingHoverBackgroundColor }
onChange={ (colorValue ) => {
itemHeadingHoverBackgroundColor = colorValue;
setAttributes({ itemHeadingHoverBackgroundColor: itemHeadingHoverBackgroundColor });
}}
disableAlpha

View File

@ -294,6 +294,18 @@ tainacan_plugin.classes.TainacanMediaGallery = class TainacanMediaGallery {
if (swiperInstance.params && swiperInstance.params.autoplay && swiperInstance.params.autoplay.enabled && swiperInstance.autoplay.running)
swiperInstance.autoplay.stop();
});
// On destroy we make a copy of the inner content to clear it
// and set again. This stops YouTube player, for example.
gallery.listen('destroy', () => {
let actualGalleryContainer = document.getElementsByClassName("pswp__container")[0];
if (actualGalleryContainer) {
let currentData = actualGalleryContainer.innerHTML;
actualGalleryContainer.innerHTML = '';
actualGalleryContainer.innerHTML = currentData;
}
});
};
// triggers when user clicks on thumbnail

View File

@ -56,8 +56,8 @@
"default": false
},
"backgroundColor": {
"type": "Object",
"default": { "r": 255, "g": 255, "b": 255, "a": 0 }
"type": "String",
"default": "rgba(255,255,255,0)"
},
"baseFontSize": {
"type": "Number",

View File

@ -1,6 +1,234 @@
const { __ } = wp.i18n;
const { RichText, useBlockProps } = (tainacan_blocks.wp_version < '5.2' ? wp.editor : wp.blockEditor );
export default [
/* Deprecated on Tainacan 0.18.8, due to the backgroundColor being a string instead of object */
{
"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": "Object",
"default": { "r": 255, "g": 255, "b": 255, "a": 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": "#454647"
},
"infoColor": {
"type": "String",
"default": "#555758"
},
"primaryColor": {
"type": "String",
"default": "#d9eced"
},
"secondaryColor": {
"type": "String",
"default": "#298596"
},
"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."
}
},
"supports": {
"align": ["full", "wide"],
"html": true,
"multiple": false
},
save({ attributes, className }) {
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
} = attributes;
const blockProps = useBlockProps.save();
let termsAgreementMessageHTML = <RichText.Content { ...blockProps } tagName="p" value={ termsAgreementMessage } />;
termsAgreementMessageHTML = (termsAgreementMessageHTML && termsAgreementMessageHTML.props && termsAgreementMessageHTML.props.value) ? termsAgreementMessageHTML.props.value : '';
return <div
style={{
'font-size': baseFontSize + 'px',
'--tainacan-base-font-size': baseFontSize + 'px',
'--tainacan-background-color': 'rgba(' + backgroundColor.r + ',' + backgroundColor.g + ',' + backgroundColor.b + ',' + backgroundColor.a + ')',
'--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' } >
</div>
</div>
}
},
/* Deprecated on Tainacan 0.18.7, due to the addition of showTermsAgreementCheckbox */
{
"attributes": {

View File

@ -4,7 +4,6 @@ const {
Button,
TextControl,
TextareaControl,
ColorPicker,
BaseControl,
CheckboxControl,
FontSizePicker,
@ -20,8 +19,9 @@ const { InspectorControls, BlockControls, RichText, useBlockProps } = (tainacan_
import tainacan from '../../js/axios.js';
import CollectionModal from '../faceted-search/collection-modal.js';
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
import TainacanBlocksCompatColorPicker from '../../js/tainacan-blocks-compat-colorpicker.js';
export default function ({ attributes, setAttributes, className, isSelected, clientId }) {
export default function ({ attributes, setAttributes, className }) {
let {
collectionId,
isCollectionModalOpen,
@ -88,6 +88,13 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
size: 20,
},
];
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 + ')';
}
function openCollectionModal() {
isCollectionModalOpen = true;
@ -406,12 +413,13 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
id="backgroundColorPicker"
label={ __('Background color', 'tainacan')}
help={ __('The background color of the entire items list', 'tainacan') }>
<ColorPicker
color={ backgroundColor }
onChangeComplete={ (colorValue ) => {
backgroundColor = colorValue.rgb;
<TainacanBlocksCompatColorPicker
value={ backgroundColor }
onChange={ (colorValue ) => {
backgroundColor = colorValue;
setAttributes({ backgroundColor: backgroundColor });
}}
enableAlpha
/>
</BaseControl>
<HorizontalRule />
@ -419,10 +427,10 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
id="secondaryColorPicker"
label={ __('Link and Active Main color', 'tainacan')}
help={ __('The text color links and other action or active state elements, such as select arrows, tooltip contents, etc', 'tainacan') }>
<ColorPicker
color={ secondaryColor }
onChangeComplete={ (colorValue ) => {
secondaryColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ secondaryColor }
onChange={ (colorValue ) => {
secondaryColor = colorValue;
setAttributes({ secondaryColor: secondaryColor });
}}
disableAlpha
@ -433,10 +441,10 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
id="primaryColorPicker"
label={ __('Tooltips background color', 'tainacan')}
help={ __('The tooltips background color and other elements, such as the hide filters button', 'tainacan') }>
<ColorPicker
color={ primaryColor }
onChangeComplete={ (colorValue ) => {
primaryColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ primaryColor }
onChange={ (colorValue ) => {
primaryColor = colorValue;
setAttributes({ primaryColor: primaryColor });
}}
disableAlpha
@ -447,10 +455,10 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
id="inputBackgroundColorPicker"
label={ __('Input Background color', 'tainacan')}
help={ __('The background color for input fields', 'tainacan') }>
<ColorPicker
color={ inputBackgroundColor }
onChangeComplete={ (colorValue ) => {
inputBackgroundColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ inputBackgroundColor }
onChange={ (colorValue ) => {
inputBackgroundColor = colorValue;
setAttributes({ inputBackgroundColor: inputBackgroundColor });
}}
disableAlpha
@ -461,10 +469,10 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
id="inputColorPicker"
label={ __('Input Text color', 'tainacan')}
help={ __('The text color for input fields, including dropdowns and buttons', 'tainacan') }>
<ColorPicker
color={ inputColor }
onChangeComplete={ (colorValue ) => {
inputColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ inputColor }
onChange={ (colorValue ) => {
inputColor = colorValue;
setAttributes({ inputColor: inputColor });
}}
disableAlpha
@ -475,10 +483,10 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
id="inputBorderColorPicker"
label={ __('Input Border color', 'tainacan')}
help={ __('The border color for input fields', 'tainacan') }>
<ColorPicker
color={ inputBorderColor }
onChangeComplete={ (colorValue ) => {
inputBorderColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ inputBorderColor }
onChange={ (colorValue ) => {
inputBorderColor = colorValue;
setAttributes({ inputBorderColor: inputBorderColor });
}}
disableAlpha
@ -489,10 +497,10 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
id="labelColorPicker"
label={ __('Label Text color', 'tainacan')}
help={ __('The text color for field labels', 'tainacan') }>
<ColorPicker
color={ labelColor }
onChangeComplete={ (colorValue ) => {
labelColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ labelColor }
onChange={ (colorValue ) => {
labelColor = colorValue;
setAttributes({ labelColor: labelColor });
}}
disableAlpha
@ -502,10 +510,10 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
id="infoColorPicker"
label={ __('General Info Text color', 'tainacan')}
help={ __('The text color for other information such as item metadata, icons, number of pages, etc', 'tainacan') }>
<ColorPicker
color={ infoColor }
onChangeComplete={ (colorValue ) => {
infoColor = colorValue.hex;
<TainacanBlocksCompatColorPicker
value={ infoColor }
onChange={ (colorValue ) => {
infoColor = colorValue;
setAttributes({ infoColor: infoColor });
}}
disableAlpha
@ -552,7 +560,7 @@ export default function ({ attributes, setAttributes, className, isSelected, cli
</div>
<div
style={{
'--tainacan-background-color': 'rgba(' + backgroundColor.r + ',' + backgroundColor.g + ',' + backgroundColor.b + ',' + backgroundColor.a + ')',
'--tainacan-background-color': backgroundColor,
'--tainacan-input-color': inputColor,
'--tainacan-input-background-color': inputBackgroundColor,
'--tainacan-input-border-color': inputBorderColor,

View File

@ -39,11 +39,18 @@ export default function({ attributes, 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': 'rgba(' + backgroundColor.r + ',' + backgroundColor.g + ',' + backgroundColor.b + ',' + backgroundColor.a + ')',
'--tainacan-background-color': backgroundColor,
'--tainacan-input-color': inputColor,
'--tainacan-input-background-color': inputBackgroundColor,
'--tainacan-input-border-color': inputBorderColor,

View File

@ -5,6 +5,7 @@ import qs from 'qs';
const { __ } = wp.i18n;
const { TextControl, Button, Modal, SelectControl, RadioControl, Spinner } = wp.components;
const currentWPVersion = (typeof tainacan_blocks != 'undefined') ? tainacan_blocks.wp_version : tainacan_plugin.wp_version;
export default class ItemsModal extends React.Component {
constructor(props) {
@ -238,7 +239,7 @@ export default class ItemsModal extends React.Component {
return this.state.collectionId ? (
// Items modal
<Modal
className="wp-block-tainacan-modal dynamic-modal"
className={ 'wp-block-tainacan-modal dynamic-modal ' + (currentWPVersion < 5.9 ? 'wp-version-smaller-than-5-9' : '') }
title={ __('Select items to add on block', 'tainacan', 'tainacan')}
onRequestClose={ () => this.cancelSelection() }
shouldCloseOnClickOutside={ false }

View File

@ -4,6 +4,7 @@ import axios from 'axios';
const { __ } = wp.i18n;
const { TextControl, Button, Modal, RadioControl, SelectControl, Spinner } = wp.components;
const currentWPVersion = (typeof tainacan_blocks != 'undefined') ? tainacan_blocks.wp_version : tainacan_plugin.wp_version;
export default class RelatedItemsModal extends React.Component {
constructor(props) {
@ -199,7 +200,7 @@ export default class RelatedItemsModal extends React.Component {
return this.state.collectionId ? (
// Items modal
<Modal
className="wp-block-tainacan-modal dynamic-modal"
className={ 'wp-block-tainacan-modal dynamic-modal ' + (currentWPVersion < 5.9 ? 'wp-version-smaller-than-5-9' : '') }
title={ __('Select one item that has relations', 'tainacan') }
onRequestClose={ () => this.cancelSelection() }
shouldCloseOnClickOutside={ false }

View File

@ -1,10 +1,11 @@
const { __ } = wp.i18n;
const { RangeControl, TextControl, SelectControl, Button, ToggleControl, Placeholder, ColorPicker, ColorPalette, BaseControl, PanelBody } = wp.components;
const { RangeControl, TextControl, SelectControl, Button, ToggleControl, Placeholder, ColorPalette, BaseControl, PanelBody } = wp.components;
const { InspectorControls, BlockControls, useBlockProps } = (tainacan_blocks.wp_version < '5.2' ? wp.editor : wp.blockEditor );
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
import TainacanBlocksCompatColorPicker from '../../js/tainacan-blocks-compat-colorpicker.js';
import SearchBarModal from './search-bar-modal.js';
export default function({ attributes, setAttributes, className, isSelected }) {
@ -308,22 +309,22 @@ export default function({ attributes, setAttributes, className, isSelected }) {
/>
<BaseControl
id="colorpicker"
label={ __('Background color', 'tainacan')}>
<ColorPicker
color={ collectionBackgroundColor }
onChangeComplete={ ( value ) => {
collectionBackgroundColor = value.hex;
setAttributes({ collectionBackgroundColor: collectionBackgroundColor }) ;
setContent();
}}
id="backgroundcolorpicker"
label={ __('Background color', 'tainacan') }>
<TainacanBlocksCompatColorPicker
value={ collectionBackgroundColor }
onChange={ ( color ) => {
collectionBackgroundColor = color;
setAttributes({ collectionBackgroundColor: collectionBackgroundColor });
setContent();
}}
disableAlpha
/>
/>
</BaseControl>
<BaseControl
id="colorpallete"
label={ __('Collection name color', 'tainacan')}>
id="colorpicker"
label={ __('Collection name color', 'tainacan') }>
<ColorPalette
colors={ [{ name: __('Black', 'tainacan'), color: '#000000'}, { name: __('White', 'tainacan'), color: '#ffffff'} ] }
value={ collectionTextColor }

View File

@ -0,0 +1,21 @@
const { ColorPicker, ColorPalette } = wp.components;
export default function TainacanBlocksCompatColorPicker({ value, onChange, enableAlpha, disableAlpha }) {
const currentWPVersion = (typeof tainacan_blocks != 'undefined') ? tainacan_blocks.wp_version : tainacan_plugin.wp_version;
return currentWPVersion < '5.9' ?
<ColorPicker
color={ value }
onChangeComplete={ (value) => onChange(value.hex) }
enableAlpha={ enableAlpha }
disableAlpha={ disableAlpha }
/>
:
<ColorPalette
value={ value }
onChange={ onChange }
enableAlpha={ enableAlpha }
disableAlpha={ disableAlpha }
/>
}

View File

@ -2,7 +2,7 @@ const { Button, Toolbar, ToolbarGroup, ToolbarButton } = wp.components;
export default function TainacanBlocksCompatToolbar({ label, icon, onClick, onClickParams, controls }) {
const currentWPVersion = (typeof tainacan_blocks != 'undefined') ? currentWPVersion : tainacan_plugin.wp_version;
const currentWPVersion = (typeof tainacan_blocks != 'undefined') ? tainacan_blocks.wp_version : tainacan_plugin.wp_version;
if (controls !== undefined)
return currentWPVersion < '5.4' ? <Toolbar controls={ controls } /> : <ToolbarGroup controls={ controls } />

View File

@ -65,17 +65,27 @@
height: 80vh;
iframe {
width: calc(100% + 32px);
height: calc(100% - 132px);
margin-left: -16px;
width: 100%;
height: calc(100% - 96px);
}
&.wp-version-smaller-than-5-9 iframe {
height: calc(100% - 156px);
}
.modal-footer-area {
height: 68px;
width: calc(100% + 32px);
margin-left: -16px !important;
padding: 1.2em 1.2em !important;
width: 100%;
border-top: 1px solid var(--tainacan-block-gray3, $gray3);
padding: 15px 32px;
}
.components-modal__content {
padding: 0;
.components-modal__header {
margin-left: 0;
margin-right: 0;
}
}
}
@ -209,8 +219,7 @@
display: flex;
align-items: baseline;
justify-content: space-between;
padding: 15px 16px 0 16px;
margin: 0 -16px;
padding: 15px 0 0 0;
p {
padding: 0 12px;