Changeset 41344

Timestamp:

09/08/2017 10:56:10 AM (9 years ago)

Author:

azaozz

Message:

Text widget: add the Add Media button and enable the wpview plugin to show embedded media previews in the editor.

Props westonruter, azaozz.
See #40854.

Location:

trunk/src/wp-admin/js

Files:

• editor.js (modified) (2 diffs)
• widgets/text-widgets.js (modified) (2 diffs)

trunk/src/wp-admin/js/editor.js

@@ -563 +563 @@
                 if ( settings.tinymce && settings.quicktags ) {
                         var $textarea = $( '#' + id );
+
                         var $wrap = $( '<div>' ).attr( {
                                         'class': 'wp-core-ui wp-editor-wrap tmce-active',
                                         id: 'wp-' + id + '-wrap'
                                 } );
+
                         var $editorContainer = $( '<div class="wp-editor-container">' );
+
                         var $button = $( '<button>' ).attr( {
                                         type: 'button',
@@ -573 +576 @@
                                 } );
 
+                        var $editorTools = $( '<div class="wp-editor-tools">' );
+
+                        if ( settings.mediaButtons ) {
+                                var buttonText = 'Add Media';
+
+                                if ( window._wpMediaViewsL10n && window._wpMediaViewsL10n.addMedia ) {
+                                        buttonText = window._wpMediaViewsL10n.addMedia;
+                                }
+
+                                var $addMediaButton = $( '<button type="button" class="button insert-media add_media">' );
+
+                                $addMediaButton.append( '<span class="wp-media-buttons-icon"></span>' );
+                                $addMediaButton.append( document.createTextNode( ' ' + buttonText ) );
+                                $addMediaButton.data( 'editor', id );
+
+                                $editorTools.append(
+                                        $( '<div class="wp-media-buttons">' )
+                                                .append( $addMediaButton )
+                                );
+                        }
+
                         $wrap.append(
-                                $( '<div class="wp-editor-tools">' )
+                                $editorTools
                                         .append( $( '<div class="wp-editor-tabs">' )
                                                 .append( $button.clone().attr({

trunk/src/wp-admin/js/widgets/text-widgets.js

@@ -231 +231 @@
                                 if ( typeof window.tinymce === 'undefined' ) {
                                         wp.editor.initialize( id, {
-                                                quicktags: true
+                                                quicktags: true,
+                                                mediaButtons: true
                                         });
 
@@ -243 +244 @@
                                 }
 
+                                // Add or enable the `wpview` plugin.
+                                $( document ).one( 'wp-before-tinymce-init.text-widget-init', function( event, init ) {
+                                        // If somebody has removed all plugins, they must have a good reason.
+                                        // Keep it that way.
+                                        if ( ! init.plugins ) {
+                                                return;
+                                        } else if ( ! /\bwpview\b/.test( init.plugins ) ) {
+                                                init.plugins += ',wpview';
+                                        }
+                                } );
+
                                 wp.editor.initialize( id, {
                                         tinymce: {
                                                 wpautop: true
                                         },
-                                        quicktags: true
+                                        quicktags: true,
+                                        mediaButtons: true
                                 });