clean input autocomplete engine

This commit is contained in:
2019-09-16 19:10:44 +02:00
parent f90f51840a
commit fa6c82a533
3 changed files with 86 additions and 86 deletions

View File

@@ -7,3 +7,5 @@ Prise de notes pour les cours du Collège des Arts Thérapeutiques Chinois
* [x] Take notes on courses
* [ ] Quick view of muscles / nerves schemas
* [x] Dictionary
* [ ] Progress bar
* [ ] Redo feedback

View File

@@ -55,9 +55,89 @@ function CATC(asGlobals)
this.initMenu = function()
{
//Search
//Search - Input Autocomplete
self.refreshDefs();
self.elem.$Menu.find('#search').addSearch('defs');
self.elem.$Menu.find('#search')
.autocomplete({
autoFocus: true,
delay: 0,
minLength: 2,
classes:{'ui-autocomplete':'list-group'},
source: function(oRequest, fResponse) {
var sTerm = removeDiacritics(oRequest.term);
var rMatcher = new RegExp($.ui.autocomplete.escapeRegex(sTerm), 'i');
var asResults = [];
$.each(self.vars('lov-defs'), function(iDefId, oItem) {
var oTitleMatch = oItem.safe_title.match(rMatcher);
var oLabelMatch = oItem.safe_label.match(rMatcher);
var oMatch = {};
oItem.field = '';
if(oTitleMatch) {
oMatch = oTitleMatch;
oItem.field = 'title';
}
else if(oLabelMatch) {
oMatch = oLabelMatch;
oItem.field = 'label';
}
if(oItem.field != '') {
oItem.index = parseInt(oMatch.index, 10);
oItem.size = oMatch[0].length;
asResults.push(oItem);
}
oItem.id = iDefId;
});
self.elem.$Menu.find('#add_def')
.toggleClass('btn-outline-primary', (asResults.length > 0))
.toggleClass('btn-primary', (asResults.length == 0));
fResponse(asResults);
},
select: function(event, ui) {
return false; //Do not update input value
}
})
.data("ui-autocomplete")._renderItem = function(ul, item) {
var fGetHighLightedContent = function(sContent, iIndex, iSize){
return $('<span>')
.append(sContent.substr(0, iIndex))
.append($('<span>', {'class':'highlight text-secondary'}).text(sContent.substr(iIndex, iSize)))
.append(sContent.substr(iIndex + iSize));
};
var $Title = $('<div>', {'class':'title text-break text-capitalize font-weight-bold text-primary'});
var $Desc = $('<div>', {'class':'desc text-break'});
if(item.field=='title') {
$Title.append(fGetHighLightedContent(item.title, item.index, item.size));
$Desc.text(item.label);
}
else {
$Title.text(item.title);
$Desc.append(fGetHighLightedContent(item.label, item.index, item.size));
}
return $('<li>', {'class':'list-group-item shadow'})
.css('width', $('#search').outerWidth())
.data("item.autocomplete", item)
.append($('<div>', {'class':'row'})
.append($('<div>', {'class':'col'})
.append($Title)
.append($Desc)
)
.append($('<div>', {'class':'col-auto d-flex align-items-center'}).append($('<button>', {'class':'btn btn-outline-secondary'})
.data('id', item.id)
.attr('data-toggle', 'modal')
.attr('data-target', '#add-def')
.appendIcon('edit')
))
)
.appendTo(ul);
};
//Add/Edit Definition Interface
$('#add-def').on('show.bs.modal', function (event) {
var $Button = $(event.relatedTarget);
var iDefId = $Button.data('id');

View File

@@ -72,7 +72,7 @@ var Tools = {
.append(sMsg)
.appendTo($Box)
.slideDown('fast')
.delay(5000)
.delay(3000)
.slideUp('fast', function(){$(this).remove();});
}
};
@@ -168,88 +168,6 @@ function copyArray(asArray)
return asArray.slice(0); //trick to copy array
}
$.prototype.addSearch = function(sSection)
{
$(this)
.autocomplete({
autoFocus: true,
delay: 0,
section:sSection,
minLength: 2,
classes:{'ui-autocomplete':'list-group'},
source: function(oRequest, fResponse) {
var sTerm = removeDiacritics(oRequest.term);
var rMatcher = new RegExp($.ui.autocomplete.escapeRegex(sTerm), 'i');
var asResults = [];
var asData = self.vars('lov-'+this.options.section);
$.each(asData, function(iDefId, oItem) {
var oTitleMatch = oItem.safe_title.match(rMatcher);
var oLabelMatch = oItem.safe_label.match(rMatcher);
if(oTitleMatch) {
oItem.index = parseInt(oTitleMatch.index, 10);
oItem.size = oTitleMatch[0].length;
oItem.field = 'title';
asResults.push(oItem);
}
else if(oLabelMatch) {
oItem.index = parseInt(oLabelMatch.index, 10);
oItem.size = oLabelMatch[0].length;
oItem.field = 'label';
asResults.push(oItem);
}
oItem.id = iDefId;
});
$('#add_def')
.toggleClass('btn-outline-primary', (asResults.length > 0))
.toggleClass('btn-primary', (asResults.length == 0));
fResponse(asResults);
},
select: function(event, ui) {
return false;
}
}
)
.data("ui-autocomplete")._renderItem = function(ul, item) {
var fGetHighLightedContent = function(sContent, iIndex, iSize){
return $('<span>')
.append(sContent.substr(0, iIndex))
.append($('<span>', {'class':'highlight text-secondary'}).text(sContent.substr(iIndex, iSize)))
.append(sContent.substr(iIndex + iSize));
};
var $Title = $('<div>', {'class':'title text-break text-capitalize font-weight-bold text-primary'});
var $Desc = $('<div>', {'class':'desc text-break'});
if(item.field=='title') {
$Title.append(fGetHighLightedContent(item.title, item.index, item.size));
$Desc.text(item.label);
}
else {
$Title.text(item.title);
$Desc.append(fGetHighLightedContent(item.label, item.index, item.size));
}
return $('<li>', {'class':'list-group-item shadow'})
.css('width', $('#search').outerWidth())
.data("item.autocomplete", item)
.append($('<div>', {'class':'row'})
.append($('<div>', {'class':'col'})
.append($Title)
.append($Desc)
)
.append($('<div>', {'class':'col-auto d-flex align-items-center'}).append($('<button>', {'class':'btn btn-outline-secondary'})
.data('id', item.id)
.attr('data-toggle', 'modal')
.attr('data-target', '#add-def')
.appendIcon('edit')
))
)
.appendTo(ul);
};
}
$.prototype.appendIcon = function(sIcon, bFull) {
return $(this).append(Tools.getIcon(sIcon, bFull));
};