From 38a2f46b794c685f57a1e227f3fb418550f4c3ed Mon Sep 17 00:00:00 2001 From: Klemek Date: Tue, 4 Nov 2025 14:50:45 +0100 Subject: [PATCH] feat: base config --- README.md | 10 +++++ index.html | 62 ++++++++++++++++++++++++++++--- main.js | 105 ++++++++++++++++++++++++++++++++++++++++++++++++++--- style.css | 15 ++++++++ 4 files changed, 182 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index 0f484d4..86e4b53 100644 --- a/README.md +++ b/README.md @@ -4,3 +4,13 @@ ### [Tool link](https://klemek.github.io/legume/) TODO docs + +## Roadmap + +- [x] Empty project from template +- [x] Configuration +- [ ] Generate table +- [ ] Copy table option +- [ ] Save last state in cookies +- [ ] Other format: raw text +- [ ] Other format: SVG diff --git a/index.html b/index.html index 90fc97a..cc8a202 100644 --- a/index.html +++ b/index.html @@ -3,7 +3,7 @@ - Légume 🥦 + 🥦 Légume @@ -16,7 +16,7 @@ - + @@ -24,10 +24,62 @@

- Légume 🥦 + {{vegetable}} Légume

-
-

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Total: {{getTime(totalDuration)}}
+ + + {{config.duration}} minutes + + + {{config.duration}} minutes + +
+ +
+ +

 klemek diff --git a/main.js b/main.js index 43f2d8e..f8af9a2 100644 --- a/main.js +++ b/main.js @@ -10,32 +10,127 @@ const utils = { }, }); }, + /* eslint-disable no-bitwise */ + randomSeed() { + return (Math.random() * 2 ** 32) >>> 0; + }, + splitmix32(seed) { + let tmp = seed; + // eslint-disable-next-line func-names + return function () { + tmp |= 0; + tmp = (tmp + 0x9e3779b9) | 0; + tmp ^= tmp >>> 16; + tmp = Math.imul(tmp, 0x21f0aaad); + tmp ^= tmp >>> 15; + tmp = Math.imul(tmp, 0x735a2d97); + return ((tmp ^= tmp >>> 15) >>> 0) / 4294967296; + }; + }, + /* eslint-enable no-bitwise */ + randomInt(max, seed) { + const prng = utils.splitmix32(seed); + return Math.floor(prng() * max); + }, + shuffleSeeded(array, seed) { + const output = array.slice(); + const prng = utils.splitmix32(seed); + for (let iteration = 0; iteration < array.length * 4; iteration += 1) { + const i1 = Math.floor(prng() * array.length); + const i2 = Math.floor(prng() * array.length); + const tmp = output[i2]; + output[i2] = output[i1]; + output[i1] = tmp; + } + return output; + }, +}; + +const VEGETABLES = { + "🥦": "Broccoli", + "🥕": "Carrot", + "🧅": "Onion", + "🌶️": "Pepper", + "🍆": "Eggplant", + "🥔": "Potato", + "🍄": "Mushroom", + "🧄": "Garlic", + "🥬": "Lettuce", + "🥒": "Cucumber", + "🥑": "Avocado", + "🌽": "Corn", + "🫘": "Beans", + "🫚": "Ginger", + "🫛": "Pea", + "🫜": "Radish", }; const app = createApp({ data() { return { - content: - "Fill this page with whatever you're going to develop.
Then enjoy!", + config: { + startTime: "21:00", + endTime: "03:00", + duration: 30, + seed: utils.randomSeed(), + candidates: + "🥦 Broccoli\n🥕 Carrot\n🧅 Onion\n🌶️ Pepper\n🍆 Eggplant\n🥔 Potato", + endWithAll: true, + back2back: true, + }, }; }, computed: { - currentYear() { - return new Date().getFullYear(); + vegetable() { + return Object.keys(VEGETABLES)[ + utils.randomInt(Object.keys(VEGETABLES).length, this.config.seed) + ]; + }, + startTimeMinute() { + return Math.floor( + Date.parse(`1970-01-01T${this.config.startTime}:00Z`) / 60000 + ); + }, + endTimeMinute() { + const result = Math.floor( + Date.parse(`1970-01-01T${this.config.endTime}:00Z`) / 60000 + ); + return result < this.startTimeMinute ? result + 1440 : result; + }, + totalDuration() { + return this.endTimeMinute - this.startTimeMinute; + }, + }, + watch: { + vegetable() { + document.title = `${this.vegetable} Légume`; }, }, - watch: {}, updated() { utils.updateIcons(); }, mounted() { + document.title = `${this.vegetable} Légume`; setTimeout(this.showApp); utils.updateIcons(); + this.config.candidates = utils + .shuffleSeeded(Object.keys(VEGETABLES), this.config.seed) + .map((key) => `${key} ${VEGETABLES[key]}`) + .slice(0, 6) + .join("\n"); }, methods: { + getTime(minutes) { + return `${(minutes / 60).toFixed(0).padStart(2, "0")}:${(minutes % 60) + .toFixed(0) + .padStart(2, "0")}`; + }, showApp() { document.getElementById("app").setAttribute("style", ""); }, + newSeed() { + this.config.seed = utils.randomSeed(); + }, }, }); diff --git a/style.css b/style.css index 74642fc..fcc6370 100644 --- a/style.css +++ b/style.css @@ -211,3 +211,18 @@ h6 .lucide { .footer { opacity: 50%; } + +table.config td { + padding: 0.25em 0.5em; + vertical-align: top; +} + +table.config input, +table.config select, +button.full { + width: 100%; +} + +table.config td:first-child { + text-align: right; +}