65 lines
2.4 KiB
Markdown
65 lines
2.4 KiB
Markdown
# Dominoclock
|
|
|
|
It's nostalgia week at Pendorwright Labs, where toy programs are the
|
|
order of the day. DominoClock is a simulation (or a re-implementation)
|
|
of a nifty electromechanical watch I saw back about 25 years ago; it was
|
|
a watch with a domino face, and the points on it elevated as the minutes
|
|
slipped by. It was kinda-sorta meant for the blind, so re-implementing
|
|
it as a web application is a bit silly. It only has a resolution of
|
|
every five minutes, so implementing the seconds hand is also a bit
|
|
silly, but it lets you see that the clock is working as planned.
|
|
|
|
# Motivation
|
|
|
|
In the `orginal/` folder, you'll find the Java (!) program I wrote back
|
|
in 1996. This is literally my first and, if memory serves me correctly,
|
|
only Java applet I ever wrote. It's written in Java so old it may even
|
|
be before Java 1.0 was released. Sun used to send a sales team to nerdy
|
|
offices and, while the main guy talked to the managers, the sales
|
|
engineer would slip the devs a CD or two with labels like "Java 0.9
|
|
beta" and "Sun Proprietary - Not for general release" handwritten on
|
|
them. By the time management got around to asking the nerds, "Have you
|
|
heard about this Java thing?" we'd already been playing with it for
|
|
months.
|
|
|
|
I just wanted to see it again.
|
|
|
|
I also wanted to practice a bit more with web components. I think
|
|
they're more important than React, and I have a strong preference for
|
|
the way they integrate with the browser ecosystem rather than fight
|
|
against it the way React does.
|
|
|
|
# Running It
|
|
|
|
```
|
|
$ npm install
|
|
$ npm run dev
|
|
```
|
|
|
|
It'll be on port 3000.
|
|
|
|
It's written using the original colors I chose back in 1996, so it's
|
|
more than a bit ugly. This version, though, has rounded corners and
|
|
dots, so there's that. It does respond to a variety of CSS variables, so
|
|
you can change the size and colors. I *really* should make it resize
|
|
the faces in response to the overall size of the container allocated to
|
|
the `<domino-clock />` component, but that's a future task.
|
|
|
|
# DEMO
|
|
|
|
There is a demo: [The Domino
|
|
Clock.](https://elfsternberg.com/projects/dominoclock/)
|
|
|
|
# TODO
|
|
|
|
- Add a few more CSS variables.
|
|
- Make it respond to the size of the container, rather than forcing its
|
|
size.
|
|
- Make the faces aria-compliant. `aria-valuenow` seems like the safest
|
|
bet.
|
|
|
|
# License
|
|
|
|
This code is released under the Mozilla 2.0 Public License. A copy of
|
|
the License File is included in this folder.
|