searchengines-web/MeiliSearch
searchengines-web/MeiliSearch
1
0
Fork 0
mirror of https://github.com/meilisearch/MeiliSearch synced 2024-11-26 14:54:27 +01:00
Code Issues Releases Wiki Activity

Make the front-end to throttle the request by 100ms

Browse Source
This commit is contained in:
Kerollmops 2020-08-31 13:34:35 +02:00
parent 4afc4d0751
commit 220ba0785c
No known key found for this signature in database
GPG Key ID: 92ADA4E935E71FA4
1 changed files with 51 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

93
public/script.js
View File

@ -1,59 +1,68 @@
var request = null;
var timeoutID = null;
$('#search').on('input', function () {
var query = $(this).val();
request = $.ajax({
type: "POST",
url: "query",
contentType: 'application/json',
data: JSON.stringify({ 'query': query }),
contentType: 'application/json',
success: function (data, textStatus, request) {
let httpResults = Papa.parse(data, { delimiter: ",", header: true, skipEmptyLines: true });
results.innerHTML = '';
var timeoutMs = 100;
let timeSpent = request.getResponseHeader('Time-Ms');
let numberOfDocuments = httpResults.data.length;
count.innerHTML = `${numberOfDocuments}`;
time.innerHTML = `${timeSpent}ms`;
time.classList.remove('fade-in-out');
if (timeoutID !== null) {
window.clearTimeout(timeoutID);
}
for (element of httpResults.data) {
const elem = document.createElement('li');
elem.classList.add("document");
timeoutID = window.setTimeout(function () {
request = $.ajax({
type: "POST",
url: "query",
contentType: 'application/json',
data: JSON.stringify({ 'query': query }),
contentType: 'application/json',
success: function (data, textStatus, request) {
let httpResults = Papa.parse(data, { delimiter: ",", header: true, skipEmptyLines: true });
results.innerHTML = '';
const ol = document.createElement('ol');
let timeSpent = request.getResponseHeader('Time-Ms');
let numberOfDocuments = httpResults.data.length;
count.innerHTML = `${numberOfDocuments}`;
time.innerHTML = `${timeSpent}ms`;
time.classList.remove('fade-in-out');
for (const prop in element) {
const field = document.createElement('li');
field.classList.add("field");
for (element of httpResults.data) {
const elem = document.createElement('li');
elem.classList.add("document");
const attribute = document.createElement('div');
attribute.classList.add("attribute");
attribute.innerHTML = prop;
const ol = document.createElement('ol');
const content = document.createElement('div');
content.classList.add("content");
content.innerHTML = element[prop];
for (const prop in element) {
const field = document.createElement('li');
field.classList.add("field");
field.appendChild(attribute);
field.appendChild(content);
const attribute = document.createElement('div');
attribute.classList.add("attribute");
attribute.innerHTML = prop;
ol.appendChild(field);
const content = document.createElement('div');
content.classList.add("content");
content.innerHTML = element[prop];
field.appendChild(attribute);
field.appendChild(content);
ol.appendChild(field);
}
elem.appendChild(ol);
results.appendChild(elem)
}
elem.appendChild(ol);
results.appendChild(elem)
}
},
beforeSend: function () {
if (request !== null) {
request.abort();
time.classList.add('fade-in-out');
}
},
});
},
beforeSend: function () {
if (request !== null) {
request.abort();
time.classList.add('fade-in-out');
}
},
});
}, timeoutMs);
});
// Make the number of document a little bit prettier