Small optimisations

This commit is contained in:
Adrian Woźniak 2020-10-19 14:42:25 +02:00
parent 46fafb619c
commit 8e939faebd
6 changed files with 314 additions and 287 deletions

View File

@ -16,6 +16,72 @@ pub enum RteField {
CodeLang(Box<FieldId>), CodeLang(Box<FieldId>),
} }
#[derive(Clone, Debug, PartialOrd, PartialEq, Hash)]
pub enum ButtonId {
JustifyAll,
JustifyCenter,
JustifyLeft,
JustifyRight,
Undo,
Redo,
RemoveFormat,
Bold,
Italic,
Underscore,
Strikethrough,
Subscript,
Superscript,
Font,
ListingDots,
ListingNumber,
Table,
Paragraph,
CodeAlt,
Indent,
Outdent,
CloseRteTableTooltip,
RteInsertCode,
RteInjectCode,
RteInsertTable,
}
impl ButtonId {
pub fn to_str<'l>(&self) -> &'l str {
match self {
ButtonId::JustifyAll => "justifyAll",
ButtonId::JustifyCenter => "justifyCenter",
ButtonId::JustifyLeft => "justifyLeft",
ButtonId::JustifyRight => "justifyRight",
ButtonId::Undo => "undo",
ButtonId::Redo => "redo",
ButtonId::RemoveFormat => "removeFormat",
ButtonId::Bold => "bold",
ButtonId::Italic => "italic ",
ButtonId::Underscore => "underscore",
ButtonId::Strikethrough => "strikethrough",
ButtonId::Subscript => "subscript",
ButtonId::Superscript => "superscript",
ButtonId::Font => "font",
ButtonId::ListingDots => "listingDots",
ButtonId::ListingNumber => "listingNumber",
ButtonId::Table => "table",
ButtonId::Paragraph => "paragraph",
ButtonId::CodeAlt => "codeAlt",
ButtonId::Indent => "indent",
ButtonId::Outdent => "outdent",
ButtonId::CloseRteTableTooltip => "closeRteTableTooltip",
ButtonId::RteInsertCode => "rteInsertCode",
ButtonId::RteInjectCode => "rteInjectCode",
ButtonId::RteInsertTable => "rteInsertTable",
}
}
}
#[derive(Clone, Debug, PartialOrd, PartialEq, Hash)] #[derive(Clone, Debug, PartialOrd, PartialEq, Hash)]
pub enum FieldId { pub enum FieldId {
SignIn(SignInFieldId), SignIn(SignInFieldId),

View File

@ -132,14 +132,17 @@ fn update(msg: Msg, model: &mut model::Model, orders: &mut impl Orders<Msg>) {
flush_queue(model, orders); flush_queue(model, orders);
send_ws_msg(WsMsg::Ping, model.ws.as_ref(), orders); send_ws_msg(WsMsg::Ping, model.ws.as_ref(), orders);
authorize_or_redirect(model, orders); authorize_or_redirect(model, orders);
orders.skip();
return; return;
} }
WebSocketChanged::SendPing => { WebSocketChanged::SendPing => {
send_ws_msg(WsMsg::Ping, model.ws.as_ref(), orders); send_ws_msg(WsMsg::Ping, model.ws.as_ref(), orders);
orders.skip();
return; return;
} }
WebSocketChanged::WebSocketMessage(incoming) => { WebSocketChanged::WebSocketMessage(incoming) => {
orders.perform_cmd(read_incoming(incoming)); orders.perform_cmd(read_incoming(incoming));
orders.skip();
return; return;
} }
WebSocketChanged::WsMsg(ref ws_msg) => { WebSocketChanged::WsMsg(ref ws_msg) => {
@ -276,8 +279,8 @@ pub fn render(host_url: String, ws_url: String) {
HOST_URL = host_url; HOST_URL = host_url;
WS_URL = ws_url; WS_URL = ws_url;
} }
{ if !cfg!(debug_assertions) {
// crate::hi::syntax_set::load(); crate::hi::syntax_set::load();
} }
elements::define(); elements::define();

View File

@ -104,23 +104,18 @@ pub fn render(values: StyledAvatar) -> Node<Msg> {
size, size,
name, name,
on_click, on_click,
mut class_list, class_list,
user_index, user_index,
} = values; } = values;
let index = user_index % 8; let index = user_index % 8;
class_list.push("styledAvatar");
match avatar_url {
Some(_) => class_list.push("image"),
_ => class_list.push("letter"),
};
let shared_style = format!("width: {size}px; height: {size}px", size = size); let shared_style = format!("width: {size}px; height: {size}px", size = size);
let handler = match on_click { let handler = match on_click {
None => vec![], None => vec![],
Some(h) => vec![h], Some(h) => vec![h],
}; };
let class_list: Vec<Attrs> = class_list.into_iter().map(|s| class![s]).collect();
let letter = name let letter = name
.chars() .chars()
.rev() .rev()
@ -135,8 +130,11 @@ pub fn render(values: StyledAvatar) -> Node<Msg> {
url = url url = url
); );
div![ div![
attrs![At::Class => class_list.join(" "), At::Style => style], class!["styledAvatar"],
handler, class!["image"],
class_list,
attrs![At::Style => style, At::Title => name],
handler
] ]
} }
_ => { _ => {
@ -146,10 +144,11 @@ pub fn render(values: StyledAvatar) -> Node<Msg> {
size = size size = size
); );
div![ div![
class!["styledAvatar"],
class!["letter"], class!["letter"],
class_list,
attrs![ attrs![
At::Class => format!("avatarColor{}", index + 1), At::Class => format!("avatarColor{}", index + 1),
At::Class => class_list.join(" "),
At::Style => style At::Style => style
], ],
span![letter], span![letter],

View File

@ -1,7 +1,7 @@
use seed::{prelude::*, *}; use seed::{prelude::*, *};
use crate::shared::ToNode; use crate::shared::ToNode;
use crate::Msg; use crate::{ButtonId, Msg};
#[allow(dead_code)] #[allow(dead_code)]
enum Variant { enum Variant {
@ -41,6 +41,7 @@ pub struct StyledButtonBuilder<'l> {
children: Option<Vec<Node<Msg>>>, children: Option<Vec<Node<Msg>>>,
class_list: Vec<&'l str>, class_list: Vec<&'l str>,
button_type: Option<&'l str>, button_type: Option<&'l str>,
button_id: Option<ButtonId>,
} }
impl<'l> StyledButtonBuilder<'l> { impl<'l> StyledButtonBuilder<'l> {
@ -69,6 +70,11 @@ impl<'l> StyledButtonBuilder<'l> {
self.variant(Variant::Empty) self.variant(Variant::Empty)
} }
pub fn button_id(mut self, button_id: ButtonId) -> Self {
self.button_id = Some(button_id);
self
}
pub fn disabled(mut self, value: bool) -> Self { pub fn disabled(mut self, value: bool) -> Self {
self.disabled = Some(value); self.disabled = Some(value);
self self
@ -123,6 +129,7 @@ impl<'l> StyledButtonBuilder<'l> {
children: self.children.unwrap_or_default(), children: self.children.unwrap_or_default(),
class_list: self.class_list, class_list: self.class_list,
button_type: self.button_type.unwrap_or_else(|| "submit"), button_type: self.button_type.unwrap_or_else(|| "submit"),
button_id: self.button_id,
} }
} }
} }
@ -137,6 +144,7 @@ pub struct StyledButton<'l> {
children: Vec<Node<Msg>>, children: Vec<Node<Msg>>,
class_list: Vec<&'l str>, class_list: Vec<&'l str>,
button_type: &'l str, button_type: &'l str,
button_id: Option<ButtonId>,
} }
impl<'l> StyledButton<'l> { impl<'l> StyledButton<'l> {
@ -162,8 +170,8 @@ pub fn render(values: StyledButton) -> Node<Msg> {
children, children,
mut class_list, mut class_list,
button_type, button_type,
button_id,
} = values; } = values;
class_list.push("styledButton");
class_list.push(variant.to_str()); class_list.push(variant.to_str());
if children.is_empty() && text.is_none() { if children.is_empty() && text.is_none() {
class_list.push("iconOnly"); class_list.push("iconOnly");
@ -183,16 +191,17 @@ pub fn render(values: StyledButton) -> Node<Msg> {
let content = if children.is_empty() && text.is_none() { let content = if children.is_empty() && text.is_none() {
empty![] empty![]
} else { } else {
span![ span![class!["text"], text.unwrap_or_default(), children]
attrs![At::Class => "text"],
text.unwrap_or_default(),
children
]
}; };
let class_list: Vec<Attrs> = class_list.into_iter().map(|s| class![s]).collect();
let button_id = button_id.map(|id| id.to_str()).unwrap_or_default();
seed::button![ seed::button![
class!["styledButton"],
class_list,
attrs![ attrs![
At::Class => class_list.join(" "), At::Id => button_id,
At::Type => button_type, At::Type => button_type,
], ],
handler, handler,

View File

@ -5,7 +5,7 @@ use crate::shared::styled_icon::{Icon, StyledIcon};
use crate::shared::styled_select::{StyledSelect, StyledSelectState}; use crate::shared::styled_select::{StyledSelect, StyledSelectState};
use crate::shared::styled_tooltip::StyledTooltip; use crate::shared::styled_tooltip::StyledTooltip;
use crate::shared::{ToChild, ToNode}; use crate::shared::{ToChild, ToNode};
use crate::{FieldId, Msg, RteField}; use crate::{ButtonId, FieldId, Msg, RteField};
#[derive(Debug, Clone, Copy)] #[derive(Debug, Clone, Copy)]
pub enum HeadingSize { pub enum HeadingSize {
@ -19,10 +19,10 @@ pub enum HeadingSize {
} }
impl HeadingSize { impl HeadingSize {
fn all() -> Vec<Self> { fn all<'l>() -> &'l [Self; 7] {
use HeadingSize::*; use HeadingSize::*;
vec![Normal, H1, H2, H3, H4, H5, H6] &[Normal, H1, H2, H3, H4, H5, H6]
} }
} }
@ -304,8 +304,7 @@ impl StyledRteState {
.lang .lang
.values .values
.get(0) .get(0)
.cloned() .and_then(|idx| self.code_tooltip.languages.get(*idx as usize))
.and_then(|idx| self.code_tooltip.languages.get(idx as usize))
{ {
Some(v) => v.to_string(), Some(v) => v.to_string(),
_ => return, _ => return,
@ -424,7 +423,7 @@ pub struct StyledRte<'component> {
impl<'component> StyledRte<'component> { impl<'component> StyledRte<'component> {
pub fn build(field_id: FieldId) -> StyledRteBuilder<'component> { pub fn build(field_id: FieldId) -> StyledRteBuilder<'component> {
StyledRteBuilder { StyledRteBuilder {
field_id: field_id.clone(), field_id,
value: String::new(), value: String::new(),
table_tooltip: None, table_tooltip: None,
code_tooltip: None, code_tooltip: None,
@ -556,13 +555,85 @@ pub fn render(values: StyledRte) -> Node<Msg> {
let id = values.identifier.unwrap_or_default().to_string(); let id = values.identifier.unwrap_or_default().to_string();
let click_handler = {
let field_id = values.field_id.clone();
let (rows, cols) = values
.table_tooltip
.as_ref()
.map(|t| (t.rows, t.cols))
.unwrap_or_default();
mouse_ev(Ev::Click, move |ev| {
ev.prevent_default();
ev.stop_propagation();
let target = ev
.current_target()
.map(|el| seed::to_html_el(&el).id())
.unwrap_or_default();
let rte_msg = match target.as_str() {
"justifyAll" => RteMsg::JustifyFull,
"justifyCenter" => RteMsg::JustifyCenter,
"justifyLeft" => RteMsg::JustifyLeft,
"justifyRight" => RteMsg::JustifyRight,
"undo" => RteMsg::Undo,
"redo" => RteMsg::Redo,
"removeFormat" => RteMsg::RemoveFormat,
"bold" => RteMsg::Bold,
"italic " => RteMsg::Italic,
"underscore" => RteMsg::Underscore,
"strikethrough" => RteMsg::Strikethrough,
"subscript" => RteMsg::Subscript,
"superscript" => RteMsg::Superscript,
// "font" => RteMsg::, // Some(RteMsg::Font),
"listingDots" => RteMsg::InsertUnorderedList,
"listingNumber" => RteMsg::InsertOrderedList,
"table" => RteMsg::TableSetVisibility(true),
"paragraph" => RteMsg::InsertParagraph,
"codeAlt" => RteMsg::InsertCode(true),
"indent" => RteMsg::ChangeIndent(RteIndentMsg::Increase),
"outdent" => RteMsg::ChangeIndent(RteIndentMsg::Decrease),
"closeRteTableTooltip" => RteMsg::TableSetVisibility(false),
"rteInsertCode" => RteMsg::InsertCode(false),
"rteInjectCode" => RteMsg::InjectCode,
"rteInsertTable" => RteMsg::InsertTable { rows, cols },
_ => {
let target = ev.target().unwrap();
let h = seed::to_html_el(&target);
log!(h);
unreachable!();
}
};
Msg::Rte(field_id, rte_msg)
})
};
let change_handler = {
let field_id = values.field_id.clone();
ev(Ev::Change, move |event| {
event
.target()
.as_ref()
.ok_or("Can't get event target reference")
.and_then(util::get_value)
.ok()
.and_then(|s| s.parse::<u16>().ok())
.map(|n| Msg::Rte(field_id, RteMsg::TableSetRows(n)))
})
};
div![ div![
C!["styledRte"], C!["styledRte"],
attrs![At::Id => id], attrs![At::Id => id],
div![ div![
C!["bar"], C!["bar"],
first_row(&values), first_row(click_handler.clone()),
second_row(&values), second_row(&values, click_handler, change_handler),
// brush_button, // brush_button,
// color_bucket_button, // color_bucket_button,
// color_picker_button, // color_picker_button,
@ -584,45 +655,31 @@ pub fn render(values: StyledRte) -> Node<Msg> {
] ]
} }
fn first_row(values: &StyledRte) -> Node<Msg> { fn first_row(click_handler: EventHandler<Msg>) -> Node<Msg> {
let justify = { let justify = {
let field_id = values.field_id.clone();
let justify_all_button = styled_rte_button( let justify_all_button = styled_rte_button(
"Justify All", "Justify All",
ButtonId::JustifyAll,
Icon::JustifyAll, Icon::JustifyAll,
mouse_ev(Ev::Click, move |ev| { click_handler.clone(),
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::JustifyFull))
}),
); );
let field_id = values.field_id.clone();
let justify_center_button = styled_rte_button( let justify_center_button = styled_rte_button(
"Justify Center", "Justify Center",
ButtonId::JustifyCenter,
Icon::JustifyCenter, Icon::JustifyCenter,
mouse_ev(Ev::Click, move |ev| { click_handler.clone(),
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::JustifyCenter))
}),
); );
let field_id = values.field_id.clone();
let justify_left_button = styled_rte_button( let justify_left_button = styled_rte_button(
"Justify Left", "Justify Left",
ButtonId::JustifyLeft,
Icon::JustifyLeft, Icon::JustifyLeft,
mouse_ev(Ev::Click, move |ev| { click_handler.clone(),
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::JustifyLeft))
}),
); );
let field_id = values.field_id.clone();
let justify_right_button = styled_rte_button( let justify_right_button = styled_rte_button(
"Justify Right", "Justify Right",
ButtonId::JustifyRight,
Icon::JustifyRight, Icon::JustifyRight,
mouse_ev(Ev::Click, move |ev| { click_handler.clone(),
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::JustifyRight))
}),
); );
div![ div![
class!["group justify"], class!["group justify"],
@ -634,24 +691,10 @@ fn first_row(values: &StyledRte) -> Node<Msg> {
}; };
let system = { let system = {
let field_id = values.field_id.clone(); let redo_button =
let redo_button = styled_rte_button( styled_rte_button("Redo", ButtonId::Redo, Icon::Redo, click_handler.clone());
"Redo", let undo_button =
Icon::Redo, styled_rte_button("Undo", ButtonId::Undo, Icon::Undo, click_handler.clone());
mouse_ev(Ev::Click, move |ev| {
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::Redo))
}),
);
let field_id = values.field_id.clone();
let undo_button = styled_rte_button(
"Undo",
Icon::Undo,
mouse_ev(Ev::Click, move |ev| {
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::Undo))
}),
);
/*let field_id = values.field_id.clone(); /*let field_id = values.field_id.clone();
let clip_board_button = styled_rte_button( let clip_board_button = styled_rte_button(
"Paste", "Paste",
@ -690,81 +733,48 @@ fn first_row(values: &StyledRte) -> Node<Msg> {
}; };
let formatting = { let formatting = {
let field_id = values.field_id.clone();
let remove_formatting = styled_rte_button( let remove_formatting = styled_rte_button(
"Remove format", "Remove format",
ButtonId::RemoveFormat,
Icon::EraserAlt, Icon::EraserAlt,
mouse_ev(Ev::Click, move |ev| { click_handler.clone(),
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::RemoveFormat))
}),
); );
let field_id = values.field_id.clone(); let bold_button =
let bold_button = styled_rte_button( styled_rte_button("Bold", ButtonId::Bold, Icon::Bold, click_handler.clone());
"Bold",
Icon::Bold,
mouse_ev(Ev::Click, move |ev| {
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::Bold))
}),
);
let field_id = values.field_id.clone();
let italic_button = styled_rte_button( let italic_button = styled_rte_button(
"Italic", "Italic",
ButtonId::Italic,
Icon::Italic, Icon::Italic,
mouse_ev(Ev::Click, move |ev| { click_handler.clone(),
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::Italic))
}),
); );
let underline_button = { let underline_button = styled_rte_button(
let field_id = values.field_id.clone(); "Underline",
styled_rte_button( ButtonId::Underscore,
"Underline", Icon::Underline,
Icon::Underline, click_handler.clone(),
mouse_ev(Ev::Click, move |ev| { );
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::Underscore))
}),
)
};
let strike_through_button = { let strike_through_button = styled_rte_button(
let field_id = values.field_id.clone(); "StrikeThrough",
styled_rte_button( ButtonId::Strikethrough,
"StrikeThrough", Icon::StrikeThrough,
Icon::StrikeThrough, click_handler.clone(),
mouse_ev(Ev::Click, move |ev| { );
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::Strikethrough))
}),
)
};
let subscript_button = { let subscript_button = styled_rte_button(
let field_id = values.field_id.clone(); "Subscript",
styled_rte_button( ButtonId::Subscript,
"Subscript", Icon::Subscript,
Icon::Subscript, click_handler.clone(),
mouse_ev(Ev::Click, move |ev| { );
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::Subscript))
}),
)
};
let superscript_button = { let superscript_button = styled_rte_button(
let field_id = values.field_id.clone(); "Superscript",
styled_rte_button( ButtonId::Superscript,
"Superscript", Icon::Superscript,
Icon::Superscript, click_handler,
mouse_ev(Ev::Click, move |ev| { );
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::Superscript))
}),
)
};
div![ div![
class!["group formatting"], class!["group formatting"],
@ -778,10 +788,14 @@ fn first_row(values: &StyledRte) -> Node<Msg> {
] ]
}; };
div![class!["row firstRow"], system, formatting, justify,] div![class!["row firstRow"], system, formatting, justify]
} }
fn second_row(values: &StyledRte) -> Node<Msg> { fn second_row(
values: &StyledRte,
click_handler: EventHandler<Msg>,
change_handler: EventHandler<Msg>,
) -> Node<Msg> {
/*let align_group = { /*let align_group = {
let field_id = values.field_id.clone(); let field_id = values.field_id.clone();
let align_center_button = styled_rte_button( let align_center_button = styled_rte_button(
@ -819,15 +833,8 @@ fn second_row(values: &StyledRte) -> Node<Msg> {
};*/ };*/
let font_group = { let font_group = {
let _field_id = values.field_id.clone(); let _font_button =
let _font_button = styled_rte_button( styled_rte_button("Font", ButtonId::Font, Icon::Font, click_handler.clone());
"Font",
Icon::Font,
mouse_ev(Ev::Click, move |ev| {
ev.prevent_default();
None as Option<Msg>
}),
);
let options: Vec<Node<Msg>> = HeadingSize::all() let options: Vec<Node<Msg>> = HeadingSize::all()
.into_iter() .into_iter()
.map(|h| { .map(|h| {
@ -836,7 +843,7 @@ fn second_row(values: &StyledRte) -> Node<Msg> {
.text(h.as_str()) .text(h.as_str())
.on_click(mouse_ev(Ev::Click, move |ev| { .on_click(mouse_ev(Ev::Click, move |ev| {
ev.prevent_default(); ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::InsertHeading(h))) Some(Msg::Rte(field_id, RteMsg::InsertHeading(*h)))
})) }))
.empty() .empty()
.build() .build()
@ -874,25 +881,19 @@ fn second_row(values: &StyledRte) -> Node<Msg> {
}; };
let insert_group = { let insert_group = {
let table_tooltip = table_tooltip(values); let table_tooltip = table_tooltip(values, click_handler.clone(), change_handler);
let field_id = values.field_id.clone();
let listing_dots = styled_rte_button( let listing_dots = styled_rte_button(
"Listing dots", "Listing dots",
ButtonId::ListingDots,
Icon::ListingDots, Icon::ListingDots,
mouse_ev(Ev::Click, move |ev| { click_handler.clone(),
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::InsertUnorderedList))
}),
); );
let field_id = values.field_id.clone();
let listing_number = styled_rte_button( let listing_number = styled_rte_button(
"Listing number", "Listing number",
ButtonId::ListingNumber,
Icon::ListingNumber, Icon::ListingNumber,
mouse_ev(Ev::Click, move |ev| { click_handler.clone(),
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::InsertOrderedList))
}),
); );
/*let field_id = values.field_id.clone(); /*let field_id = values.field_id.clone();
let sub_listing_button = styled_rte_button( let sub_listing_button = styled_rte_button(
@ -904,42 +905,23 @@ fn second_row(values: &StyledRte) -> Node<Msg> {
}), }),
);*/ );*/
let mut table_button = { let mut table_button =
let field_id = values.field_id.clone(); styled_rte_button("Table", ButtonId::Table, Icon::Table, click_handler.clone());
styled_rte_button(
"Table",
Icon::Table,
mouse_ev(Ev::Click, move |ev| {
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::TableSetVisibility(true)))
}),
)
};
table_button.add_child(table_tooltip); table_button.add_child(table_tooltip);
let paragraph_button = { let paragraph_button = styled_rte_button(
let field_id = values.field_id.clone(); "Paragraph",
styled_rte_button( ButtonId::Paragraph,
"Paragraph", Icon::Paragraph,
Icon::Paragraph, click_handler.clone(),
mouse_ev(Ev::Click, move |ev| { );
ev.prevent_default(); let mut code_alt_button = styled_rte_button(
Some(Msg::Rte(field_id, RteMsg::InsertParagraph)) "Insert code",
}), ButtonId::CodeAlt,
) Icon::CodeAlt,
}; click_handler.clone(),
let mut code_alt_button = { );
let field_id = values.field_id.clone(); code_alt_button.add_child(code_tooltip(values, click_handler.clone()));
styled_rte_button(
"Insert code",
Icon::CodeAlt,
mouse_ev(Ev::Click, move |ev| {
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::InsertCode(true)))
}),
)
};
code_alt_button.add_child(code_tooltip(values));
div![ div![
class!["group insert"], class!["group insert"],
@ -953,30 +935,14 @@ fn second_row(values: &StyledRte) -> Node<Msg> {
}; };
let indent_outdent = { let indent_outdent = {
let field_id = values.field_id.clone();
let indent_button = styled_rte_button( let indent_button = styled_rte_button(
"Indent", "Indent",
ButtonId::Indent,
Icon::Indent, Icon::Indent,
mouse_ev(Ev::Click, move |ev| { click_handler.clone(),
ev.prevent_default();
Some(Msg::Rte(
field_id,
RteMsg::ChangeIndent(RteIndentMsg::Increase),
))
}),
);
let field_id = values.field_id.clone();
let outdent_button = styled_rte_button(
"Outdent",
Icon::Outdent,
mouse_ev(Ev::Click, move |ev| {
ev.prevent_default();
Some(Msg::Rte(
field_id,
RteMsg::ChangeIndent(RteIndentMsg::Decrease),
))
}),
); );
let outdent_button =
styled_rte_button("Outdent", ButtonId::Outdent, Icon::Outdent, click_handler);
div![class!["group indentOutdent"], indent_button, outdent_button] div![class!["group indentOutdent"], indent_button, outdent_button]
}; };
@ -989,7 +955,11 @@ fn second_row(values: &StyledRte) -> Node<Msg> {
] ]
} }
fn table_tooltip(values: &StyledRte) -> Node<Msg> { fn table_tooltip(
values: &StyledRte,
click_handler: EventHandler<Msg>,
change_handler: EventHandler<Msg>,
) -> Node<Msg> {
let (visible, rows, cols) = values let (visible, rows, cols) = values
.table_tooltip .table_tooltip
.map( .map(
@ -1019,36 +989,25 @@ fn table_tooltip(values: &StyledRte) -> Node<Msg> {
}) })
}; };
let close_table_tooltip = { let close_table_tooltip = StyledButton::build()
let field_id = values.field_id.clone(); .button_id(ButtonId::CloseRteTableTooltip)
StyledButton::build() .empty()
.empty() .icon(Icon::Close)
.icon(Icon::Close) .on_click(click_handler.clone())
.on_click(mouse_ev(Ev::Click, move |ev| { .build()
ev.prevent_default(); .into_node();
Some(Msg::Rte(field_id, RteMsg::TableSetVisibility(false)))
}))
.build()
.into_node()
};
let on_submit = { let on_submit = click_handler;
let field_id = values.field_id.clone();
mouse_ev(Ev::Click, move |ev| {
ev.prevent_default();
Some(Msg::Rte(field_id, RteMsg::InsertTable { rows, cols }))
})
};
StyledTooltip::build() StyledTooltip::build()
.table_tooltip() .table_tooltip()
.visible(visible) .visible(visible)
.add_child(h2![span!["Add table"], close_table_tooltip]) .add_child(h2![span!["Add table"], close_table_tooltip])
.add_child(div![class!["inputs"], span!["Rows"], seed::input![ .add_child(div![class!["inputs"], span!["Rows"], seed::input![
attrs![At::Type => "range"; At::Step => "1"; At::Min => "1"; At::Max => "10"; At::Value => rows], attrs![At::Type => "range"; At::Step => "1"; At::Min => "1"; At::Max => "10"; At::Value => rows],
on_rows_change on_rows_change
]]) ]])
.add_child(div![ .add_child(div![
class!["inputs"], class!["inputs"],
span!["Columns"], span!["Columns"],
seed::input![ seed::input![
@ -1056,40 +1015,26 @@ fn table_tooltip(values: &StyledRte) -> Node<Msg> {
on_cols_change on_cols_change
] ]
]) ])
.add_child({ .add_child({
let body: Vec<Node<Msg>> = (0..rows) let body: Vec<Node<Msg>> = (0..rows)
.map(|_row| { .map(|_row| {
let tds: Vec<Node<Msg>> = (0..cols) let tds: Vec<Node<Msg>> = (0..cols)
.map(|_col| td![" "]) .map(|_col| td![" "])
.collect(); .collect();
tr![tds] tr![tds]
}) })
.collect(); .collect();
seed::div![ seed::div![
class!["tablePreview"], class!["tablePreview"],
seed::table![tbody![body]], seed::table![tbody![body]],
input![attrs![At::Type => "button"; At::Value => "Insert"], on_submit], input![attrs![At::Type => "button"; At::Id => "rteInsertTable"; At::Value => "Insert"], on_submit],
] ]
}) })
.build() .build()
.into_node() .into_node()
} }
fn styled_rte_button(title: &str, icon: Icon, handler: EventHandler<Msg>) -> Node<Msg> { fn code_tooltip(values: &StyledRte, click_handler: EventHandler<Msg>) -> Node<Msg> {
let button = StyledButton::build()
.icon(StyledIcon::build(icon).build())
.on_click(handler)
.empty()
.build()
.into_node();
span![
class!["styledRteButton"],
attrs![At::Title => title],
button
]
}
fn code_tooltip(values: &StyledRte) -> Node<Msg> {
let (visible, lang) = values let (visible, lang) = values
.code_tooltip .code_tooltip
.as_ref() .as_ref()
@ -1122,18 +1067,13 @@ fn code_tooltip(values: &StyledRte) -> Node<Msg> {
)))) ))))
.into_node(); .into_node();
let close_tooltip = { let close_tooltip = StyledButton::build()
let field_id = values.field_id.clone(); .empty()
StyledButton::build() .icon(Icon::Close)
.empty() .button_id(ButtonId::RteInsertCode)
.icon(Icon::Close) .on_click(click_handler.clone())
.on_click(mouse_ev(Ev::Click, move |ev| { .build()
ev.prevent_default(); .into_node();
Some(Msg::Rte(field_id, RteMsg::InsertCode(false)))
}))
.build()
.into_node()
};
let input = { let input = {
let field_id = values.field_id.clone(); let field_id = values.field_id.clone();
@ -1148,15 +1088,9 @@ fn code_tooltip(values: &StyledRte) -> Node<Msg> {
}; };
let actions = { let actions = {
let field_id = values.field_id.clone();
let on_insert = ev(Ev::Click, move |ev| {
ev.stop_propagation();
ev.prevent_default();
ev.target().unwrap();
Msg::Rte(field_id, RteMsg::InjectCode)
});
let insert = StyledButton::build() let insert = StyledButton::build()
.on_click(on_insert) .button_id(ButtonId::RteInjectCode)
.on_click(click_handler)
.text("Insert") .text("Insert")
.build() .build()
.into_node(); .into_node();
@ -1173,3 +1107,23 @@ fn code_tooltip(values: &StyledRte) -> Node<Msg> {
.build() .build()
.into_node() .into_node()
} }
fn styled_rte_button(
title: &str,
button_id: ButtonId,
icon: Icon,
handler: EventHandler<Msg>,
) -> Node<Msg> {
let button = StyledButton::build()
.button_id(button_id)
.icon(StyledIcon::build(icon).build())
.on_click(handler)
.empty()
.build()
.into_node();
span![
class!["styledRteButton"],
attrs![At::Title => title],
button
]
}

View File

@ -42,12 +42,9 @@ pub fn send_ws_msg(msg: WsMsg, ws: Option<&WebSocket>, orders: &mut impl Orders<
return; return;
} }
}; };
// orders.perform_cmd(seed::app::cmds::timeout(10, move || {
// let ws = ws.clone();
let binary = bincode::serialize(&msg).unwrap(); let binary = bincode::serialize(&msg).unwrap();
ws.send_bytes(binary.as_slice()) ws.send_bytes(binary.as_slice())
.expect("Failed to send ws msg"); .expect("Failed to send ws msg");
// }));
} }
pub fn open_socket(model: &mut Model, orders: &mut impl Orders<Msg>) { pub fn open_socket(model: &mut Model, orders: &mut impl Orders<Msg>) {
@ -300,7 +297,6 @@ pub fn update(msg: &WsMsg, model: &mut Model, orders: &mut impl Orders<Msg>) {
} }
_ => (), _ => (),
}; };
orders.render();
} }
fn init_current_project(model: &mut Model, orders: &mut impl Orders<Msg>) { fn init_current_project(model: &mut Model, orders: &mut impl Orders<Msg>) {