tinker-gomoku 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md ADDED
@@ -0,0 +1,26 @@
1
+ # tinker-gomoku
2
+
3
+ A polished 3D Gomoku game for [TINKER](https://github.com/liriliri/tinker), built with Three.js.
4
+
5
+ ![Screenshot](https://raw.githubusercontent.com/liriliri/tinker-games/master/packages/tinker-gomoku/screenshot.png)
6
+
7
+ ## Highlights
8
+
9
+ - **Classic Gomoku** — play on a standard 15×15 board with star points and a clear winning-line animation
10
+ - **Play your way** — local two-player mode or a computer opponent with Easy, Normal, and Hard difficulty
11
+ - **Multiple controls** — mouse, touch, keyboard, and gamepad support
12
+ - **Immersive 3D board** — rounded wood textures, normal mapping, stone-drop animation, lighting, and soft shadows
13
+ - **Remembers your choices** — mode and difficulty selections are saved automatically
14
+ - **Bilingual interface** — English and Simplified Chinese
15
+
16
+ ## Installation
17
+
18
+ Play directly in [browser](https://tinker.liriliri.io/games/gomoku/), or install via TINKER: download from `https://tinker.liriliri.io/`, then run `npm i -g tinker-gomoku`.
19
+
20
+ ## How to Play
21
+
22
+ 1. Choose local two-player mode or play against the computer, then select a difficulty.
23
+ 2. Click an intersection to place a stone, or move the cursor with the arrow keys, WASD, or a gamepad.
24
+ 3. Press **Space** or **Enter** to place a stone. Black moves first.
25
+ 4. Drag with the **left mouse button** to rotate the board, or the **right mouse button** to pan.
26
+ 5. Connect five stones in a row to win.
@@ -0,0 +1 @@
1
+ :root{--night: #17110d;--ink: #261910;--paper: #d9c08d;--paper-light: #f4e4b8;--amber: #b98a48;--coral: #9b3f2d;--line: rgba(231, 204, 148, .24);--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--night)}body{color:var(--paper-light);font-family:Songti SC,STSong,"Noto Serif SC",Georgia,serif;-webkit-user-select:none;user-select:none}button{font:inherit}#app,#ui{position:fixed;top:0;right:0;bottom:0;left:0}canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:none}#ui{z-index:2;pointer-events:none}.topbar{position:absolute;z-index:3;top:0;left:0;right:0;display:flex;align-items:center;gap:18px;padding:calc(18px + var(--safe-top)) calc(22px + var(--safe-right)) 18px calc(22px + var(--safe-left));background:linear-gradient(180deg,#1c110be6,#1c110b00)}.turn-pill{position:absolute;top:calc(18px + var(--safe-top));left:50%;display:flex;align-items:center;gap:9px;margin:0;padding:8px 14px;transform:translate(-50%);border:1px solid rgba(203,160,86,.48);border-radius:999px;background:#271910db;box-shadow:inset 0 1px #ffecb914,0 8px 22px #0000003d;color:var(--paper);font-size:13px;letter-spacing:.12em;transition:border-color .18s,box-shadow .18s}.turn-pill.thinking{border-color:#dba957e6;box-shadow:inset 0 1px #ffecb91f,0 0 22px #ab652a4d}.turn-stone{display:block;width:14px;height:14px;border-radius:50%;box-shadow:inset 1px 1px 2px #ffffff3d,0 2px 4px #0006}.turn-stone.black{background:radial-gradient(circle at 35% 28%,#59616b,#11161c 58%,#05070a)}.turn-stone.white{background:radial-gradient(circle at 35% 28%,#fffdf7,#eadfca 58%,#af9e83)}.top-actions{display:flex;gap:8px;margin-left:auto;justify-content:flex-end}.ghost-button,.secondary-button{pointer-events:auto;min-height:38px;padding:8px 13px;border:1px solid var(--line);border-radius:4px;background:#2b1c12c7;color:var(--paper);cursor:pointer;font-size:11px;letter-spacing:.12em;text-transform:uppercase;transition:background .16s,border-color .16s,transform .16s}.ghost-button:hover,.secondary-button:hover{border-color:#dba957d1;background:#482a18e6}.icon-button{display:grid;width:38px;padding:8px;place-items:center}.sound-icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7}.sound-off-line,.icon-button.muted .sound-waves{display:none}.icon-button.muted .sound-off-line{display:block}.secondary-button:active,.primary-button:active{transform:translateY(1px)}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:grid;place-items:center;padding:calc(24px + var(--safe-top)) calc(20px + var(--safe-right)) calc(24px + var(--safe-bottom)) calc(20px + var(--safe-left));background:radial-gradient(circle at 50% 42%,#351f125c,#0f0906d1 72%);pointer-events:auto}.overlay.hidden{display:none}.menu-panel,.result-panel{position:relative;width:min(520px,91vw);padding:34px 38px 28px;border:1px solid rgba(128,83,38,.9);border-radius:7px;background:linear-gradient(142deg,#e5cf9dfa,#be995efa);box-shadow:0 28px 90px #0000009e,inset 0 1px #fff4c880;color:var(--ink)}.menu-panel:before,.result-panel:before{position:absolute;top:8px;right:8px;bottom:8px;left:8px;border:1px solid rgba(111,70,30,.28);content:"";pointer-events:none}.setting label{color:#e3a84dbf;font-size:9px;letter-spacing:.2em}.settings-grid{display:grid;grid-template-columns:1fr;gap:22px;margin-bottom:26px}.setting label{display:block;margin-bottom:9px;color:#67431f;font-size:11px;letter-spacing:.14em}.segmented{display:flex;gap:5px}.choice{flex:1;min-height:40px;padding:7px 8px;border:1px solid rgba(91,57,27,.42);border-radius:4px;background:#53341b1a;color:#362212bd;cursor:pointer;font-size:12px;letter-spacing:.08em;transition:color .16s,background .16s,border-color .16s}.choice:hover{border-color:#73411dd1}.choice.selected{border-color:#8c3427;background:#913726db;color:#f7e7bd}#difficultySetting.disabled{opacity:.38;pointer-events:none}.primary-button{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;padding:12px 17px;border:1px solid rgba(255,222,164,.8);border-radius:4px;background:var(--coral);color:#f8e6b7;cursor:pointer;font-size:12px;font-weight:700;letter-spacing:.15em;transition:background .16s,transform .16s}.primary-button:hover{background:#b04d35}.result-panel{width:min(390px,88vw)}h2{margin:0 0 10px;color:var(--ink);font-family:Georgia,Times New Roman,serif;font-size:38px;font-weight:400;text-align:center}.result-panel p{margin:0 0 24px;color:#362212b8;font-size:13px;line-height:1.6}.result-actions{display:flex;flex-direction:column;gap:9px}.result-actions .secondary-button{width:100%}.mobile-controls{position:absolute;right:calc(18px + var(--safe-right));bottom:calc(18px + var(--safe-bottom));z-index:3;display:none;grid-template-columns:repeat(3,38px);grid-template-rows:repeat(3,38px);gap:4px;pointer-events:auto}.mobile-controls button{border:1px solid rgba(204,163,91,.48);border-radius:5px;background:#2b1b11d6;color:var(--paper);cursor:pointer;font-size:17px}.mobile-controls button:first-child{grid-column:2}.mobile-controls button:nth-child(2){grid-column:1;grid-row:2}.mobile-controls button:nth-child(3){grid-column:2;grid-row:2;color:#e2b260;font-size:12px}.mobile-controls button:nth-child(4){grid-column:3;grid-row:2}.mobile-controls button:nth-child(5){grid-column:2;grid-row:3}@media (pointer: coarse){.mobile-controls{display:grid}}@media (max-width: 600px){.topbar{gap:8px;padding-left:calc(14px + var(--safe-left));padding-right:calc(14px + var(--safe-right))}.turn-pill{padding:7px 10px;font-size:10px}.ghost-button{padding:8px 9px;font-size:9px}.menu-panel,.result-panel{padding:26px 23px 22px}.settings-grid{grid-template-columns:1fr;gap:16px;margin-bottom:20px}}@media (max-height: 560px){.menu-panel,.result-panel{padding:20px 25px 17px}.settings-grid{margin-bottom:15px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}