propagate from branch 'it.lapo.asn1js.esm' (head 1f81e568f0723f8ce942…

…b435f81d205e157789ce) to branch 'it.lapo.asn1js.github-82' (head 7107a48abf688173dcdf7bd716d415c8edd85f46)
lapo-luchini · Mar 31, 2024 · c2ebbf4 · c2ebbf4
2 parents aa1f1c3 + e3fca65
commit c2ebbf4
Show file tree

Hide file tree

Showing 6 changed files with 85 additions and 1 deletion.
diff --git a/README.md b/README.md
@@ -62,7 +62,7 @@ credits
 - extended tag support added by [Péter Budai](https://www.peterbudai.eu/)
 - patches by [Gergely Nagy](https://github.com/ngg)
 - Relative OID support added by [Mistial Developer](https://github.com/mistial-dev)
-- dark mode support added by [Oliver Burgmaier](https://github.com/olibu/)
+- dark mode and other UI improvements by [Oliver Burgmaier](https://github.com/olibu/)
 - patches by [Nicolai Søborg](https://github.com/NicolaiSoeborg)
 
 links

diff --git a/dom.js b/dom.js
@@ -52,6 +52,10 @@ const
 
 export class ASN1DOM extends ASN1 {
 
+    buf2hex(buffer) {
+        return [...new Uint8Array(buffer)].map((x) => x.toString(16).padStart(2, '0')).join(' ');
+    }
+
     toDOM(spaces) {
         spaces = spaces || '';
         let isOID = (typeof oids === 'object') && (this.tag.isUniversal() && (this.tag.tagNumber == 0x06) || (this.tag.tagNumber == 0x0D));
@@ -187,6 +191,15 @@ export class ASN1DOM extends ASN1 {
                 this.className = 'hex';
             }
         };
+        // handler to copy the complete hex dump into the clipboard
+        node.onclick = function (event) {
+            let contextMenu = document.getElementById('contextmenu');    
+            contextMenu.style.left = event.pageX + "px";
+            contextMenu.style.top = event.pageY + "px";
+            contextMenu.style.visibility = 'visible';
+            document.getElementById('contextmenu').node = this;
+            event.stopPropagation();
+        };      
         if (root == node) {
             let lineStart = this.posStart() & 0xF;
             if (lineStart != 0) {
@@ -200,6 +213,9 @@ export class ASN1DOM extends ASN1 {
                 node.appendChild(skip);
             }
         }
+        // set the current start and end position as an attribute at the node to know the selected area
+        node.setAttribute('pos', this.posStart());
+        node.setAttribute('end', this.posEnd());    
         this.toHexDOM_sub(node, 'tag', this.stream, this.posStart(), this.posLen());
         this.toHexDOM_sub(node, (this.length >= 0) ? 'dlen' : 'ulen', this.stream, this.posLen(), this.posContent());
         if (this.sub === null) {

diff --git a/index.css b/index.css
@@ -212,3 +212,23 @@ header {
 #dump .hexCurrent .dlen { color: #004040; }
 #file { display: none; }
 #area { width: 100%; }
+#contextmenu {
+    position: absolute;
+    visibility: hidden;
+    top: 0;
+    left: 0;
+    padding: 2px;
+    background-color: var(--button-bg-color);
+    border: 1px solid var(--button-bg-color);
+    z-index: 2;
+}
+#contextmenu > button {
+    width: 120px;
+    background-color: var(--button-bg-color);
+    color: var(--main-text-color);
+    border: 1px solid var(--button-border-color);
+    text-align: left;
+}
+#contextmenu > button:hover {
+    background-color: var(--button-bghover-color);
+}
diff --git a/index.html b/index.html
@@ -8,6 +8,7 @@
   <link rel="icon" type="image/svg+xml" sizes="192x192" href="favicon.svg">
 </head>
 <body>
+  <div id="contextmenu" onmouseleave="this.style.visibility = 'hidden';"><button id="btnCopyHex">Copy as HEX</button><br><button id="btnCopyString">Copy as String</button><br><button id="btnCopyPretty">Copy as Pretty</button></div>
   <header>
     <div class="title">
       <h1>ASN.1 JavaScript decoder</h1>

diff --git a/index.js b/index.js
@@ -5,6 +5,7 @@ import { Defs } from './defs.js';
 import { tags } from './tags.js';
 
 const
+    ASN1 = require('./asn1'),
     maxLength = 10240,
     reHex = /^\s*(?:[0-9A-Fa-f][0-9A-Fa-f]\s*)+$/,
     tree = id('tree'),
@@ -45,6 +46,9 @@ function show(asn1) {
     if (wantHex.checked) dump.appendChild(asn1.toHexDOM(undefined, trimHex.checked));
 }
 function decode(der, offset) {
+    // store the DER buffer of asn1 in window to copy it completely into clipboard on dumpcopy
+    window.derBuffer = der;
+
     offset = offset || 0;
     try {
         const asn1 = ASN1DOM.decode(der, offset);
@@ -231,3 +235,45 @@ selectTag.onchange = function (ev) {
     let tag = ev.target.selectedOptions[0].value;
     window.location.href = 'https://rawcdn.githack.com/lapo-luchini/asn1js/' + tag + '/index.html';
 };
+
+// register context menu function
+document.getElementById('btnCopyHex').onclick = function (event) {
+    let contextMenu = document.getElementById('contextmenu');
+    let node = contextMenu.node;
+    const pos = parseInt(node.getAttribute('pos'));
+    const end = parseInt(node.getAttribute('end'));
+    const hex = node.asn1.buf2hex(window.derBuffer.subarray(pos, end));
+    navigator.clipboard.writeText(hex);
+    contextMenu.style.visibility = 'hidden';
+    event.stopPropagation();
+};
+
+document.getElementById('btnCopyString').onclick = function (event) {
+    let contextMenu = document.getElementById('contextmenu');
+    let node = contextMenu.node;
+    const pos = parseInt(node.getAttribute('pos'));
+    const end = parseInt(node.getAttribute('end'));
+    let result = ASN1.decode(window.derBuffer.subarray(pos, end));
+    let type = result.typeName();
+    switch (type) {
+    case 'SET':
+    case 'SEQUENCE':
+        alert('Selected value is not a String!');
+        break;
+    default: 
+        navigator.clipboard.writeText(result.content());
+    }
+    contextMenu.style.visibility = 'hidden';
+    event.stopPropagation();
+};
+
+document.getElementById('btnCopyPretty').onclick = function (event) {
+    let contextMenu = document.getElementById('contextmenu');
+    let node = contextMenu.node;
+    const pos = parseInt(node.getAttribute('pos'));
+    const end = parseInt(node.getAttribute('end'));
+    let result = ASN1.decode(window.derBuffer.subarray(pos, end));
+    navigator.clipboard.writeText(result.toPrettyString());
+    contextMenu.style.visibility = 'hidden';
+    event.stopPropagation();
+};
diff --git a/release.sh b/release.sh
@@ -24,6 +24,7 @@ mtn automate tags 'it.lapo.asn1js{,.*}' | \
     { print "  " q $2 q ": " q $1 q "," }
     END { print "};" }
   ' > tags.js
+chmod 644 examples/*
 type gsha256sum >/dev/null && SHA256=gsha256sum || SHA256=sha256sum
 $SHA256 -t $FILES | gpg --clearsign > sha256sums.asc
 7z a -tzip -mx=9 asn1js.zip $FILES sha256sums.asc