| 1 |
/** |
| 2 |
* |
| 3 |
* ----------------------------------------------------------- |
| 4 |
* |
| 5 |
* Adminify Framework Gutenberg Block |
| 6 |
* A Simple and Lightweight WordPress Option Framework |
| 7 |
* |
| 8 |
* ----------------------------------------------------------- |
| 9 |
* |
| 10 |
*/ |
| 11 |
( function( blocks, blockEditor, element, components ) { |
| 12 |
|
| 13 |
if ( !window.adminify_gutenberg_blocks ) { return; } |
| 14 |
|
| 15 |
Object.values(window.adminify_gutenberg_blocks).forEach( function( block ) { |
| 16 |
|
| 17 |
var registerBlockType = blocks.registerBlockType; |
| 18 |
var PlainText = blockEditor.PlainText; |
| 19 |
var createElement = element.createElement; |
| 20 |
var RawHTML = element.RawHTML; |
| 21 |
var Button = components.Button; |
| 22 |
|
| 23 |
registerBlockType('adminify-gutenberg-block/block-'+block.hash, { |
| 24 |
title: block.gutenberg.title, |
| 25 |
description: block.gutenberg.description, |
| 26 |
icon: block.gutenberg.icon || 'screenoptions', |
| 27 |
category: block.gutenberg.category || 'widgets', |
| 28 |
keywords: block.gutenberg.keywords, |
| 29 |
supports: { |
| 30 |
html: false, |
| 31 |
className: false, |
| 32 |
customClassName: false, |
| 33 |
}, |
| 34 |
attributes: { |
| 35 |
shortcode: { |
| 36 |
string: 'string', |
| 37 |
source: 'text', |
| 38 |
} |
| 39 |
}, |
| 40 |
edit: function (props) { |
| 41 |
return ( |
| 42 |
createElement('div', {className: 'adminify-shortcode-block'}, |
| 43 |
|
| 44 |
createElement(Button, { |
| 45 |
'data-modal-id': block.modal_id, |
| 46 |
'data-gutenberg-id': block.hash, |
| 47 |
className: 'is-secondary adminify-shortcode-button', |
| 48 |
onClick: function () { |
| 49 |
window.adminify_gutenberg_props = props; |
| 50 |
}, |
| 51 |
}, block.button_title ), |
| 52 |
|
| 53 |
createElement(PlainText, { |
| 54 |
placeholder: block.gutenberg.placeholder, |
| 55 |
className: 'input-control blocks-shortcode__textarea', |
| 56 |
onChange: function (value) { |
| 57 |
props.setAttributes({ |
| 58 |
shortcode: value |
| 59 |
}); |
| 60 |
}, |
| 61 |
value: props.attributes.shortcode |
| 62 |
}) |
| 63 |
|
| 64 |
) |
| 65 |
); |
| 66 |
}, |
| 67 |
save: function (props) { |
| 68 |
return createElement(RawHTML, {}, props.attributes.shortcode); |
| 69 |
} |
| 70 |
}); |
| 71 |
|
| 72 |
}); |
| 73 |
|
| 74 |
})( |
| 75 |
window.wp.blocks, |
| 76 |
window.wp.blockEditor, |
| 77 |
window.wp.element, |
| 78 |
window.wp.components |
| 79 |
); |
| 80 |
|
