clean input autocomplete engine
This commit is contained in:
@@ -6,4 +6,6 @@ Prise de notes pour les cours du Collège des Arts Thérapeutiques Chinois
|
||||
* [ ] View docs online: audio, video, word, pdf
|
||||
* [x] Take notes on courses
|
||||
* [ ] Quick view of muscles / nerves schemas
|
||||
* [x] Dictionary
|
||||
* [x] Dictionary
|
||||
* [ ] Progress bar
|
||||
* [ ] Redo feedback
|
||||
@@ -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');
|
||||
|
||||
@@ -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));
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user