Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #17928 from woocommerce/fix/selectwoofocus 

Fix some focus issues in selectWoo
This commit is contained in:
Mike Jolley 2017-12-04 13:55:17 +00:00 committed by GitHub
parent 4b029f7252 9d2b76da2b
commit 050ba6642f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 74 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
assets/js/selectWoo/selectWoo.full.js
View File

@ -1475,8 +1475,14 @@ S2.define('select2/selection/base',[
}
var $element = $this.data('element');
$element.select2('close');
// Remove any focus when dropdown is closed by clicking outside the select area.
// Timeout of 1 required for close to finish wrapping up.
setTimeout(function(){
$this.find('*:focus').blur();
$target.focus();
}, 1);
});
});
};
@ -1675,6 +1681,11 @@ S2.define('select2/selection/multiple',[
container.open();
}
});
// Focus on the search field when the container is focused instead of the main container.
container.on( 'focus', function(){
self.focusOnSearch();
});
};
MultipleSelection.prototype.clear = function () {
@ -1700,8 +1711,25 @@ S2.define('select2/selection/multiple',[
return $container;
};
MultipleSelection.prototype.update = function (data) {
/**
* Focus on the search field instead of the main multiselect container.
*/
MultipleSelection.prototype.focusOnSearch = function() {
var self = this;
if ('undefined' !== typeof self.$search) {
// Needs 1 ms delay because of other 1 ms setTimeouts when rendering.
setTimeout(function(){
// Prevent the dropdown opening again when focused from this.
// This gets reset automatically when focus is triggered.
self._keyUpPrevented = true;
self.$search.focus();
}, 1);
}
}
MultipleSelection.prototype.update = function (data) {
this.clear();
if (data.length === 0) {
@ -1727,14 +1755,6 @@ S2.define('select2/selection/multiple',[
var $rendered = this.$selection.find('.select2-selection__rendered');
Utils.appendMany($rendered, $selections);
// Return cursor to search field after updating.
// Needs 1 ms delay because of other 1 ms setTimeouts when rendering.
if ('undefined' !== typeof this.$search) {
setTimeout(function(){
self.$search.focus();
}, 1);
}
};
return MultipleSelection;
@ -1980,6 +2000,9 @@ S2.define('select2/selection/search',[
evt.preventDefault();
}
} else if (evt.which === KEYS.ENTER) {
container.open();
evt.preventDefault();
}
});
@ -5480,18 +5503,9 @@ S2.define('select2/core',[
self.focusOnActiveElement();
}, 1000);
}
// If focus is in the search field, select the current active element on Enter key.
$searchField.on('keydown', function (evt) {
if (evt.which === KEYS.ENTER) {
self.trigger('results:select', {});
evt.preventDefault();
}
});
} else if (self.hasFocus()) {
if (key === KEYS.ENTER || key === KEYS.SPACE ||
(key === KEYS.DOWN && evt.altKey)) {
key === KEYS.DOWN) {
self.open();
evt.preventDefault();
}
@ -5501,7 +5515,7 @@ S2.define('select2/core',[
Select2.prototype.focusOnActiveElement = function () {
// Don't mess with the focus on touchscreens because it causes havoc with on-screen keyboards.
if (! Utils.isTouchscreen()) {
if (this.isOpen() && ! Utils.isTouchscreen()) {
this.$results.find('li.select2-results__option--highlighted').focus();
}
};

2
assets/js/selectWoo/selectWoo.full.min.js vendored
View File

File diff suppressed because one or more lines are too long

56
assets/js/selectWoo/selectWoo.js
View File

@ -1475,8 +1475,14 @@ S2.define('select2/selection/base',[
}
var $element = $this.data('element');
$element.select2('close');
// Remove any focus when dropdown is closed by clicking outside the select area.
// Timeout of 1 required for close to finish wrapping up.
setTimeout(function(){
$this.find('*:focus').blur();
$target.focus();
}, 1);
});
});
};
@ -1675,6 +1681,11 @@ S2.define('select2/selection/multiple',[
container.open();
}
});
// Focus on the search field when the container is focused instead of the main container.
container.on( 'focus', function(){
self.focusOnSearch();
});
};
MultipleSelection.prototype.clear = function () {
@ -1700,8 +1711,25 @@ S2.define('select2/selection/multiple',[
return $container;
};
MultipleSelection.prototype.update = function (data) {
/**
* Focus on the search field instead of the main multiselect container.
*/
MultipleSelection.prototype.focusOnSearch = function() {
var self = this;
if ('undefined' !== typeof self.$search) {
// Needs 1 ms delay because of other 1 ms setTimeouts when rendering.
setTimeout(function(){
// Prevent the dropdown opening again when focused from this.
// This gets reset automatically when focus is triggered.
self._keyUpPrevented = true;
self.$search.focus();
}, 1);
}
}
MultipleSelection.prototype.update = function (data) {
this.clear();
if (data.length === 0) {
@ -1727,14 +1755,6 @@ S2.define('select2/selection/multiple',[
var $rendered = this.$selection.find('.select2-selection__rendered');
Utils.appendMany($rendered, $selections);
// Return cursor to search field after updating.
// Needs 1 ms delay because of other 1 ms setTimeouts when rendering.
if ('undefined' !== typeof this.$search) {
setTimeout(function(){
self.$search.focus();
}, 1);
}
};
return MultipleSelection;
@ -1980,6 +2000,9 @@ S2.define('select2/selection/search',[
evt.preventDefault();
}
} else if (evt.which === KEYS.ENTER) {
container.open();
evt.preventDefault();
}
});
@ -5480,18 +5503,9 @@ S2.define('select2/core',[
self.focusOnActiveElement();
}, 1000);
}
// If focus is in the search field, select the current active element on Enter key.
$searchField.on('keydown', function (evt) {
if (evt.which === KEYS.ENTER) {
self.trigger('results:select', {});
evt.preventDefault();
}
});
} else if (self.hasFocus()) {
if (key === KEYS.ENTER || key === KEYS.SPACE ||
(key === KEYS.DOWN && evt.altKey)) {
key === KEYS.DOWN) {
self.open();
evt.preventDefault();
}
@ -5501,7 +5515,7 @@ S2.define('select2/core',[
Select2.prototype.focusOnActiveElement = function () {
// Don't mess with the focus on touchscreens because it causes havoc with on-screen keyboards.
if (! Utils.isTouchscreen()) {
if (this.isOpen() && ! Utils.isTouchscreen()) {
this.$results.find('li.select2-results__option--highlighted').focus();
}
};

2
assets/js/selectWoo/selectWoo.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
includes/admin/class-wc-admin-assets.php
View File

@ -111,7 +111,7 @@ class WC_Admin_Assets {
wp_register_script( 'wc-shipping-classes', WC()->plugin_url() . '/assets/js/admin/wc-shipping-classes' . $suffix . '.js', array( 'jquery', 'wp-util', 'underscore', 'backbone' ), WC_VERSION );
wp_register_script( 'wc-clipboard', WC()->plugin_url() . '/assets/js/admin/wc-clipboard' . $suffix . '.js', array( 'jquery' ), WC_VERSION );
wp_register_script( 'select2', WC()->plugin_url() . '/assets/js/select2/select2.full' . $suffix . '.js', array( 'jquery' ), '4.0.3' );
wp_register_script( 'selectWoo', WC()->plugin_url() . '/assets/js/selectWoo/selectWoo.full' . $suffix . '.js', array( 'jquery' ), '1.0.1' );
wp_register_script( 'selectWoo', WC()->plugin_url() . '/assets/js/selectWoo/selectWoo.full' . $suffix . '.js', array( 'jquery' ), '1.0.2' );
wp_register_script( 'wc-enhanced-select', WC()->plugin_url() . '/assets/js/admin/wc-enhanced-select' . $suffix . '.js', array( 'jquery', 'selectWoo' ), WC_VERSION );
wp_localize_script( 'wc-enhanced-select', 'wc_enhanced_select_params', array(
'i18n_no_matches' => _x( 'No matches found', 'enhanced select', 'woocommerce' ),

2
includes/class-wc-frontend-scripts.php
View File

@ -220,7 +220,7 @@ class WC_Frontend_Scripts {
'selectWoo' => array(
'src' => self::get_asset_url( 'assets/js/selectWoo/selectWoo.full' . $suffix . '.js' ),
'deps' => array( 'jquery' ),
'version' => '1.0.1',
'version' => '1.0.2',
),
'wc-address-i18n' => array(
'src' => self::get_asset_url( 'assets/js/frontend/address-i18n' . $suffix . '.js' ),