hide stuff when disconnected
This commit is contained in:
parent
103a92b486
commit
a9e7636c58
4 changed files with 184 additions and 173 deletions
|
@ -47,12 +47,13 @@ pub fn Auth() -> impl IntoView {
|
|||
view! {
|
||||
<div class="my-2">
|
||||
<h2 class="text-2xl">Sign in:</h2>
|
||||
<Show when=move || { connected() } fallback=|| view! { <p>"Disconnected."</p> }>
|
||||
<p>
|
||||
"You were already given a random name but if you'd like to change it this is the place. Identities are saved once created so if you leave or get disconnected just enter your old name here to \"log back in\". Please don't steal each other's identities (yes, you can)."
|
||||
</p>
|
||||
<br />
|
||||
<p>Username:</p>
|
||||
<form onsubmit="return false" on:submit=send_login>
|
||||
<form onsubmit="return false" on:submit=send_login.clone()>
|
||||
<input
|
||||
class="w-96 font-mono rounded-sm bg-neutral-900 text-neutral-200"
|
||||
placeholder=move || username.get()
|
||||
|
@ -67,6 +68,7 @@ pub fn Auth() -> impl IntoView {
|
|||
disabled=move || !connected()
|
||||
/>
|
||||
</form>
|
||||
</Show>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
use crate::components::websocket::WebSocketContext;
|
||||
use leptos::*;
|
||||
use leptos_use::core::ConnectionReadyState;
|
||||
use lib::*;
|
||||
use serde_json::to_string;
|
||||
|
||||
|
@ -7,6 +8,8 @@ use serde_json::to_string;
|
|||
pub fn Browser() -> impl IntoView {
|
||||
// Websocket stuff
|
||||
let websocket = expect_context::<WebSocketContext>();
|
||||
let connected = move || websocket.ready_state.get() == ConnectionReadyState::Open;
|
||||
|
||||
let tx = websocket.clone();
|
||||
let (websocket_send, set_websocket_send) = create_signal("".to_string());
|
||||
|
||||
|
@ -37,11 +40,14 @@ pub fn Browser() -> impl IntoView {
|
|||
view! {
|
||||
<div class="my-2">
|
||||
<h2 class="text-2xl">Game Browser</h2>
|
||||
<p>"Yes, the delete button works. Please don't abuse it."</p>
|
||||
<Show when=move || { connected() } fallback=|| view! { <p>"Disconnected."</p> }>
|
||||
<Show
|
||||
when=move || { game_browser_context().len() > 0 }
|
||||
fallback=|| view! { "No games to show right now.. Maybe you should create one!" }
|
||||
fallback=|| {
|
||||
view! { "No games to show right now.. Maybe you should create one!" }
|
||||
}
|
||||
>
|
||||
<p>"Yes, the delete button works. Please don't abuse it."</p>
|
||||
<div>
|
||||
<table class="min-w-full border border-collapse table-auto">
|
||||
<thead>
|
||||
|
@ -94,6 +100,7 @@ pub fn Browser() -> impl IntoView {
|
|||
</table>
|
||||
</div>
|
||||
</Show>
|
||||
</Show>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
|
|
@ -62,10 +62,10 @@ pub fn CreateGame() -> impl IntoView {
|
|||
|
||||
view! {
|
||||
<div class="my-2">
|
||||
<Show when=move || connected() fallback=|| view! { <p>Disconnected.</p> }>
|
||||
<h2 class="text-2xl">Create Game</h2>
|
||||
<Show when=move || connected() fallback=|| view! { <p>"Disconnected."</p> }>
|
||||
<div class="flex">
|
||||
<form onsubmit="return false" on:submit=request_new_game>
|
||||
<h2 class="text-2xl">Create Game</h2>
|
||||
<input
|
||||
class="w-80 h-11 font-mono rounded-sm bg-neutral-900 text-neutral-200"
|
||||
placeholder="Name"
|
||||
|
|
|
@ -165,6 +165,7 @@ pub fn Game() -> impl IntoView {
|
|||
view! {
|
||||
<div class="my-2">
|
||||
<h2 class="text-2xl">Game</h2>
|
||||
<Show when=move || { connected() } fallback=|| view! { <p>"Disconnected."</p> }>
|
||||
<Show
|
||||
when=move || game_meta.get().is_some() && connected()
|
||||
fallback=|| view! { "You are not in a game" }
|
||||
|
@ -272,6 +273,7 @@ pub fn Game() -> impl IntoView {
|
|||
/>
|
||||
</div>
|
||||
</Show>
|
||||
</Show>
|
||||
|
||||
</div>
|
||||
}
|
||||
|
|
Loading…
Add table
Reference in a new issue