simpler javascript

knzai · Aug 7, 2024 · d47f2a0 · d47f2a0
1 parent 1c778c9
commit d47f2a0
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 9 deletions.
diff --git a/Cargo.toml b/Cargo.toml
@@ -36,7 +36,7 @@ gui = ["dep:sdl2"]
 #Web usage, may want to build with no-default-features to skip irrelevant terminal stuff
 wasm = ["png", "dep:base64", "dep:gloo", "dep:js-sys", "dep:web-sys", "dep:yew"]
 #Web component, may want to build with no-default-features to skip irrelevant terminal stuff
-webc = ["png", "dep:base64", "dep:gloo", "dep:js-sys", "dep:web-sys"]
+webc = ["png", "dep:base64", "dep:gloo", "dep:js-sys", "dep:wasm-bindgen", "dep:web-sys"]
 
 
 [dev-dependencies]
@@ -57,5 +57,6 @@ sdl2 = { optional = true, version = "0.37.0", features = ["gfx"], default-featur
 base64  = { optional = true, version = "0.21.5"}
 gloo    = { optional = true, version = "0.10" }
 js-sys  = { optional = true, version = "0.3"}
+wasm-bindgen  = { optional = true, version = "0.2" }
 web-sys = { optional = true, version = "0.3", features = ["File", "DragEvent", "DataTransfer"] }
-yew     = { optional = true, git = "https://github.com/yewstack/yew/", features = ["csr"] }
+yew     = { optional = true, git = "https://github.com/yewstack/yew/", features = ["csr"] }
diff --git a/src/webc/index.html b/src/webc/index.html
@@ -1,10 +1,29 @@
 <!doctype html>
 <html lang="en">
-    <head>
-        <link data-trunk rel="css" href="./styles.css" />
-        <link rel="stylesheet"
-            href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css"
-        />
-    </head>
-    <body></body>
+<head>
+   <link data-trunk rel="css" href="./styles.css" />
+   <link 
+   data-trunk 
+   rel="rust" href="../../Cargo.toml"
+   data-bin="cega-webc" 
+   data-cargo-no-default-features 
+   data-cargo-features="webc"
+   />
+   <script>
+      const fileReader = new FileReader();
+      fileReader.onloadend = function() {
+         var array = new Int8Array(fileReader.result);
+         document.getElementById('preview').src = window.wasmBindings.png(array);
+      }
+      document.addEventListener("DOMContentLoaded", () => {
+         const fileInput = document.getElementById('file-input');
+         fileInput.addEventListener("change", e => fileReader.readAsArrayBuffer(fileInput.files[0]));
+      });
+</script>
+</head>
+<body>
+   <h1>Process your CGA/EGAs</h1>
+   <input id="file-input" multiple="false" type="file" accept=".bin,.cga,.ega,.cega" />
+   <img id="preview" src="" />
+</body>
 </html>
diff --git a/src/webc/main.rs b/src/webc/main.rs
@@ -1,3 +1,23 @@
 #![cfg(feature = "webc")]
 
+use base64::engine::general_purpose::STANDARD;
+use base64::Engine;
+use wasm_bindgen::prelude::*;
+
+use cega::color::palette::palette_from_abbr;
+use cega::file_data::Raw;
+use cega::parser::ParserType;
+use cega::png;
+
+#[wasm_bindgen]
+pub fn png(data: &[u8]) -> String {
+    let file_data = Raw::new(data);
+    let parser = ParserType::CGA;
+    let image = file_data.parse(parser, 320);
+    let palette = palette_from_abbr("cga0");
+    let mut bytes: Vec<u8> = Vec::new();
+    let _ = png::write_to(&mut bytes, image.data(), palette.clone());
+    format!("data:application/png;base64,{}", STANDARD.encode(bytes))
+}
+
 fn main() {}