From e52622a5d50960b52600b209c7d0a3d314d7f7e1 Mon Sep 17 00:00:00 2001
From: Stephan Porada <sporada@uni-bielefeld.de>
Date: Thu, 21 Nov 2019 16:05:17 +0100
Subject: [PATCH] First result view

---
 app/templates/corpora/analyse_corpus.html.j2 | 50 +++++++++++++++++---
 1 file changed, 43 insertions(+), 7 deletions(-)

diff --git a/app/templates/corpora/analyse_corpus.html.j2 b/app/templates/corpora/analyse_corpus.html.j2
index a5a303cb..abe800eb 100644
--- a/app/templates/corpora/analyse_corpus.html.j2
+++ b/app/templates/corpora/analyse_corpus.html.j2
@@ -115,14 +115,50 @@
   socket.on('init_corpus_analysis', function(msg) {
     if (msg === 'Ready') {loadingModal.close();}
   });
+  function decodeResults(resultsByteArray) {
+    console.log(resultsByteArray);
+    var decompressedData = pako.inflate(resultsByteArray); // decompresses the recieved ArrayBuffer holding the compressed Byte data
+    console.log(decompressedData);
+    utf8decoder = new TextDecoder(); // default is utf-8
+    var decodedStrData = utf8decoder.decode(decompressedData); // decodes the decompressed Uint8Array as an utf-8 string
+    console.log(decodedStrData);
+    return decodedStrData
+  }
+  function getResultInfos(matchObject) {
+    for (var key in matchObject) {
+        var token = matchObject[key];
+        for (var key in token) {
+          infos += token[key]['word'] + ' ';
+        }
+        var infos = infos;
+    }
+    return infos
+  }
   socket.on('query', function(results) {
-    queryResultsElement.innerHTML = '';
-    console.log(results)
-    var decoder = new TextDecoder().decode(results)
-    console.log(results)
-    for (let key in results) {
-      console.log(results[key]);
-      queryResultsElement.innerHTML += '<p>' + results[key]['match_cpos_list'] + '</p>';
+    console.log(results);
+    var decodedJSONStr = decodeResults(results);
+    var results = JSON.parse(decodedJSONStr);
+    if (results === null){
+      M.toast({html: 'Query has no results!'});
+    }
+    else {
+      console.log(results);
+      html_txt = '<table class="highlight"> <thead><tr><th>Left context</th><th>Match</th><th>Right Context</th></tr></thead>';
+      for (var key in results) {
+        var hit = results[key];
+        var left_context = hit['context_before_cpos_list']
+        var match = hit['match_cpos_list']
+        var right_context = hit['context_after_cpos_list']
+        var l_text = getResultInfos(left_context)
+        var m_text = getResultInfos(match)
+        var r_text = getResultInfos(right_context)
+        html_txt += '<tr><td>' + l_text + '</td><td>' + m_text + '</td><td>' + r_text + '</td></tr>';
+        l_text = '';
+        m_text = '';
+      }
+      html_txt += '</table>';
+      console.log(html_txt);
+      queryResultsElement.innerHTML = html_txt;
     }
   });
 </script>