├── .gitignore
├── assets
    ├── css
    │   └── editor.css
    ├── img
    │   └── gravityforms-icon.svg
    └── js
    │   └── block.js
├── gutenberg-gravityforms.php
└── inc
    └── blocks
        └── class-gb-gravityforms-form-block.php


/.gitignore:
--------------------------------------------------------------------------------
 1 | # Packages #
 2 | ############
 3 | *.7z
 4 | *.dmg
 5 | *.gz
 6 | *.bz2
 7 | *.iso
 8 | *.jar
 9 | *.rar
10 | *.tar
11 | *.zip
12 | *.tgz
13 | *.map
14 | 
15 | # Logs and databases #
16 | ######################
17 | *.log
18 | *.sql
19 | 
20 | # OS generated files #
21 | ######################
22 | **.DS_Store*
23 | ehthumbs.db
24 | Icon?
25 | Thumbs.db
26 | ._*
27 | 
28 | # Vim generated files #
29 | ######################
30 | *.un~
31 | 
32 | # SASS #
33 | ##########
34 | **/.sass-cache
35 | **/.sass-cache/*
36 | **/.map
37 | 
38 | # Composer #
39 | ##########
40 | vendors/composer/
41 | !assets/js/vendor/
42 | wpcs/
43 | composer.lock
44 | 
45 | # Bower #
46 | ##########
47 | assets/bower_components/*
48 | 
49 | # Codekit #
50 | ##########
51 | /codekit-config.json
52 | *.codekit
53 | **.codekit-cache/*
54 | 
55 | # NPM #
56 | ##########
57 | node_modules
58 | 
59 | # Compiled Files and Build Dirs #
60 | ##########
61 | /README.html
62 | /build/
63 | 
64 | # PhpStrom Project Files #
65 | .idea/
66 | library/vendors/composer
67 | assets/img/.DS_Store
68 | assets/sass/HTML
69 | assets/sass/Rails
70 | HTML
71 | Rails
72 | 


--------------------------------------------------------------------------------
/assets/css/editor.css:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/lucasstark/gutenberg-gravityforms/ddb507d94ccf6bcc8a97e3049d9dfe5a3b64a63a/assets/css/editor.css


--------------------------------------------------------------------------------
/assets/img/gravityforms-icon.svg:
--------------------------------------------------------------------------------
1 | <?xml version="1.0" encoding="utf-8"?><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-15 77 581 640" enable-background="new -15 77 581 640" xml:space="preserve"><g id="Layer_2"><path fill="#999999" d="M489.5,227L489.5,227L315.9,126.8c-22.1-12.8-58.4-12.8-80.5,0L61.8,227c-22.1,12.8-40.3,44.2-40.3,69.7v200.5c0,25.6,18.1,56.9,40.3,69.7l173.6,100.2c22.1,12.8,58.4,12.8,80.5,0L489.5,567c22.2-12.8,40.3-44.2,40.3-69.7V296.8C529.8,271.2,511.7,239.8,489.5,227z M401,300.4v59.3H241v-59.3H401z M163.3,490.9c-16.4,0-29.6-13.3-29.6-29.6c0-16.4,13.3-29.6,29.6-29.6s29.6,13.3,29.6,29.6C192.9,477.6,179.6,490.9,163.3,490.9z M163.3,359.7c-16.4,0-29.6-13.3-29.6-29.6s13.3-29.6,29.6-29.6s29.6,13.3,29.6,29.6S179.6,359.7,163.3,359.7z M241,490.9v-59.3h160v59.3H241z"/></g></svg>


--------------------------------------------------------------------------------
/assets/js/block.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * The gravity form block
  3 |  */
  4 | 
  5 | 
  6 | 
  7 | (function (blocks, i18n, element) {
  8 | 
  9 |     var __ = wp.i18n.__; // The __() for internationalization.
 10 |     var el = wp.element.createElement; // The wp.element.createElement() function to create elements.
 11 | 
 12 |     var InspectorControls = wp.blocks.InspectorControls;
 13 |     var SelectControl = wp.blocks.InspectorControls.SelectControl;
 14 |     var ToggleControl = wp.blocks.InspectorControls.ToggleControl;
 15 | 
 16 | 
 17 |     var blockStyle = {
 18 |         backgroundColor: '#900',
 19 |         color: '#fff',
 20 |         padding: '20px'
 21 |     };
 22 | 
 23 |     blocks.registerBlockType('gutenberg-gravityforms/single-form', {
 24 |         title: __('Gravity Form', 'gutenberg-gravityforms'),
 25 |         icon: 'media-spreadsheet',
 26 |         category: 'layout',
 27 | 
 28 |         attributes: {
 29 |             form_id: {
 30 |                 type: 'string'
 31 |             },
 32 |             displayFormTitle: {
 33 |                 type: 'bool',
 34 |                 default: true
 35 |             },
 36 |             displayFormDescription: {
 37 |                 type: 'bool',
 38 |                 default: true
 39 |             },
 40 |             enableAjax: {
 41 |                 type: 'bool',
 42 |                 default: false
 43 |             }
 44 | 
 45 |         },
 46 | 
 47 |         edit: function (props) {
 48 |             var focus = props.focus;
 49 | 
 50 |             props.attributes.form_id =  props.attributes.form_id &&  props.attributes.form_id != '0' ?  props.attributes.form_id : false;
 51 | 
 52 |             return [
 53 |                 !!focus && el(
 54 |                     InspectorControls,
 55 |                     {key: 'inspector'},
 56 |                     el(
 57 |                         SelectControl,
 58 |                         {
 59 |                             label: __('Gravity Form', 'gutenberg-gravityforms'),
 60 |                             value: props.attributes.form_id ? parseInt(props.attributes.form_id) : 0,
 61 |                             instanceId: 'gravity-form-selector',
 62 |                             onChange: function (value) {
 63 |                                 props.setAttributes({form_id: value});
 64 |                             },
 65 |                             options: gb_gravityforms_block_params.forms,
 66 |                         }
 67 |                     ),
 68 |                     el(
 69 |                         'div',
 70 |                         {
 71 |                             'style': {
 72 |                                 'padding': '8px 0 0 0',
 73 |                                 'fontSize': '11px',
 74 |                                 'fontStyle': 'italic',
 75 |                                 'color': '#5A5A5A',
 76 |                                 'marginTop': '-22px',
 77 |                                 'marginBottom': '22px'
 78 |                             },
 79 |                         },
 80 |                         'Cant find your form? Make sure it is active.'
 81 |                     ),
 82 |                     el(
 83 |                         ToggleControl,
 84 |                         {
 85 |                             label: 'Display form title',
 86 |                             checked: props.attributes.displayFormTitle,
 87 |                             instanceId: 'gravity-form-display-form-title',
 88 |                             onChange: function (event) {
 89 |                                 props.setAttributes({displayFormTitle: !props.attributes.displayFormTitle});
 90 |                             }
 91 |                         }
 92 |                     ),
 93 |                     el(
 94 |                         ToggleControl,
 95 |                         {
 96 |                             label: 'Display form description',
 97 |                             checked: props.attributes.displayFormDescription,
 98 |                             instanceId: 'gravity-form-display-form-description',
 99 |                             onChange: function (event) {
100 |                                 props.setAttributes({displayFormDescription: !props.attributes.displayFormDescription});
101 |                             }
102 |                         }
103 |                     ),
104 |                     el(
105 |                         ToggleControl,
106 |                         {
107 |                             label: 'Enable Ajax',
108 |                             checked: props.attributes.enableAjax,
109 |                             instanceId: 'gravity-form-display-enable-ajax',
110 |                             onChange: function (event) {
111 |                                 props.setAttributes({enableAjax: !props.attributes.enableAjax});
112 |                             }
113 |                         }
114 |                     )
115 |                 ),
116 |                 el('div',
117 |                     {key: 'gravity-form'},
118 |                     props.attributes.form_id ? __('Gravity Form: ') + gb_gravityforms_block_params.formMeta[props.attributes.form_id].title : 'Choose Your Form'
119 |                 )
120 |             ];
121 |         },
122 |         save: function (props) {
123 |             return el('p', {}, props.attributes.form_id);
124 |         },
125 |     });
126 | })(
127 |     window.wp.blocks,
128 |     window.wp.i18n,
129 |     window.wp.element
130 | );


--------------------------------------------------------------------------------
/gutenberg-gravityforms.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | /**
  3 |  * Plugin Name: Gutenberg Gravity Form Selector
  4 |  * Plugin URI: https://github.com/lucasstark/gutenberg-gravityforms
  5 |  * Description: Shows how to build a Editor Block which represents a shortcode, specific example shown here is to render a Gravity Form
  6 |  * Author: lucasstark
  7 |  * Author URI: https://elementstark.com/
  8 |  * Version: 1.0.0
  9 |  * License: GPL2+
 10 |  * License URI: http://www.gnu.org/licenses/gpl-2.0.txt
 11 |  *
 12 |  * @package GB
 13 |  */
 14 | 
 15 | // Exit if accessed directly.
 16 | if ( ! defined( 'ABSPATH' ) ) {
 17 | 	exit;
 18 | }
 19 | 
 20 | 
 21 | class GB_Gravity_Forms {
 22 | 
 23 | 	/**
 24 | 	 * @var GB_Gravity_Forms
 25 | 	 */
 26 | 	private static $instance;
 27 | 
 28 | 
 29 | 	/**
 30 | 	 * Registers the plugin.
 31 | 	 */
 32 | 	public static function register() {
 33 | 		if ( self::$instance == null ) {
 34 | 			self::$instance = new GB_Gravity_Forms();
 35 | 		}
 36 | 	}
 37 | 
 38 | 
 39 | 	/**
 40 | 	 * @var string The plugin base directory path ( without trailing slash )
 41 | 	 */
 42 | 	private $_dir;
 43 | 
 44 | 	/**
 45 | 	 * @var string The plugin base URL path ( without trailing slash )
 46 | 	 */
 47 | 	private $_url;
 48 | 
 49 | 	/**
 50 | 	 * @var string Asset version string
 51 | 	 */
 52 | 	private $_assets_version;
 53 | 
 54 | 	/**
 55 | 	 * @var GB_Gravity_Forms_Form_Block
 56 | 	 */
 57 | 	private $_form_block_output;
 58 | 
 59 | 
 60 | 	private function __construct() {
 61 | 		$this->_dir = untrailingslashit( plugin_dir_path( __FILE__ ) );
 62 | 		$this->_url = untrailingslashit( plugins_url( '/', __FILE__ ) );
 63 | 
 64 | 		$this->assets_version = '1.0.0';
 65 | 
 66 | 
 67 | 		add_action( 'plugins_loaded', array( $this, 'on_plugins_loaded' ) );
 68 | 	}
 69 | 
 70 | 
 71 | 	public function on_plugins_loaded() {
 72 | 
 73 | 		if ( class_exists( 'GFAPI' ) ) {
 74 | 
 75 | 			add_action( 'enqueue_block_editor_assets', array( $this, 'on_enqueue_block_editor_assets' ) );
 76 | 
 77 | 			require $this->_dir . '/inc/blocks/class-gb-gravityforms-form-block.php';
 78 | 			$this->_form_block_output = new GB_Gravity_Forms_Form_Block();
 79 | 		}
 80 | 	}
 81 | 
 82 | 
 83 | 	public function on_enqueue_block_editor_assets() {
 84 | 
 85 | 		// Scripts.
 86 | 		wp_enqueue_script(
 87 | 			'gb-gravityforms-block', // Handle.
 88 | 			$this->_url . '/assets/js/block.js',
 89 | 			array( 'wp-blocks', 'wp-i18n', 'wp-element' ), // Dependencies, defined above.
 90 | 			$this->assets_version
 91 | 		);
 92 | 
 93 | 		// Styles.
 94 | 		wp_enqueue_style(
 95 | 			'gb-gravityforms-block', // Handle.
 96 | 			$this->_url . '/assets/css/editor.css',
 97 | 			array( 'wp-blocks', 'wp-i18n', 'wp-element' ), // Dependencies, defined above.
 98 | 			$this->assets_version );
 99 | 
100 | 
101 | 		$forms = array(
102 | 			0 => array(
103 | 				'value' => 0,
104 | 				'label' => __( 'Choose Your Form', 'gutenberg-gravityforms' )
105 | 			)
106 | 		);
107 | 
108 | 		$formmeta = array(
109 | 			0 => __( 'Choose Your Form', 'gutenberg-gravityforms' )
110 | 		);
111 | 
112 | 		foreach ( GFAPI::get_forms() as $form ) {
113 | 			$forms[] = array(
114 | 				'value' => $form['id'],
115 | 				'label' => $form['title']
116 | 			);
117 | 
118 | 			$formmeta[ $form['id'] ] = array( 'title' => $form['title'] );
119 | 
120 | 		}
121 | 
122 | 		wp_localize_script( 'gb-gravityforms-block', 'gb_gravityforms_block_params', array(
123 | 			'forms'    => $forms,
124 | 			'formMeta' => $formmeta
125 | 		) );
126 | 
127 | 
128 | 	}
129 | 
130 | }
131 | 
132 | GB_Gravity_Forms::register();


--------------------------------------------------------------------------------
/inc/blocks/class-gb-gravityforms-form-block.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | // Exit if accessed directly.
 4 | if ( !defined( 'ABSPATH' ) ) {
 5 | 	exit;
 6 | }
 7 | 
 8 | 
 9 | /**
10 |  * Class GB_Gravity_Forms_Form_Block
11 |  * Renders the output for the actual selected Gravity Form.
12 |  */
13 | class GB_Gravity_Forms_Form_Block {
14 | 
15 | 
16 | 	public function __construct() {
17 | 
18 | 		add_action( 'init', array( $this, 'on_init' ) );
19 | 
20 | 	}
21 | 
22 | 
23 | 	public function on_init() {
24 | 		register_block_type( 'gutenberg-gravityforms/single-form', array(
25 | 			'render_callback' => array( $this, 'on_render_block' )
26 | 		) );
27 | 	}
28 | 
29 | 
30 | 	public function on_render_block( $attributes ) {
31 | 		$form_id             = is_array( $attributes ) && isset( $attributes['form_id'] ) ? $attributes['form_id'] : false;
32 | 		$display_title       = isset( $attributes['displayFormTitle'] ) ? $attributes['displayFormTitle'] : true;
33 | 		$display_description = isset( $attributes['displayFormDescription'] ) ? $attributes['displayFormDescription'] : true;
34 | 		$is_ajax             = isset( $attributes['enableAjax'] ) ? $attributes['enableAjax'] : false;
35 | 
36 | 		if ( $form_id ) {
37 | 			return '[gravityform id="' . $form_id . '" title="' . ( $display_title ? 'true' : 'false' ) . '" description="' . ( $display_description ? 'true' : 'false' ) . '" ajax="' . ( $is_ajax ? 'true' : 'false' ) . '" /]';
38 | 		}
39 | 
40 | 	}
41 | 
42 | 
43 | }
44 | 


--------------------------------------------------------------------------------