Show field names from ASN.1 definitions.

(just a couple of examples right now)
lapo-luchini · Mar 12, 2023 · 2516eb2 · 2516eb2
1 parent 347ed78
commit 2516eb2
Show file tree

Hide file tree

Showing 6 changed files with 78 additions and 30 deletions.
diff --git a/defs.js b/defs.js
@@ -14,9 +14,9 @@
 // OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
 
 (typeof define != 'undefined' ? define : function (factory) { 'use strict';
-    if (typeof module == 'object') module.exports = factory();
-    else window.defs = factory();
-})(function () {
+    if (typeof module == 'object') module.exports = factory(function (name) { return require(name); });
+    else window.defs = factory(function (name) { return window[name.substring(2)]; });
+})(function (require) {
 'use strict';
 
 const rfc = require('./rfcdef');
@@ -95,7 +95,7 @@ class Defs {
                         if (type?.type == 'defined')
                             stats.defs[type.id] = subval.content().split(/\n/);
                         else if (type?.definedBy && stats.defs?.[type.definedBy]?.[1]) // hope current OIDs contain the type name (will need to parse from RFC itself)
-                            type = searchType(firstUpper(stats.defs[type.definedBy][1]));
+                            type = Defs.searchType(firstUpper(stats.defs[type.definedBy][1]));
                     }
                 }
                 Defs.match(subval, type, stats);

diff --git a/dom.js b/dom.js
@@ -66,6 +66,11 @@ class ASN1DOM extends ASN1 {
         node.asn1 = this;
         let head = DOM.tag('div', 'head');
         head.innerHTML = "<span class='spaces'>" + spaces + '</span>' + this.typeName().replace(/_/g, ' ');
+        if (this.def && this.def.id) {
+            let name = DOM.tag('span', 'name');
+            name.innerText = this.def.id + ' ';
+            head.prepend(name);
+        }
         let content = this.content(contentLength);
         let oid;
         if (content !== null) {

diff --git a/index.css b/index.css
@@ -142,6 +142,9 @@ header {
 .node.collapsed.hover > .sub {
     display: block;
 }
+.name {
+    color: var(--preview-border-color);
+}
 .value {
     display: none;
     position: absolute;

diff --git a/index.html b/index.html
@@ -32,29 +32,23 @@ <h1>ASN.1 JavaScript decoder</h1>
       <br>
       <br>
       <label title="can be slow with big files"><input type="checkbox" id="wantHex" checked="checked"> with hex dump</label>
+      <label title="can be slow with big files"><input type="checkbox" id="wantDef" checked="checked"> with definitions</label>
       <input id="butDecode" type="button" value="decode">
       <br><br>
       <table>
-        <tr>
-          <td>
-            <input type="file" id="file">
-            </td>
-            <td>&nbsp;</td>
-            <td>
-            <div>Examples:
-              <select id="examples">
-                <option value="sig-p256-der.p7m">PKCS#7/CMS attached signature (DER)</option>
-                <option value="sig-p256-ber.p7m">PKCS#7/CMS attached signature (BER)</option>
-                <option value="sig-rsa1024-sha1.p7s">PKCS#7/CMS detached signature (old)</option>
-                <option value="letsencrypt-x3.cer">X.509 certificate: Let's Encrypt X3</option>
-                <option value="ed25519.cer">X.509 certificate: ed25519 (RFC 8410)</option>
-              </select>
-              <input id="butExample" type="button" value="load example">
-            </div>
-          </td>
-        </tr>
+        <tr><td>Drag or load file:</td><td><input type="file" id="file"></td></tr>
+        <tr><td>Load examples:</td><td>
+          <select id="examples">
+            <option value="sig-p256-der.p7m">PKCS#7/CMS attached signature (DER)</option>
+            <option value="sig-p256-ber.p7m">PKCS#7/CMS attached signature (BER)</option>
+            <option value="sig-rsa1024-sha1.p7s">PKCS#7/CMS detached signature (old)</option>
+            <option value="letsencrypt-x3.cer">X.509 certificate: Let's Encrypt X3</option>
+            <option value="ed25519.cer">X.509 certificate: ed25519 (RFC 8410)</option>
+          </select>
+          <input id="butExample" type="button" value="load"><br>
+        </td></tr>
+        <tr><td>Definitions:</td><td><select id="definitions"></select></td></tr>
       </table>
-      <br>
     </form>
     <br>
   </div>
@@ -103,6 +97,8 @@ <h3>Links</h3>
   <script type="text/javascript" src="hex.js"></script>
   <script type="text/javascript" src="base64.js"></script>
   <script type="text/javascript" src="oids.js"></script>
+  <script type="text/javascript" src="rfcdef.js"></script>
+  <script type="text/javascript" src="defs.js"></script>
   <script type="text/javascript" src="int10.js"></script>
   <script type="text/javascript" src="asn1.js"></script>
   <script type="text/javascript" src="dom.js"></script>

diff --git a/index.js b/index.js
@@ -8,16 +8,19 @@ const
     ASN1DOM = require('./dom'),
     Base64 = require('./base64'),
     Hex = require('./hex'),
+    Defs = require('./defs'),
     tags = require('./tags'),
     maxLength = 10240,
     reHex = /^\s*(?:[0-9A-Fa-f][0-9A-Fa-f]\s*)+$/,
     tree = id('tree'),
     dump = id('dump'),
-    wantHex = id('wantHex'),
+    wantHex = checkbox('wantHex'),
+    wantDef = checkbox('wantDef'),
     area = id('area'),
     file = id('file'),
     examples = id('examples'),
     selectTheme = id('theme-select'),
+    selectDefs = id('definitions'),
     selectTag = id('tags');
 
 let hash = null;
@@ -31,14 +34,55 @@ function text(el, string) {
     if ('textContent' in el) el.textContent = string;
     else el.innerText = string;
 }
-function decode(der, offset) {
-    offset = offset || 0;
+function checkbox(name) {
+    const el = id(name);
+    const cfg = localStorage.getItem(name);
+    if (cfg === 'false')
+        el.checked = false;
+    el.onchange = () => localStorage.setItem(name, el.checked);
+    return el;
+}
+function show(asn1) {
     tree.innerHTML = '';
     dump.innerHTML = '';
+    tree.appendChild(asn1.toDOM());
+    if (wantHex.checked) dump.appendChild(asn1.toHexDOM());
+}
+function decode(der, offset) {
+    offset = offset || 0;
     try {
-        let asn1 = ASN1DOM.decode(der, offset);
-        tree.appendChild(asn1.toDOM());
-        if (wantHex.checked) dump.appendChild(asn1.toHexDOM());
+        const asn1 = ASN1DOM.decode(der, offset);
+        if (wantDef.checked) {
+            selectDefs.innerHTML = '';
+            const types = Defs.commonTypes
+                .map(type => {
+                    const stats = Defs.match(asn1, type);
+                    return { type, match: stats.recognized / stats.total };
+                })
+                .sort((a, b) => b.match - a.match);
+            for (const t of types) {
+                t.element = document.createElement('option');
+                t.element.innerText = (t.match * 100).toFixed(1) + '% ' + t.type.description;
+                selectDefs.appendChild(t.element);
+            }
+            let not = document.createElement('option');
+            not.innerText = 'no definition';
+            selectDefs.appendChild(not);
+            Defs.match(asn1, types[0].type);
+            selectDefs.onchange = () => {
+                for (const t of types) {
+                    if (t.element == selectDefs.selectedOptions[0]) {
+                        Defs.match(asn1, t.type);
+                        show(asn1);
+                        return;
+                    }
+                }
+                Defs.match(asn1, null);
+                show(asn1);
+            };
+        } else
+            selectDefs.innerHTML = '<option>no definition</option>';
+        show(asn1);
         let b64 = der.length < maxLength ? asn1.toB64String() : '';
         if (area.value === '') area.value = Base64.pretty(b64);
         try {

diff --git a/release.sh b/release.sh
@@ -1,7 +1,7 @@
 #!/bin/sh
 set -e
 FILES="
-  asn1.js oids.js base64.js hex.js int10.js dom.js test.js tags.js
+  asn1.js oids.js defs.js base64.js hex.js int10.js dom.js rfcdef.js test.js tags.js
   index.css index-dark.css index.js index.html
   README.md LICENSE
   updateOID.sh check.sh