use new typeahead search using json objects

This commit is contained in:
Uwe Steinmann 2020-12-13 09:10:50 +01:00
parent a0557d4892
commit 582c00ce4e
3 changed files with 66 additions and 17 deletions

View File

@ -96,39 +96,85 @@ $(document).ready( function() {
}
}); /* }}} */
/* The typeahead functionality useѕ the rest api */
/* The typeahead functionality useѕ the modified version of
* bootstrap-typeahead, which is able to set the render function.
* This was needed because the search function return json objects
* for each hit and render could only process strings.
* */
$("#searchfield").typeahead({ /* {{{ */
minLength: 3,
items: 100, /* the query will limit the number of hits */
source: function(query, process) {
var d = new Date();
var pastYear = d.getFullYear() - 1;
d.setFullYear(pastYear);
console.log(d.toISOString().split('T')[0]);
// console.log(d.toISOString().split('T')[0]);
$.get('../restapi/index.php/search', { query: query, limit: 8, mode: 'typeahead' }, function(data) {
// $.get('../out/out.Search.php', { query: query, limit: 8, creationdate: 1, createstart: d.toISOString().split('T')[0], action: 'typeahead' }, function(data) {
process(data);
// $.get('../restapi/index.php/search', { query: query, limit: 8, mode: 'typeahead' }, function(data) {
var data = {
query: query,
limit: 18,
// fullsearch: 1,
// creationdate: 1,
// createstart: d.toISOString().split('T')[0],
action: 'typeahead'
};
/* Return a list of json objects, each containing
* type: type of object (D=doc, F=folder, S=searchterm)
* name: name of object
*/
$.get('../out/out.Search.php', data, function(data) {
process(data);
});
},
/* updater is called when the item in the list is clicked. It is
* actually provided to update the input field, but here we use
* it to set the document location. */
* it to set the document location. The passed value is the string
* set in data-value of the list items. */
updater: function (item) {
document.location = "../out/out.Search.php?query=" + encodeURIComponent(item.substring(1));
console.log(item);
document.location = "../out/out.Search.php?query=" + encodeURIComponent(item);
return item;
},
/* Set a matcher that allows any returned value */
sorter: function(items) {
return items;
},
/* matcher will always return true, because the initial search returns
* matches only
*/
matcher : function (item) {
return true;
},
highlighter : function (item) {
if(item.charAt(0) == 'D')
return '<i class="fa fa-file"></i> ' + item.substring(1).replace(/</g, '&lt;');
else if(item.charAt(0) == 'F')
return '<i class="fa fa-folder-o"></i> ' + item.substring(1).replace(/</g, '&lt;');
if(item.type.charAt(0) == 'D')
return '<i class="fa fa-file"></i> ' + item.name.replace(/</g, '&lt;');
else if(item.type.charAt(0) == 'F')
return '<i class="fa fa-folder-o"></i> ' + item.name.replace(/</g, '&lt;');
else
return '<i class="fa fa-search"></i> ' + item.substring(1).replace(/</g, '&lt;');
}
return '<i class="fa fa-search"></i> ' + item.name.replace(/</g, '&lt;');
},
/* This only works with a modified version of bootstrap typeahead located
* in boostrap-typeahead.js Search for 'render'
* The line
* this.render = this.options.render || this.render
* was added to bootstrap-typeahead.js
* The following function is a copy of the original render function but
* access item.name instead of item
*/
render : function (items) {
var that = this
items = $(items).map(function (i, item) {
i = $(that.options.item).attr('data-value', item.name)
i.find('a').html(that.highlighter(item))
return i[0]
})
items.first().addClass('active')
this.$menu.html(items)
return this
}
}); /* }}} */
/* Document chooser */

View File

@ -177,6 +177,7 @@ background-image: linear-gradient(to bottom, #882222, #111111);;
}
}
echo '<script src="../styles/'.$this->theme.'/bootstrap/js/bootstrap.min.js"></script>'."\n";
echo '<script src="../styles/'.$this->theme.'/bootstrap/js/bootstrap-typeahead.js"></script>'."\n";
echo '<script src="../views/'.$this->theme.'/vendors/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>'."\n";
foreach(array('de', 'es', 'ar', 'el', 'bg', 'ru', 'hr', 'hu', 'ko', 'pl', 'ro', 'sk', 'tr', 'uk', 'ca', 'nl', 'fi', 'cs', 'it', 'fr', 'sv', 'sl', 'pt-BR', 'zh-CN', 'zh-TW') as $lang)
echo '<script src="../views/'.$this->theme.'/vendors/bootstrap-datepicker/locales/bootstrap-datepicker.'.$lang.'.min.js"></script>'."\n";

View File

@ -74,13 +74,15 @@ class SeedDMS_View_Search extends SeedDMS_Bootstrap_Style {
if($entries) {
foreach ($entries as $entry) {
if($entry->isType('document')) {
$recs[] = 'D'.$entry->getName();
// $recs[] = 'D'.$entry->getName();
$recs[] = array('type'=>'D', 'name'=>$entry->getName());
} elseif($entry->isType('folder')) {
$recs[] = 'F'.$entry->getName();
// $recs[] = 'F'.$entry->getName();
$recs[] = array('type'=>'F', 'name'=>$entry->getName());
}
}
}
array_unshift($recs, ' '.$query);
array_unshift($recs, array('type'=>'S', 'name'=>$query));
header('Content-Type: application/json');
echo json_encode($recs);
} /* }}} */