diff --git a/backend/Cargo.toml b/backend/Cargo.toml index 5b73123..7f1a8b1 100644 --- a/backend/Cargo.toml +++ b/backend/Cargo.toml @@ -19,3 +19,5 @@ serde_json = "1.0" tracing = "0.1.9" tracing-futures = "0.1.0" tracing-subscriber = "0.1.5" +rocket = { git = "https://github.com/SergioBenitez/Rocket", branch = "async" } +rocket_contrib = { git = "https://github.com/SergioBenitez/Rocket", branch = "async", features = ["handlebars_templates", "tera_templates"] } diff --git a/backend/src/routes.rs b/backend/src/routes.rs index 17cb0ff..99a9eaa 100644 --- a/backend/src/routes.rs +++ b/backend/src/routes.rs @@ -64,7 +64,7 @@ async fn maps_get() -> Result { let maps = get_maps().await?; let context = Context { name: "Arthur".into(), maps: Some(maps) }; - Ok(Template::render("index", &context)) + Ok(Template::render("lobby", &context)) } #[get("/maps/")] diff --git a/backend/static/script/maps.js b/backend/static/script/maps.js new file mode 100644 index 0000000..1b1931c --- /dev/null +++ b/backend/static/script/maps.js @@ -0,0 +1,14 @@ +const ids = {}; +["map_holder"].forEach(id => ids[id] = document.getElementById(id)); + +var last_map; + +async function handle_map_click(url, event) { + if (last_map) { + last_map.classList.remove("selected"); + } + last_map = event.target; + event.target.classList.add("selected"); + const c = await fetch(url); + ids["map_holder"].innerHTML = await c.text(); +} \ No newline at end of file diff --git a/backend/static/script/script.js b/backend/static/script/script.js deleted file mode 100644 index 2bdfc89..0000000 --- a/backend/static/script/script.js +++ /dev/null @@ -1,8 +0,0 @@ -const ids = {}; -["map_holder"].forEach(id => ids[id] = document.getElementById(id)); - -async function handle_map_click(url) { - console.log(url); - const c = await fetch(url); - ids["map_holder"].innerHTML = await c.text(); -} diff --git a/backend/static/style/style.css b/backend/static/style/style.css index 0c58e47..c6fa5c9 100644 --- a/backend/static/style/style.css +++ b/backend/static/style/style.css @@ -1,3 +1,104 @@ +html, +body { + margin: 0; + padding: 0; +} + .small { font-size: 2px; - } +} + +.main { + display: flex; + width: 100%; + height: 100%; + overflow: hidden; +} + +.lobby { + flex-grow: 1; + background-color: red; +} + +.input_container { + display: flex; + margin: auto; + width: 90%; + padding: 10px; +} + +.input_container label { + font-size: normal; + width: 30%; +} + +.input_container input { + font-size: small; + width: 70%; +} + +.number label { + width: 60%; +} + +.number input { + width: 40%; + text-align: right; +} + +.map_select { + overflow-y: scroll; + flex-shrink: 5; + width: 75%; + height: 100%; +} + +.map { + padding: 5px; + background-color: lightgray; + color: black; +} + +.selected { + background-color: #ff7f00; +} + +.map:hover { + filter: brightness(80%); +} + +.creator { + background-color: #333; + display: flex; + flex-direction: column; + height: 100vh; + min-width: 300px; + /* width: 25%; */ + justify-content: space-between; + align-items: center; + color: #aaa; +} + +.creator h1 { + text-align: center; + margin: 0; +} + +.creator button { + margin-bottom: 10px; + width: 80%; + padding: 5px; +} + +#map_holder { + width: 100%; + height: 300px; + background-color: #111; +} + +svg { + left: 0; + top: 0; + width: 100%; + height: 100%; +} \ No newline at end of file diff --git a/backend/static/test.html b/backend/static/test.html new file mode 100644 index 0000000..408e9ea --- /dev/null +++ b/backend/static/test.html @@ -0,0 +1,60 @@ + + + + + + + + Document + + + +
+
+
+

Start new game

+
+ + +
+ +
+
map
+ +
hex_up
+ +
spiral2
+ +
spiral
+ +
hungergames
+ +
hex
+ +
test_map
+ +
pietmap
+ +
large
+
+
+ + +
+
+ + +
+ +
+ +
+
+
+ + + + + \ No newline at end of file diff --git a/backend/templates/base.html.tera b/backend/templates/base.html.tera index bdd4d0c..d3c395f 100644 --- a/backend/templates/base.html.tera +++ b/backend/templates/base.html.tera @@ -7,10 +7,5 @@ {% block content %}{% endblock content %} - -
-
- - diff --git a/backend/templates/lobby.html.tera b/backend/templates/lobby.html.tera new file mode 100644 index 0000000..7636bfb --- /dev/null +++ b/backend/templates/lobby.html.tera @@ -0,0 +1,34 @@ +{% extends "base" %} + +{% block content %} +
+
+
+

Start new game

+
+ + +
+ +
+ {% include "maps" %} +
+
+ + +
+
+ + +
+ +
+ +
+
+
+ + +{% endblock %} diff --git a/backend/templates/map_partial.html.tera b/backend/templates/map_partial.html.tera index 61a7be4..595f2c5 100644 --- a/backend/templates/map_partial.html.tera +++ b/backend/templates/map_partial.html.tera @@ -1,8 +1,7 @@ -

Map rendering

-{% for planet in planets %} - -{{planet.name}} -{% endfor %} +{% for planet in planets -%} + + {# {{planet.name}} #} +{% endfor -%} diff --git a/backend/templates/maps.html.tera b/backend/templates/maps.html.tera index 61818be..94ef632 100644 --- a/backend/templates/maps.html.tera +++ b/backend/templates/maps.html.tera @@ -1,3 +1,3 @@ {% for m in maps %} -

{{ m.name }}

+
{{ m.name }}
{% endfor %}