itsscb/wordl
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: success color green + succes string

Browse Source
This commit is contained in:
itsscb 2024-08-22 22:57:27 +02:00
parent e1d88bec46
commit 6e31804f19
10 changed files with 110 additions and 118 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/dist/index.html vendored
View File

@ -4,18 +4,18 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>wordl</title> <title>wordl</title>
<link rel="stylesheet" href="/styles-add0068c1366f403.css" integrity="sha384&#x2D;oO0hYe8j0tkkpiCNo2PXiIFh6Vwmm2ty5iohHzbRDrcpAuTt928xjetb0ohUvBR&#x2B;"/> <link rel="stylesheet" href="/styles-56e395d325eea0a0.css" integrity="sha384&#x2D;BKXf0WUvwZXMIC1tQftZYg6IGrJLeye6QMBsIJIV&#x2F;h8FrUIm8CdRg2PVDsWMe&#x2B;21"/>
<!-- <link data-trunk href="./assets/favicon.ico" rel="icon" type="image/x-icon"> --> <!-- <link data-trunk href="./assets/favicon.ico" rel="icon" type="image/x-icon"> -->
<link rel="manifest" href="public/manifest.json" /> <link rel="manifest" href="public/manifest.json" />
<link rel="modulepreload" href="/wordl-frontend-7f6cb257e85da62d.js" crossorigin=anonymous integrity="sha384-YfcyUtskzvmk1ZFFoDAlBKcXGliokP+ONHDzdyJ+ackDIvDUSi8e+7NWFKvrIDPt"> <link rel="modulepreload" href="/wordl-frontend-770b82d74b8fe3d1.js" crossorigin=anonymous integrity="sha384-CDuGXq2M2GIUtZqzV+WpfMGA9eLZOCCBQ42XsIz7ArSLjDz58qhttqIvHNgUVHDv">
<link rel="preload" href="/wordl-frontend-7f6cb257e85da62d_bg.wasm" crossorigin=anonymous integrity="sha384-FQHSAJ8FzS4eGs5P++LL1Ufxf/0evG6ZjlFdEx/eoFuF1wSlpdYlMdV8RmR94Vxs" as="fetch" type="application/wasm"></head> <link rel="preload" href="/wordl-frontend-770b82d74b8fe3d1_bg.wasm" crossorigin=anonymous integrity="sha384-oEouOw3rU92vA/EK60pTtLrcYepoqg01Nh427fylyLqc3i8yln10i7nFwbIzJb9L" as="fetch" type="application/wasm"></head>
<body class="bg-black text-white"> <body class="bg-black text-white">
<script type="module" nonce="tYbozDdMc+NoIg0ie+h89g=="> <script type="module" nonce="Y+ksMS3ptZr6m/zye0dAGQ==">
import init, * as bindings from '/wordl-frontend-7f6cb257e85da62d.js'; import init, * as bindings from '/wordl-frontend-770b82d74b8fe3d1.js';
const wasm = await init('/wordl-frontend-7f6cb257e85da62d_bg.wasm'); const wasm = await init('/wordl-frontend-770b82d74b8fe3d1_bg.wasm');
window.wasmBindings = bindings; window.wasmBindings = bindings;

5
frontend/dist/public/styles.css vendored
View File

@ -656,6 +656,11 @@ video {
background-color: rgb(74 222 128 / var(--tw-bg-opacity)); background-color: rgb(74 222 128 / var(--tw-bg-opacity));
} }
.bg-green-600 {
--tw-bg-opacity: 1;
background-color: rgb(22 163 74 / var(--tw-bg-opacity));
}
.bg-green-700 { .bg-green-700 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(21 128 61 / var(--tw-bg-opacity)); background-color: rgb(21 128 61 / var(--tw-bg-opacity));

5
frontend/dist/styles-add0068c1366f403.css → frontend/dist/styles-56e395d325eea0a0.css vendored
View File

@ -656,6 +656,11 @@ video {
background-color: rgb(74 222 128 / var(--tw-bg-opacity)); background-color: rgb(74 222 128 / var(--tw-bg-opacity));
} }
.bg-green-600 {
--tw-bg-opacity: 1;
background-color: rgb(22 163 74 / var(--tw-bg-opacity));
}
.bg-green-700 { .bg-green-700 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(21 128 61 / var(--tw-bg-opacity)); background-color: rgb(21 128 61 / var(--tw-bg-opacity));

51
frontend/dist/wordl-frontend-7f6cb257e85da62d.js → frontend/dist/wordl-frontend-770b82d74b8fe3d1.js vendored
View File

@ -667,29 +667,6 @@ function __wbg_get_imports() {
const ret = result; const ret = result;
return ret; return ret;
}; };
imports.wbg.__wbg_url_1bf85c8abeb8c92d = function(arg0, arg1) {
const ret = getObject(arg1).url;
const ptr1 = passStringToWasm0(ret, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc);
const len1 = WASM_VECTOR_LEN;
getDataViewMemory0().setInt32(arg0 + 4 * 1, len1, true);
getDataViewMemory0().setInt32(arg0 + 4 * 0, ptr1, true);
};
imports.wbg.__wbg_redirected_1cc4f189c19c7627 = function(arg0) {
const ret = getObject(arg0).redirected;
return ret;
};
imports.wbg.__wbg_status_ae8de515694c5c7c = function(arg0) {
const ret = getObject(arg0).status;
return ret;
};
imports.wbg.__wbg_headers_5e283e8345689121 = function(arg0) {
const ret = getObject(arg0).headers;
return addHeapObject(ret);
};
imports.wbg.__wbg_bodyUsed_51e2f0d1a45b2956 = function(arg0) {
const ret = getObject(arg0).bodyUsed;
return ret;
};
imports.wbg.__wbg_text_a94b91ea8700357a = function() { return handleError(function (arg0) { imports.wbg.__wbg_text_a94b91ea8700357a = function() { return handleError(function (arg0) {
const ret = getObject(arg0).text(); const ret = getObject(arg0).text();
return addHeapObject(ret); return addHeapObject(ret);
@ -811,18 +788,6 @@ function __wbg_get_imports() {
const ret = new Function(getStringFromWasm0(arg0, arg1)); const ret = new Function(getStringFromWasm0(arg0, arg1));
return addHeapObject(ret); return addHeapObject(ret);
}; };
imports.wbg.__wbg_next_f9cb570345655b9a = function() { return handleError(function (arg0) {
const ret = getObject(arg0).next();
return addHeapObject(ret);
}, arguments) };
imports.wbg.__wbg_done_bfda7aa8f252b39f = function(arg0) {
const ret = getObject(arg0).done;
return ret;
};
imports.wbg.__wbg_value_6d39332ab4788d86 = function(arg0) {
const ret = getObject(arg0).value;
return addHeapObject(ret);
};
imports.wbg.__wbg_call_1084a111329e68ce = function() { return handleError(function (arg0, arg1) { imports.wbg.__wbg_call_1084a111329e68ce = function() { return handleError(function (arg0, arg1) {
const ret = getObject(arg0).call(getObject(arg1)); const ret = getObject(arg0).call(getObject(arg1));
return addHeapObject(ret); return addHeapObject(ret);
@ -883,10 +848,6 @@ function __wbg_get_imports() {
const ret = getObject(arg0).toString(); const ret = getObject(arg0).toString();
return addHeapObject(ret); return addHeapObject(ret);
}; };
imports.wbg.__wbg_entries_2f5ddf03b53c6730 = function(arg0) {
const ret = getObject(arg0).entries();
return addHeapObject(ret);
};
imports.wbg.__wbg_isSafeInteger_7f1ed56200d90674 = function(arg0) { imports.wbg.__wbg_isSafeInteger_7f1ed56200d90674 = function(arg0) {
const ret = Number.isSafeInteger(getObject(arg0)); const ret = Number.isSafeInteger(getObject(arg0));
return ret; return ret;
@ -958,16 +919,16 @@ function __wbg_get_imports() {
const ret = wasm.memory; const ret = wasm.memory;
return addHeapObject(ret); return addHeapObject(ret);
}; };
imports.wbg.__wbindgen_closure_wrapper919 = function(arg0, arg1, arg2) { imports.wbg.__wbindgen_closure_wrapper893 = function(arg0, arg1, arg2) {
const ret = makeClosure(arg0, arg1, 382, __wbg_adapter_38); const ret = makeClosure(arg0, arg1, 364, __wbg_adapter_38);
return addHeapObject(ret); return addHeapObject(ret);
}; };
imports.wbg.__wbindgen_closure_wrapper1026 = function(arg0, arg1, arg2) { imports.wbg.__wbindgen_closure_wrapper1041 = function(arg0, arg1, arg2) {
const ret = makeMutClosure(arg0, arg1, 409, __wbg_adapter_41); const ret = makeMutClosure(arg0, arg1, 411, __wbg_adapter_41);
return addHeapObject(ret); return addHeapObject(ret);
}; };
imports.wbg.__wbindgen_closure_wrapper1119 = function(arg0, arg1, arg2) { imports.wbg.__wbindgen_closure_wrapper1125 = function(arg0, arg1, arg2) {
const ret = makeMutClosure(arg0, arg1, 447, __wbg_adapter_44); const ret = makeMutClosure(arg0, arg1, 441, __wbg_adapter_44);
return addHeapObject(ret); return addHeapObject(ret);
}; };

BIN
frontend/dist/wordl-frontend-770b82d74b8fe3d1_bg.wasm vendored Normal file
View File

Binary file not shown.

BIN
frontend/dist/wordl-frontend-7f6cb257e85da62d_bg.wasm vendored
View File

Binary file not shown.

5
frontend/public/styles.css
View File

@ -656,6 +656,11 @@ video {
background-color: rgb(74 222 128 / var(--tw-bg-opacity)); background-color: rgb(74 222 128 / var(--tw-bg-opacity));
} }
.bg-green-600 {
--tw-bg-opacity: 1;
background-color: rgb(22 163 74 / var(--tw-bg-opacity));
}
.bg-green-700 { .bg-green-700 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(21 128 61 / var(--tw-bg-opacity)); background-color: rgb(21 128 61 / var(--tw-bg-opacity));

30
frontend/src/pages/game.rs
View File

@ -2,7 +2,7 @@ use serde::{Deserialize, Serialize};
use crate::CharStatus; use crate::CharStatus;
#[derive(Debug,Serialize, Deserialize, Clone)] #[derive(Debug, Serialize, Deserialize, Clone)]
struct Game { struct Game {
word: String, word: String,
submitted_words: Vec<Vec<CharStatus<String>>>, submitted_words: Vec<Vec<CharStatus<String>>>,
@ -12,19 +12,29 @@ struct Game {
impl Game { impl Game {
#[allow(dead_code)] #[allow(dead_code)]
pub fn new(word: String, submitted_words: Vec<Vec<CharStatus<String>>>) -> Self { pub fn new(word: String, submitted_words: Vec<Vec<CharStatus<String>>>) -> Self {
let result = submitted_words.clone().into_iter().last().map_or(GameResult::Lose, |w| if w.iter().all(|v| matches!(v, CharStatus::Match(_))) { let result = submitted_words
GameResult::Win .clone()
} else { .into_iter()
GameResult::Lose .last()
.map_or(GameResult::Lose, |w| {
if w.iter().all(|v| matches!(v, CharStatus::Match(_))) {
GameResult::Win
} else {
GameResult::Lose
}
}); });
Self { word, submitted_words, result } Self {
word,
submitted_words,
result,
}
} }
} }
#[derive(Debug, Serialize, Deserialize, Clone, PartialEq, Eq)]
#[derive(Debug,Serialize, Deserialize, Clone, PartialEq, Eq)] #[allow(clippy::module_name_repetitions)]
enum GameResult { pub enum GameResult {
Win, Win,
Lose, Lose,
} }

119
frontend/src/pages/home.rs
View File

@ -1,4 +1,3 @@
use tracing::{debug, error};
use gloo_net::http::Request; use gloo_net::http::Request;
use web_sys::wasm_bindgen::convert::OptionIntoWasmAbi; use web_sys::wasm_bindgen::convert::OptionIntoWasmAbi;
use web_sys::wasm_bindgen::JsCast; use web_sys::wasm_bindgen::JsCast;
@ -6,6 +5,7 @@ use web_sys::HtmlElement;
use yew::prelude::*; use yew::prelude::*;
use yew::{classes, function_component, Callback, Html}; use yew::{classes, function_component, Callback, Html};
use crate::pages::game::GameResult;
use crate::CharStatus; use crate::CharStatus;
static NEW_WORD_URI: &str = "https://wordl.shuttleapp.rs/word"; static NEW_WORD_URI: &str = "https://wordl.shuttleapp.rs/word";
@ -27,7 +27,6 @@ fn set_focus(index: usize) {
} }
} }
// fn string_to_html(input: &Vec<CharStatus<String>>) -> Html {
fn string_to_html(input: &[CharStatus<String>]) -> Html { fn string_to_html(input: &[CharStatus<String>]) -> Html {
let classes = classes!( let classes = classes!(
"bg-gray-700", "bg-gray-700",
@ -96,6 +95,7 @@ fn string_to_html(input: &[CharStatus<String>]) -> Html {
) )
} }
#[allow(clippy::too_many_arguments)]
fn fetch_new_word( fn fetch_new_word(
word: &UseStateHandle<String>, word: &UseStateHandle<String>,
loading: &UseStateHandle<bool>, loading: &UseStateHandle<bool>,
@ -104,6 +104,7 @@ fn fetch_new_word(
game_over: &UseStateHandle<bool>, game_over: &UseStateHandle<bool>,
length: &UseStateHandle<usize>, length: &UseStateHandle<usize>,
node_refs: &UseStateHandle<Vec<NodeRef>>, node_refs: &UseStateHandle<Vec<NodeRef>>,
result: &UseStateHandle<GameResult>,
) { ) {
let handle = word.clone(); let handle = word.clone();
let loading = loading.clone(); let loading = loading.clone();
@ -112,36 +113,27 @@ fn fetch_new_word(
let game_over = game_over.clone(); let game_over = game_over.clone();
let length = length.clone(); let length = length.clone();
let node_refs = node_refs.clone(); let node_refs = node_refs.clone();
let result = result.clone();
wasm_bindgen_futures::spawn_local(async move { wasm_bindgen_futures::spawn_local(async move {
debug!("retrieving word");
let res = Request::get(NEW_WORD_URI).send().await; let res = Request::get(NEW_WORD_URI).send().await;
debug!(RESULT = format!("{res:?}")); if let Ok(r) = res {
match res { if let Ok(w) = r.text().await {
Ok(r) => { length.set(w.len());
debug!(RESPONSE = format!("{r:?}")); node_refs.set(vec![NodeRef::default(); w.len()]);
match r.text().await { input_values.set(vec![String::new(); w.len()]);
Ok(w) => { handle.set(w.to_uppercase());
debug!(WORD = &w); submitted_words.set(Vec::with_capacity(MAX_TRIES));
length.set(w.len()); game_over.set(false);
node_refs.set(vec![NodeRef::default(); w.len()]); result.set(GameResult::Lose);
input_values.set(vec![String::new(); w.len()]); loading.set(false);
handle.set(w.to_uppercase());
submitted_words.set(Vec::with_capacity(MAX_TRIES));
game_over.set(false);
loading.set(false);
}
Err(e) => error!(ERROR = format!("{e:?}"), "failed to get request body"),
}
} }
Err(e) => error!(ERROR = format!("{e:?}"), "failed to retrieve word"),
} }
}); });
} }
#[function_component] #[function_component]
pub fn Home() -> Html { pub fn Home() -> Html {
let word: UseStateHandle<String> = use_state(String::new); let word: UseStateHandle<String> = use_state(String::new);
let loading: UseStateHandle<bool> = use_state(|| true); let loading: UseStateHandle<bool> = use_state(|| true);
@ -153,6 +145,8 @@ pub fn Home() -> Html {
let input_values: UseStateHandle<Vec<String>> = use_state(|| vec![String::new(); *length]); let input_values: UseStateHandle<Vec<String>> = use_state(|| vec![String::new(); *length]);
let game_over = use_state(|| false); let game_over = use_state(|| false);
let result = use_state(|| GameResult::Lose);
{ {
let handle = word.clone(); let handle = word.clone();
let loading = loading.clone(); let loading = loading.clone();
@ -162,50 +156,42 @@ pub fn Home() -> Html {
let game_over = game_over.clone(); let game_over = game_over.clone();
let length = length.clone(); let length = length.clone();
let node_refs = node_refs.clone(); let node_refs = node_refs.clone();
let result = result.clone();
use_effect_with((), move |()| { use_effect_with((), move |()| {
wasm_bindgen_futures::spawn_local(async move { fetch_new_word(
debug!("retreiving word"); &handle,
let res = Request::get(NEW_WORD_URI).send().await; &loading,
debug!(RESULT = format!("{res:?}")); &submitted_words,
match res { &input_values,
Ok(r) => { &game_over,
debug!(RESPONSE = format!("{r:?}")); &length,
match r.text().await { &node_refs,
Ok(w) => { &result,
debug!(WORD = &w); );
length.set(w.len());
node_refs.set(vec![NodeRef::default(); w.len()]);
input_values.set(vec![String::new(); w.len()]);
handle.set(w.to_uppercase());
submitted_words.set(std::vec::Vec::with_capacity(MAX_TRIES));
game_over.set(false);
loading.set(false);
}
Err(e) => error!(ERROR = format!("{e:?}"),"failed to get request body"),
}
}
Err(e) => error!(ERROR = format!("{e:?}"),"failed to retreive word"),
}
});
|| ()
}); });
} }
let game_over_check = { let game_over_check = {
let word = word.clone(); let word = word.clone();
let submitted_words = submitted_words.clone(); let submitted_words = submitted_words.clone();
let iv = input_values.clone(); let iv = input_values.clone();
let game_over = game_over.clone(); let game_over = game_over.clone();
let length = length.clone(); let length = length.clone();
let result = result.clone();
Callback::from(move |_| { Callback::from(move |_| {
if submitted_words.iter().count() >= *length - 1 if submitted_words.iter().count() >= *length - 1
|| crate::compare_strings(&word, &iv.join("")) || crate::compare_strings(&word, &iv.join(""))
.iter() .iter()
.all(|v| matches!(v, CharStatus::Match(_))) .all(|v| matches!(v, CharStatus::Match(_)))
{ {
if crate::compare_strings(&word, &iv.join(""))
.iter()
.all(|v| matches!(v, CharStatus::Match(_)))
{
result.set(GameResult::Win);
}
game_over.set(true); game_over.set(true);
} }
}) })
@ -219,8 +205,8 @@ pub fn Home() -> Html {
let word = word.clone(); let word = word.clone();
let node_refs = node_refs.clone(); let node_refs = node_refs.clone();
let loading = loading.clone(); let loading = loading.clone();
let result = result.clone();
Callback::from(move |_e: MouseEvent| { Callback::from(move |_e: MouseEvent| {
if *game_over { if *game_over {
let input_values = input_values.clone(); let input_values = input_values.clone();
@ -230,7 +216,17 @@ pub fn Home() -> Html {
let word = word.clone(); let word = word.clone();
let loading = loading.clone(); let loading = loading.clone();
let node_refs = node_refs.clone(); let node_refs = node_refs.clone();
fetch_new_word(&word, &loading, &submitted_words, &input_values, &game_over, &length, &node_refs); let result = result.clone();
fetch_new_word(
&word,
&loading,
&submitted_words,
&input_values,
&game_over,
&length,
&node_refs,
&result,
);
return; return;
} }
let values: Vec<_> = input_values.iter().cloned().collect(); let values: Vec<_> = input_values.iter().cloned().collect();
@ -293,11 +289,22 @@ pub fn Home() -> Html {
{ {
if *loading { if *loading {
html!(<p>{"Loading..."}</p>) html!(<p>{"Loading..."}</p>)
} }
else if *game_over { else if *game_over {
let (text, color) = match *result {
GameResult::Win => {
("FOUND", "bg-green-600")
},
GameResult::Lose => {
("WANTED", "bg-red-600")
}
};
html! ( html! (
<div> <div>
<h1>{"WANTED"}</h1> <h1>{
text
}</h1>
<ul <ul
class={ class={
classes!( classes!(
@ -310,7 +317,7 @@ pub fn Home() -> Html {
> >
{ {
word.chars().map(|e|{ word.chars().map(|e|{
let text = e; let text = e;
html!{ html!{
<li <li
@ -330,7 +337,7 @@ pub fn Home() -> Html {
"py-4", "py-4",
"font-bold", "font-bold",
"text-lg", "text-lg",
"bg-red-600", {color},
) )
} }
> >

1
frontend/src/pages/mod.rs
View File

@ -1,4 +1,3 @@
mod home; mod home;
pub use home::Home; pub use home::Home;