From f0f473b829dff00d50b06587f7181216f4020dc4 Mon Sep 17 00:00:00 2001 From: Matthieu Gautier Date: Wed, 17 Nov 2021 15:24:03 +0100 Subject: [PATCH] Show suggestions using autoComplete.js This change only shows suggestions. Clicking them does nothing. --- static/skin/taskbar.css | 2 +- static/skin/taskbar.js | 87 ++++++++++++++++-------------- static/templates/taskbar_part.html | 2 +- test/server.cpp | 19 ++++--- 4 files changed, 57 insertions(+), 53 deletions(-) diff --git a/static/skin/taskbar.css b/static/skin/taskbar.css index 74f16bb5b..02d3c5e30 100644 --- a/static/skin/taskbar.css +++ b/static/skin/taskbar.css @@ -9,6 +9,7 @@ transition: 0.3s; width: 100%; box-sizing: border-box; + background: #bbb; } #kiwixtoolbar>a { @@ -100,7 +101,6 @@ label[for="kiwix_button_show_toggle"], } .kiwix #kiwixtoolbar #kiwixsearchform input[type='text'] { - position: absolute; left: 0; box-sizing: border-box !important; width: 100%; diff --git a/static/skin/taskbar.js b/static/skin/taskbar.js index 421758216..664d8daca 100644 --- a/static/skin/taskbar.js +++ b/static/skin/taskbar.js @@ -3,46 +3,51 @@ function htmlDecode(input) { return doc.documentElement.textContent; } -const jq = jQuery.noConflict(true); -jq(document).ready(() => { - (function ($) { - const root = $( `link[type='root']` ).attr("href"); +document.addEventListener('DOMContentLoaded', function () { + const root = document.querySelector(`link[type='root']`).getAttribute("href"); + const bookName = (window.location.pathname == `${root}/search`) + ? (new URLSearchParams(window.location.search)).get('content') + : window.location.pathname.split(`${root}/`)[1].split('/')[0]; - const bookName = (window.location.pathname == `${root}/search`) - ? (new URLSearchParams(window.location.search)).get('content') - : window.location.pathname.split(`${root}/`)[1].split('/')[0]; - - const userlang = (new URLSearchParams(window.location.search)).get('userlang') || "en"; - $( "#kiwixsearchbox" ).autocomplete({ - - source: `${root}/suggest?content=${bookName}&userlang=${userlang}`, - dataType: "json", - cache: false, - - response: function( event, ui ) { - for(const item of ui.content) { - item.label = htmlDecode(item.label); - item.value = htmlDecode(item.value); - if (item.path) item.path = htmlDecode(item.path); - } - }, - - select: function(event, ui) { - if (ui.item.kind === 'path') { - window.location.href = `${root}/${bookName}/${encodeURI(ui.item.path)}`; - } else { - $( "#kiwixsearchbox" ).val(ui.item.value); - $( "#kiwixsearchform" ).submit(); - } - }, - }).data( "ui-autocomplete" )._renderItem = function( ul, item ) { - return $( "
  • " ) - .data( "ui-autocomplete-item", item ) - .append( item.label ) - .appendTo( ul ); - }; - - /* cybook hack */ + const autoCompleteJS = new autoComplete( + { + selector: "#kiwixsearchbox", + placeHolder: document.querySelector("#kiwixsearchbox").title, + threshold: 1, + debounce: 300, + data : { + src: async (query) => { + try { + // Fetch Data from external Source + const source = await fetch(`${root}/suggest?content=${encodeURIComponent(bookName)}&term=${encodeURIComponent(query)}`); + const data = await source.json(); + return data; + } catch (error) { + return error; + } + }, + keys: ['label'], + }, + searchEngine: (query, record) => { + // We accept all records + return true; + }, + resultsList: { + noResults: true, + /* We must display 10 results (requested) + 1 potential link to do a full text search. */ + maxResults: 11, + highlight: true + }, + resultItem: { + element: (item, data) => { + item.innerHTML = `${htmlDecode(data.value.label)}`; + } + } + } + ); + + /* + // cybook hack if (navigator.userAgent.indexOf("bookeen/cybook") != -1) { $("html").addClass("cybook"); } @@ -93,5 +98,5 @@ jq(document).ready(() => { $('label[for="kiwix_button_show_toggle"], .kiwix_button_cont').removeClass('searching'); } }); - })(jq); -}) + };*/ +}); \ No newline at end of file diff --git a/static/templates/taskbar_part.html b/static/templates/taskbar_part.html index c056d48d0..fab98abe3 100644 --- a/static/templates/taskbar_part.html +++ b/static/templates/taskbar_part.html @@ -5,7 +5,7 @@
    {{#hascontent}}{{/hascontent}} - +
    diff --git a/test/server.cpp b/test/server.cpp index 2866ed307..d1bae7ab6 100644 --- a/test/server.cpp +++ b/test/server.cpp @@ -195,11 +195,11 @@ R"EXPECTEDRESULT( - + - + )EXPECTEDRESULT" @@ -211,11 +211,11 @@ R"EXPECTEDRESULT( - + - + )EXPECTEDRESULT" @@ -445,11 +445,11 @@ std::string TestContentIn404HtmlResponse::expectedResponse() const R"FRAG( - + - + @@ -533,10 +533,9 @@ std::string TestContentIn404HtmlResponse::hiddenBookNameInput() const std::string TestContentIn404HtmlResponse::searchPatternInput() const { const std::string searchboxTooltip = isTranslatedVersion() - ? "Որոնել '" + bookTitle + "'֊ում" - : "Search '" + bookTitle + "'"; - - return R"(