[−][src]Crate sauron
One crate to rule the DOM
One crate to mind it
One crate to bring JSON
And in the Rust code bind it
This code, no other, is made by code elves
Who'd pawn parent process to get it themselves
Ruler of net troll and mortal and hacker
This code is a lib crate for Patreon backers
If trashed or buggy it cannot be remade
If found send to Ivan, the bandwidth is prepaid
-- The Harvard Lampoon & po8
Sauron is an html web framework for building web-apps with the goal of closely adhering to The Elm Architecture, a paragon for elegant design.
As with elm, sauron follows the simplistic design of writing view code.
Example
use sauron::prelude::*; use wasm_bindgen::prelude::*; use log::*; #[derive(Debug, PartialEq, Clone)] pub enum Msg { Click, } pub struct App { click_count: u32, } impl App { pub fn new() -> Self { App { click_count: 0 } } } impl Component<Msg> for App { fn view(&self) -> Node<Msg> { div!( [class("some-class"), id("some-id"), attr("data-id", 1)], [ input!( [ class("client"), type_("button"), value("Click me!"), onclick(|_| { trace!("Button is clicked"); Msg::Click }), ], [], ), text!("Clicked: {}", self.click_count), ], ) } fn update(&mut self, msg: Msg) -> Cmd<Self, Msg> { trace!("App is updating from msg: {:?}", msg); match msg { Msg::Click => { self.click_count += 1; Cmd::none() } } } } #[wasm_bindgen(start)] pub fn main() { Program::mount_to_body(App::new()); }
index.html
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
<title>Minimal sauron app</title>
</head>
<body>
<script src='pkg/minimal.js'></script>
<script type=module>
window.wasm_bindgen('pkg/minimal_bg.wasm')
.catch(console.error);
</script>
</body>
</html>
In Cargo.toml, specify the crate-type to be cdylib
[lib]
crate-type = ["cdylib"]
Note: You need to use the nightly compiler with minimum version: rustc 1.37.0-nightly (17e62f77f 2019-07-01)
Build using
$> wasm-pack build --target no-modules
Look at the examples and the build script for the details.
Demo examples
- data-viewer - A resizable spreadsheet csv data viewer
- svg_clock - A clock drawn using svg and window tick event.
- svg_graph - A simple graph using svg
Convert html to sauron syntax
html2sauron - A tool to easily convert html into sauron node tree for your views.
Prerequisite:
cargo install wasm-pack
cargo install basic-http-server
Warning: I repeat, You need to use the latest nightly compiler in order for this to work.
Performance:
Please support this project:
Re-exports
pub use dom::*; |
pub use sauron_vdom; |
Modules
| dom | |
| html | |
| prelude | Prelude simplifies the imports from sauron This imports the necessary functions to build a basic sauron app. |
| svg |
Macros
Structs
| Callback | A generic sized representation of a function that can be attached to a Node. The callback will essentially be owned by the element |
| DomEvent | This needs wrapping only so that we can implement PartialEq for testing purposes |
| Text |
Enums
| Value | Value is an abstraction of the values used in the actual backend. Html and gtk-rs have different set of compatible values therefore a need for a storage of these intermediate value is needed |
Functions
| diff | This is a sauron html specific functionality
diff 2 nodes with attribute using |
| markdown | |
| render_markdown | Renders a string of Markdown to HTML with the default options (footnotes disabled, tables enabled). |
Type Definitions
| Attribute | |
| Element | |
| Event | |
| Node | A simplified version of saurdon_vdom node, where we supplied the type for the tag which is a &'static str. The missing type is now only MSG which will be supplied by the users App code. |
| Patch |