sane-wasm 0.3.0 → 0.3.2

package/README.md

@@ -4,7 +4,7 @@ A project to bring the [SANE API](http://www.sane-project.org/intro.html) to Nod
 
 It supports USB scanners on browser environments through the [WebUSB API](https://developer.mozilla.org/en-US/docs/Web/API/WebUSB_API) and on Node.js using [node-usb](https://github.com/node-usb/node-usb).
 
-This works by compiling all SANE backends (and required dependencies) to WebAssembly using Emscripten. The other key piece is @RReverser's [bridge from libusb to WebUSB](https://github.com/libusb/libusb/pull/1057) ([1](https://web.dev/porting-libusb-to-webusb/)/[2](https://web.dev/porting-gphoto2-to-the-web/)) with [some patching](https://github.com/goncalomb/sane-wasm/issues/1) to support multi-threading.
+This works by compiling all SANE backends (and required dependencies) to WebAssembly using Emscripten. The other key piece is @RReverser's bridge from libusb to WebUSB ([article](https://web.dev/articles/porting-libusb-to-webusb)/[article](https://web.dev/articles/porting-gphoto2-to-the-web)/[code](https://github.com/libusb/libusb/pull/1057)/[code](https://github.com/libusb/libusb/pull/1339)) for direct USB access.
 
 Right now, it includes [all backends](http://www.sane-project.org/lists/sane-backends-cvs.html) that have support for at least one USB device ([genesys is not included due to issues](https://github.com/goncalomb/sane-wasm/issues/3)). No [external backends](http://www.sane-project.org/lists/sane-backends-external.html) are included at the moment.
 

package/build/libsane.html

@@ -14,6 +14,21 @@
                 max-width: 950px;
                 margin: 0 auto;
             }
+            table#options {
+                width: 100%;
+                border-collapse: collapse;
+            }
+            table#options tr td {
+                padding: 2px;
+            }
+            table#options tr:not(:last-child) td {
+                border-bottom: 1px solid #555;
+            }
+            table#options tr td:last-child {
+                overflow: hidden;
+                text-overflow: ellipsis;
+                max-width: 250px;
+            }
             canvas {
                 border: 2px solid #555;
                 margin-bottom: 25px;
@@ -262,16 +277,22 @@
                         }
                     }
                     const options = document.querySelector("#options");
+                    options.style.display = null;
                     options.innerHTML = "";
                     options.append(tree(option_descriptors.map((opt, n) => (
-                        ["div", null, [
-                            ["p", null, [
-                                `${n}: ${opt.title} [name=${opt.name}]`, ["br"],
-                                ["small", null, opt.desc], ["br"],
-                                ["small", null, `[type=${LibSANE.SANE_TYPE.asString(opt.type)}] [unit=${LibSANE.SANE_UNIT.asString(opt.unit)}] [size=${opt.size}] [cap=${JSON.stringify(opt.cap)}]`], ["br"],
-                                ["small", null, `[constraint_type=${LibSANE.SANE_CONSTRAINT.asString(opt.constraint_type)}] [constraint=${JSON.stringify(opt.constraint)}]`],
+                        ["tr", null, [
+                            ["td", null, `${n}`],
+                            ["td", null, [
+                                ["strong", null, `${opt.title}`],
+                                ` [name=${opt.name}] [type=${LibSANE.SANE_TYPE.asString(opt.type)}] [unit=${LibSANE.SANE_UNIT.asString(opt.unit)}] [size=${opt.size}]`, ["br"],
+                                ["abbr", { title: [
+                                    `cap=${JSON.stringify(opt.cap, null, 2)}`,
+                                    `constraint_type=${LibSANE.SANE_CONSTRAINT.asString(opt.constraint_type)}`,
+                                    `constraint=${JSON.stringify(opt.constraint, null, 2)}`,
+                                ].join("\n") }, "[cap=...] [constraint_type=...] [constraint=...]"], ["br"],
+                                ["small", null, opt.desc],
                             ]],
-                            ["div", { id: `option-${n}` }]
+                            ["td", { id: `option-${n}` }]
                         ]]
                     ))));
                     let n = 0;
@@ -333,7 +354,7 @@
                                 ["button", { onclick: e => callSANE("sane_close") }, "LibSANE.sane_close()"], " ",
                             ]],
                             ["h3", null, "Options"],
-                            ["div", { id: "options" }],
+                            ["table", { id: "options", style: "display: none;" }],
                             ["h3", null, "Scan"],
                             ["p", null, [
                                 ["button", { onclick: e => callSANE("sane_get_parameters") }, "LibSANE.sane_get_parameters()"], " ",
@@ -353,5 +374,3 @@
         </script>
     </body>
 </html>
-
-