diff --git a/src/views/gutenberg-blocks/class-tainacan-gutenberg-block.php b/src/views/gutenberg-blocks/class-tainacan-gutenberg-block.php index d5a54915c..8e4abd1ea 100644 --- a/src/views/gutenberg-blocks/class-tainacan-gutenberg-block.php +++ b/src/views/gutenberg-blocks/class-tainacan-gutenberg-block.php @@ -67,7 +67,11 @@ function tainacan_blocks_register_categories($categories, $editor_context) { array( array( 'slug' => 'tainacan-blocks', - 'title' => __( 'Tainacan', 'tainacan' ), + 'title' => __( 'Tainacan Blocks', 'tainacan' ), + ), + array( + 'slug' => 'tainacan-blocks-variations', + 'title' => __( 'Tainacan Query Loop Variations', 'tainacan' ), ), ) ); @@ -82,6 +86,7 @@ function tainacan_blocks_register_and_enqueue_all_blocks() { if ( is_admin() ) { tainacan_blocks_get_category_icon_script(); tainacan_blocks_get_common_editor_styles(); + tainacan_blocks_get_variations_script(); } // May be needed outside the editor, if server side render is used foreach(TAINACAN_BLOCKS as $block_slug => $block_options) { @@ -212,6 +217,12 @@ function tainacan_blocks_get_plugin_js_settings(){ global $TAINACAN_BASE_URL; global $wp_version; + $Tainacan_Collections = \Tainacan\Repositories\Collections::get_instance(); + $collections = $Tainacan_Collections->fetch( [], 'OBJECT' ); + foreach ( $collections as $col ) { + $cpts[$col->get_db_identifier()] = $col->get_name(); + } + $settings = [ 'wp_version' => $wp_version, 'root' => esc_url_raw( rest_url() ) . 'tainacan/v2', @@ -219,7 +230,8 @@ function tainacan_blocks_get_plugin_js_settings(){ 'base_url' => $TAINACAN_BASE_URL, 'admin_url' => admin_url(), 'site_url' => site_url(), - 'theme_items_list_url' => esc_url_raw( get_site_url() ) . '/' . \Tainacan\Theme_Helper::get_instance()->get_items_list_slug() + 'theme_items_list_url' => esc_url_raw( get_site_url() ) . '/' . \Tainacan\Theme_Helper::get_instance()->get_items_list_slug(), + 'collections_post_types' => $cpts ]; return $settings; @@ -286,3 +298,22 @@ function tainacan_blocks_get_category_icon_script() { $TAINACAN_VERSION ); } + +/** + * Registers the script that inserts the Query Loop Block variations + */ +function tainacan_blocks_get_variations_script() { + global $TAINACAN_BASE_URL; + global $TAINACAN_VERSION; + + wp_enqueue_script( + 'tainacan-blocks-query-variations', + $TAINACAN_BASE_URL . '/assets/js/tainacan_blocks_query_variations.js', + array('wp-blocks', 'wp-components'), + $TAINACAN_VERSION + ); + + $block_settings = tainacan_blocks_get_plugin_js_settings(); + wp_localize_script( 'tainacan-blocks-query-variations', 'tainacan_blocks', $block_settings ); +} + diff --git a/src/views/gutenberg-blocks/js/tainacan-blocks-category-icon.js b/src/views/gutenberg-blocks/js/tainacan-blocks-category-icon.js index 4fcd49f4e..6ae98f543 100644 --- a/src/views/gutenberg-blocks/js/tainacan-blocks-category-icon.js +++ b/src/views/gutenberg-blocks/js/tainacan-blocks-category-icon.js @@ -49,6 +49,8 @@ var g2 = el('g', { transform: 'translate(-85.490815,-209.14412)' }); var svgIcon = el( 'svg', { width: 20, height: 20, viewBox: '0 0 20 20'}, path4, path6, path8, path10, path12, path14, path16, path18, path20, g1, g2); - if (wp.blocks.updateCategory) + if (wp.blocks.updateCategory) { wp.blocks.updateCategory( 'tainacan-blocks', { icon: svgIcon } ); + wp.blocks.updateCategory( 'tainacan-blocks-variations', { icon: svgIcon } ); + } } )(); \ No newline at end of file diff --git a/src/views/gutenberg-blocks/js/tainacan-blocks-query-variations.js b/src/views/gutenberg-blocks/js/tainacan-blocks-query-variations.js new file mode 100644 index 000000000..35b1c49db --- /dev/null +++ b/src/views/gutenberg-blocks/js/tainacan-blocks-query-variations.js @@ -0,0 +1,48 @@ +const { registerBlockVariation } = wp.blocks; +const { __ } = wp.i18n; +import icon from '../blocks/items-list/icon'; + +const POST_TYPES = tainacan_blocks.collections_post_types; + +Object.keys(POST_TYPES).forEach((postType) => { + const postName = POST_TYPES[postType]; + const VARIATION_NAME = 'tainacan-items-' + postType; + + registerBlockVariation( 'core/query', { + name: VARIATION_NAME, + title: postName, + icon: icon, + category: 'tainacan-blocks-variations', + description: __('Displays a list of Tainacan itens', 'tainacan'), + isActive: ( { namespace, query } ) => { + return ( + namespace === VARIATION_NAME + && query.postType === postType + ); + }, + attributes: { + namespace: VARIATION_NAME, + query: { + postType: postType, + perPage: 12, + offset: 0 + }, + align: 'wide', + displayLayout: { + type: 'flex', + columns: 4 + } + }, + allowedControls: [ 'inherit', 'order', 'taxQuery', 'search' ], + innerBlocks: [ + [ + 'core/post-template', + {}, + [ + [ 'core/post-featured-image' ], + [ 'core/post-title' ] + ], + ] + ] + } ); +}); diff --git a/webpack.common.js b/webpack.common.js index 26a3c8ba6..47596f3c2 100644 --- a/webpack.common.js +++ b/webpack.common.js @@ -9,6 +9,7 @@ module.exports = { tainacan_pages_common_scripts: './src/views/tainacan-pages-common-scripts.js', tainacan_blocks_common_scripts: './src/views/gutenberg-blocks/tainacan-blocks-common-scripts.js', tainacan_blocks_category_icon: './src/views/gutenberg-blocks/js/tainacan-blocks-category-icon.js', + tainacan_blocks_query_variations: './src/views/gutenberg-blocks/js/tainacan-blocks-query-variations.js', block_terms_list: './src/views/gutenberg-blocks/blocks/terms-list/index.js', block_items_list: './src/views/gutenberg-blocks/blocks/items-list/index.js',