Ticket #31187: 31187.3.diff

src/wp-admin/js/common.js

@@ -707 +707 @@
 
         window.wpResponsive = {
                 init: function() {
-                        var self = this;
+                        var self = this,
+                        wpTouchMenu = {
+                                started: false,
+                                tracking: false,
+                                startPosition: 0,
+                                open: false,
+                                rtl: ( 'rtl' === document.documentElement.getAttribute( 'dir' ) )
+                        };
 
                         // Modify functionality based on custom activate/deactivate event
                         $document.on( 'wp-responsive-activate.wp-responsive', function() {
@@ -725 +732 @@
                                 if ( $wpwrap.hasClass( 'wp-responsive-open' ) ) {
                                         $(this).find('a').attr( 'aria-expanded', 'true' );
                                         $( '#adminmenu a:first' ).focus();
+                                        wpTouchMenu.open = true;
                                 } else {
                                         $(this).find('a').attr( 'aria-expanded', 'false' );
+                                        wpTouchMenu.open = false;
                                 }
                         } );
 
+                        $( window ).on( 'touchstart.wp-responsive', function( e ) {
+                                var touches = e.originalEvent.touches,
+                                touch,
+                                winWidth = Math.max( window.innerWidth, document.documentElement.clientWidth );
+
+                                // if it's multi touch bail
+                                if ( 1 !== touches.length ) {
+                                        return;
+                                }
+
+                                touch = touches[0];
+
+                                // if the menu is open and we're starting from the
+                                // outside it start closing the menu
+                                if ( wpTouchMenu.open && ! $( e.target ).closest( '#adminmenu' ).length ) {
+                                        wpTouchMenu.started = true;
+                                        wpTouchMenu.startPosition = touch.screenX;
+                                        return;
+                                }
+
+                                // if it's within the left 20% of the screen
+                                // note that it has started
+                                if (
+                                        ( ! wpTouchMenu.rtl && touch.screenX <= ( winWidth * 0.2 ) ) ||
+                                        ( wpTouchMenu.rtl && ( winWidth - ( winWidth * 0.2 ) ) <= touch.screenX )
+                                ) {
+                                        wpTouchMenu.started = true;
+                                        wpTouchMenu.startPosition = touch.screenX;
+                                }
+                        } );
+
+                        $( window ).on( 'touchmove.wp-responsive', function( e ) {
+                                var touches, touch;
+                                // if it didn't qualify for potential menu
+                                // open bail
+                                if ( ! wpTouchMenu.started ) {
+                                        return;
+                                }
+
+                                touches = e.originalEvent.changedTouches;
+
+                                // no multitouch
+                                if ( 1 !== touches.length ) {
+                                        return;
+                                }
+
+                                // stop back action
+                                e.preventDefault();
+
+                                touch = touches[0];
+
+                                // cancel open if we're not going in the right direction
+                                if (
+                                        ( ! wpTouchMenu.rtl && ! wpTouchMenu.open && touch.screenX <= wpTouchMenu.startPosition ) ||
+                                        ( ! wpTouchMenu.rtl && wpTouchMenu.open && wpTouchMenu.startPosition <= touch.screenX ) ||
+                                        ( wpTouchMenu.rtl && ! wpTouchMenu.open && wpTouchMenu.startPosition <= touch.screenX ) ||
+                                        ( wpTouchMenu.rtl && wpTouchMenu.open && touch.screenX <= wpTouchMenu.startPosition )
+                                ) {
+                                        wpTouchMenu.started = false;
+                                        wpTouchMenu.startPosition = 0;
+                                        return;
+                                }
+
+                                wpTouchMenu.tracking = true;
+                        } );
+
+                        $( window ).on( 'touchend.wp-responsive', function( e ) {
+                                var touches = e.originalEvent.changedTouches,
+                                touch,
+                                winWidth = Math.max( window.innerWidth, document.documentElement.clientWidth ),
+                                moved = 0;
+
+                                // only process if we're tracking
+                                if ( ! wpTouchMenu.tracking ) {
+                                        return;
+                                }
+
+                                // no multitouch
+                                if ( 1 !== touches.length ) {
+                                        wpTouchMenu.started = false;
+                                        wpTouchMenu.startPosition = 0;
+                                        wpTouchMenu.tracking = false;
+                                        return;
+                                }
+
+                                touch = touches[0];
+                                // calculate how far we've moved
+                                if ( wpTouchMenu.rtl ) {
+                                        if ( wpTouchMenu.open ) {
+                                                moved = touch.screenX - wpTouchMenu.startPosition;
+                                        } else {
+                                                moved = wpTouchMenu.startPosition - touch.screenX;
+                                        }
+                                } else {
+                                        if ( wpTouchMenu.open ) {
+                                                moved = wpTouchMenu.startPosition - touch.screenX;
+                                        } else {
+                                                moved = touch.screenX - wpTouchMenu.startPosition;
+                                        }
+                                }
+
+                                // if it's 20% or more trigger the menu
+                                if ( ( winWidth * 0.2 ) <= moved ) {
+                                        $( '#wp-admin-bar-menu-toggle' ).trigger( 'click' );
+                                }
+
+                                // reset our values
+                                wpTouchMenu.started = false;
+                                wpTouchMenu.startPosition = 0;
+                                wpTouchMenu.tracking = false;
+                        } );
+
                         // Add menu events
                         $adminmenu.on( 'click.wp-responsive', 'li.wp-has-submenu > a', function( event ) {
                                 if ( ! $adminmenu.data('wp-responsive') ) {