Update screenshots

Signed-off-by: Jo Vandeginste <[email protected]>
jovandeginste · Jan 12, 2025 · 18658b2 · 18658b2
1 parent ef6f3a9
commit 18658b2
Show file tree

Hide file tree

Showing 21 changed files with 47 additions and 30 deletions.
diff --git a/README.md b/README.md
@@ -136,6 +136,10 @@ Login / registration form
 - new users have to be activated by an admin
 - registration can be disabled
 
+#### Multilingual
+
+![](docs/login-nl.png)
+
 ### Dashboard
 
 ![](docs/dashboard.png)
@@ -185,6 +189,9 @@ Details of a workout, with:
   calculated and stored in the database (serialized).
 - Or add a workout manually.
 
+![](docs/upload_workouts_manual.png)
+
+
 ### Statistics to follow your progress
 
 ![](docs/statistics.png)
@@ -320,6 +327,8 @@ Because I keep forgetting how to build every component, I created a Makefile.
 make all # Run tests and build all components
 
 # Install system dependencies
+make install-dev-deps
+# Install Javascript libraries
 make install-deps
 
 # Testing

diff --git a/docs/dashboard-responsive.png b/docs/dashboard-responsive.png
diff --git a/docs/dashboard.png b/docs/dashboard.png
diff --git a/docs/login-nl.png b/docs/login-nl.png
diff --git a/docs/login.png b/docs/login.png
diff --git a/docs/responsive.png b/docs/responsive.png
diff --git a/docs/single_workout-dark.png b/docs/single_workout-dark.png
diff --git a/docs/single_workout-light.png b/docs/single_workout-light.png
diff --git a/docs/single_workout-responsive.png b/docs/single_workout-responsive.png
diff --git a/docs/single_workout-theme.jpg b/docs/single_workout-theme.jpg
diff --git a/docs/statistics-responsive.png b/docs/statistics-responsive.png
diff --git a/docs/statistics.png b/docs/statistics.png
diff --git a/docs/upload_workouts.png b/docs/upload_workouts.png
diff --git a/docs/upload_workouts_manual.png b/docs/upload_workouts_manual.png
diff --git a/docs/workout_overview.png b/docs/workout_overview.png
diff --git a/package-lock.json b/package-lock.json
diff --git a/screenshots.js b/screenshots.js
@@ -24,6 +24,13 @@ export default async function () {
   });
 
   try {
+    await Promise.all([
+      page.waitForNavigation(),
+      page.goto("http://localhost:8080/user/signin?lang=nl"),
+    ]);
+
+    page.screenshot({ path: "docs/login-nl.png", fullPage: true });
+
     await Promise.all([
       page.waitForNavigation(),
       page.goto("http://localhost:8080"),
@@ -60,7 +67,7 @@ export default async function () {
 
     await Promise.all([
       page.waitForNavigation(),
-      page.goto("http://localhost:8080/workouts/10"),
+      page.goto("http://localhost:8080/workouts/250"),
     ]);
     page.screenshot({ path: "docs/single_workout-dark.png", fullPage: true });
 
@@ -69,13 +76,22 @@ export default async function () {
       page.goto("http://localhost:8080/workouts/add"),
     ]);
     page.screenshot({ path: "docs/upload_workouts.png", fullPage: true });
+    const options = page.locator("#manual #type");
+    await options.selectOption("running");
+    await page.waitForSelector("#manual #location");
+    page.locator("#manual #location").fill("brussels");
+    await page.waitForSelector("#manual #address-results");
+    page.screenshot({
+      path: "docs/upload_workouts_manual.png",
+      fullPage: true,
+    });
 
     page.emulateMedia({
       colorScheme: "light",
     });
     await Promise.all([
       page.waitForNavigation(),
-      page.goto("http://localhost:8080/workouts/10"),
+      page.goto("http://localhost:8080/workouts/250"),
     ]);
     page.screenshot({ path: "docs/single_workout-light.png", fullPage: true });
 
@@ -96,7 +112,7 @@ export default async function () {
 
     await Promise.all([
       page.waitForNavigation(),
-      page.goto("http://localhost:8080/workouts/10"),
+      page.goto("http://localhost:8080/workouts/250"),
     ]);
     page.screenshot({ path: "docs/single_workout-responsive.png" });
 

diff --git a/views/partials/address_results.templ b/views/partials/address_results.templ
@@ -20,7 +20,7 @@ templ AddressResults(addresses []string) {
     </script>
 	}
 	if len(addresses) > 0 {
-		<ul class="list-none">
+		<ul id="address-results" class="list-none">
 			for _, a := range addresses {
 				<li>
 					@helpers.IconFor("location")

diff --git a/views/partials/address_results_templ.go b/views/partials/address_results_templ.go
diff --git a/views/workouts/add.templ b/views/workouts/add.templ
@@ -17,6 +17,7 @@ templ Add() {
 				<div class="inner-form">
 					<h3>{ i18n.T(ctx, "Use a file") }</h3>
 					<form
+						id="upload"
 						method="post"
 						action={ templ.SafeURL(helpers.RouteFor(ctx, "workouts-create")) }
 						enctype="multipart/form-data"
@@ -79,7 +80,7 @@ templ Add() {
 			<div>
 				<div class="inner-form">
 					<h3>{ i18n.T(ctx, "Manual") }</h3>
-					<form method="post" action={ templ.SafeURL(helpers.RouteFor(ctx, "workouts-create")) }>
+					<form id="manual" method="post" action={ templ.SafeURL(helpers.RouteFor(ctx, "workouts-create")) }>
 						<table class="sm:table-auto">
 							<thead>
 								<tr>

diff --git a/views/workouts/add_templ.go b/views/workouts/add_templ.go