Skip to content

Commit

Permalink
Merge pull request #10 from maebli/feature/wasm-pack
Browse files Browse the repository at this point in the history
Feature/wasm pack
  • Loading branch information
maebli authored Jun 13, 2024
2 parents c3857fc + 373a6c3 commit c439f4c
Show file tree
Hide file tree
Showing 20 changed files with 699 additions and 44 deletions.
70 changes: 68 additions & 2 deletions .github/workflows/rust.yml
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,11 @@ name: Rust

on:
push:
branches: [main]
branches: [feature/wasm-pack]
tags:
- 'v*'
- 'cli-v*'
- 'wasm-v*'
pull_request:
branches: [main]

Expand Down Expand Up @@ -61,6 +62,32 @@ jobs:
cd cli/src
cargo clippy -- -D warnings
build-wasm:
runs-on: ubuntu-latest
needs: build-library
steps:
- uses: actions/checkout@v2
- name: Set up Rust
uses: actions-rs/toolchain@v1
with:
profile: minimal
toolchain: stable
override: true
- name: Build WASM
run: |
cd wasm
cargo build --verbose
- name: Run CLI Tests
run: |
cd wasm
cargo test --verbose
- name: Lint CLI with Clippy
run: |
rustup component add clippy
cd wasm
cargo clippy -- -D warnings
publish-library:
needs: build-library
runs-on: ubuntu-latest
Expand All @@ -82,7 +109,7 @@ jobs:
publish-cli:
needs: build-cli
runs-on: ubuntu-latest
if: startsWith(github.ref_name, 'cli-v')
if: startsWith(github.ref, 'refs/tags/cli-v')
steps:
- uses: actions/checkout@v2
- name: Set up Rust
Expand All @@ -95,3 +122,42 @@ jobs:
run: |
cd cli/src
cargo publish --token ${{ secrets.CRATESTOKEN }}
publish-wasm:
needs: build-wasm
runs-on: ubuntu-latest
permissions:
id-token: write
contents: read
if: startsWith(github.ref, 'refs/tags/wasm-v')
steps:
- uses: actions/checkout@v4
- name: Set up Rust
uses: actions-rs/toolchain@v1
with:
toolchain: stable
profile: minimal
override: true
- name: Install wasm-pack
run: cargo install wasm-pack
- name: Build wasm package
run: |
cd wasm
wasm-pack build --target bundler
- uses: actions/setup-node@v4
with:
node-version: '20.x'
registry-url: 'https://registry.npmjs.org'
token: ${{ secrets.NPM_TOKEN }}
- name: Install npm dependencies
run: |
cd wasm/pkg
npm install
npm ci
- name: Publish to npm
run: |
cd wasm/pkg
npm publish --provenance --access public
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
9 changes: 7 additions & 2 deletions Cargo.toml
Original file line number Diff line number Diff line change
Expand Up @@ -28,15 +28,20 @@ bindgen = "0.69.4"
[features]
std = []
plaintext-before-extension = []
serde = ["dep:serde", "std", "arrayvec/serde", "bitflags/serde"]

[profile.release]
opt-level = 'z' # Optimize for size
lto = true # Enable Link Time Optimization
codegen-units = 1 # Reduce codegen units to improve optimizations

[profile.release.package."m-bus-parser-wasm-pack"]
opt-level = "s"

[dependencies]
serde = { version = "1.0", features = ["derive"], optional = true }
bitflags = "2.4.2"
arrayvec = "0.7.4"
arrayvec = { version = "0.7.4", optional = false, default-features = true }

[workspace]
members = ["cli"]
members = ["cli", "wasm"]
16 changes: 16 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,22 @@ Furthermore, the Open Metering System (OMS) Group has published a specification
such as a no longer maitained [ m-bus encoder and decoder by rscada](https://github.com/rscada/libmbus) written in **c**, [jMbus](https://github.com/qvest-digital/jmbus) written in **java**,[Valley.Net.Protocols.MeterBus](https://github.com/sympthom/Valley.Net.Protocols.MeterBus/) written in **C#**, [tmbus](https://dev-lab.github.io/tmbus/) written in javascript or [pyMeterBus](https://github.com/ganehag/pyMeterBus) written in python.


## Dependants and Deployments

### NPM Wasm Package
![npm](https://img.shields.io/npm/dm/m-bus-parser-wasm-pack.svg) ![npm](https://img.shields.io/npm/v/m-bus-parser-wasm-pack.svg)

The parser has been published as an npm package and can be used in the browser. An example of this can be seen under the url www.maebli.github.io/m-bus-parser/ [https://maebli.github.io/m-bus-parser/](https://maebli.github.io/m-bus-parser/).

The source is in the wasm folder in this repos


### CLI rust crate
[![Crates.io](https://img.shields.io/crates/v/m-bus-parser-cli.svg)](https://crates.io/crates/m-bus-parser-cli) [![Downloads](https://img.shields.io/crates/d/m-bus-parser-cli.svg)](https://crates.io/crates/m-bus-parser-cli)

There is a cli, the source is in the sub folder "cli" and is published on crates.io [https://crates.io/crates/m-bus-parser-cli](https://crates.io/crates/m-bus-parser-cli).


### Visualization of Library Function

Do not get confused about the different types of frame types. The most important one to understand at first is the `LongFrame` which is the most common frame type. The others are for example for searching for a slave or for setting the primary address of a slave. This is not of primary intrest for most users. Visualization was made with the help of the tool [excalidraw](https://excalidraw.com/).
Expand Down
2 changes: 1 addition & 1 deletion cli/Cargo.toml
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
[package]
name = "m-bus-parser-cli"
version = "0.0.4"
version = "0.0.3"
edition = "2021"
description = "A cli to use the library for parsing M-Bus frames"
license = "MIT"
Expand Down
122 changes: 122 additions & 0 deletions docs/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,122 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<title>Wired M-Bus Parser</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.0/styles/default.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.0/highlight.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.0/languages/json.min.js"></script>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 20px;
background-color: #ffffff;
}

.header {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 20px;
}

.header img {
margin-right: 10px;
}

h1 {
color: #333;
margin: 0;
}

form {
background: #fff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
max-width: 600px;
margin: 0 auto;
}

label {
display: block;
margin-bottom: 8px;
font-weight: bold;
}

textarea {
width: 100%;
padding: 10px;
border: 1px solid #ddd;
border-radius: 4px;
box-sizing: border-box;
margin-bottom: 10px;
font-family: monospace;
}

input[type="button"] {
background-color: #4CAF50;
color: white;
padding: 10px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
}

input[type="button"]:hover {
background-color: #45a049;
}

pre {
background: #f0f0f0;
padding: 10px;
border-radius: 4px;
white-space: pre-wrap;
word-wrap: break-word;
}

#output {
margin-top: 20px;
max-width: 600px;
margin: 20px auto 0;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
</style>
</head>

<body>
<div class="header">
<img id="banner" src="meter.png" alt="Meter Banner">
<h1>Wired M-Bus Parser with WASM</h1>
</div>
<form>
<label for="inputstring">Input String:</label>
<textarea rows="5" cols="80" id="inputstring"></textarea>
<input id="m_bus_parse" type="button" value="Parse JSON" />
</form>
<pre id="output"></pre>
<script type="module">
import init, { m_bus_parse } from "./m_bus_parser_wasm_pack.js";

async function setup() {
await init(); // Ensure the WASM module is initialized

document.getElementById('m_bus_parse').addEventListener('click', () => {
const inputString = document.getElementById('inputstring').value;
const result = m_bus_parse(inputString);
const formattedResult = JSON.stringify(JSON.parse(result), null, 2); // Pretty-print the JSON
const outputElement = document.getElementById("output");
outputElement.textContent = formattedResult;
hljs.highlightElement(outputElement); // Apply syntax highlighting
});
}

setup(); // Set up the event listeners after the page is loaded
</script>
</body>

</html>
Loading

0 comments on commit c439f4c

Please sign in to comment.