diff options
author | dweller <dweller@cabin.digital> | 2024-02-24 17:35:21 +0200 |
---|---|---|
committer | dweller <dweller@cabin.digital> | 2024-02-24 17:35:21 +0200 |
commit | a87359aaacac66655af6baa80ced112ac842f651 (patch) | |
tree | c8f4081bdd492bcfc4ac9982819f1734bbac5fb3 /page.html | |
parent | c680cbf1d759c13a0a2a54fced7e963f0094bd1f (diff) |
change search to be actually html5 search, add URL field in the page page. man (hehe) what a mess...
Diffstat (limited to '')
-rw-r--r-- | page.html | 59 |
1 files changed, 48 insertions, 11 deletions
@@ -15,6 +15,10 @@ <link rel="stylesheet" href="style/main.css"/> <link rel="stylesheet" href="style/search.css"/> <link rel="stylesheet" href="style/man.css"/> + + <noscript><style> + .jsonly { display: none; } + </style></noscript> </head> <body> <div id="main"> @@ -35,7 +39,7 @@ <nav id="search_pane"> <form> <div id="query_wrap"> - <input id="query" type='text' value='man' name='query' required/> + <input id="query" type='search' value='man' name='query' required/> <button id="mank" type='submit' value='apropos' name='action' title="apropos(1)">-k</button> <button id="man" type='submit' value='man' name='action' title="Feeling lucky, punk?" class="btn-acc"> <div id="query_icon"></div> @@ -49,17 +53,16 @@ <button class="btn-acc">Man up</button> </nav> </header> - <!-- TODO: LmmtFy URL form --> - <section id="lmmtfy_sect"> - <label for="query">Lmmty URL:</label> - <div id="query_wrap"> - <input id="query" type="text" name="lmmtfy" value="http://localhost:8000/?lmmtft=man§ion=1"> - <button id="man" type='submit' value='man' name='action' class="btn-acc"> - Copy - </button> - </div> - </section> <section id="results"> + <nav id="lmmtfy"> + <div> + <div> + <label for="lmmtfy_url">LmmtFy URL</label> + </div> + <textarea id="lmmtfy_url" wrap="off" rows="1" readonly>https://manup.sh?lmmtfy=man&s=1</textarea> + <button id="lmmtfy_copy" class="jsonly">Copy</button> + </div> + </nav> <article class="manpage"><p> </p><div class="head" role="doc-pageheader" aria-label="Manual header line"><span class="head-ltitle">MAN(1)</span> <span class="head-vol">General @@ -359,5 +362,39 @@ The <code class="Nm">man</code> utility displays the manual page entitled </p> </footer> </div> + + <script> + const lmmtfy = document.getElementById("lmmtfy_url"); + const btn = document.getElementById("lmmtfy_copy"); + btn.onclick = lmmtfy_copy; + + function lmmtfy_copy() + { + lmmtfy.focus(); + lmmtfy.select(); + + try + { + // TODO: deprecated -- https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand + if(document.execCommand('copy')) + btn.innerHTML = "Copied!" + + setTimeout(() => + { + btn.innerHTML = "Copy" + }, 3000); + + } + catch(err) + { + btn.innerHTML = "Error :("; + console.log('Oops, unable to copy'); + } + + // This unfocuses the element, but W3C decided to be funny with + // the naming. + document.activeElement.blur(); + } + </script> </body> </html> |