caseSensitive option added to autocomplete

This commit is contained in:
Israel 2017-12-02 13:30:44 -05:00
parent 168a65cda4
commit f2492e32dc
3 changed files with 29 additions and 9 deletions

View File

@ -162,6 +162,10 @@ Constructs a new JSONEditor.
Indicate the KeyCodes for trigger confirm completion, by default those keys are: [39, 35, 9] which are the code for [right, end, tab]
- `{boolean} caseSensitive`
Indicate if the autocomplete is going to be strict case-sensitive to match the options.
- `{Function} getOptions (text: string, path: string[], input: string, editor: JSONEditor)`
This function will return your possible options for create the autocomplete selection, you can control dynamically which options you want to display according to the current active editing node.

View File

@ -36,6 +36,7 @@
var options = {
autocomplete: {
confirmKeys: [39, 35, 9, 190], // Confirm Autocomplete Keys: [right, end, tab, '.'] // By default are only [right, end, tab]
caseSensitive: false,
getOptions: function (text, path, input, editor) {
if (!text.startsWith(activationChar) || input !== 'value') return [];

View File

@ -3,6 +3,7 @@
function completely(config) {
config = config || {};
config.confirmKeys = config.confirmKeys || [39, 35, 9] // right, end, tab
config.caseSensitive = config.caseSensitive || false // autocomplete case sensitive
var fontSize = '';
var fontFamily = '';
@ -47,7 +48,10 @@ function completely(config) {
rows = [];
for (var i = 0; i < array.length; i++) {
if (array[i].indexOf(token) !== 0) { continue; }
if ( (config.caseSensitive && array[i].indexOf(token) !== 0)
||(!config.caseSensitive && array[i].toLowerCase().indexOf(token.toLowerCase()) !== 0)) { continue; }
var divRow = document.createElement('div');
divRow.className = 'item';
//divRow.style.color = config.color;
@ -62,7 +66,8 @@ function completely(config) {
if (rows.length === 0) {
return; // nothing to show.
}
if (rows.length === 1 && token === rows[0].__hint) {
if (rows.length === 1 && ( (token.toLowerCase() === rows[0].__hint.toLowerCase() && !config.caseSensitive)
||(token === rows[0].__hint && config.caseSensitive))){
return; // do not show the dropDown if it has only one element which matches what we have just displayed.
}
@ -248,8 +253,10 @@ function completely(config) {
for (var i = 0; i < optionsLength; i++) {
var opt = this.options[i];
if (opt.indexOf(token) === 0) { // <-- how about upperCase vs. lowercase
this.elementHint.innerText = leftSide + opt;
if ( (!config.caseSensitive && opt.toLowerCase().indexOf(token.toLowerCase()) === 0)
|| (config.caseSensitive && opt.indexOf(token) === 0)) { // <-- how about upperCase vs. lowercase
this.elementHint.innerText = leftSide + token + opt.substring(token.length);
this.elementHint.realInnerText = leftSide + opt;
break;
}
}
@ -283,6 +290,10 @@ function completely(config) {
return;
}
var text = this.element.innerText;
text = text.replace('\n', '');
var startFrom = this.startFrom;
if (config.confirmKeys.indexOf(keyCode) >= 0) { // (autocomplete triggered)
if (keyCode == 9) {
if (this.elementHint.innerText.length == 0) {
@ -290,8 +301,8 @@ function completely(config) {
}
}
if (this.elementHint.innerText.length > 0) { // if there is a hint
if (this.element.innerText != this.elementHint.innerText) {
this.element.innerText = this.elementHint.innerText;
if (this.element.innerText != this.elementHint.realInnerText) {
this.element.innerText = this.elementHint.realInnerText;
rs.hideDropDown();
setEndOfContenteditable(this.element);
if (keyCode == 9) {
@ -318,7 +329,7 @@ function completely(config) {
return;
}
this.element.innerText = this.elementHint.innerText;
this.element.innerText = this.elementHint.realInnerText;
rs.hideDropDown();
setEndOfContenteditable(this.element);
e.preventDefault();
@ -328,18 +339,22 @@ function completely(config) {
}
if (keyCode == 40) { // down
var token = text.substring(this.startFrom);
var m = dropDownController.move(+1);
if (m == '') { rs.onArrowDown(); }
this.elementHint.innerText = leftSide + m;
this.elementHint.innerText = leftSide + token + m.substring(token.length);
this.elementHint.realInnerText = leftSide + m;
e.preventDefault();
e.stopPropagation();
return;
}
if (keyCode == 38) { // up
var token = text.substring(this.startFrom);
var m = dropDownController.move(-1);
if (m == '') { rs.onArrowUp(); }
this.elementHint.innerText = leftSide + m;
this.elementHint.innerText = leftSide + token + m.substring(token.length);
this.elementHint.realInnerText = leftSide + m;
e.preventDefault();
e.stopPropagation();
return;