Use randomly shuffled strings instead of numbers
This commit is contained in:
parent
555108ff8f
commit
3d877709f3
40
remembers/Cargo.lock
generated
40
remembers/Cargo.lock
generated
|
|
@ -48,8 +48,10 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
|
|||
checksum = "d39cd93900197114fa1fcb7ae84ca742095eed9442088988ae74fa744e930e77"
|
||||
dependencies = [
|
||||
"cfg-if",
|
||||
"js-sys",
|
||||
"libc",
|
||||
"wasi",
|
||||
"wasm-bindgen",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
|
|
@ -110,6 +112,12 @@ version = "1.0.6"
|
|||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "0744126afe1a6dd7f394cb50a716dbe086cb06e255e53d8d0185d82828358fb5"
|
||||
|
||||
[[package]]
|
||||
name = "ppv-lite86"
|
||||
version = "0.2.16"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "eb9f9e6e233e5c4a35559a617bf40a4ec447db2e84c20b55a6f83167b7e57872"
|
||||
|
||||
[[package]]
|
||||
name = "proc-macro2"
|
||||
version = "1.0.36"
|
||||
|
|
@ -128,12 +136,44 @@ dependencies = [
|
|||
"proc-macro2",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "rand"
|
||||
version = "0.8.5"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "34af8d1a0e25924bc5b7c43c079c942339d8f0a8b57c39049bef581b46327404"
|
||||
dependencies = [
|
||||
"libc",
|
||||
"rand_chacha",
|
||||
"rand_core",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "rand_chacha"
|
||||
version = "0.3.1"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "e6c10a63a0fa32252be49d21e7709d4d4baf8d231c2dbce1eaa8141b9b127d88"
|
||||
dependencies = [
|
||||
"ppv-lite86",
|
||||
"rand_core",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "rand_core"
|
||||
version = "0.6.3"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "d34f1408f55294453790c48b2f1ebbb1c5b4b7563eb1f418bcfcfdbb06ebb4e7"
|
||||
dependencies = [
|
||||
"getrandom",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "remembers"
|
||||
version = "0.1.0"
|
||||
dependencies = [
|
||||
"console_error_panic_hook",
|
||||
"getrandom",
|
||||
"js-sys",
|
||||
"rand",
|
||||
"sycamore",
|
||||
"wasm-bindgen",
|
||||
"web-sys",
|
||||
|
|
|
|||
|
|
@ -9,6 +9,8 @@ edition = "2021"
|
|||
console_error_panic_hook = "0.1.7"
|
||||
sycamore = "0.8.0-beta.3"
|
||||
wasm-bindgen = "0.2.79"
|
||||
rand = "0.8.5"
|
||||
getrandom = { version = "0.2.5", features = ["js"] }
|
||||
|
||||
[dependencies.js-sys]
|
||||
version = "0.3.56"
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>RemembeRS</title>
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
use rand::seq::SliceRandom;
|
||||
use sycamore::prelude::*;
|
||||
use wasm_bindgen::{prelude::*, JsCast};
|
||||
use web_sys::{Element, Event};
|
||||
|
|
@ -29,7 +30,16 @@ fn main() {
|
|||
sycamore::render(|ctx| {
|
||||
console_error_panic_hook::set_once();
|
||||
|
||||
let v: &Signal<Vec<u8>> = ctx.create_signal((0..12u8).collect());
|
||||
let mut cards = ["burger", "fries", "hotdog", "soda", "nachos", "tacos"]
|
||||
.into_iter()
|
||||
.cycle()
|
||||
.take(12)
|
||||
// .map(|s| s.to_string())
|
||||
.collect::<Vec<_>>();
|
||||
|
||||
cards.shuffle(&mut rand::rngs::OsRng);
|
||||
|
||||
let v = ctx.create_signal(cards);
|
||||
|
||||
let on_click = |event: Event| {
|
||||
let elem = event
|
||||
|
|
@ -43,22 +53,22 @@ fn main() {
|
|||
|
||||
view! {ctx,
|
||||
div(class="wrapper") {
|
||||
h1(class="text-align-center") { "RemembeRS" }
|
||||
section(id="game") {
|
||||
Keyed {
|
||||
iterable: v,
|
||||
view: move |ctx, i| view! {ctx,
|
||||
div(class="card", on:click=on_click) {
|
||||
h2(class="back-face") {
|
||||
(i)
|
||||
}
|
||||
div(class="front-face")
|
||||
h1(class="text-align-center") { "RemembeRS" }
|
||||
section(id="game") {
|
||||
Keyed {
|
||||
iterable: v,
|
||||
view: move |ctx, i| view! {ctx,
|
||||
div(class="card", on:click=on_click, data_value=i.clone()) {
|
||||
h2(class="back-face") {
|
||||
(i)
|
||||
}
|
||||
},
|
||||
key: |x| *x
|
||||
}
|
||||
div(class="front-face")
|
||||
}
|
||||
},
|
||||
key: |x| x.clone()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
.wrapper {
|
||||
/* Text margin */
|
||||
margin: auto;
|
||||
width: 60%;
|
||||
width: 90%;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
|
|
@ -16,17 +16,23 @@
|
|||
}
|
||||
|
||||
body {
|
||||
height: 100vh;
|
||||
/* height: 100vh; */
|
||||
display: flex;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#game {
|
||||
width: 640px;
|
||||
height: 640px;
|
||||
width: 100%;
|
||||
height: 85vh;
|
||||
margin: auto;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
perspective: 1000px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.card {
|
||||
|
|
|
|||
Loading…
Reference in a new issue