ui stuff

src/bin/client/ui/channel.rs

@@ -0,0 +1,67 @@
+use super::*;
+
+pub fn view(rsc: &mut Rsc) -> StrongWidget {
+    let msg_panel = msg_panel(rsc);
+    let side_bar = rect(Color::BLACK.alpha(150)).width(260);
+
+    (side_bar, msg_panel).span(Dir::RIGHT).add_strong(rsc)
+}
+
+pub fn msg_widget(username: &str, content: &str) -> impl WidgetIdFn<Rsc> {
+    let content = wtext(content)
+        .editable(EditMode::MultiLine)
+        .size(SIZE)
+        .wrap(true)
+        .attr::<Selectable>(());
+    let header = wtext(username).size(SIZE);
+    (
+        image(include_bytes!("../assets/sungals.png"))
+            .sized((70, 70))
+            .align(Align::TOP),
+        (header, content)
+            .span(Dir::DOWN)
+            .gap(10)
+            .width(rest(1))
+            .align(Align::TOP),
+    )
+        .span(Dir::RIGHT)
+        .gap(10)
+        .to_any()
+}
+
+pub fn msg_panel(rsc: &mut Rsc) -> WeakWidget {
+    let msg_area = Span::empty(Dir::DOWN).gap(15);
+
+    let send_text = wtext("")
+        .editable(EditMode::MultiLine)
+        .size(SIZE)
+        .wrap(true)
+        .hint(hint_text("send message"))
+        .add(rsc);
+
+    let msg_area = msg_area.add(rsc);
+
+    (
+        msg_area
+            .scrollable()
+            .pad(Padding::x(15).with_top(15))
+            .height(rest(1)),
+        send_text
+            .on(Submit, move |ctx, rsc| {
+                let content = ctx.widget.edit(rsc).take();
+                let msg = msg_widget("ur mothe:", &content).add_strong(rsc);
+                rsc[msg_area].children.push(msg);
+            })
+            .pad(15)
+            .attr::<Selector>(send_text)
+            .scrollable()
+            .masked()
+            .background(rect(Color::BLACK.brighter(0.05)).radius(15))
+            .pad(15)
+            .max_height(rel(0.5))
+            .layer_offset(1),
+    )
+        .span(Dir::DOWN)
+        .width(rest(1))
+        .add(rsc)
+}