Changeset 31720

Timestamp:

03/11/2015 04:28:21 PM (11 years ago)

Author:

azaozz

Message:

Allow swiping of the admin menu on touch devices.
Props iseulde, ninnypants. See #31187.

File:

• trunk/src/wp-admin/js/common.js (modified) (4 diffs)

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

@@ -713 +713 @@
         window.wpResponsive = {
                 init: function() {
-                        var self = this;
+                        var self = this,
+                                x, y;
 
                         // Modify functionality based on custom activate/deactivate event
@@ -728 +729 @@
                                 event.preventDefault();
                                 $wpwrap.toggleClass( 'wp-responsive-open' );
-                                if ( $wpwrap.hasClass( 'wp-responsive-open' ) ) {
+                                if ( self.isOpen() ) {
                                         $(this).find('a').attr( 'aria-expanded', 'true' );
                                         $( '#adminmenu a:first' ).focus();
@@ -736 +737 @@
                         } );
 
+                        $window.on( 'touchstart.wp-responsive', function( event ) {
+                                var touches = event.originalEvent.touches;
+
+                                if ( 1 !== touches.length ) {
+                                        return;
+                                }
+
+                                x = touches[0].clientX;
+                                y = touches[0].clientY;
+                        } );
+
+                        $window.on( 'touchend.wp-responsive', function( event ) {
+                                var touches = event.originalEvent.changedTouches,
+                                        isOpen = self.isOpen(),
+                                        distanceX;
+
+                                if ( 1 === touches.length && x && y ) {
+                                        if ( ( window.isRtl && isOpen ) || ( ! window.isRtl && ! isOpen ) ) {
+                                                distanceX = touches[0].clientX - x;
+                                        } else {
+                                                distanceX = x - touches[0].clientX;
+                                        }
+
+                                        if ( distanceX > 30 && distanceX > Math.abs( touches[0].clientY - y ) ) {
+                                                $( '#wp-admin-bar-menu-toggle' ).trigger( 'click' );
+                                        }
+                                }
+
+                                x = y = 0;
+                        } );
+
                         // Add menu events
                         $adminmenu.on( 'click.wp-responsive', 'li.wp-has-submenu > a', function( event ) {
@@ -757 +789 @@
                                 }
                         });
+                },
+
+                isOpen: function() {
+                        return $wpwrap.hasClass( 'wp-responsive-open' );
                 },