Feat: wowza got it all working

This commit is contained in:
Jonathan Kelley 2021-03-02 00:14:28 -05:00
parent da00df6688
commit 4b8e9f4a12
8 changed files with 233 additions and 105 deletions

View file

@ -1,13 +1,13 @@
[workspace]
members = [
# Built-in
"packages/dioxus",
"packages/core-macro",
# "packages/dioxus",
# "packages/core",
"packages/core",
"packages/web",
# "packages/router",
# "packages/ssr",
# "packages/webview",
# "packages/web",
# "packages/livehost",
# "packages/vscode-ext",
# "packages/recoil",
@ -16,7 +16,7 @@ members = [
# TODO @Jon, share the validation code
# "packages/web",
# "packages/hooks",
# "packages/cli",
"packages/cli",
# "examples",
# "packages/html-macro",
# "packages/html-macro-2",

View file

@ -16,24 +16,21 @@ static Example: FC<()> = |ctx, props| {
ctx.render(rsx! {
div {
h1 { "Hello, {selection}" }
button { "?", onclick: move |_| set_selection("world!") }
button { "?", onclick: move |_| set_selection("Dioxus 🎉") }
button { "?", onclick: {move |_| set_selection("world!")}}
button { "?", onclick: {move |_| set_selection("Dioxus 🎉")}}
}
})
};
```
Dioxus can be used to deliver webapps, desktop apps, static pages, liveview apps, Android apps, iOS Apps, and more. At its core, Dioxus is entirely renderer agnostic and has great documentation for creating new renderers for any platform.
### **Things you'll love ❤️:**
- Minimal boilerplate
- Ergonomic lifetime design for props and state management
- Simple build, test, and deploy
- "Dioxus Designer" for instant component reloading
- Support for html! and rsx! templating
- Support for html! **and** rsx! templating
- SSR, WASM, desktop, and mobile support

View file

@ -12,7 +12,7 @@ description = "CLI tool for developing, testing, and publishing Dioxus apps"
thiserror = "1.0.23"
log = "0.4.13"
fern = { version = "0.6.0", features = ["colored"] }
wasm-bindgen-cli-support = "0.2.70"
wasm-bindgen-cli-support = "0.2.71"
anyhow = "1.0.38"
argh = "0.1.4"
serde = "1.0.120"

View file

@ -1,46 +1,127 @@
use dioxus_core_macro::rsx;
pub mod dioxus {
pub mod builder {
pub struct Builder;
struct AttrVal;
impl Into<AttrVal> for &'static str {
fn into(self) -> AttrVal {
todo!()
}
}
impl Into<AttrVal> for String {
fn into(self) -> AttrVal {
todo!()
}
}
// impl<T> From<T> for AttrVal {
// fn from(_: T) -> Self {
// todo!()
// }
// }
impl Builder {
// fn attr<T>(mut self, key: &str, value: impl Into<AttrVal>) -> Self {
pub fn attr<T>(mut self, key: &str, value: T) -> Self {
Self
}
pub fn on<T>(mut self, key: &str, value: T) -> Self {
Self
}
pub fn finish(mut self) {
// Self
}
}
pub struct Bump;
pub fn div(bump: &Bump) -> Builder {
todo!()
}
pub fn h1(bump: &Bump) -> Builder {
todo!()
}
pub fn h2(bump: &Bump) -> Builder {
todo!()
}
}
}
use dioxus::builder::Bump;
pub fn main() {
// render(rsx! {
// _ {}
// div { // we can actually support just a list of nodes too
// h1 {"Hello Dioxus"}
// p {"This is a beautful app you're building"}
// section {
// "custom section to the rescue",
// class: "abc123"
// }
// span {
// class: "abc123"
// "Try backwards too."
// "Anything goes!"
// "As long as it's within the rules"
// {0..10.map(|f| rsx!{
// div {
// h3 {"totally okay to drop in iterators and expressions"}
// p {"however, debug information is lost"}
// }
// })}
// }
// span {
// "Feel free"
// class: "abc123"
// "To mix to your heart's content"
// }
// span { class: "some-very-long-and-tedious-class-name-is-now-separated"
// "Very ergonomic"
// }
// span { "Innovative design 🛠"
// class: "some-very-long-and-tedious-class-name-is-now-separated"
// }
// }
// });
let g = String::from("asd");
let lazy = rsx! {
div {
a: "asd",
a: "asd",
a: "asd",
a: "asd",
a: "asd",
a: {rsx!{ h1 {"hello world"} }}, // include
a: {g},
b: {1 + 2},
onclick: {move |_| {
println!("hello world!")
}},
div {
a: "asd"
div {
div {
div {
// let lazy = rsx! {
// div {
// a: "asd",
// a: "asd",
// a: "asd",
// a: "asd",
// a: "asd",
// // a: {rsx!{ h1 {"hello world"} }}, // include
// a: {&g},
// b: {1 + 2},
// onclick: {move |e: ()| {
// println!("hello world!")
// }},
// div {
// a: "asd"
// div {
// div {
// div {
}
}
}
}
h1 {
// }
// }
// }
// }
// h1 {
}
h2 {
"child"
}
"Childnode"
}
};
// }
// h2 {
// "child"
// }
// "Childnode"
// }
// };
render(lazy);
// render(lazy);
}
fn render(f: impl Fn(())) {}
fn render(f: impl Fn(&dioxus::builder::Bump)) {}

View file

@ -49,7 +49,9 @@ use {
// ==============================================
// Parse any stream coming from the rsx! macro
// ==============================================
pub struct RsxRender {}
pub struct RsxRender {
el: Element,
}
impl Parse for RsxRender {
fn parse(input: ParseStream) -> Result<Self> {
@ -57,20 +59,22 @@ impl Parse for RsxRender {
// can only accept one root per component
// fragments can be used as
// _ { content }
let g: Element = input.parse()?;
Ok(Self {})
let el: Element = input.parse()?;
Ok(Self { el })
}
}
impl ToTokens for RsxRender {
fn to_tokens(&self, tokens: &mut TokenStream2) {
let new_toks = quote! {
move |_| {
todo!()
}
fn to_tokens(&self, out_tokens: &mut TokenStream2) {
let new_toks = ToToksCtx::new(&self.el).to_token_stream();
// let new_toks = ToToksCtx::new(&self.kind).to_token_stream();
// create a lazy tree that accepts a bump allocator
let final_tokens = quote! {
move |bump: &Bump| { #new_toks }
};
new_toks.to_tokens(tokens)
final_tokens.to_tokens(out_tokens);
}
}
@ -100,14 +104,23 @@ impl ToTokens for ToToksCtx<&Node> {
impl Parse for Node {
fn parse(s: ParseStream) -> Result<Self> {
let fork = s.fork();
if let Ok(text) = fork.parse::<TextNode>() {
let ret = if let Ok(text) = fork.parse::<TextNode>() {
s.advance_to(&fork);
return Ok(Self::Text(text));
Ok(Self::Text(text))
} else if let Ok(el) = s.parse::<Element>() {
return Ok(Self::Element(el));
Ok(Self::Element(el))
} else {
// TODO: Span information
panic!("Not a valid child node");
};
// consume comma if it exists
// we don't actually care if there *are* commas after elements/text
if s.peek(Token![,]) {
let _ = s.parse::<Token![,]>();
}
ret
}
}
@ -125,37 +138,37 @@ struct Element {
impl ToTokens for ToToksCtx<&Element> {
fn to_tokens(&self, tokens: &mut TokenStream2) {
todo!()
// todo!()
// // let ctx = self.ctx;
// let name = &self.inner.name;
// tokens.append_all(quote! {
// dioxus::builder::#name(bump)
// });
// for attr in self.inner.attrs.iter() {
// self.recurse(attr).to_tokens(tokens);
// }
// match &self.inner.children {
// MaybeExpr::Expr(expr) => tokens.append_all(quote! {
// .children(#expr)
// }),
// MaybeExpr::Literal(nodes) => {
// let mut children = nodes.iter();
// if let Some(child) = children.next() {
// let mut inner_toks = TokenStream2::new();
// self.recurse(child).to_tokens(&mut inner_toks);
// while let Some(child) = children.next() {
// quote!(,).to_tokens(&mut inner_toks);
// self.recurse(child).to_tokens(&mut inner_toks);
// }
// tokens.append_all(quote! {
// .children([#inner_toks])
// });
// }
// }
// }
// tokens.append_all(quote! {
// .finish()
// });
let name = &self.inner.name;
tokens.append_all(quote! {
dioxus::builder::#name(bump)
});
for attr in self.inner.attrs.iter() {
self.recurse(attr).to_tokens(tokens);
}
match &self.inner.children {
MaybeExpr::Expr(expr) => tokens.append_all(quote! {
.children(#expr)
}),
MaybeExpr::Literal(nodes) => {
let mut children = nodes.iter();
if let Some(child) = children.next() {
let mut inner_toks = TokenStream2::new();
self.recurse(child).to_tokens(&mut inner_toks);
while let Some(child) = children.next() {
quote!(,).to_tokens(&mut inner_toks);
self.recurse(child).to_tokens(&mut inner_toks);
}
tokens.append_all(quote! {
.children([#inner_toks])
});
}
}
}
tokens.append_all(quote! {
.finish()
});
}
}
@ -214,7 +227,8 @@ impl Parse for Element {
panic!("Entry is not an attr or element\n {}", content)
}
let children = MaybeExpr::Literal(Vec::new());
let children = MaybeExpr::Literal(children);
// let children = MaybeExpr::Literal(Vec::new());
// // Contents of an element can either be a brace (in which case we just copy verbatim), or a
// // sequence of nodes.
// let children = if s.peek(token::Brace) {

View file

@ -12,23 +12,21 @@ struct ButtonProps<'a> {
fn CustomButton(ctx: Context, props: ButtonProps) -> DomTree {
let onfocus = move |evt: ()| log::debug!("Focused");
ctx.render(rsx! {
button {
// ..props.attrs,
class: "abc123",
style: { a: 2, b: 3, c: 4 },
onclick: move |evt| {
log::info("hello world");
},
onfocus,
onhover: props.onhover,
Custom1 { a: 123 }
Custom2 { a: 456, "abc", h1 {"1"}, h2 {"2"} }
Custom3 { a: "sometext goes here" }
Custom4 { onclick: |evt| log::info("click") }
}
})
todo!()
// ctx.render(rsx! {
// // button {
// // // ..props.attrs,
// // class: "abc123",
// // // style: { a: 2, b: 3, c: 4 },
// // onclick: {move |evt| {
// // log::info("hello world");
// // }},
// // // Custom1 { a: 123 }
// // // Custom2 { a: 456, "abc", h1 {"1"}, h2 {"2"} }
// // // Custom3 { a: "sometext goes here" }
// // // Custom4 { onclick: |evt| log::info("click") }
// // }
// })
}
// h1 {

View file

@ -10,7 +10,7 @@ license = "MIT/Apache-2.0"
[dependencies]
dioxus-core = { path = "../core", version = "0.1.2" }
js-sys = "0.3"
wasm-bindgen = "0.2.69"
wasm-bindgen = "0.2.71"
# wasm-bindgen = "0.2.70"
lazy_static = "1.4.0"
wasm-bindgen-futures = "0.4.20"

View file

@ -0,0 +1,38 @@
use bumpalo::Bump;
use dioxus::prelude::*;
use dioxus_core as dioxus;
use dioxus_web::WebsysRenderer;
fn main() {
wasm_logger::init(wasm_logger::Config::new(log::Level::Debug));
console_error_panic_hook::set_once();
wasm_bindgen_futures::spawn_local(WebsysRenderer::start(Example))
}
static Example: FC<()> = |ctx, props| {
let (name, set_name) = use_state(&ctx, || "...?");
ctx.render(rsx! {
div { class: "py-12 px-4 text-center w-full max-w-2xl mx-auto"
span { "Dioxus Example: Jack and Jill",
class: "text-sm font-semibold"
}
h2 { "Hello, {name}",
class: "text-5xl mt-2 mb-6 leading-tight font-semibold font-heading"
}
div {
button { "Jack!"
class: "inline-block py-4 px-8 mr-6 leading-none text-white bg-indigo-600 hover:bg-indigo-900 font-semibold rounded shadow"
onclick: {move |_| set_name("jack")}
}
button { "Jill!"
class: "inline-block py-4 px-8 mr-6 leading-none text-white bg-indigo-600 hover:bg-indigo-900 font-semibold rounded shadow"
onclick: {move |_| set_name("jill")}
onclick: {move |_| set_name("jill")}
}
}
}
})
};