From 7cf5677221656fe71363a8db12e0559d92249ea3 Mon Sep 17 00:00:00 2001 From: Jocavdh Date: Mon, 11 Jun 2018 14:44:11 +0200 Subject: [PATCH] Autocomplete is now visible in frontendgit add -A. Crying out of joy from the inside --- app/static/js/app.js | 84 +++++++++++++++++++++++++------------------- app/views.py | 8 +++-- 2 files changed, 53 insertions(+), 39 deletions(-) diff --git a/app/static/js/app.js b/app/static/js/app.js index 2d887fe..992e2bf 100755 --- a/app/static/js/app.js +++ b/app/static/js/app.js @@ -161,41 +161,53 @@ $(document).ready(function() // Autocomplete for search - Contact Joca in case of trouble // Check: Code doesn't work inside document.ready function // Are the other functions correctly closed? + function split( val ) { + return val.split( /,\s*/ ); + } + function extractLast( term ) { + return split( term ).pop(); + } -// Send query to server -$('#search').on("input", function() { - var query = this.value; - - $.ajax({ - url: "/autocomplete_suggestions", - data: $('form').serialize(), - type: "POST", - async: false, - success: function(response) { - //console.log("Got your query!"); - } - - }); - - var JSONItems = ['battle']; - $.getJSON( "/autocomplete_suggestions", callbackFuncWithData); - - - -function callbackFuncWithData() { - -$("#search").autocomplete({ - source: function( request, response ) { - $.getJSON( "autocomplete_suggestions", { - term: extractLast( request.term ) - }, response ); + $( "#search" ) + // don't navigate away from the field on tab when selecting an item + .on( "keydown", function( event ) { + if ( event.keyCode === $.ui.keyCode.TAB && + $( this ).autocomplete( "instance" ).menu.active ) { + event.preventDefault(); + } + }) + .autocomplete({ + source:function(request, response) { + $.getJSON("/autocomplete_suggestions",{ + q: request.term, // in flask, "q" will be the argument to look for using request.args + }, function(data) { + response(data); // matching_results from jsonify + console.log("this" + data); + }); + }, + search: function() { + // custom minLength + var term = extractLast( this.value ); + if ( term.length < 2 ) { + return false; } -}); -} - - -}); - - -// Get autocomplete_suggestions -console.log("haha"); + }, + focus: function() { + // prevent value inserted on focus + return false; + }, + select: function( event, ui ) { + console.log(this.value); + str = this.value; + var terms = str.split(" "); + console.log(terms); + // remove the current input + terms.pop(); + // add the selected item + terms.push( ui.item.value ); + // add placeholder to get the comma-and-space at the end + terms.push( "" ); + this.value = terms.join( " " ); + return false; + } + }); diff --git a/app/views.py b/app/views.py index a7cd5a4..078f4e7 100755 --- a/app/views.py +++ b/app/views.py @@ -441,8 +441,9 @@ autocomplete.load() #Train markov model once, for autocomplete in search @app.route('/autocomplete_suggestions', methods=['GET', 'POST']) def autocomplete_search(): - if request.method == 'POST': - query = request.form['search'] + if request.method == 'GET': + #query = request.form['search'] + query = request.args.get('q') query_tokenized = query.lower().split() print(query_tokenized) word_1 = query_tokenized[-2] @@ -458,7 +459,8 @@ def autocomplete_search(): print(session['autocomplete_suggestions']) - return Response(json.dumps(session['autocomplete_suggestions']), mimetype='application/json') + return Response(json.dumps(autocomplete_suggestions), mimetype='application/json') + ## STACKS!