Compare commits

..

No commits in common. "706e5ed07ebda5367353e8092793826caec46f78" and "8bb1f623525d2199beaab38837baa5da74a5d63c" have entirely different histories.

6 changed files with 53 additions and 171 deletions

View File

@ -12,7 +12,6 @@ $text-color: #f3efef;
html, html,
body { body {
height: 100vh; height: 100vh;
max-width: 100vw;
margin: 0; margin: 0;
font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
} }
@ -45,11 +44,10 @@ a {
.navbar { .navbar {
background-color: $secondary-bg-color; background-color: $secondary-bg-color;
position: relative;
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
padding: 8px 0; padding: 8px;
} }
.navbar > a { .navbar > a {
@ -64,12 +62,6 @@ a {
color: $text-color !important; color: $text-color !important;
} }
.db-connection {
position: absolute;
left: 0px;
padding: 8px 16px;
}
.btn-add-link { .btn-add-link {
width: 100%; width: 100%;
padding: 12px 0; padding: 12px 0;
@ -83,30 +75,3 @@ a {
background-color: $secondary-bg-color-light; background-color: $secondary-bg-color-light;
} }
input {
background-color: $secondary-bg-color-light;
border: none;
border-radius: 3px;
padding: 5px 10px;
font-size: 0.9em;
color: $text-color;
margin-bottom: 20px;
}
input[type=password] {
margin-top: 60px;
}
input[type=submit]:hover {
background-color: $secondary-bg-color-lighter;
cursor: pointer;
}
form {
display: flex;
flex-direction: column;
text-align: center;
margin: 40px auto 0 auto;
width: 400px;
}

View File

@ -9,7 +9,7 @@ pub fn Navbar() -> impl IntoView {
view! { view! {
<div class="navbar"> <div class="navbar">
<span class="db-connection">"Connection: "{ move || websocket.ready_state.get().to_string()}</span> <p>{ move || websocket.ready_state.get().to_string()}</p>
<A href="/" active_class="route-active">Home</A> <A href="/" active_class="route-active">Home</A>
<A href="/participants" active_class="route-active">Deelnemers</A> <A href="/participants" active_class="route-active">Deelnemers</A>
<A href="/times" active_class="route-active">Tijden</A> <A href="/times" active_class="route-active">Tijden</A>

View File

@ -9,7 +9,6 @@ mod util;
// Top-Level pages // Top-Level pages
use crate::pages::home::Home; use crate::pages::home::Home;
use crate::pages::login;
use crate::pages::not_found::NotFound; use crate::pages::not_found::NotFound;
use crate::pages::participants; use crate::pages::participants;
use crate::pages::times; use crate::pages::times;
@ -22,7 +21,8 @@ pub fn App() -> impl IntoView {
util::surrealdb::init_surrealdb(); util::surrealdb::init_surrealdb();
let websocket = expect_context::<util::surrealdb::SurrealContext>(); let websocket = expect_context::<util::surrealdb::SurrealContext>();
let _participants = use_context::<util::surrealdb::ParticipantsContext>() let websocket2 = websocket.clone();
let participants = use_context::<util::surrealdb::ParticipantsContext>()
.expect("Could not find participants context"); .expect("Could not find participants context");
view! { view! {
@ -59,22 +59,17 @@ pub fn App() -> impl IntoView {
> >
<Router> <Router>
<components::navbar::Navbar /> <components::navbar::Navbar />
<p>{websocket.message}</p>
<p>{ move || format!("{:?}", participants.0.get() )}</p>
<button on:click=move |_| { websocket.signin() }>"Test Message"</button>
<button on:click=move |_| { websocket2.send("{ \"id\": 1, \"method\": \"create\", \"params\": [ \"person\", { \"name\": \"Mary Doe\" } ] }") }>"Test Message"</button>
<main> <main>
<Routes> <Routes>
<Route path="/" view=move || { <Route path="/" view=Home />
view! { <Route path="/participants" view=participants::Participants />
// only show the outlet if data have loaded <Route path="/participants/add" view=participants::add::Add />
<Show when=move || websocket.authenticated.get() fallback=login::Login> <Route path="/times" view=times::Times />
<Outlet/> <Route path="/*" view=NotFound />
</Show>
}
}>
<Route path="/" view=Home />
<Route path="/participants" view=participants::Participants />
<Route path="/participants/add" view=participants::add::Add />
<Route path="/times" view=times::Times />
<Route path="/*" view=NotFound />
</Route>
</Routes> </Routes>
</main> </main>
</Router> </Router>

View File

@ -1,32 +0,0 @@
use crate::util;
use leptos::*;
/// Login page
#[component]
pub fn Login() -> impl IntoView {
let websocket = expect_context::<util::surrealdb::SurrealContext>();
let input_element: NodeRef<html::Input> = create_node_ref();
let on_submit = move |ev: leptos::ev::SubmitEvent| {
ev.prevent_default();
let value = input_element
.get()
.expect("<input> should be mounted")
.value();
websocket.signin(value)
};
view! {
<form class="login" on:submit=on_submit>
<h1>"WRB Timings"</h1>
<input type="password"
node_ref=input_element
placeholder="Password"
/>
<input type="submit" value="Submit" />
</form>
}
}

View File

@ -1,5 +1,4 @@
pub mod home; pub mod home;
pub mod login;
pub mod not_found; pub mod not_found;
pub mod participants; pub mod participants;
pub mod times; pub mod times;

View File

@ -1,6 +1,6 @@
use leptos::*; use leptos::*;
use leptos_use::{core::ConnectionReadyState, use_websocket, UseWebsocketReturn}; use leptos_use::{core::ConnectionReadyState, use_websocket, UseWebsocketReturn};
use serde::{Deserialize, Serialize}; use serde::Serialize;
use serde_json::json; use serde_json::json;
use std::rc::Rc; use std::rc::Rc;
@ -25,10 +25,25 @@ struct SigninParam {
pass: String, pass: String,
} }
#[derive(Clone, Debug)]
pub enum HourKind {
A,
B,
C,
D,
Z,
}
#[derive(Clone, Debug)]
pub struct GroupKind {
hour: HourKind,
lane: u8,
}
#[derive(Clone, Debug)] #[derive(Clone, Debug)]
pub struct Participant { pub struct Participant {
name: String, name: String,
group: String, group: GroupKind,
} }
#[derive(Clone, Debug)] #[derive(Clone, Debug)]
@ -39,21 +54,6 @@ pub struct SurrealContext {
pub message: Signal<Option<String>>, pub message: Signal<Option<String>>,
send: Rc<dyn Fn(&str)>, send: Rc<dyn Fn(&str)>,
pub ready_state: Signal<ConnectionReadyState>, pub ready_state: Signal<ConnectionReadyState>,
pub authenticated: ReadSignal<bool>,
pub set_authenticated: WriteSignal<bool>,
}
#[derive(Serialize, Deserialize)]
struct SurrealResponse {
id: u32,
result: SurrealResult,
}
#[derive(Serialize, Deserialize)]
#[serde(untagged)]
enum SurrealResult {
String(String),
Null,
} }
impl SurrealContext { impl SurrealContext {
@ -61,15 +61,11 @@ impl SurrealContext {
message: Signal<Option<String>>, message: Signal<Option<String>>,
send: Rc<dyn Fn(&str)>, send: Rc<dyn Fn(&str)>,
ready_state: Signal<ConnectionReadyState>, ready_state: Signal<ConnectionReadyState>,
authenticated: ReadSignal<bool>,
set_authenticated: WriteSignal<bool>,
) -> Self { ) -> Self {
Self { Self {
message, message,
send, send,
ready_state, ready_state,
authenticated,
set_authenticated,
} }
} }
@ -78,19 +74,28 @@ impl SurrealContext {
(self.send)(message) (self.send)(message)
} }
pub fn signin(&self, pass: String) { pub fn signin(&self) {
log::debug!("Signing into surrealdb");
let request = SurrealRequest { let request = SurrealRequest {
id: 0, id: 1,
method: String::from("signin"), method: String::from("signin"),
params: vec![SurrealParams::SigninParam(SigninParam { params: vec![SurrealParams::SigninParam(SigninParam {
user: String::from("root"), user: String::from("root"),
pass, pass: String::from("root"),
})], })],
}; };
self.send(&json!(request).to_string()); self.send(&json!(request).to_string());
let request = SurrealRequest {
id: 1,
method: String::from("use"),
params: vec![
SurrealParams::String(String::from("wrb")),
SurrealParams::String(String::from("timings")),
],
};
self.send(&json!(request).to_string())
} }
} }
@ -102,68 +107,18 @@ pub fn init_surrealdb() {
.. ..
} = use_websocket("ws://localhost:80/rpc"); } = use_websocket("ws://localhost:80/rpc");
let (participants, _set_participants) = create_signal::<Vec<Participant>>(vec![]); let (participants, _set_participants) = create_signal::<Vec<Participant>>(vec![Participant {
let (authenticated, set_authenticated) = create_signal::<bool>(false); name: "User1".to_string(),
group: GroupKind {
hour: HourKind::A,
lane: 1,
},
}]);
let websocket = SurrealContext::new( provide_context(SurrealContext::new(
message, message,
Rc::new(send.clone()), Rc::new(send.clone()),
ready_state, ready_state,
authenticated, ));
set_authenticated,
);
provide_context(websocket);
provide_context(ParticipantsContext(participants)); provide_context(ParticipantsContext(participants));
create_effect(move |prev_value| {
let msg = message.get();
if prev_value != Some(msg.clone()) {
match msg {
Some(ref text) => {
log::debug!("{:?}", text);
surrealdb_response(text.to_string());
}
None => (),
}
}
msg
});
}
/// Function to execute when SurrealDB returns a message
fn surrealdb_response(response: String) {
let response: SurrealResponse = match serde_json::from_str(&response) {
Ok(res) => res,
Err(err) => {
log::warn!("{}", err);
return;
}
};
match response.id {
0 => use_surrealdb(response),
1 => log::debug!("Succesfully execute use wrb timings"),
_ => return,
}
}
/// Function to execute when DB signin is succesful
fn use_surrealdb(_response: SurrealResponse) {
let websocket = expect_context::<SurrealContext>();
websocket.set_authenticated.set(true);
let request = SurrealRequest {
id: 1,
method: String::from("use"),
params: vec![
SurrealParams::String(String::from("wrb")),
SurrealParams::String(String::from("timings")),
],
};
websocket.send(&json!(request).to_string())
} }