Widgets: Extend the Text widget with TinyMCE.

Introduces rich text formatting: bold, italic, lists, links.

Props westonruter, azaozz, timmydcrawford, obenland, melchoyce.
See #35760.
Fixes #35243.

Built from https://develop.svn.wordpress.org/trunk@40631


git-svn-id: http://core.svn.wordpress.org/trunk@40492 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Weston Ruter
2017-05-11 18:55:43 +00:00
parent 8561cb0516
commit 40ebb188cd
10 changed files with 466 additions and 17 deletions

View File

@@ -164,7 +164,11 @@ add_filter( 'list_cats', 'wptexturize' );
add_filter( 'wp_sprintf', 'wp_sprintf_l', 10, 2 );
add_filter( 'widget_text', 'balanceTags' );
add_filter( 'widget_text', 'balanceTags' );
add_filter( 'widget_text_content', 'capital_P_dangit', 11 );
add_filter( 'widget_text_content', 'wptexturize' );
add_filter( 'widget_text_content', 'convert_smilies', 20 );
add_filter( 'widget_text_content', 'wpautop' );
add_filter( 'date_i18n', 'wp_maybe_decline_date' );

View File

@@ -602,6 +602,8 @@ function wp_default_scripts( &$scripts ) {
$scripts->add( 'admin-gallery', "/wp-admin/js/gallery$suffix.js", array( 'jquery-ui-sortable' ) );
$scripts->add( 'admin-widgets', "/wp-admin/js/widgets$suffix.js", array( 'jquery-ui-sortable', 'jquery-ui-draggable', 'jquery-ui-droppable' ), false, 1 );
$scripts->add( 'text-widgets', "/wp-admin/js/widgets/text-widgets$suffix.js", array( 'jquery', 'backbone', 'editor', 'wp-util' ) );
$scripts->add_inline_script( 'text-widgets', 'wp.textWidgets.init();', 'after' );
$scripts->add( 'theme', "/wp-admin/js/theme$suffix.js", array( 'wp-backbone', 'wp-a11y' ), false, 1 );

View File

@@ -4,7 +4,7 @@
*
* @global string $wp_version
*/
$wp_version = '4.8-alpha-40630';
$wp_version = '4.8-alpha-40631';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.

View File

@@ -28,10 +28,30 @@ class WP_Widget_Text extends WP_Widget {
'description' => __( 'Arbitrary text or HTML.' ),
'customize_selective_refresh' => true,
);
$control_ops = array( 'width' => 400, 'height' => 350 );
$control_ops = array(
'width' => 400,
'height' => 350,
);
parent::__construct( 'text', __( 'Text' ), $widget_ops, $control_ops );
}
/**
* Add hooks for enqueueing assets when registering all widget instances of this widget class.
*
* @since 4.8.0
* @access public
*/
public function _register() {
// Note that the widgets component in the customizer will also do the 'admin_print_scripts-widgets.php' action in WP_Customize_Widgets::print_scripts().
add_action( 'admin_print_scripts-widgets.php', array( $this, 'enqueue_admin_scripts' ) );
// Note that the widgets component in the customizer will also do the 'admin_footer-widgets.php' action in WP_Customize_Widgets::print_footer_scripts().
add_action( 'admin_footer-widgets.php', array( $this, 'render_control_template_scripts' ) );
parent::_register();
}
/**
* Outputs the content for the current Text widget instance.
*
@@ -61,11 +81,34 @@ class WP_Widget_Text extends WP_Widget {
*/
$text = apply_filters( 'widget_text', $widget_text, $instance, $this );
if ( isset( $instance['filter'] ) ) {
if ( 'content' === $instance['filter'] ) {
/**
* Filters the content of the Text widget to apply changes expected from the visual (TinyMCE) editor.
*
* By default a subset of the_content filters are applied, including wpautop and wptexturize.
*
* @since 4.8.0
*
* @param string $widget_text The widget content.
* @param array $instance Array of settings for the current widget.
* @param WP_Widget_Text $this Current Text widget instance.
*/
$text = apply_filters( 'widget_text_content', $widget_text, $instance, $this );
} elseif ( $instance['filter'] ) {
$text = wpautop( $text ); // Back-compat for instances prior to 4.8.
}
}
echo $args['before_widget'];
if ( ! empty( $title ) ) {
echo $args['before_title'] . $title . $args['after_title'];
} ?>
<div class="textwidget"><?php echo !empty( $instance['filter'] ) ? wpautop( $text ) : $text; ?></div>
}
?>
<div class="textwidget"><?php echo $text; ?></div>
<?php
echo $args['after_widget'];
}
@@ -89,30 +132,73 @@ class WP_Widget_Text extends WP_Widget {
} else {
$instance['text'] = wp_kses_post( $new_instance['text'] );
}
$instance['filter'] = ! empty( $new_instance['filter'] );
/*
* Re-use legacy 'filter' (wpautop) property to now indicate content filters will always apply.
* Prior to 4.8, this is a boolean value used to indicate whether or not wpautop should be
* applied. By re-using this property, downgrading WordPress from 4.8 to 4.7 will ensure
* that the content for Text widgets created with TinyMCE will continue to get wpautop.
*/
$instance['filter'] = 'content';
return $instance;
}
/**
* Loads the required scripts and styles for the widget control.
*
* @since 4.8.0
* @access public
*/
public function enqueue_admin_scripts() {
wp_enqueue_editor();
wp_enqueue_script( 'text-widgets' );
}
/**
* Outputs the Text widget settings form.
*
* @since 2.8.0
* @since 4.8.0 Form only contains hidden inputs which are synced with JS template.
* @access public
* @see WP_Widget_Visual_Text::render_control_template_scripts()
*
* @param array $instance Current settings.
* @return void
*/
public function form( $instance ) {
$instance = wp_parse_args( (array) $instance, array( 'title' => '', 'text' => '' ) );
$filter = isset( $instance['filter'] ) ? $instance['filter'] : 0;
$title = sanitize_text_field( $instance['title'] );
$instance = wp_parse_args(
(array) $instance,
array(
'title' => '',
'text' => '',
)
);
?>
<p><label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('Title:'); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id('title'); ?>" name="<?php echo $this->get_field_name('title'); ?>" type="text" value="<?php echo esc_attr($title); ?>" /></p>
<input id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" class="title" type="hidden" value="<?php echo esc_attr( $instance['title'] ); ?>">
<input id="<?php echo $this->get_field_id( 'text' ); ?>" name="<?php echo $this->get_field_name( 'text' ); ?>" class="text" type="hidden" value="<?php echo esc_attr( $instance['text'] ); ?>">
<?php
}
<p><label for="<?php echo $this->get_field_id( 'text' ); ?>"><?php _e( 'Content:' ); ?></label>
<textarea class="widefat" rows="16" cols="20" id="<?php echo $this->get_field_id('text'); ?>" name="<?php echo $this->get_field_name('text'); ?>"><?php echo esc_textarea( $instance['text'] ); ?></textarea></p>
<p><input id="<?php echo $this->get_field_id('filter'); ?>" name="<?php echo $this->get_field_name('filter'); ?>" type="checkbox"<?php checked( $filter ); ?> />&nbsp;<label for="<?php echo $this->get_field_id('filter'); ?>"><?php _e('Automatically add paragraphs'); ?></label></p>
/**
* Render form template scripts.
*
* @since 4.8.0
* @access public
*/
public function render_control_template_scripts() {
?>
<script type="text/html" id="tmpl-widget-text-control-fields">
<# var elementIdPrefix = 'el' + String( Math.random() ).replace( /\D/g, '' ) + '_' #>
<p>
<label for="{{ elementIdPrefix }}title"><?php esc_html_e( 'Title:' ); ?></label>
<input id="{{ elementIdPrefix }}title" type="text" class="widefat title">
</p>
<p>
<label for="{{ elementIdPrefix }}text" class="screen-reader-text"><?php esc_html_e( 'Content:' ); ?></label>
<textarea id="{{ elementIdPrefix }}text" class="widefat text" style="height: 200px" rows="16" cols="20"></textarea>
</p>
</script>
<?php
}
}