From 451e6a2e8e35cc619210e430a1d8d2e7e387d7c0 Mon Sep 17 00:00:00 2001
From: Carl Worth
Date: Sun, 7 Jun 2020 10:23:02 -0700
Subject: [PATCH 01/16] Drop unused scribe/game.html
The server actually has a template file that serves this prupose. So
this static HTML file is entirely unused, (perhaps obviously so since
it has "Tic-Tac-Toe" in its title.
---
scribe/game.html | 35 -----------------------------------
1 file changed, 35 deletions(-)
delete mode 100644 scribe/game.html
diff --git a/scribe/game.html b/scribe/game.html
deleted file mode 100644
index b9136b7..0000000
--- a/scribe/game.html
+++ /dev/null
@@ -1,35 +0,0 @@
-
-
-
-
-
-
- Tic-tac-toe
-
-
-
-
-
-
-
-
-
-
-
-
-
-
Tic Tac Toe
-
-
- Just the classic game.
-
-
-
-
-
-
-
-
-
-
-
--
2.43.0
From 53c8c6ba09301563293750e1010ca1ac8dd05590 Mon Sep 17 00:00:00 2001
From: Carl Worth
Date: Sun, 7 Jun 2020 11:56:35 -0700
Subject: [PATCH 02/16] Initial framework for an Empathy game
This starts with the generic code, (grabbed from Scribe), for
displaying the game INFO, (with a button for copying the link), and
the list of players that are in the game.
It also provides a form for submitting a category, but that is still
inert for now.
---
empathy/.gitignore | 1 +
empathy/Makefile | 12 +++
empathy/empathy.css | 1 +
empathy/empathy.jsx | 217 ++++++++++++++++++++++++++++++++++++++++++++
empathy/index.html | 36 ++++++++
5 files changed, 267 insertions(+)
create mode 100644 empathy/.gitignore
create mode 100644 empathy/Makefile
create mode 100644 empathy/empathy.css
create mode 100644 empathy/empathy.jsx
create mode 100644 empathy/index.html
diff --git a/empathy/.gitignore b/empathy/.gitignore
new file mode 100644
index 0000000..053da87
--- /dev/null
+++ b/empathy/.gitignore
@@ -0,0 +1 @@
+empathy.js
diff --git a/empathy/Makefile b/empathy/Makefile
new file mode 100644
index 0000000..9f07401
--- /dev/null
+++ b/empathy/Makefile
@@ -0,0 +1,12 @@
+# Defer all targets up to the upper-level
+#
+# This requires two recipes. The first to cover the case of no
+# explicit target specifed (so when invoked as "make" we call "make"
+# at the upper-level) and then a .DEFAULT recipe to pass any explicit
+# target up as well, (so that an invocation of "make foo" results in a
+# call to "make foo" above.
+all:
+ $(MAKE) -C ..
+
+.DEFAULT:
+ $(MAKE) -C .. $@
diff --git a/empathy/empathy.css b/empathy/empathy.css
new file mode 100644
index 0000000..e8a317e
--- /dev/null
+++ b/empathy/empathy.css
@@ -0,0 +1 @@
+/* Nothing to see here yet. */
diff --git a/empathy/empathy.jsx b/empathy/empathy.jsx
new file mode 100644
index 0000000..9ebe9f3
--- /dev/null
+++ b/empathy/empathy.jsx
@@ -0,0 +1,217 @@
+function undisplay(element) {
+ element.style.display="none";
+}
+
+function add_message(severity, message) {
+ message = `
+ You don't need to be right, you just need to agree with your
+ friends.
+
+
+
+
+
+
+
+
+
+
--
2.43.0
From 68a66356ecb9d184e44b8d75e1f7db25926d4af3 Mon Sep 17 00:00:00 2001
From: Carl Worth
Date: Sun, 7 Jun 2020 15:14:10 -0700
Subject: [PATCH 03/16] Convert CategoryRequest from a function to a class
This seems like it will be more convenient for defining additional
methods to get access to from the JSX code (such as a submit handler
function).
---
empathy/empathy.jsx | 62 +++++++++++++++++++++++++--------------------
1 file changed, 34 insertions(+), 28 deletions(-)
diff --git a/empathy/empathy.jsx b/empathy/empathy.jsx
index 9ebe9f3..cd80629 100644
--- a/empathy/empathy.jsx
+++ b/empathy/empathy.jsx
@@ -122,36 +122,42 @@ async function fetch_put_json(api = '', data = {}) {
return fetch_method_json('PUT', api, data);
}
-function CategoryRequest(props) {
- return (
-
Suggest a category to play with your friends. Don't forget to
include the number of items for each person to submit.
-
-
-
-
- );
+
+
+
+
+ );
+ }
}
class Game extends React.Component {
--
2.43.0
From a1ed0fc881f3bfe6cc55041fda3b54f7c0baa94b Mon Sep 17 00:00:00 2001
From: Carl Worth
Date: Sun, 7 Jun 2020 15:22:28 -0700
Subject: [PATCH 04/16] Add a submit handler function for our form
This is still a stub that doesn't actually _do_ aything yet.
Note that we're using the "uncontrolled components" React pattern for
the input field here as described here:
https://reactjs.org/docs/uncontrolled-components.html
The alternative, forcing a new call to React's setState on every
keypress seems really silly to me, (I don't care to have React getting
involved on every keypress).
---
empathy/empathy.jsx | 19 ++++++++++++++++---
1 file changed, 16 insertions(+), 3 deletions(-)
diff --git a/empathy/empathy.jsx b/empathy/empathy.jsx
index cd80629..84a35a5 100644
--- a/empathy/empathy.jsx
+++ b/empathy/empathy.jsx
@@ -125,6 +125,19 @@ async function fetch_put_json(api = '', data = {}) {
class CategoryRequest extends React.Component {
constructor(props) {
super(props);
+ this.category = React.createRef();
+
+ this.handle_submit = this.handle_submit.bind(this);
+ }
+
+ handle_submit(event) {
+ const category_input = this.category.current;
+ const category = category_input.value;
+
+ /* Prevent the default page-changing form-submission behavior. */
+ event.preventDefault();
+
+ console.log("Do something here with category: " + category);
}
render() {
@@ -136,7 +149,7 @@ class CategoryRequest extends React.Component {
include the number of items for each person to submit.