diff --git a/index.js b/index.js
index 180092f..3826513 100644
--- a/index.js
+++ b/index.js
@@ -20,10 +20,21 @@ PUT /changelog
 
 "use strict"
 
+const authorizationToken = process.env.AUTH_TOKEN || "hello";
+const port = process.env.APP_PORT || 3000;
+
+function requireAuthentication( req, res, next ){
+  const userAuth = req.get("authorizationToken") || req.query.authorizationToken;
+  console.log( "userAuth : "+userAuth)
+  if( userAuth && userAuth === authorizationToken ) next(); 
+  else res.end("Auth required");
+}
+
+
 const elasticsearch = require('elasticsearch');
 var client = new elasticsearch.Client({
   host: process.env.ES_CONNECT,
-  // log: 'trace',
+//  log: 'trace',
   apiVersion: '7.7'
 });
 
@@ -31,12 +42,11 @@ var client = new elasticsearch.Client({
 const express = require('express');
 const app = express();
 
-
 app.set('view engine', 'pug');
 app.use(express.static('public'));
 
+app.all('*', requireAuthentication)
 
-const port = process.env.APP_PORT || 3000;
 
 const bodyParser = require('body-parser');
 app.use(bodyParser.json());
@@ -47,15 +57,32 @@ app.disable('x-powered-by');
 
 const routes = {
     main: (req, res) => {
-      client.search({index:"changelog", "sort":"created_at:desc"}).then( (results,err) => {
-        res.render('index', { title: 'changelog', error: err, data: JSON.stringify( results) });
+      client.search({index:"changelog", "size":100,"sort":"created_at:desc"}).then( (results,err) => {
+        res.render('index', { 
+          title: 'changelog', 
+          error: err, 
+          data: JSON.stringify( results), 
+          authorizationToken: authorizationToken
+        });
         
       });
 
     },
     search: (req, res) => {
       const query = req.query.q;
-      client.search({index:"changelog",body:{query:{multi_match:{query:query}}}}).then( (results,err) => {
+      const search = {
+        index:"changelog",
+        size:100,
+        body:{
+          query:{
+            multi_match:{
+              query:     query
+            }
+          }
+        },
+        sort:"_score,created_at:desc"
+      };
+      client.search(search).then( (results,err) => {
         res.json(results );
         
       }, (err) => {
diff --git a/public/css/site.css b/public/css/site.css
new file mode 100644
index 0000000..72ba943
--- /dev/null
+++ b/public/css/site.css
@@ -0,0 +1,20 @@
+
+/* 
+    Created on : 16 mai 2020
+    Author     : alban
+*/
+
+.log {
+    margin-bottom: 10px;
+    border-top: 1px solid #eee;
+    padding-top: 6px;
+}
+
+.log h4 {
+    white-space: pre;
+    font-family: monospace;
+}
+
+.log p {
+    color: #666;
+}
\ No newline at end of file
diff --git a/public/js/app.js b/public/js/app.js
index d15c396..ca25498 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -1,24 +1,37 @@
-/* global initData */
+/* global initData, authorizationToken */
 
+// List of HTML entities for escaping.
+var htmlEscapes = {
+  '&': '&',
+  '<': '&lt;',
+  '>': '&gt;',
+  '"': '&quot;',
+  "'": '&#x27;',
+  '/': '&#x2F;'
+};
 
-/**
- * 
- * @type type
- */
-const serviceContainer = {};
+// Regex containing the keys listed immediately above.
+var htmlEscaper = /[&<>"'\/]/g;
 
+// Escape a string for HTML interpolation.
+escape = function(string) {
+  return ('' + string).replace(htmlEscaper, function(match) {
+    return htmlEscapes[match];
+  });
+};
 
 function updatePage(data){
   
   var content = "";
   $.each(data.hits.hits, (k,v)=>{
     var item = v._source;
+    
     content += `
 
     <div class="log row-fluid">
       <div class="span9">
-        <p>${item.created_at} ${item.author} ${item.server} 
-        <h4> ${item.content}</h4>
+        <p>${escape(item.created_at)} -- ${escape(item.author)} -- ${escape(item.server)} 
+        <h4> ${escape(item.content)}</h4>
       </span>
     </div>
     `;
@@ -27,12 +40,17 @@ function updatePage(data){
   
 }
 
-$("input").on("keydown",function(e){
+$("input").on("keyup",function(e){
   const el = $(e.target);
   const val = el.val();
   if( val.length < 3 ){ return; }
   $.ajax("/search",{
-    data: {q:val}
+    beforeSend: function(request) {
+    request.setRequestHeader("authorizationToken", authorizationToken);
+    },
+    data: {
+      q:val,
+    }
   })  
   .done(function(data) {
     updatePage(data);
diff --git a/views/index.pug b/views/index.pug
index 2bfc7fd..9a64fc4 100644
--- a/views/index.pug
+++ b/views/index.pug
@@ -6,7 +6,7 @@ html(lang="en")
     meta(charset='utf-8')
     meta(name='viewport', content='width=device-width, initial-scale=1')
     link(rel='stylesheet', href='https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css')
-    script(type = "text/javascript",src='/js/lodash.min.js')
+    link(rel='stylesheet', href='css/site.css')
     script(type = "text/javascript",src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js')
   body
     <nav class="navbar navbar-expand-lg navbar-light bg-light justify-content-between">
@@ -31,4 +31,6 @@ html(lang="en")
 
   script.
     var initData = !{data};
+    var authorizationToken = "  !{authorizationToken}";
+
   script(type = "text/javascript",src='/js/app.js')