add indicators of the services that seem appropriate for the input

diff --git a/icedeb.css b/icedeb.css
index 80be164c4b70267662bad1b5bdceeb40b9f26c34..5a64933b0a3f84c5241aa0617b6fed6459cea6c3 100644 (file)
--- a/icedeb.css
+++ b/icedeb.css
@@ -31,14 +31,27 @@ body { padding: 1ex; }
   cursor: pointer;
   color: blue;
   margin-right: 1em;
   cursor: pointer;
   color: blue;
   margin-right: 1em;

+  opacity: 0.3;

 }
 }

+.likely .icedeb-button { opacity: 1; }

 .icedeb-button:hover {
     text-decoration: underline;
 }
 a, a:visited { color: blue; }
 .hints { margin-left: auto; margin-right: 0; }
 .icedeb-button:hover {
     text-decoration: underline;
 }
 a, a:visited { color: blue; }
 .hints { margin-left: auto; margin-right: 0; }

-.hints .hint { display: inline-block; width: 1.8ex; text-align: center; margin: 0 0.2ex; cursor: default; }
+.hints .hint {
+    display: inline-block;
+    width: 1.8ex;
+    text-align: center;
+    margin: 0 0.2ex;
+    cursor: default;
+    opacity: 0.5;
+}

 .hints .hint.b { background-color: hsl(312,100%,96%) }
 .hints .hint.p { background-color: hsl(120,100%,96%) }
 .hints .hint.b { background-color: hsl(312,100%,96%) }
 .hints .hint.p { background-color: hsl(120,100%,96%) }

-.hints .hint.m { background-color: hsl(240,100%,96%) }
+.hints .hint.m { background-color: hsl(240,100%,90%) }

 .hints .hint.i { background-color: hsl( 40,100%,96%) }
 .hints .hint.i { background-color: hsl( 40,100%,96%) }

+.like-b .hint.b,
+.like-p .hint.p,
+.like-m .hint.m,
+.like-i .hint.i { opacity: 1; }

diff --git a/icedeb.js b/icedeb.js
index 2d2a10e24d61824a54f91d3a1afec5df45b90695..60dfa66cb086252c9abb6bd9065bb706d0b3eb44 100644 (file)
--- a/icedeb.js
+++ b/icedeb.js
@@ -162,14 +162,44 @@ function link_clicked(e) {
   return false;
 }
 
   return false;
 }
 

+function check_likely_inputs(q) {
+  let cnt = document.getElementById('button-list-container').classList;
+
+  cnt.remove('like-b', 'like-p', 'like-m', 'like-i');
+  document.querySelectorAll('.likely')
+    .forEach((el) => {
+        el.classList.remove('likely');
+    });
+
+  if ( /^\d+$/.test(q) || /^CVE-/.test(q) )
+    cnt.add('like-b');
+
+  if ( /^[a-z0-9][a-z0-9\-+.]+$/.test(q) )
+    cnt.add('like-p');
+
+  if ( /.@[a-z0-9-]/i.test(q) )
+    cnt.add('like-m');
+
+  if ( /^<.+@.+>$/.test(q) )
+    cnt.add('like-i');
+
+  document.querySelectorAll('.like-b .hint.b, .like-p .hint.p, .like-m .hint.m, .like-i .hint.i')
+    .forEach((el) => {
+      el.parentElement.parentElement.classList.add('likely');
+    } );
+}
+

 function get_clipboard_contents() {
   let clip_pot = document.getElementById('clip-pot');
   let clip_input = document.getElementById("clipboard");
   clip_pot.focus();
   if (document.execCommand("Paste")) {
 function get_clipboard_contents() {
   let clip_pot = document.getElementById('clip-pot');
   let clip_input = document.getElementById("clipboard");
   clip_pot.focus();
   if (document.execCommand("Paste")) {

-    clip_input.value = clip_pot.textContent.trim();
+    let q = clip_pot.textContent.trim();
+    clip_input.value = q;

     clip_input.focus();
     clip_input.focus();

-    clip_input.setSelectionRange(0, clip_input.value.length)
+    clip_input.setSelectionRange(0, clip_input.value.length);
+
+    check_likely_inputs(q);

   }
 }
 
   }
 }
 


@@ -179,6 +209,11 @@ window.addEventListener('DOMContentLoaded', (e) => {
       el.addEventListener('mouseup', link_clicked);
     });
 
       el.addEventListener('mouseup', link_clicked);
     });
 

+  document.querySelector('#clipboard')
+    .addEventListener('input', function(ev) {
+      check_likely_inputs(ev.target.value);
+    });
+

   document.addEventListener('change', (e) => {
     if ( !e.target.classList.contains('icedeb-option') )
       return;
   document.addEventListener('change', (e) => {
     if ( !e.target.classList.contains('icedeb-option') )
       return;