w6 clock exercise

2025-04-01 13:16:47 +09:00 · 2025-04-01 13:16:47 +09:00 · bf2be407e4
commit bf2be407e4
parent 93738938d7
3 changed files with 86 additions and 0 deletions
--- a/w6_clock/clock.js
+++ b/w6_clock/clock.js
@ -0,0 +1,44 @@
+/*
+ * Clock Module
+ */
+
+/**
+ * @typedef Clock
+ * @type {object}
+ * @property {number} x - The x-coordinate of the clock center.
+ * @property {number} y - The y-coordinate of the clock center.
+ * @property {number} radius - The radius of the clock.
+ * @property {string} color - The color of the clock.
+ * @property {number} oneSecondMs - The interval in milliseconds for one second.
+ * @property {number} hours - The current hour.
+ * @property {number} minutes - The current minute.
+ * @property {number} seconds - The current second.
+ */
+
+const createClock = (color, oneSecondMs) => (x, y, radius) => {
+  // return a clock
+};
+
+// export const createSportsClock = createClock('#FFF000', 500);
+// export const createStandardClock = createClock('#FFFFFF', 1000);
+
+export const drawClock = (clock) => {
+  // draw the clock face
+};
+
+export function startClock(clock) {
+  // start animating the clock
+}
+
+export function stopClock(intervalId) {
+  // stop the clock
+}
+
+// Private Helpers
+const tick = (clock) => {
+  // return a new clock that advances the time of 1 second
+};
+
+const drawClockHands = (x, y, alpha, length) => {
+  // draw the clock hands
+};
--- a/w6_clock/index.html
+++ b/w6_clock/index.html
@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=<device-width>, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+    <script src='https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.11.3/p5.js' integrity='sha512-BLd2MDTrBCo01Vkhjbjn3ITBDbx3o/Lt7D5hj5oLwW8vlDHYXMenxglTcUURCgBhdLNAjZ7KD8x4ZA7bQY3OhA==' crossorigin='anonymous'></script>
+    <script type="module" src="./index.js""></script>
+</body>
+</html>
--- a/w6_clock/index.js
+++ b/w6_clock/index.js
@ -0,0 +1,30 @@
+import {
+  createStandardClock,
+  createSportsClock,
+  drawClock,
+  startClock,
+  stopClock,
+} from './clock.js';
+
+let clock;
+let timer;
+
+window.setup = function () {
+  createCanvas(800, 600);
+
+  // clock = createStandardClock(width / 2, height / 2, 200);
+  //   clock = createSportsClock(width / 2, height / 2, 200);
+  // timer = startClock(clock);
+};
+
+window.draw = function () {
+  background('#eee');
+  // drawClock(clock);
+};
+
+window.keyPressed = function () {
+  if (key === 's' || key === 'S') {
+    // stopClock(timer);
+    console.log('Clock stopped');
+  }
+};