clean up stuff on disconnect
This commit is contained in:
Adam
parent
35afcf7dd4
commit
89344c6042
2 changed files with 185 additions and 171 deletions
|
|
@ -60,185 +60,187 @@ pub fn Browser() -> impl IntoView {
|
||||||
|
|
||||||
view! {
|
view! {
|
||||||
<div class="p-1">
|
<div class="p-1">
|
||||||
<h2 class="text-2xl">Game Browser</h2>
|
<Show when=move || connected() fallback=|| view! { <p>Disconnected.</p> }>
|
||||||
<table class="min-w-full border border-collapse table-auto">
|
<h2 class="text-2xl">Game Browser</h2>
|
||||||
<thead>
|
<div class="p-1">
|
||||||
<tr>
|
<table class="min-w-full border border-collapse table-auto">
|
||||||
<th class="border-b">Name</th>
|
<thead>
|
||||||
<th class="border-b">Host</th>
|
<tr>
|
||||||
<th class="border-b">Players</th>
|
<th class="border-b">Name</th>
|
||||||
<th class="border-b">Card Packs</th>
|
<th class="border-b">Host</th>
|
||||||
<th class="border-b"></th>
|
<th class="border-b">Players</th>
|
||||||
</tr>
|
<th class="border-b">Card Packs</th>
|
||||||
</thead>
|
<th class="border-b"></th>
|
||||||
{move || {
|
</tr>
|
||||||
game_browser_context()
|
</thead>
|
||||||
.iter()
|
<For
|
||||||
.map(|game| {
|
each=move || game_browser_context()
|
||||||
view! {
|
key=|game| game.uuid.clone()
|
||||||
<tr>
|
children=move |game| {
|
||||||
<td class="text-center border-b">{&game.name}</td>
|
view! {
|
||||||
<td class="text-center border-b">{&game.host}</td>
|
<tr>
|
||||||
<td class="text-center border-b">
|
<td class="text-center border-b">{&game.name}</td>
|
||||||
{&game.players.to_string()}
|
<td class="text-center border-b">{&game.host}</td>
|
||||||
</td>
|
<td class="text-center border-b">
|
||||||
<td class="text-center border-b">
|
{&game.players.to_string()}
|
||||||
{&game.packs.len().to_string()}
|
</td>
|
||||||
</td>
|
<td class="text-center border-b">
|
||||||
<td class="text-center border-b">
|
{&game.packs.len().to_string()}
|
||||||
<button
|
</td>
|
||||||
type="button"
|
<td class="text-center border-b">
|
||||||
value=&game.uuid
|
<button
|
||||||
on:click=move |e| {
|
type="button"
|
||||||
set_join_id(event_target_value(&e));
|
value=&game.uuid
|
||||||
}
|
on:click=move |e| {
|
||||||
>
|
set_join_id(event_target_value(&e));
|
||||||
Join
|
}
|
||||||
</button>
|
>
|
||||||
<button
|
Join
|
||||||
type="button"
|
</button>
|
||||||
value=&game.uuid
|
<button
|
||||||
on:click=move |e| {
|
type="button"
|
||||||
set_delete_id(event_target_value(&e));
|
value=&game.uuid
|
||||||
}
|
on:click=move |e| {
|
||||||
>
|
set_delete_id(event_target_value(&e));
|
||||||
Delete
|
}
|
||||||
</button>
|
>
|
||||||
</td>
|
Delete
|
||||||
</tr>
|
</button>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})
|
/>
|
||||||
.collect_view()
|
</table>
|
||||||
}}
|
|
||||||
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
<hr />
|
|
||||||
|
|
||||||
<div class="flex p-1">
|
|
||||||
<form onsubmit="return false" on:submit=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"
|
|
||||||
disabled=move || !connected()
|
|
||||||
node_ref=new_game_name_ref
|
|
||||||
/>
|
|
||||||
<h2 class="text-2xl">Packs</h2>
|
|
||||||
<div class="p-2">
|
|
||||||
<button type="button" class="bg-neutral-600">
|
|
||||||
<input type="checkbox" id="all" />
|
|
||||||
<label for="all">All</label>
|
|
||||||
</button>
|
|
||||||
<button type="button" class="bg-neutral-600">
|
|
||||||
<input type="checkbox" id="official" checked />
|
|
||||||
<label for="official">Official</label>
|
|
||||||
</button>
|
|
||||||
<button type="button" class="bg-neutral-600" on:click=show_packs_button>
|
|
||||||
<label>Custom</label>
|
|
||||||
</button>
|
|
||||||
TODO: finish this
|
|
||||||
</div>
|
</div>
|
||||||
<Show when=move || show_packs()>
|
<hr />
|
||||||
<span class="flex">
|
|
||||||
<div>
|
|
||||||
<h2 class="text-xl">Official</h2>
|
|
||||||
{move || {
|
|
||||||
card_packs()
|
|
||||||
.official_meta
|
|
||||||
.into_iter()
|
|
||||||
.map(|n| {
|
|
||||||
view! {
|
|
||||||
<input
|
|
||||||
type="checkbox"
|
|
||||||
value=n.pack
|
|
||||||
id=n.pack
|
|
||||||
checked
|
|
||||||
on:change=move |e| {
|
|
||||||
if event_target_checked(&e) {
|
|
||||||
logging::log!("insert");
|
|
||||||
set_selected_packs
|
|
||||||
.update(|packs| {
|
|
||||||
packs.insert(n.pack);
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
logging::log!("remove");
|
|
||||||
set_selected_packs
|
|
||||||
.update(|packs| {
|
|
||||||
packs.remove(&n.pack);
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<label for=n.pack>{n.name}</label>
|
|
||||||
<br />
|
|
||||||
|
|
||||||
// hax
|
|
||||||
{set_selected_packs
|
|
||||||
.update(|packs| {
|
|
||||||
packs.insert(n.pack);
|
|
||||||
})}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.collect_view()
|
|
||||||
}}
|
|
||||||
|
|
||||||
|
<div class="flex p-1">
|
||||||
|
<form onsubmit="return false" on:submit=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"
|
||||||
|
disabled=move || !connected()
|
||||||
|
node_ref=new_game_name_ref
|
||||||
|
/>
|
||||||
|
<h2 class="text-2xl">Packs</h2>
|
||||||
|
<div class="p-2">
|
||||||
|
<button type="button" class="bg-neutral-600">
|
||||||
|
<input type="checkbox" id="all" />
|
||||||
|
<label for="all">All</label>
|
||||||
|
</button>
|
||||||
|
<button type="button" class="bg-neutral-600">
|
||||||
|
<input type="checkbox" id="official" checked />
|
||||||
|
<label for="official">Official</label>
|
||||||
|
</button>
|
||||||
|
<button type="button" class="bg-neutral-600" on:click=show_packs_button>
|
||||||
|
<label>Custom</label>
|
||||||
|
</button>
|
||||||
|
TODO: finish this
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<Show when=move || show_packs()>
|
||||||
<h2 class="text-xl">Unofficial</h2>
|
<span class="flex">
|
||||||
{move || {
|
<div>
|
||||||
card_packs()
|
<h2 class="text-xl">Official</h2>
|
||||||
.unofficial_meta
|
{move || {
|
||||||
.into_iter()
|
card_packs()
|
||||||
.map(|n| {
|
.official_meta
|
||||||
view! {
|
.into_iter()
|
||||||
<input
|
.map(|n| {
|
||||||
checked
|
view! {
|
||||||
type="checkbox"
|
<input
|
||||||
value=n.pack
|
type="checkbox"
|
||||||
id=n.pack
|
value=n.pack
|
||||||
on:change=move |e| {
|
id=n.pack
|
||||||
if event_target_checked(&e) {
|
checked
|
||||||
logging::log!("insert");
|
on:change=move |e| {
|
||||||
set_selected_packs
|
if event_target_checked(&e) {
|
||||||
.update(|packs| {
|
logging::log!("insert");
|
||||||
packs.insert(n.pack);
|
set_selected_packs
|
||||||
})
|
.update(|packs| {
|
||||||
} else {
|
packs.insert(n.pack);
|
||||||
logging::log!("remove");
|
})
|
||||||
set_selected_packs
|
} else {
|
||||||
.update(|packs| {
|
logging::log!("remove");
|
||||||
packs.remove(&n.pack);
|
set_selected_packs
|
||||||
})
|
.update(|packs| {
|
||||||
}
|
packs.remove(&n.pack);
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<label for=n.pack>{n.name}</label>
|
||||||
|
<br />
|
||||||
|
|
||||||
|
// hax
|
||||||
|
{set_selected_packs
|
||||||
|
.update(|packs| {
|
||||||
|
packs.insert(n.pack);
|
||||||
|
})}
|
||||||
}
|
}
|
||||||
/>
|
})
|
||||||
|
.collect_view()
|
||||||
|
}}
|
||||||
|
|
||||||
<label for=n.pack>{n.name}</label>
|
</div>
|
||||||
<br />
|
<div>
|
||||||
|
<h2 class="text-xl">Unofficial</h2>
|
||||||
|
{move || {
|
||||||
|
card_packs()
|
||||||
|
.unofficial_meta
|
||||||
|
.into_iter()
|
||||||
|
.map(|n| {
|
||||||
|
view! {
|
||||||
|
<input
|
||||||
|
checked
|
||||||
|
type="checkbox"
|
||||||
|
value=n.pack
|
||||||
|
id=n.pack
|
||||||
|
on:change=move |e| {
|
||||||
|
if event_target_checked(&e) {
|
||||||
|
logging::log!("insert");
|
||||||
|
set_selected_packs
|
||||||
|
.update(|packs| {
|
||||||
|
packs.insert(n.pack);
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
logging::log!("remove");
|
||||||
|
set_selected_packs
|
||||||
|
.update(|packs| {
|
||||||
|
packs.remove(&n.pack);
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
|
||||||
// hax
|
<label for=n.pack>{n.name}</label>
|
||||||
{set_selected_packs
|
<br />
|
||||||
.update(|packs| {
|
|
||||||
packs.insert(n.pack);
|
|
||||||
})}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.collect_view()
|
|
||||||
}}
|
|
||||||
|
|
||||||
</div>
|
// hax
|
||||||
</span>
|
{set_selected_packs
|
||||||
</Show>
|
.update(|packs| {
|
||||||
|
packs.insert(n.pack);
|
||||||
|
})}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.collect_view()
|
||||||
|
}}
|
||||||
|
|
||||||
<input
|
</div>
|
||||||
class="py-2 px-4 pl-4 font-bold text-white rounded border-b-4 bg-neutral-600 border-neutral-800 hover:bg-neutral-700 hover:border-neutral-500"
|
</span>
|
||||||
type="submit"
|
</Show>
|
||||||
disabled=move || !connected()
|
|
||||||
value="New Game"
|
<input
|
||||||
/>
|
class="py-2 px-4 pl-4 font-bold text-white rounded border-b-4 bg-neutral-600 border-neutral-800 hover:bg-neutral-700 hover:border-neutral-500"
|
||||||
</form>
|
type="submit"
|
||||||
|
disabled=move || !connected()
|
||||||
|
value="New Game"
|
||||||
|
/>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</Show>
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -54,9 +54,10 @@ pub fn Websocket() -> impl IntoView {
|
||||||
Rc::new(close.clone()),
|
Rc::new(close.clone()),
|
||||||
));
|
));
|
||||||
|
|
||||||
// TODO: This context stuff can probably be done better
|
let connected = move || ready_state.get() == ConnectionReadyState::Open;
|
||||||
|
|
||||||
// Contexts for message handler
|
// Contexts for message handler
|
||||||
|
// TODO: This context stuff can probably be done better
|
||||||
let (state_summary, set_state_summary) =
|
let (state_summary, set_state_summary) =
|
||||||
create_signal::<Option<ServerStateSummary>>(Option::None);
|
create_signal::<Option<ServerStateSummary>>(Option::None);
|
||||||
let (active_games, set_active_games) = create_signal::<Vec<GameBrowserMeta>>(vec![]);
|
let (active_games, set_active_games) = create_signal::<Vec<GameBrowserMeta>>(vec![]);
|
||||||
|
|
@ -70,6 +71,17 @@ pub fn Websocket() -> impl IntoView {
|
||||||
unofficial_meta: vec![],
|
unofficial_meta: vec![],
|
||||||
});
|
});
|
||||||
|
|
||||||
|
create_effect(move |_| {
|
||||||
|
if !connected() {
|
||||||
|
set_active_games.set_untracked(vec![]);
|
||||||
|
set_user_update.set_untracked(None);
|
||||||
|
set_chat_update.set_untracked(None);
|
||||||
|
set_judge_round.set_untracked(None);
|
||||||
|
set_chat_message.set_untracked(None);
|
||||||
|
set_current_game.set_untracked(None);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
provide_context::<ReadSignal<CardPacksMeta>>(card_packs_meta);
|
provide_context::<ReadSignal<CardPacksMeta>>(card_packs_meta);
|
||||||
provide_context::<ReadSignal<Option<UserUpdate>>>(user_update);
|
provide_context::<ReadSignal<Option<UserUpdate>>>(user_update);
|
||||||
provide_context::<ReadSignal<Option<ChatUpdate>>>(chat_update);
|
provide_context::<ReadSignal<Option<ChatUpdate>>>(chat_update);
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue