Skip to content

Commit

Permalink
Update layout and integrate the text processor.
Browse files Browse the repository at this point in the history 
Signed-off-by: Aalekh Patel <[email protected]>
  • Loading branch information
@aalekhpatel07
aalekhpatel07 committed Jun 14, 2022
1 parent 2e7c78a commit 4a2dab8
Show file tree
Hide file tree
Showing 9 changed files with 75 additions and 127 deletions.
7 changes: 1 addition & 6 deletions yew-frontend/src/components/navbar.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,16 +11,11 @@ pub fn navbar() -> Html {
<nav class="navbar bg-base-100 sticky top-0 ">
<div class="flex-1">
<Link<Route> to={Route::Home}>
<button class="btn btn-ghost normal-case text-xl">{"Text Cleaner"}</button>
<button class="btn btn-ghost normal-case text-2xl">{"Text Cleaner"}</button>
</Link<Route>>
</div>
<div class="flex-none">
<ul class="menu menu-horizontal p-0">
<li>
<Link<Route> to={Route::About}>
{"About"}
</Link<Route>>
</li>
<li>
<a href={github_url}>
<svg
Expand Down
52 changes: 31 additions & 21 deletions yew-frontend/src/components/settings.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ pub enum Msg {

pub struct Settings {
check_boxes: HashMap<String, NodeRef>,
check_boxes_ordered: Vec<(String, NodeRef)>,
config: ProcessorConfigNamesContext,
_config_handle: ContextHandle<ProcessorConfigNamesContext>
}
Expand All @@ -24,7 +25,22 @@ pub struct SettingsProp {
pub all_config: ProcessorConfigNames,
}


pub fn snake_case_to_camel_case(s: &str) -> String {

let capitalized =
s
.replace(r"_", r" ")
.split_ascii_whitespace()
.map(|word| {
let mut chars = word.chars();
let first_char = chars.next().unwrap();
let rest = chars.collect::<String>();
first_char.to_uppercase().to_string() + rest.as_str()
})
.collect::<Vec<String>>();

String::from(capitalized.join(" "))
}

impl Component for Settings {
type Message = Msg;
Expand All @@ -46,8 +62,15 @@ impl Component for Settings {
check_boxes.insert(function.clone(), NodeRef::default());
}

let mut check_boxes_ordered = all_config.functions.iter().map(|function| {
(function.clone(), check_boxes.get(function).unwrap().clone())
}).collect::<Vec<(String, NodeRef)>>();
check_boxes_ordered.sort_by(|a, b| a.0.cmp(&b.0));


Self {
check_boxes,
check_boxes_ordered,
config: config_names,
_config_handle: config_names_handle
}
Expand All @@ -57,12 +80,13 @@ impl Component for Settings {

// let on_value_change = ctx.link().callback(|x| Msg::Toggle(x));

let check_boxes = self.check_boxes.clone();
let check_boxes_ordered = self.check_boxes_ordered.clone();

html! {
<div class="h-[90%] w-full overflow-auto">
<form id="settings" class="grid grid-cols-3">
{ for check_boxes.into_iter().map(|(key, value)| {
<div class="h-[90%] w-full space-y-8">
<h1 class="text-2xl">{"Settings"}</h1>
<form id="settings" class="h-[90%] px-4 space-y-2 overflow-auto">
{ for check_boxes_ordered.into_iter().map(|(key, value)| {

let key_cp = key.clone();
let on_value_change = ctx.link().callback(Msg::Refresh);
Expand All @@ -74,15 +98,14 @@ impl Component for Settings {
type="checkbox"
ref={value.clone()}
checked={self.config.functions.contains(&key)}
class="checkbox checkbox-secondary"
class="checkbox checkbox-secondary rounded-md"
onchange={move |_| on_value_change.emit(key_cp.clone())}
/>
<label class="label" for={key.clone()}>{key}</label>
<label class="label italic" for={key.clone()}>{snake_case_to_camel_case(&key)}</label>
</div>
}
})}
</form>
{format!("{:?}", self.config.functions)}
</div>
}
}
Expand All @@ -91,20 +114,7 @@ impl Component for Settings {
fn update(&mut self, _ctx: &Context<Self>, msg: Self::Message) -> bool {
match msg {
Msg::ProcessorConfigNamesContextUpdated(processor_config_names) => {
info!("ProcessorConfigNamesContextUpdated {:?}", processor_config_names);
self.config = processor_config_names;

// for (function_name, check_box_node) in self.check_boxes.iter() {

// if let Some(check_box) = check_box_node.cast::<web_sys::HtmlInputElement>() {

// if self.config.functions.contains(function_name) {
// check_box.set_attribute("checked", "true").unwrap();
// } else {
// check_box.set_attribute("checked", "false").unwrap();
// }
// }
// }
},
Msg::Refresh(key) => {
self.config.dispatch(key);
Expand Down
95 changes: 21 additions & 74 deletions yew-frontend/src/components/textboxes.rs
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
use crate::contexts::*;
use std::ops::Deref;

use crate::contexts::*;


use yew::context::ContextHandle;
Expand All @@ -21,6 +22,7 @@ pub struct InputOutputBox {
processor_config_names: ProcessorConfigNamesContext,
_text_input_context_handle: ContextHandle<TextInputContext>,
_processor_config_names_context_handle: ContextHandle<ProcessorConfigNamesContext>,
processor: TextProcessor
}

pub enum Msg {
Expand Down Expand Up @@ -63,9 +65,10 @@ impl Component for InputOutputBox {
input_node_ref: NodeRef::default(),
output_node_ref: NodeRef::default(),
text_input,
processor: TextProcessor::with_config_names(processor_config_names.deref()).unwrap(),
processor_config_names,
_text_input_context_handle: text_input_ctx_handle,
_processor_config_names_context_handle: processor_config_names_ctx_handle
_processor_config_names_context_handle: processor_config_names_ctx_handle,
}
}

Expand All @@ -78,8 +81,8 @@ impl Component for InputOutputBox {
let on_processed_text_copy_pressed = ctx.link().callback(|_| Msg::CopyProcessed);

html! {
<div class="h-full w-full overflow-auto flex flex-col justify-around">
<section class="p-4 space-y-4">
<div class="w-full overflow-auto flex flex-col justify-start gap-8 px-2 py-4">
<section class="px-4 space-y-4">
<div class="w-full flex justify-between items-center">
<h1 class="text-2xl"> {"Raw"} </h1>
<button class="btn btn-secondary p-0 rounded-md" title="Copy"
Expand All @@ -93,49 +96,19 @@ impl Component for InputOutputBox {
<path d="M38.6031494,29.4603004H16.253952c-0.5615005,0-1.0159006,0.4543991-1.0159006,1.0158997 s0.4544001,1.0158997,1.0159006,1.0158997h22.3491974c0.5615005,0,1.0158997-0.4543991,1.0158997-1.0158997 S39.16465,29.4603004,38.6031494,29.4603004z" />
<path d="M28.4444485,37.5872993H16.253952c-0.5615005,0-1.0159006,0.4543991-1.0159006,1.0158997 s0.4544001,1.0158997,1.0159006,1.0158997h12.1904964c0.5615025,0,1.0158005-0.4543991,1.0158005-1.0158997 S29.0059509,37.5872993,28.4444485,37.5872993z" />
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
</svg>
</button>
</div>
<textarea
ref={self.input_node_ref.clone()}
class="textarea textarea-bordered resize-y w-full rounded-lg"
rows="12"
placeholder="Copy and paste your text here. Change the settings on the right and watch for results on the bottom."
rows="10"
placeholder="Copy and paste your text here. Change the settings and watch the results update live on the bottom."
onkeyup={onkeyup}
>
</textarea>
</section>
<section class="p-4 space-y-4">
<section class="px-4 space-y-4">
<div class="w-full flex justify-between items-center">
<h1 class="text-2xl"> {"Processed"} </h1>
<button class="btn btn-secondary p-0 rounded-md" title="Copy"
Expand All @@ -149,44 +122,14 @@ impl Component for InputOutputBox {
<path d="M38.6031494,29.4603004H16.253952c-0.5615005,0-1.0159006,0.4543991-1.0159006,1.0158997 s0.4544001,1.0158997,1.0159006,1.0158997h22.3491974c0.5615005,0,1.0158997-0.4543991,1.0158997-1.0158997 S39.16465,29.4603004,38.6031494,29.4603004z" />
<path d="M28.4444485,37.5872993H16.253952c-0.5615005,0-1.0159006,0.4543991-1.0159006,1.0158997 s0.4544001,1.0158997,1.0159006,1.0158997h12.1904964c0.5615025,0,1.0158005-0.4543991,1.0158005-1.0158997 S29.0059509,37.5872993,28.4444485,37.5872993z" />
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
</svg>
</button>
</div>
<textarea
ref={self.output_node_ref.clone()}
class="textarea textarea-bordered resize-y w-full rounded-lg disabled:text-gray-200 cursor-pointer"
rows="12"
placeholder="Change text above and watch this change."
rows="10"
placeholder="This is where the processed text will be displayed. It is currently an empty string."
>
</textarea>
</section>
Expand All @@ -201,7 +144,9 @@ impl Component for InputOutputBox {
input.set_value(self.text_input.raw.as_str());
}
if let Some(output) = self.output_node_ref.cast::<web_sys::HtmlTextAreaElement>() {
output.set_value(self.text_input.raw.as_str());

let processed = self.processor.process(self.text_input.raw.as_str());
output.set_value(processed.as_str());
}
}

Expand All @@ -211,10 +156,11 @@ impl Component for InputOutputBox {

match msg {
Msg::TextInputContextUpdated(text_input_context) => {
info!("TextInputContextUpdated: {:?}", text_input_context.raw.to_string());
self.text_input = text_input_context;
if let Some(output) = self.output_node_ref.cast::<web_sys::HtmlTextAreaElement>() {
output.set_value(self.text_input.raw.as_str());

let processed = self.processor.process(self.text_input.raw.as_str());
output.set_value(processed.as_str());
}
},
Msg::Change => {
Expand Down Expand Up @@ -265,6 +211,7 @@ impl Component for InputOutputBox {
}
Msg::ProcessorConfigNamesContextUpdated(processor_config_names) => {
self.processor_config_names = processor_config_names;
self.processor = TextProcessor::with_config_names(self.processor_config_names.deref()).unwrap();
}
}
true
Expand Down
18 changes: 16 additions & 2 deletions yew-frontend/src/contexts/config.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,21 @@ impl TryFrom<ProcessorConfigNames> for ProcessorConfig {
}
}

impl TryFrom<&ProcessorConfigNames> for ProcessorConfig {
type Error = anyhow::Error;

fn try_from(config_names: &ProcessorConfigNames) -> Result<Self, Self::Error> {
let mut config = ProcessorConfig::new();
for func in &config_names.functions {
match config.try_add(func.as_str()) {
Ok(()) => {},
Err(_e) => {panic!();}
}
}
Ok(config)
}
}


pub fn toggle(hset: &HashSet<String>, key: &str) -> HashSet<String>
{
Expand All @@ -94,7 +109,6 @@ impl Reducible for ProcessorConfigNames {

let hset = toggle(&self.functions, &action);
let size = hset.len();
info!("New should be: {:?}", hset);
ProcessorConfigNames {
functions: hset,
size
Expand Down Expand Up @@ -172,7 +186,7 @@ impl TextProcessor {
config: ProcessorConfig::new()
}
}
pub fn with_config_names(config_names: ProcessorConfigNames) -> anyhow::Result<Self> {
pub fn with_config_names(config_names: &ProcessorConfigNames) -> anyhow::Result<Self> {
Ok(Self {
config: ProcessorConfig::try_from(config_names)?
})
Expand Down
1 change: 0 additions & 1 deletion yew-frontend/src/contexts/text_input.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ impl Reducible for TextInput {
type Action = String;

fn reduce(self: std::rc::Rc<Self>, action: Self::Action) -> std::rc::Rc<Self> {
info!("In reduce: {:?}", action);
Self {
raw: action
}.into()
Expand Down
10 changes: 5 additions & 5 deletions yew-frontend/src/layouts/base.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,15 +17,15 @@ pub fn base_layout(props: &Props) -> Html {
<div
class="w-1/4 overflow-hidden"
>
<InputOutputBox/>
<div class="w-full bg-neutral p-8 h-full">
{ for props.children.iter() }
</div>
</div>
<div
class="w-3/4 h-full overflow-hidden"
class="w-3/4 h-full overflow-auto"
>
<Navbar/>
<div class="w-full bg-neutral p-8 h-full">
{ for props.children.iter() }
</div>
<InputOutputBox/>
</div>
</div>
}
Expand Down
12 changes: 0 additions & 12 deletions yew-frontend/src/pages/about.rs
View file

This file was deleted.

4 changes: 1 addition & 3 deletions yew-frontend/src/pages/mod.rs
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@
mod home;
mod about;

pub use home::*;
pub use about::*;
pub use home::*;
Loading

0 comments on commit 4a2dab8

Please sign in to comment.