From b4914249ee389a733e7dcfd2df20708ab3215827 Mon Sep 17 00:00:00 2001
From: zeripath <art27@cantab.net>
Date: Sun, 2 Feb 2020 22:28:00 +0000
Subject: [PATCH] Update aria-fixed semantic-dropdown to fomantic master
(#10096)
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
---
web_src/js/semanticDropdown.js | 81 ++++++++++++++++------------------
1 file changed, 38 insertions(+), 43 deletions(-)
diff --git a/web_src/js/semanticDropdown.js b/web_src/js/semanticDropdown.js
index 14dcf63a81..c9144adf53 100644
--- a/web_src/js/semanticDropdown.js
+++ b/web_src/js/semanticDropdown.js
@@ -1,6 +1,3 @@
-/* This is a patched version of semantic.dropdown which includes a11y changes, see
- https://github.com/go-gitea/gitea/pull/8638#issuecomment-549175290 */
-
/*!
* # Fomantic-UI - Dropdown
* http://github.com/fomantic/Fomantic-UI/
@@ -41,6 +38,10 @@ $.fn.dropdown = function(parameters) {
moduleSelector = $allModules.selector || '',
hasTouch = ('ontouchstart' in document.documentElement),
+ clickEvent = hasTouch
+ ? 'touchstart'
+ : 'click',
+
time = new Date().getTime(),
performance = [],
@@ -663,27 +664,10 @@ $.fn.dropdown = function(parameters) {
bind: {
events: function() {
- if(hasTouch) {
- module.bind.touchEvents();
- }
module.bind.keyboardEvents();
module.bind.inputEvents();
module.bind.mouseEvents();
},
- touchEvents: function() {
- module.debug('Touch device detected binding additional touch events');
- if( module.is.searchSelection() ) {
- // do nothing special yet
- }
- else if( module.is.single() ) {
- $module
- .on('touchstart' + eventNamespace, module.event.test.toggle)
- ;
- }
- $menu
- .on('touchstart' + eventNamespace, selector.item, module.event.item.mouseenter)
- ;
- },
keyboardEvents: function() {
module.verbose('Binding keyboard events');
$module
@@ -710,8 +694,8 @@ $.fn.dropdown = function(parameters) {
module.verbose('Binding mouse events');
if(module.is.multiple()) {
$module
- .on('click' + eventNamespace, selector.label, module.event.label.click)
- .on('click' + eventNamespace, selector.remove, module.event.remove.click)
+ .on(clickEvent + eventNamespace, selector.label, module.event.label.click)
+ .on(clickEvent + eventNamespace, selector.remove, module.event.remove.click)
;
}
if( module.is.searchSelection() ) {
@@ -720,24 +704,24 @@ $.fn.dropdown = function(parameters) {
.on('mouseup' + eventNamespace, module.event.mouseup)
.on('mousedown' + eventNamespace, selector.menu, module.event.menu.mousedown)
.on('mouseup' + eventNamespace, selector.menu, module.event.menu.mouseup)
- .on('click' + eventNamespace, selector.icon, module.event.icon.click)
- .on('click' + eventNamespace, selector.clearIcon, module.event.clearIcon.click)
+ .on(clickEvent + eventNamespace, selector.icon, module.event.icon.click)
+ .on(clickEvent + eventNamespace, selector.clearIcon, module.event.clearIcon.click)
.on('focus' + eventNamespace, selector.search, module.event.search.focus)
- .on('click' + eventNamespace, selector.search, module.event.search.focus)
+ .on(clickEvent + eventNamespace, selector.search, module.event.search.focus)
.on('blur' + eventNamespace, selector.search, module.event.search.blur)
- .on('click' + eventNamespace, selector.text, module.event.text.focus)
+ .on(clickEvent + eventNamespace, selector.text, module.event.text.focus)
;
if(module.is.multiple()) {
$module
- .on('click' + eventNamespace, module.event.click)
+ .on(clickEvent + eventNamespace, module.event.click)
;
}
}
else {
if(settings.on == 'click') {
$module
- .on('click' + eventNamespace, selector.icon, module.event.icon.click)
- .on('click' + eventNamespace, module.event.test.toggle)
+ .on(clickEvent + eventNamespace, selector.icon, module.event.icon.click)
+ .on(clickEvent + eventNamespace, module.event.test.toggle)
;
}
else if(settings.on == 'hover') {
@@ -755,7 +739,7 @@ $.fn.dropdown = function(parameters) {
.on('mousedown' + eventNamespace, module.event.mousedown)
.on('mouseup' + eventNamespace, module.event.mouseup)
.on('focus' + eventNamespace, module.event.focus)
- .on('click' + eventNamespace, selector.clearIcon, module.event.clearIcon.click)
+ .on(clickEvent + eventNamespace, selector.clearIcon, module.event.clearIcon.click)
;
if(module.has.menuSearch() ) {
$module
@@ -769,7 +753,7 @@ $.fn.dropdown = function(parameters) {
}
}
$menu
- .on('mouseenter' + eventNamespace, selector.item, module.event.item.mouseenter)
+ .on((hasTouch ? 'touchstart' : 'mouseenter') + eventNamespace, selector.item, module.event.item.mouseenter)
.on('mouseleave' + eventNamespace, selector.item, module.event.item.mouseleave)
.on('click' + eventNamespace, selector.item, module.event.item.click)
;
@@ -783,7 +767,7 @@ $.fn.dropdown = function(parameters) {
;
}
$document
- .on('click' + elementNamespace, module.event.test.hide)
+ .on(clickEvent + elementNamespace, module.event.test.hide)
;
}
},
@@ -798,7 +782,7 @@ $.fn.dropdown = function(parameters) {
;
}
$document
- .off('click' + elementNamespace)
+ .off(clickEvent + elementNamespace)
;
}
},
@@ -946,6 +930,10 @@ $.fn.dropdown = function(parameters) {
text,
value
;
+ if($choice.hasClass(className.unfilterable)) {
+ results.push(this);
+ return true;
+ }
if(settings.match === 'both' || settings.match === 'text') {
text = module.remove.diacritics(String(module.get.choiceText($choice, false)));
if(text.search(beginsWithRegExp) !== -1) {
@@ -1084,6 +1072,7 @@ $.fn.dropdown = function(parameters) {
if(settings.allowAdditions || (hasSelected && !module.is.multiple())) {
module.debug('Forcing partial selection to selected item', $selectedItem);
$selectedItem[0].click();
+ return;
}
else {
module.remove.searchTerm();
@@ -1115,7 +1104,7 @@ $.fn.dropdown = function(parameters) {
var
value = settings.templates.deQuote(item[fields.value]),
name = settings.templates.escape(
- item[fields.name] || item[fields.value],
+ item[fields.name] || '',
settings.preserveHTML
)
;
@@ -2077,6 +2066,9 @@ $.fn.dropdown = function(parameters) {
value = ( $option.attr('value') !== undefined )
? $option.attr('value')
: name,
+ text = ( $option.data(metadata.text) !== undefined )
+ ? $option.data(metadata.text)
+ : name,
group = $option.parent('optgroup')
;
if(settings.placeholder === 'auto' && value === '') {
@@ -2094,6 +2086,7 @@ $.fn.dropdown = function(parameters) {
select.values.push({
name : name,
value : value,
+ text : text,
disabled : disabled
});
}
@@ -2182,7 +2175,7 @@ $.fn.dropdown = function(parameters) {
return;
}
if(isMultiple) {
- if($.inArray( String(optionValue), value) !== -1) {
+ if($.inArray(module.escape.htmlEntities(String(optionValue)), value) !== -1) {
$selectedItem = ($selectedItem)
? $selectedItem.add($choice)
: $choice
@@ -2201,7 +2194,7 @@ $.fn.dropdown = function(parameters) {
optionValue = optionValue.toLowerCase();
value = value.toLowerCase();
}
- if( String(optionValue) == String(value)) {
+ if(module.escape.htmlEntities(String(optionValue)) === module.escape.htmlEntities(String(value))) {
module.verbose('Found select item by value', optionValue, value);
$selectedItem = $choice;
return true;
@@ -3175,6 +3168,7 @@ $.fn.dropdown = function(parameters) {
values = module.get.values(),
newValue
;
+ removedValue = module.escape.htmlEntities(removedValue);
if( module.has.selectInput() ) {
module.verbose('Input is <select> removing selected option', removedValue);
newValue = module.remove.arrayValue(removedValue, values);
@@ -3764,10 +3758,9 @@ $.fn.dropdown = function(parameters) {
},
htmlEntities: function(string) {
var
- badChars = /[&<>"'`]/g,
+ badChars = /[<>"'`]/g,
shouldEscape = /[&<>"'`]/,
escape = {
- "&": "&",
"<": "<",
">": ">",
'"': """,
@@ -3779,6 +3772,7 @@ $.fn.dropdown = function(parameters) {
}
;
if(shouldEscape.test(string)) {
+ string = string.replace(/&(?![a-z0-9#]{1,6};)/, "&");
return string.replace(badChars, escapedChar);
}
return string;
@@ -4175,7 +4169,8 @@ $.fn.dropdown.settings = {
delete : 'delete',
header : 'header',
divider : 'divider',
- groupIcon : ''
+ groupIcon : '',
+ unfilterable : 'unfilterable'
}
};
@@ -4190,10 +4185,9 @@ $.fn.dropdown.settings.templates = {
return string;
}
var
- badChars = /[&<>"'`]/g,
+ badChars = /[<>"'`]/g,
shouldEscape = /[&<>"'`]/,
escape = {
- "&": "&",
"<": "<",
">": ">",
'"': """,
@@ -4205,6 +4199,7 @@ $.fn.dropdown.settings.templates = {
}
;
if(shouldEscape.test(string)) {
+ string = string.replace(/&(?![a-z0-9#]{1,6};)/, "&");
return string.replace(badChars, escapedChar);
}
return string;
@@ -4260,10 +4255,10 @@ $.fn.dropdown.settings.templates = {
if(option[fields.icon]) {
html += '<i class="'+deQuote(option[fields.icon])+' '+(option[fields.iconClass] ? deQuote(option[fields.iconClass]) : className.icon)+'"></i>';
}
- html += escape(option[fields.name] || option[fields.value],preserveHTML);
+ html += escape(option[fields.name] || '', preserveHTML);
html += '</div>';
} else if (itemType === 'header') {
- var groupName = escape(option[fields.name],preserveHTML),
+ var groupName = escape(option[fields.name] || '', preserveHTML),
groupIcon = option[fields.icon] ? deQuote(option[fields.icon]) : className.groupIcon
;
if(groupName !== '' || groupIcon !== '') {