Changeset 40640

Timestamp:

05/11/2017 09:10:54 PM (7 years ago)

Author:

westonruter

Message:

Widgets: Introduce media widgets for images, audio, and video with extensible base for additional media widgets in the future.

The last time a new widget was introduced, Vuvuzelas were a thing, Angry Birds started taking over phones, and WordPress stopped shipping with Kubrick. Seven years and 17 releases without new widgets have been enough, time to spice up your sidebar!

Props westonruter, melchoyce, obenland, timmydcrawford, adamsilverstein, gonom9, wonderboymusic, Fab1en, DrewAPicture, sirbrillig, joen, matias, samikeijonen, afercia, celloexpressions, designsimply, michelleweber, ranh, kjellr, karmatosed.
Fixes #32417, #39993, #39994, #39995.

Location:

trunk

Files:

• src/wp-admin/css/widgets.css (modified) (1 diff)
• src/wp-admin/js/widgets/media-audio-widget.js (added)
• src/wp-admin/js/widgets/media-image-widget.js (added)
• src/wp-admin/js/widgets/media-video-widget.js (added)
• src/wp-admin/js/widgets/media-widgets.js (added)
• src/wp-content/themes/twentyten/style.css (modified) (1 diff)
• src/wp-includes/default-widgets.php (modified) (1 diff)
• src/wp-includes/js/customize-selective-refresh.js (modified) (1 diff)
• src/wp-includes/media-template.php (modified) (3 diffs)
• src/wp-includes/script-loader.php (modified) (1 diff)
• src/wp-includes/widgets.php (modified) (1 diff)
• src/wp-includes/widgets/class-wp-widget-media-audio.php (added)
• src/wp-includes/widgets/class-wp-widget-media-image.php (added)
• src/wp-includes/widgets/class-wp-widget-media-video.php (added)
• src/wp-includes/widgets/class-wp-widget-media.php (added)
• tests/phpunit/data/images/canola-150x150.jpg (added)
• tests/phpunit/data/images/canola-300x225.jpg (added)
• tests/phpunit/data/uploads/small-audio.mp3 (added)
• tests/phpunit/data/uploads/small-video.mp4 (added)
• tests/phpunit/tests/widgets/media-audio-widget.php (added)
• tests/phpunit/tests/widgets/media-image-widget.php (added)
• tests/phpunit/tests/widgets/media-video-widget.php (added)
• tests/phpunit/tests/widgets/media-widget.php (added)
• tests/phpunit/tests/widgets/text-widget.php (modified) (2 diffs)
• tests/qunit/index.html (modified) (4 diffs)
• tests/qunit/wp-admin/js/widgets (added)
• tests/qunit/wp-admin/js/widgets/test-media-image-widget.js (added)
• tests/qunit/wp-admin/js/widgets/test-media-video-widget.js (added)
• tests/qunit/wp-admin/js/widgets/test-media-widgets.js (added)

trunk/src/wp-admin/css/widgets.css

@@ -56 +56 @@
 }
 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 /* Widget Dragging Helpers */
 .widget.ui-draggable-dragging {

trunk/src/wp-content/themes/twentyten/style.css

@@ -842 +842 @@
     text-align: center;
 }
+
+
+
 .wp-caption img {
     margin: 5px 5px 0;

trunk/src/wp-includes/default-widgets.php

@@ -19 +19 @@
 /** WP_Widget_Archives class */
 require_once( ABSPATH . WPINC . '/widgets/class-wp-widget-archives.php' );
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 /** WP_Widget_Meta class */

trunk/src/wp-includes/js/customize-selective-refresh.js

@@ -469 +469 @@
             // Prevent placement container from being being re-triggered as being rendered among nested partials.
             placement.container.data( 'customize-partial-content-rendered', true );
+
+
+
+
+
+
+
+
+
 
             /**

trunk/src/wp-includes/media-template.php

@@ -609 +609 @@
 
         <# if ( 'image' === data.type ) { #>
-            <label class="setting">
+            <label class="setting">
                 <span><?php _e('Alignment'); ?></span>
                 <select class="alignment"
@@ -1088 +1088 @@
                 </div>
 
-                <label class="setting checkbox-setting">
+                <label class="setting checkbox-setting">
                     <input type="checkbox" data-setting="autoplay" />
                     <span><?php _e( 'Autoplay' ); ?></span>
@@ -1177 +1177 @@
                 </div>
 
-                <label class="setting checkbox-setting">
+                <label class="setting checkbox-setting">
                     <input type="checkbox" data-setting="autoplay" />
                     <span><?php _e( 'Autoplay' ); ?></span>

trunk/src/wp-includes/script-loader.php

@@ -603 +603 @@
 
         $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' );

trunk/src/wp-includes/widgets.php

@@ -1437 +1437 @@
  */
 function wp_widgets_init() {
-    if ( !is_blog_installed() )
-        return;
-
-    register_widget('WP_Widget_Pages');
-
-    register_widget('WP_Widget_Calendar');
-
-    register_widget('WP_Widget_Archives');
-
-    if ( get_option( 'link_manager_enabled' ) )
-        register_widget('WP_Widget_Links');
-
-    register_widget('WP_Widget_Meta');
-
-    register_widget('WP_Widget_Search');
-
-    register_widget('WP_Widget_Text');
-
-    register_widget('WP_Widget_Categories');
-
-    register_widget('WP_Widget_Recent_Posts');
-
-    register_widget('WP_Widget_Recent_Comments');
-
-    register_widget('WP_Widget_RSS');
-
-    register_widget('WP_Widget_Tag_Cloud');
-
-    register_widget('WP_Nav_Menu_Widget');
+    if ( ! is_blog_installed() ) {
+        return;
+    }
+
+    register_widget( 'WP_Widget_Pages' );
+
+    register_widget( 'WP_Widget_Calendar' );
+
+    register_widget( 'WP_Widget_Archives' );
+
+    if ( get_option( 'link_manager_enabled' ) ) {
+        register_widget( 'WP_Widget_Links' );
+    }
+
+    register_widget( 'WP_Widget_Media_Audio' );
+
+    register_widget( 'WP_Widget_Media_Image' );
+
+    register_widget( 'WP_Widget_Media_Video' );
+
+    register_widget( 'WP_Widget_Meta' );
+
+    register_widget( 'WP_Widget_Search' );
+
+    register_widget( 'WP_Widget_Text' );
+
+    register_widget( 'WP_Widget_Categories' );
+
+    register_widget( 'WP_Widget_Recent_Posts' );
+
+    register_widget( 'WP_Widget_Recent_Comments' );
+
+    register_widget( 'WP_Widget_RSS' );
+
+    register_widget( 'WP_Widget_Tag_Cloud' );
+
+    register_widget( 'WP_Nav_Menu_Widget' );
 
     /**

trunk/tests/phpunit/tests/widgets/text-widget.php

@@ -179 +179 @@
         $result = $widget->update( $instance, array() );
         $this->assertEquals( $result, $expected );
-
         remove_filter( 'map_meta_cap', array( $this, 'grant_unfiltered_html_cap' ) );
+
         add_filter( 'map_meta_cap', array( $this, 'revoke_unfiltered_html_cap' ), 10, 2 );
         $this->assertFalse( current_user_can( 'unfiltered_html' ) );
@@ -187 +187 @@
         $result = $widget->update( $instance, array() );
         $this->assertEquals( $result, $expected );
-        remove_filter( 'map_meta_cap', array( $this, 'revoke_unfiltered_html_cap' ), 10, 2 );
+        remove_filter( 'map_meta_cap', array( $this, 'revoke_unfiltered_html_cap' ), 10 );
     }
 

trunk/tests/qunit/index.html

@@ -25 +25 @@
         <script src="../../src/wp-includes/js/wp-util.js"></script>
         <script src="../../src/wp-includes/js/wp-a11y.js"></script>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
         <!-- QUnit -->
@@ -65 +92 @@
         <script src="../../src/wp-admin/js/word-count.js"></script>
 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
         <!-- Unit tests -->
         <script src="wp-admin/js/password-strength-meter.js"></script>
@@ -77 +130 @@
         <script src="wp-admin/js/word-count.js"></script>
         <script src="wp-admin/js/nav-menu.js"></script>
+
+
+
 
         <!-- Customizer templates for sections -->
@@ -500 +556 @@
                 </div><!-- #available-widgets -->
             </div><!-- #widgets-left -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
         </div><!-- end widget templates -->
         <script src="../../src/wp-includes/js/tinymce/tinymce.js"></script>