[enh] themes: display the engine descriptions

4 files changed, 63 insertions, 0 deletions

diff --git a/searx/static/themes/oscar/src/js/preferences.js b/searx/static/themes/oscar/src/js/preferences.js
new file mode 100644
index 000000000..25aac052f
--- /dev/null
+++ b/searx/static/themes/oscar/src/js/preferences.js
@@ -0,0 +1,23 @@
+$(document).ready(function(){
+    let engine_descriptions = null;
+    function load_engine_descriptions() {
+        if (engine_descriptions == null) {
+            $.ajax("engine_descriptions.json", dataType="json").done(function(data) {
+                engine_descriptions = data;
+                for (const [engine_name, description] of Object.entries(data)) {
+                    let elements = $('[data-engine-name="' + engine_name + '"] .description');
+                    for(const element of elements) {
+                        let source = ' (<i>' + searx.translations['Source'] + ':&nbsp;' + description[1] + '</i>)';
+                        element.innerHTML = description[0] + source;
+                    }
+                }
+            });
+        }
+    }
+
+    if (document.querySelector('body[class="preferences_endpoint"]')) {
+        $('[data-engine-name]').hover(function() {
+            load_engine_descriptions();
+        });
+    }
+});
diff --git a/searx/static/themes/oscar/src/less/logicodev/preferences.less b/searx/static/themes/oscar/src/less/logicodev/preferences.less
index 32e230413..2d716e966 100644
--- a/searx/static/themes/oscar/src/less/logicodev/preferences.less
+++ b/searx/static/themes/oscar/src/less/logicodev/preferences.less
@@ -25,6 +25,7 @@ input.cursor-text {
     font-size: 14px;
     font-weight: normal;
     z-index: 1000000; 
+    max-width: 40rem;
 }
 
 td:hover .engine-tooltip, th:hover .engine-tooltip, .engine-tooltip:hover {
diff --git a/searx/static/themes/simple/src/js/main/searx_preferences.js b/searx/static/themes/simple/src/js/main/searx_preferences.js
new file mode 100644
index 000000000..136d9f03e
--- /dev/null
+++ b/searx/static/themes/simple/src/js/main/searx_preferences.js
@@ -0,0 +1,27 @@
+(function (w, d, searx) {
+    'use strict';
+
+    searx.ready(function() {
+        let engine_descriptions = null;
+        function load_engine_descriptions() {
+            if (engine_descriptions == null) {
+                searx.http("GET", "engine_descriptions.json").then(function(content) {
+                    engine_descriptions = JSON.parse(content);
+                    for (const [engine_name, description] of Object.entries(engine_descriptions)) {
+                        let elements = d.querySelectorAll('[data-engine-name="' + engine_name + '"] .engine-description');
+                        for(const element of elements) {
+                            let source = ' (<i>' + searx.translations['Source'] + ':&nbsp;' + description[1] + '</i>)';
+                            element.innerHTML = description[0] + source;
+                        }
+                    }
+                });
+            }
+        }
+
+        if (d.querySelector('body[class="preferences_endpoint"]')) {
+            for(const el of d.querySelectorAll('[data-engine-name]')) {
+                searx.on(el, 'mouseenter', load_engine_descriptions);
+            }
+        }
+    });
+})(window, document, window.searx);
diff --git a/searx/static/themes/simple/src/less/preferences.less b/searx/static/themes/simple/src/less/preferences.less
index 034102e66..0be6f9023 100644
--- a/searx/static/themes/simple/src/less/preferences.less
+++ b/searx/static/themes/simple/src/less/preferences.less
@@ -108,6 +108,18 @@
       width: 100%;
     }
   }
+
+  th.name {
+    .engine-tooltip {
+      margin-top: 1.8rem;
+      left: 20rem;
+      max-width: 40rem;
+
+      .engine-description {
+        margin-top: 0.5rem;
+      }
+    }
+  }
 }
 
 @media screen and (max-width: 75em) {