var request = null; var timeoutID = null; $('#search').on('input', function () { var query = $(this).val(); var timeoutMs = 100; if (timeoutID !== null) { window.clearTimeout(timeoutID); } 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 = ''; 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 (element of httpResults.data) { const elem = document.createElement('li'); elem.classList.add("document"); const ol = document.createElement('ol'); for (const prop in element) { const field = document.createElement('li'); field.classList.add("field"); const attribute = document.createElement('div'); attribute.classList.add("attribute"); attribute.innerHTML = prop; 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) } }, beforeSend: function () { if (request !== null) { request.abort(); time.classList.add('fade-in-out'); } }, }); }, timeoutMs); }); // Make the number of document a little bit prettier $('#docs-count').text(function(index, text) { return parseInt(text).toLocaleString() }); // Make the database a little bit easier to read $('#db-size').text(function(index, text) { return filesize(parseInt(text)) }); // We trigger the input when we load the script, this way // we execute a placeholder search when the input is empty. $(window).on('load', function () { $('#search').trigger('input'); });