From b58fed39e5769e904f1394277b636597569aa04f Mon Sep 17 00:00:00 2001 From: Javier Villanueva Date: Fri, 15 Feb 2019 16:23:01 +0000 Subject: [PATCH] Blocks: Add a new Tag Cloud block (#7875) --- lib/load.php | 3 + packages/block-library/src/editor.scss | 1 + packages/block-library/src/index.js | 2 + packages/block-library/src/tag-cloud/edit.js | 101 ++++++++++++++++++ .../block-library/src/tag-cloud/editor.scss | 13 +++ packages/block-library/src/tag-cloud/index.js | 32 ++++++ .../block-library/src/tag-cloud/index.php | 71 ++++++++++++ .../fixtures/core__tag-cloud.html | 1 + .../fixtures/core__tag-cloud.json | 13 +++ .../fixtures/core__tag-cloud.parsed.json | 11 ++ .../fixtures/core__tag-cloud.serialized.html | 1 + .../core__tag-cloud__showTagCounts.html | 1 + .../core__tag-cloud__showTagCounts.json | 13 +++ ...core__tag-cloud__showTagCounts.parsed.json | 12 +++ ...__tag-cloud__showTagCounts.serialized.html | 1 + .../full-content/server-registered.json | 2 +- 16 files changed, 277 insertions(+), 1 deletion(-) create mode 100644 packages/block-library/src/tag-cloud/edit.js create mode 100644 packages/block-library/src/tag-cloud/editor.scss create mode 100644 packages/block-library/src/tag-cloud/index.js create mode 100644 packages/block-library/src/tag-cloud/index.php create mode 100644 test/integration/full-content/fixtures/core__tag-cloud.html create mode 100644 test/integration/full-content/fixtures/core__tag-cloud.json create mode 100644 test/integration/full-content/fixtures/core__tag-cloud.parsed.json create mode 100644 test/integration/full-content/fixtures/core__tag-cloud.serialized.html create mode 100644 test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.html create mode 100644 test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.json create mode 100644 test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.parsed.json create mode 100644 test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.serialized.html diff --git a/lib/load.php b/lib/load.php index 54be9e51c49bdf..20276007928865 100644 --- a/lib/load.php +++ b/lib/load.php @@ -52,6 +52,9 @@ if ( ! function_exists( 'render_block_core_shortcode' ) ) { require dirname( __FILE__ ) . '/../packages/block-library/src/shortcode/index.php'; } +if ( ! function_exists( 'render_block_core_tag_cloud' ) ) { + require dirname( __FILE__ ) . '/../packages/block-library/src/tag-cloud/index.php'; +} if ( ! function_exists( 'render_block_core_search' ) ) { require dirname( __FILE__ ) . '/../packages/block-library/src/search/index.php'; } diff --git a/packages/block-library/src/editor.scss b/packages/block-library/src/editor.scss index b5778d5b472ff9..517218be5e7154 100644 --- a/packages/block-library/src/editor.scss +++ b/packages/block-library/src/editor.scss @@ -28,6 +28,7 @@ @import "./spacer/editor.scss"; @import "./subhead/editor.scss"; @import "./table/editor.scss"; +@import "./tag-cloud/editor.scss"; @import "./text-columns/editor.scss"; @import "./verse/editor.scss"; @import "./video/editor.scss"; diff --git a/packages/block-library/src/index.js b/packages/block-library/src/index.js index 1439edcc350ecc..4b15aac33c4a4f 100644 --- a/packages/block-library/src/index.js +++ b/packages/block-library/src/index.js @@ -50,6 +50,7 @@ import * as template from './template'; import * as textColumns from './text-columns'; import * as verse from './verse'; import * as video from './video'; +import * as tagCloud from './tag-cloud'; import * as classic from './classic'; @@ -96,6 +97,7 @@ export const registerCoreBlocks = () => { spacer, subhead, table, + tagCloud, template, textColumns, verse, diff --git a/packages/block-library/src/tag-cloud/edit.js b/packages/block-library/src/tag-cloud/edit.js new file mode 100644 index 00000000000000..2fb7179e2ca221 --- /dev/null +++ b/packages/block-library/src/tag-cloud/edit.js @@ -0,0 +1,101 @@ +/** + * External dependencies + */ +import { map, filter } from 'lodash'; + +/** + * WordPress dependencies + */ +import { Component, Fragment } from '@wordpress/element'; +import { + PanelBody, + ToggleControl, + SelectControl, + ServerSideRender, +} from '@wordpress/components'; +import { withSelect } from '@wordpress/data'; +import { __ } from '@wordpress/i18n'; +import { InspectorControls } from '@wordpress/editor'; + +class TagCloudEdit extends Component { + constructor() { + super( ...arguments ); + + this.state = { + editing: ! this.props.attributes.taxonomy, + }; + + this.setTaxonomy = this.setTaxonomy.bind( this ); + this.toggleShowTagCounts = this.toggleShowTagCounts.bind( this ); + } + + getTaxonomyOptions() { + const taxonomies = filter( this.props.taxonomies, 'show_cloud' ); + const selectOption = { + label: __( '- Select -' ), + value: '', + }; + const taxonomyOptions = map( taxonomies, ( taxonomy ) => { + return { + value: taxonomy.slug, + label: taxonomy.name, + }; + } ); + + return [ selectOption, ...taxonomyOptions ]; + } + + setTaxonomy( taxonomy ) { + const { setAttributes } = this.props; + + setAttributes( { taxonomy } ); + } + + toggleShowTagCounts() { + const { attributes, setAttributes } = this.props; + const { showTagCounts } = attributes; + + setAttributes( { showTagCounts: ! showTagCounts } ); + } + + render() { + const { attributes } = this.props; + const { taxonomy, showTagCounts } = attributes; + const taxonomyOptions = this.getTaxonomyOptions(); + + const inspectorControls = ( + + + + + + + ); + + return ( + + { inspectorControls } + + + ); + } +} + +export default withSelect( ( select ) => { + return { + taxonomies: select( 'core' ).getTaxonomies(), + }; +} )( TagCloudEdit ); diff --git a/packages/block-library/src/tag-cloud/editor.scss b/packages/block-library/src/tag-cloud/editor.scss new file mode 100644 index 00000000000000..c70f1522860806 --- /dev/null +++ b/packages/block-library/src/tag-cloud/editor.scss @@ -0,0 +1,13 @@ +.block-editor .wp-block-tag-cloud { + a { + display: inline-block; + margin-right: 5px; + } + + span { + display: inline-block; + margin-left: 5px; + color: $dark-gray-100; + text-decoration: none; + } +} diff --git a/packages/block-library/src/tag-cloud/index.js b/packages/block-library/src/tag-cloud/index.js new file mode 100644 index 00000000000000..cc785fdb3167a4 --- /dev/null +++ b/packages/block-library/src/tag-cloud/index.js @@ -0,0 +1,32 @@ +/** + * WordPress dependencies + */ +import { __ } from '@wordpress/i18n'; + +/** + * Internal dependencies + */ +import edit from './edit'; + +export const name = 'core/tag-cloud'; + +export const settings = { + title: __( 'Tag Cloud' ), + + description: __( 'A cloud of your most used tags.' ), + + icon: 'tag', + + category: 'widgets', + + supports: { + html: false, + align: true, + }, + + edit, + + save() { + return null; + }, +}; diff --git a/packages/block-library/src/tag-cloud/index.php b/packages/block-library/src/tag-cloud/index.php new file mode 100644 index 00000000000000..c60f8a1dd6f541 --- /dev/null +++ b/packages/block-library/src/tag-cloud/index.php @@ -0,0 +1,71 @@ + false, + 'taxonomy' => $attributes['taxonomy'], + 'show_count' => $attributes['showTagCounts'], + ); + + $tag_cloud = wp_tag_cloud( $args ); + + if ( ! $tag_cloud ) { + $tag_cloud = esc_html( __( 'No terms to show.' ) ); + } + + return sprintf( + '

%2$s

', + esc_attr( $class ), + $tag_cloud + ); +} + +/** + * Registers the `core/tag-cloud` block on server. + */ +function register_block_core_tag_cloud() { + register_block_type( + 'core/tag-cloud', + array( + 'attributes' => array( + 'taxonomy' => array( + 'type' => 'string', + 'default' => 'post_tag', + ), + 'className' => array( + 'type' => 'string', + ), + 'showTagCounts' => array( + 'type' => 'boolean', + 'default' => false, + ), + 'align' => array( + 'type' => 'string', + ), + ), + 'render_callback' => 'render_block_core_tag_cloud', + ) + ); +} + +add_action( 'init', 'register_block_core_tag_cloud' ); diff --git a/test/integration/full-content/fixtures/core__tag-cloud.html b/test/integration/full-content/fixtures/core__tag-cloud.html new file mode 100644 index 00000000000000..05ef749fc0b354 --- /dev/null +++ b/test/integration/full-content/fixtures/core__tag-cloud.html @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/test/integration/full-content/fixtures/core__tag-cloud.json b/test/integration/full-content/fixtures/core__tag-cloud.json new file mode 100644 index 00000000000000..da9762c711adb4 --- /dev/null +++ b/test/integration/full-content/fixtures/core__tag-cloud.json @@ -0,0 +1,13 @@ +[ + { + "clientId": "_clientId_0", + "name": "core/tag-cloud", + "isValid": true, + "attributes": { + "taxonomy": "category", + "showTagCounts": false + }, + "innerBlocks": [], + "originalContent": "" + } +] diff --git a/test/integration/full-content/fixtures/core__tag-cloud.parsed.json b/test/integration/full-content/fixtures/core__tag-cloud.parsed.json new file mode 100644 index 00000000000000..cb601766c2b8e1 --- /dev/null +++ b/test/integration/full-content/fixtures/core__tag-cloud.parsed.json @@ -0,0 +1,11 @@ +[ + { + "blockName": "core/tag-cloud", + "attrs": { + "taxonomy": "category" + }, + "innerBlocks": [], + "innerHTML": "", + "innerContent": [] + } +] diff --git a/test/integration/full-content/fixtures/core__tag-cloud.serialized.html b/test/integration/full-content/fixtures/core__tag-cloud.serialized.html new file mode 100644 index 00000000000000..d342963579e299 --- /dev/null +++ b/test/integration/full-content/fixtures/core__tag-cloud.serialized.html @@ -0,0 +1 @@ + diff --git a/test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.html b/test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.html new file mode 100644 index 00000000000000..3f22f21fc6cfe9 --- /dev/null +++ b/test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.html @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.json b/test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.json new file mode 100644 index 00000000000000..5946f7330f8b55 --- /dev/null +++ b/test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.json @@ -0,0 +1,13 @@ +[ + { + "clientId": "_clientId_0", + "name": "core/tag-cloud", + "isValid": true, + "attributes": { + "taxonomy": "category", + "showTagCounts": true + }, + "innerBlocks": [], + "originalContent": "" + } +] diff --git a/test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.parsed.json b/test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.parsed.json new file mode 100644 index 00000000000000..d9f82c35762450 --- /dev/null +++ b/test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.parsed.json @@ -0,0 +1,12 @@ +[ + { + "blockName": "core/tag-cloud", + "attrs": { + "taxonomy": "category", + "showTagCounts": true + }, + "innerBlocks": [], + "innerHTML": "", + "innerContent": [] + } +] diff --git a/test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.serialized.html b/test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.serialized.html new file mode 100644 index 00000000000000..9711e8c6ad6c0b --- /dev/null +++ b/test/integration/full-content/fixtures/core__tag-cloud__showTagCounts.serialized.html @@ -0,0 +1 @@ + diff --git a/test/integration/full-content/server-registered.json b/test/integration/full-content/server-registered.json index 65eb48d6d53f28..080865f39bb108 100644 --- a/test/integration/full-content/server-registered.json +++ b/test/integration/full-content/server-registered.json @@ -1 +1 @@ -{"core\/block":{"attributes":{"ref":{"type":"number"}}},"core\/latest-comments":{"attributes":{"className":{"type":"string"},"commentsToShow":{"type":"number","default":5,"minimum":1,"maximum":100},"displayAvatar":{"type":"boolean","default":true},"displayDate":{"type":"boolean","default":true},"displayExcerpt":{"type":"boolean","default":true},"align":{"type":"string","enum":["center","left","right","wide","full",""]}}},"core\/archives":{"attributes":{"align":{"type":"string"},"className":{"type":"string"},"displayAsDropdown":{"type":"boolean","default":false},"showPostCounts":{"type":"boolean","default":false}}},"core\/latest-posts":{"attributes":{"categories":{"type":"string"},"className":{"type":"string"},"postsToShow":{"type":"number","default":5},"displayPostDate":{"type":"boolean","default":false},"postLayout":{"type":"string","default":"list"},"columns":{"type":"number","default":3},"align":{"type":"string"},"order":{"type":"string","default":"desc"},"orderBy":{"type":"string","default":"date"}}}} \ No newline at end of file +{"core\/block":{"attributes":{"ref":{"type":"number"}}},"core\/latest-comments":{"attributes":{"className":{"type":"string"},"commentsToShow":{"type":"number","default":5,"minimum":1,"maximum":100},"displayAvatar":{"type":"boolean","default":true},"displayDate":{"type":"boolean","default":true},"displayExcerpt":{"type":"boolean","default":true},"align":{"type":"string","enum":["center","left","right","wide","full",""]}}},"core\/archives":{"attributes":{"align":{"type":"string"},"className":{"type":"string"},"displayAsDropdown":{"type":"boolean","default":false},"showPostCounts":{"type":"boolean","default":false}}},"core\/latest-posts":{"attributes":{"categories":{"type":"string"},"className":{"type":"string"},"postsToShow":{"type":"number","default":5},"displayPostDate":{"type":"boolean","default":false},"postLayout":{"type":"string","default":"list"},"columns":{"type":"number","default":3},"align":{"type":"string"},"order":{"type":"string","default":"desc"},"orderBy":{"type":"string","default":"date"}}},"core\/tag-cloud":{"attributes":{"taxonomy":{"type":"string","default":"tags"},"className":{"type":"string"},"showTagCounts":{"type":"boolean","default":false},"align":{"type":"string"}}}} \ No newline at end of file