| Dir : /home/trave494/islandpc.ca/wp-content/plugins/complianz-terms-conditions/gutenberg/src/ |
| Server: Linux ngx353.inmotionhosting.com 4.18.0-553.22.1.lve.1.el8.x86_64 #1 SMP Tue Oct 8 15:52:54 UTC 2024 x86_64 IP: 209.182.202.254 |
| Dir : /home/trave494/islandpc.ca/wp-content/plugins/complianz-terms-conditions/gutenberg/src/index.js |
/**
* BLOCK:Complianz Documents block
*
* Registering the Complianz Privacy Suite documents block with Gutenberg.
*/
import * as api from './utils/api';
const { __ } = wp.i18n;
const { registerBlockType } = wp.blocks;
const { InspectorControls } = wp.editor;
const { SelectControl } = wp.components;
const { PanelBody, PanelRow } = wp.components;
const el = wp.element.createElement;
/**
* Set custom Complianz Icon
*/
const iconEl =
el('svg', { width: 20, height: 20 ,viewBox : "0 0 133.62 133.62"},
el('path', { d: "M113.63,19.34C100.37,6.51,84.41,0,66.2,0A64.08,64.08,0,0,0,19.36,19.36,64.08,64.08,0,0,0,0,66.2c0,18.25,6.51,34.21,19.34,47.43s28.61,20,46.86,20,34.2-6.72,47.45-20,20-29.21,20-47.45S126.89,32.21,113.63,19.34Zm-2.85,91.44c-12.47,12.46-27.47,18.77-44.58,18.77s-31.89-6.31-43.94-18.75A62.11,62.11,0,0,1,4.07,66.2a60.14,60.14,0,0,1,18.17-44,60.1,60.1,0,0,1,44-18.17c17.12,0,32.12,6.12,44.6,18.19s18.75,26.86,18.75,43.94S123.23,98.32,110.78,110.78Z" } ),
el('path', { d: "M99.49,30.71a6.6,6.6,0,0,0-9.31,0L40.89,80,35.3,74.41a6.58,6.58,0,0,0-9.31,0l-2.12,2.12a6.6,6.6,0,0,0,0,9.31l9.64,9.64a6.67,6.67,0,0,0,.56.65l2.12,2.12L41,102.8l4-4a8.39,8.39,0,0,0,.65-.56l2.12-2.12a8.39,8.39,0,0,0,.56-.65l53.34-53.34a6.6,6.6,0,0,0,0-9.31Z" } ),
el('path', { d: "M94.91,86.63H65.15L48.86,102.8H94.91a6.6,6.6,0,0,0,6.58-6.58v-3A6.61,6.61,0,0,0,94.91,86.63Z" } ),
el('path', { d: "M47.09,45H68.71L85,28.79H47.09a6.6,6.6,0,0,0-6.58,6.58v3A6.6,6.6,0,0,0,47.09,45Z" } ),
);
import {useState, useEffect} from "@wordpress/element";
const selectDocument = ({ className, isSelected, attributes, setAttributes }) => {
const [documents, setDocuments] = useState({});
const [documentSyncStatus, setDocumentSyncStatus] = useState(attributes.documentSyncStatus);
const [customDocumentHtml, setCustomDocumentHtml] = useState('');
useEffect(() => {
api.getDocument().then( ( response ) => {
let documentData = response.data
setDocuments(documentData);
let tempHtml = '';
if ( documentData ) {
tempHtml = documentData.content;
}
if ( attributes.customDocument && attributes.customDocument.length>0 ){
tempHtml = attributes.customDocument;
}
setCustomDocumentHtml(tempHtml);
});
}, [])
const onChangeCustomDocument = (value) => {
setAttributes({
customDocument: value,
});
}
const onChangeSelectDocumentSyncStatus = (value) => {
setDocumentSyncStatus(value);
setAttributes({
documentSyncStatus: value,
});
setCustomDocumentHtml(documents.content);
setAttributes({
customDocument: documents.content,
});
}
let output = __('Loading...', 'complianz-terms-conditions');
let id = 'document-title';
let document_status_options = [
{value: 'sync', label: __('Synchronize document with Complianz', 'complianz-terms-conditions')},
{value: 'unlink', label: __('Edit document and stop synchronization', 'complianz-terms-conditions')},
];
//preview
if (attributes.preview){
return(
<img alt="preview" src={complianztc.cmplz_tc_preview} />
);
}
//load content
if (documents && documents.hasOwnProperty('title')) {
output = documents.content;
id = attributes.selectedDocument;
}
if (documentSyncStatus==='sync') {
return [
!!isSelected && (
<InspectorControls key='inspector'>
<PanelBody title={ __('Document settings', 'complianz-terms-conditions' ) } initialOpen={ true } >
<PanelRow>
<SelectControl onChange={onChangeSelectDocumentSyncStatus}
value={attributes.documentSyncStatus}
label={__('Document sync status', 'complianz-terms-conditions')}
options={document_status_options}/>
</PanelRow>
</PanelBody>
</InspectorControls>
),
<div key={id} className={className} dangerouslySetInnerHTML={{__html: output}}></div>
]
} else {
return [
!!isSelected && (
<InspectorControls key='inspector'>
<PanelBody title={ __('Document settings', 'complianz-terms-conditions' ) } initialOpen={ true } >
<PanelRow>
<SelectControl onChange={onChangeSelectDocumentSyncStatus}
value={attributes.documentSyncStatus}
label={__('Document sync status', 'complianz-terms-conditions')}
options={document_status_options}/>
</PanelRow>
</PanelBody>
</InspectorControls>
),
<div contentEditable={true} onInput={(e)=>onChangeCustomDocument(e.currentTarget.innerHTML)}
dangerouslySetInnerHTML={{__html: customDocumentHtml}}
className={className}
></div>
]
}
}
/**
* Register: a Gutenberg Block.
*
* Registers a new block provided a unique name and an object defining its
* behavior. Once registered, the block is made editor as an option to any
* editor interface where blocks are implemented.
*
* @link https://wordpress.org/gutenberg/handbook/block-api/
* @param {string} name Block name.
* @param {Object} settings Block settings.
* @return {?WPBlock} The block, if it has been successfully
* registered; otherwise `undefined`.
*/
registerBlockType('complianztc/terms-conditions', {
title: __('Legal document - Complianz Terms & conditions', 'complianz-terms-conditions'), // Block title.
icon: iconEl, // Block icon from Dashicons → https://developer.wordpress.org/resource/dashicons/.
category: 'widgets',
example: {
attributes: {
'preview' : true,
},
},
keywords: [
__('Terms & conditions', 'complianz-terms-conditions'),
],
//className: 'cmplz-document',
attributes: {
documentSyncStatus: {
type: 'string',
default: 'sync'
},
customDocument: {
type: 'string',
default: ''
},
content: {
type: 'string',
source: 'children',
selector: 'p',
},
document: {
type: 'array',
},
preview: {
type: 'boolean',
default: false,
}
},
/**
* The edit function describes the structure of your block in the context of the editor.
* This represents what the editor will render when the block is used.
*
* The "edit" property must be a valid function.
*
* @link https://wordpress.org/gutenberg/handbook/block-api/block-edit-save/
*/
edit:selectDocument,
/**
* The save function defines the way in which the different attributes should be combined
* into the final markup, which is then serialized by Gutenberg into post_content.
*
* The "save" property must be specified and must be a valid function.
*
* @link https://wordpress.org/gutenberg/handbook/block-api/block-edit-save/
*/
save: function() {
// Rendering in PHP
return null;
},
});