[+] Display puzzle
This commit is contained in:
+107
@@ -0,0 +1,107 @@
|
||||
<script lang="ts">
|
||||
import svelteLogo from './assets/svelte.svg'
|
||||
import viteLogo from '/vite.svg'
|
||||
import Number from './lib/Number.svelte'
|
||||
import { cfg, randInt, range } from "./utils";
|
||||
import Line from "./lib/Line.svelte";
|
||||
import { cat } from "./examples";
|
||||
|
||||
const [rows, cols] = [40, 40]
|
||||
const [eRows, eCols] = [rows + 1, cols + 1]
|
||||
let numbers = Int8Array.from({ length: rows * cols }, () => 0)
|
||||
let numberMasked = Int8Array.from({ length: rows * cols }, () => 0)
|
||||
let hedgeStates = Int8Array.from({ length: eRows * eCols }, () => 0)
|
||||
let vedgeStates = Int8Array.from({ length: eRows * eCols }, () => 0)
|
||||
|
||||
let grid: HTMLDivElement
|
||||
const editMode = true
|
||||
|
||||
// Editor mode
|
||||
if (editMode) {
|
||||
cat.solution.forEach(edge => {
|
||||
const [ sx, sy, ex, _ ] = edge
|
||||
const isVertical = sx === ex
|
||||
if (isVertical) {
|
||||
vedgeStates[sy * (eCols) + sx] = 1
|
||||
if (ex != cols) numbers[sy * cols + sx] += 1
|
||||
if (sx != 0) numbers[sy * cols + sx - 1] += 1
|
||||
} else {
|
||||
hedgeStates[sy * (eCols) + sx] = 1
|
||||
// numbers[sy * cols + sx] += 1
|
||||
// if (sx != 0) numbers[(sy - 1) * cols + sx] += 1
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function clickEdge(sx: number, sy: number, tx: number, ty: number) {
|
||||
console.log(sx, sy, tx, ty)
|
||||
// const edge = edgeMap[`${sx}-${sy}-${tx}-${ty}`]
|
||||
hedgeStates[sy * (cols + 1) + sx] = 1
|
||||
}
|
||||
|
||||
// Positions for click handling
|
||||
function clickDiv(event: MouseEvent) {
|
||||
const target = event.target as HTMLElement
|
||||
console.log(target)
|
||||
|
||||
// Compute the x and y coordinates of the clicked cell
|
||||
const rect = target.getBoundingClientRect()
|
||||
const x = Math.floor((event.clientX - rect.left) / cfg.totalW)
|
||||
console.log(rect)
|
||||
event.preventDefault()
|
||||
}
|
||||
</script>
|
||||
|
||||
<main>
|
||||
<div class="heading">
|
||||
<img src={viteLogo} class="logo" alt="Vite Logo" />
|
||||
<span class="title">Slither Link</span>
|
||||
<img src={svelteLogo} class="logo svelte" alt="Svelte Logo" />
|
||||
</div>
|
||||
|
||||
<div class="puzzle-grid" style={`height: ${rows * cfg.totalW}px; width: ${cols * cfg.totalW}px;`}
|
||||
on:click={clickDiv} on:keypress={console.log} role="grid" tabindex="0"
|
||||
bind:this={grid}>
|
||||
{#each range(rows) as y}
|
||||
{#each range(cols) as x}
|
||||
<Number x={x} y={y} n={numbers[y * cols + x]} masked={numberMasked[y * cols + x] === 0} />
|
||||
{/each}
|
||||
{/each}
|
||||
{#each range(eRows) as y}
|
||||
{#each range(eCols) as x}
|
||||
<Line sx={x} sy={y} state={hedgeStates[y * eCols + x]} />
|
||||
{/each}
|
||||
{/each}
|
||||
{#each range(rows) as y}
|
||||
{#each range(cols + 1) as x}
|
||||
<Line sx={x} sy={y} vertical state={vedgeStates[y * eCols + x]} />
|
||||
{/each}
|
||||
{/each}
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<style lang="sass">
|
||||
.heading
|
||||
display: flex
|
||||
justify-content: center
|
||||
align-items: center
|
||||
gap: 1em
|
||||
padding: 1em
|
||||
|
||||
.title
|
||||
font-size: 3em
|
||||
line-height: 1.1
|
||||
|
||||
.logo
|
||||
height: 3em
|
||||
padding: 1.5em
|
||||
will-change: filter
|
||||
transition: filter 300ms
|
||||
|
||||
.logo:hover
|
||||
filter: drop-shadow(0 0 2em #646cffaa)
|
||||
|
||||
.logo.svelte:hover
|
||||
filter: drop-shadow(0 0 2em #ff3e00aa)
|
||||
|
||||
</style>
|
||||
+909
@@ -0,0 +1,909 @@
|
||||
|
||||
export const cat = {
|
||||
dim: [40, 40],
|
||||
numbers: [],
|
||||
solution: [
|
||||
[0, 0, 0, 1],
|
||||
[0, 0, 1, 0],
|
||||
[0, 1, 0, 2],
|
||||
[0, 2, 0, 3],
|
||||
[0, 3, 0, 4],
|
||||
[0, 4, 0, 5],
|
||||
[0, 5, 0, 6],
|
||||
[0, 6, 0, 7],
|
||||
[0, 7, 0, 8],
|
||||
[0, 8, 0, 9],
|
||||
[0, 9, 0, 10],
|
||||
[0, 10, 0, 11],
|
||||
[0, 11, 0, 12],
|
||||
[0, 12, 0, 13],
|
||||
[0, 13, 0, 14],
|
||||
[0, 14, 0, 15],
|
||||
[0, 15, 0, 16],
|
||||
[0, 16, 0, 17],
|
||||
[0, 17, 0, 18],
|
||||
[0, 18, 0, 19],
|
||||
[0, 19, 0, 20],
|
||||
[0, 20, 0, 21],
|
||||
[0, 21, 0, 22],
|
||||
[0, 22, 0, 23],
|
||||
[0, 23, 0, 24],
|
||||
[0, 24, 0, 25],
|
||||
[0, 25, 0, 26],
|
||||
[0, 26, 0, 27],
|
||||
[0, 27, 0, 28],
|
||||
[0, 28, 0, 29],
|
||||
[0, 29, 0, 30],
|
||||
[0, 30, 0, 31],
|
||||
[0, 31, 0, 32],
|
||||
[0, 32, 0, 33],
|
||||
[0, 33, 0, 34],
|
||||
[0, 34, 0, 35],
|
||||
[0, 35, 0, 36],
|
||||
[0, 36, 0, 37],
|
||||
[0, 37, 0, 38],
|
||||
[0, 38, 0, 39],
|
||||
[0, 39, 0, 40],
|
||||
[0, 40, 1, 40],
|
||||
[1, 0, 2, 0],
|
||||
[1, 1, 1, 2],
|
||||
[1, 1, 2, 1],
|
||||
[1, 2, 1, 3],
|
||||
[1, 3, 1, 4],
|
||||
[1, 4, 1, 5],
|
||||
[1, 5, 1, 6],
|
||||
[1, 6, 1, 7],
|
||||
[1, 7, 1, 8],
|
||||
[1, 8, 1, 9],
|
||||
[1, 9, 1, 10],
|
||||
[1, 10, 1, 11],
|
||||
[1, 11, 1, 12],
|
||||
[1, 12, 1, 13],
|
||||
[1, 13, 2, 13],
|
||||
[1, 14, 1, 15],
|
||||
[1, 14, 2, 14],
|
||||
[1, 15, 1, 16],
|
||||
[1, 16, 1, 17],
|
||||
[1, 17, 1, 18],
|
||||
[1, 18, 1, 19],
|
||||
[1, 19, 1, 20],
|
||||
[1, 20, 1, 21],
|
||||
[1, 21, 2, 21],
|
||||
[1, 22, 1, 23],
|
||||
[1, 22, 2, 22],
|
||||
[1, 23, 1, 24],
|
||||
[1, 24, 1, 25],
|
||||
[1, 25, 1, 26],
|
||||
[1, 26, 2, 26],
|
||||
[1, 30, 1, 31],
|
||||
[1, 30, 2, 30],
|
||||
[1, 31, 1, 32],
|
||||
[1, 32, 1, 33],
|
||||
[1, 33, 1, 34],
|
||||
[1, 34, 1, 35],
|
||||
[1, 35, 1, 36],
|
||||
[1, 36, 1, 37],
|
||||
[1, 37, 1, 38],
|
||||
[1, 38, 1, 39],
|
||||
[1, 39, 2, 39],
|
||||
[1, 40, 2, 40],
|
||||
[2, 0, 3, 0],
|
||||
[2, 1, 3, 1],
|
||||
[2, 12, 2, 13],
|
||||
[2, 12, 3, 12],
|
||||
[2, 14, 2, 15],
|
||||
[2, 15, 3, 15],
|
||||
[2, 19, 2, 20],
|
||||
[2, 19, 3, 19],
|
||||
[2, 20, 2, 21],
|
||||
[2, 22, 2, 23],
|
||||
[2, 23, 2, 24],
|
||||
[2, 24, 3, 24],
|
||||
[2, 26, 3, 26],
|
||||
[2, 30, 2, 31],
|
||||
[2, 31, 3, 31],
|
||||
[2, 39, 3, 39],
|
||||
[2, 40, 3, 40],
|
||||
[3, 0, 4, 0],
|
||||
[3, 1, 3, 2],
|
||||
[3, 2, 3, 3],
|
||||
[3, 3, 3, 4],
|
||||
[3, 4, 3, 5],
|
||||
[3, 5, 3, 6],
|
||||
[3, 6, 3, 7],
|
||||
[3, 7, 3, 8],
|
||||
[3, 8, 4, 8],
|
||||
[3, 9, 3, 10],
|
||||
[3, 9, 4, 9],
|
||||
[3, 10, 3, 11],
|
||||
[3, 11, 3, 12],
|
||||
[3, 15, 3, 16],
|
||||
[3, 16, 3, 17],
|
||||
[3, 17, 3, 18],
|
||||
[3, 18, 4, 18],
|
||||
[3, 19, 3, 20],
|
||||
[3, 20, 3, 21],
|
||||
[3, 21, 4, 21],
|
||||
[3, 22, 3, 23],
|
||||
[3, 22, 4, 22],
|
||||
[3, 23, 3, 24],
|
||||
[3, 26, 4, 26],
|
||||
[3, 31, 3, 32],
|
||||
[3, 32, 4, 32],
|
||||
[3, 39, 4, 39],
|
||||
[3, 40, 4, 40],
|
||||
[4, 0, 5, 0],
|
||||
[4, 1, 4, 2],
|
||||
[4, 1, 5, 1],
|
||||
[4, 2, 4, 3],
|
||||
[4, 3, 5, 3],
|
||||
[4, 4, 4, 5],
|
||||
[4, 4, 5, 4],
|
||||
[4, 5, 4, 6],
|
||||
[4, 6, 4, 7],
|
||||
[4, 7, 4, 8],
|
||||
[4, 9, 4, 10],
|
||||
[4, 10, 4, 11],
|
||||
[4, 11, 4, 12],
|
||||
[4, 12, 5, 12],
|
||||
[4, 15, 4, 16],
|
||||
[4, 15, 5, 15],
|
||||
[4, 16, 4, 17],
|
||||
[4, 17, 4, 18],
|
||||
[4, 21, 4, 22],
|
||||
[4, 26, 5, 26],
|
||||
[4, 32, 4, 33],
|
||||
[4, 33, 5, 33],
|
||||
[4, 39, 5, 39],
|
||||
[4, 40, 5, 40],
|
||||
[5, 0, 6, 0],
|
||||
[5, 1, 6, 1],
|
||||
[5, 3, 6, 3],
|
||||
[5, 4, 5, 5],
|
||||
[5, 5, 5, 6],
|
||||
[5, 6, 6, 6],
|
||||
[5, 12, 5, 13],
|
||||
[5, 13, 6, 13],
|
||||
[5, 14, 5, 15],
|
||||
[5, 14, 6, 14],
|
||||
[5, 24, 5, 25],
|
||||
[5, 24, 6, 24],
|
||||
[5, 25, 6, 25],
|
||||
[5, 26, 6, 26],
|
||||
[5, 33, 5, 34],
|
||||
[5, 34, 6, 34],
|
||||
[5, 39, 6, 39],
|
||||
[5, 40, 6, 40],
|
||||
[6, 0, 7, 0],
|
||||
[6, 1, 7, 1],
|
||||
[6, 3, 7, 3],
|
||||
[6, 4, 6, 5],
|
||||
[6, 4, 7, 4],
|
||||
[6, 5, 6, 6],
|
||||
[6, 13, 7, 13],
|
||||
[6, 14, 7, 14],
|
||||
[6, 24, 7, 24],
|
||||
[6, 25, 7, 25],
|
||||
[6, 26, 7, 26],
|
||||
[6, 34, 6, 35],
|
||||
[6, 35, 7, 35],
|
||||
[6, 39, 7, 39],
|
||||
[6, 40, 7, 40],
|
||||
[7, 0, 8, 0],
|
||||
[7, 1, 8, 1],
|
||||
[7, 3, 8, 3],
|
||||
[7, 4, 7, 5],
|
||||
[7, 5, 7, 6],
|
||||
[7, 6, 7, 7],
|
||||
[7, 7, 7, 8],
|
||||
[7, 8, 8, 8],
|
||||
[7, 13, 7, 14],
|
||||
[7, 24, 8, 24],
|
||||
[7, 25, 8, 25],
|
||||
[7, 26, 8, 26],
|
||||
[7, 35, 7, 36],
|
||||
[7, 36, 8, 36],
|
||||
[7, 39, 8, 39],
|
||||
[7, 40, 8, 40],
|
||||
[8, 0, 9, 0],
|
||||
[8, 1, 9, 1],
|
||||
[8, 3, 8, 4],
|
||||
[8, 4, 8, 5],
|
||||
[8, 5, 8, 6],
|
||||
[8, 6, 8, 7],
|
||||
[8, 7, 8, 8],
|
||||
[8, 21, 8, 22],
|
||||
[8, 21, 9, 21],
|
||||
[8, 22, 8, 23],
|
||||
[8, 23, 8, 24],
|
||||
[8, 25, 9, 25],
|
||||
[8, 26, 9, 26],
|
||||
[8, 27, 8, 28],
|
||||
[8, 27, 9, 27],
|
||||
[8, 28, 8, 29],
|
||||
[8, 29, 9, 29],
|
||||
[8, 36, 9, 36],
|
||||
[8, 39, 9, 39],
|
||||
[8, 40, 9, 40],
|
||||
[9, 0, 10, 0],
|
||||
[9, 1, 9, 2],
|
||||
[9, 2, 9, 3],
|
||||
[9, 3, 9, 4],
|
||||
[9, 4, 9, 5],
|
||||
[9, 5, 9, 6],
|
||||
[9, 6, 9, 7],
|
||||
[9, 7, 9, 8],
|
||||
[9, 8, 10, 8],
|
||||
[9, 13, 9, 14],
|
||||
[9, 13, 10, 13],
|
||||
[9, 14, 9, 15],
|
||||
[9, 15, 9, 16],
|
||||
[9, 16, 9, 17],
|
||||
[9, 17, 9, 18],
|
||||
[9, 18, 9, 19],
|
||||
[9, 19, 9, 20],
|
||||
[9, 20, 9, 21],
|
||||
[9, 25, 10, 25],
|
||||
[9, 26, 10, 26],
|
||||
[9, 27, 10, 27],
|
||||
[9, 29, 9, 30],
|
||||
[9, 30, 10, 30],
|
||||
[9, 36, 10, 36],
|
||||
[9, 39, 10, 39],
|
||||
[9, 40, 10, 40],
|
||||
[10, 0, 11, 0],
|
||||
[10, 1, 10, 2],
|
||||
[10, 1, 11, 1],
|
||||
[10, 2, 10, 3],
|
||||
[10, 3, 11, 3],
|
||||
[10, 4, 10, 5],
|
||||
[10, 4, 11, 4],
|
||||
[10, 5, 11, 5],
|
||||
[10, 6, 10, 7],
|
||||
[10, 6, 11, 6],
|
||||
[10, 7, 11, 7],
|
||||
[10, 8, 11, 8],
|
||||
[10, 10, 10, 11],
|
||||
[10, 10, 11, 10],
|
||||
[10, 11, 10, 12],
|
||||
[10, 12, 10, 13],
|
||||
[10, 25, 11, 25],
|
||||
[10, 26, 11, 26],
|
||||
[10, 27, 10, 28],
|
||||
[10, 28, 11, 28],
|
||||
[10, 30, 10, 31],
|
||||
[10, 31, 11, 31],
|
||||
[10, 36, 11, 36],
|
||||
[10, 39, 11, 39],
|
||||
[10, 40, 11, 40],
|
||||
[11, 0, 12, 0],
|
||||
[11, 1, 12, 1],
|
||||
[11, 3, 12, 3],
|
||||
[11, 4, 12, 4],
|
||||
[11, 5, 12, 5],
|
||||
[11, 6, 12, 6],
|
||||
[11, 7, 12, 7],
|
||||
[11, 8, 12, 8],
|
||||
[11, 10, 11, 11],
|
||||
[11, 11, 12, 11],
|
||||
[11, 25, 12, 25],
|
||||
[11, 26, 12, 26],
|
||||
[11, 28, 12, 28],
|
||||
[11, 31, 12, 31],
|
||||
[11, 36, 12, 36],
|
||||
[11, 39, 12, 39],
|
||||
[11, 40, 12, 40],
|
||||
[12, 0, 13, 0],
|
||||
[12, 1, 13, 1],
|
||||
[12, 3, 13, 3],
|
||||
[12, 4, 13, 4],
|
||||
[12, 5, 13, 5],
|
||||
[12, 6, 13, 6],
|
||||
[12, 7, 13, 7],
|
||||
[12, 8, 13, 8],
|
||||
[12, 11, 12, 12],
|
||||
[12, 12, 13, 12],
|
||||
[12, 21, 12, 22],
|
||||
[12, 21, 13, 21],
|
||||
[12, 22, 12, 23],
|
||||
[12, 23, 12, 24],
|
||||
[12, 24, 12, 25],
|
||||
[12, 26, 13, 26],
|
||||
[12, 28, 13, 28],
|
||||
[12, 31, 13, 31],
|
||||
[12, 35, 12, 36],
|
||||
[12, 35, 13, 35],
|
||||
[12, 39, 13, 39],
|
||||
[12, 40, 13, 40],
|
||||
[13, 0, 14, 0],
|
||||
[13, 1, 14, 1],
|
||||
[13, 3, 14, 3],
|
||||
[13, 4, 14, 4],
|
||||
[13, 5, 13, 6],
|
||||
[13, 7, 14, 7],
|
||||
[13, 8, 14, 8],
|
||||
[13, 12, 13, 13],
|
||||
[13, 13, 14, 13],
|
||||
[13, 21, 13, 22],
|
||||
[13, 22, 13, 23],
|
||||
[13, 23, 13, 24],
|
||||
[13, 24, 13, 25],
|
||||
[13, 25, 13, 26],
|
||||
[13, 28, 14, 28],
|
||||
[13, 31, 14, 31],
|
||||
[13, 32, 13, 33],
|
||||
[13, 32, 14, 32],
|
||||
[13, 33, 14, 33],
|
||||
[13, 34, 13, 35],
|
||||
[13, 34, 14, 34],
|
||||
[13, 39, 14, 39],
|
||||
[13, 40, 14, 40],
|
||||
[14, 0, 15, 0],
|
||||
[14, 1, 15, 1],
|
||||
[14, 3, 14, 4],
|
||||
[14, 7, 14, 8],
|
||||
[14, 13, 14, 14],
|
||||
[14, 14, 15, 14],
|
||||
[14, 28, 15, 28],
|
||||
[14, 31, 14, 32],
|
||||
[14, 33, 14, 34],
|
||||
[14, 39, 15, 39],
|
||||
[14, 40, 15, 40],
|
||||
[15, 0, 16, 0],
|
||||
[15, 1, 15, 2],
|
||||
[15, 2, 15, 3],
|
||||
[15, 3, 15, 4],
|
||||
[15, 4, 15, 5],
|
||||
[15, 5, 15, 6],
|
||||
[15, 6, 15, 7],
|
||||
[15, 7, 15, 8],
|
||||
[15, 8, 16, 8],
|
||||
[15, 14, 15, 15],
|
||||
[15, 15, 15, 16],
|
||||
[15, 16, 16, 16],
|
||||
[15, 28, 15, 29],
|
||||
[15, 29, 16, 29],
|
||||
[15, 32, 15, 33],
|
||||
[15, 32, 16, 32],
|
||||
[15, 33, 16, 33],
|
||||
[15, 39, 16, 39],
|
||||
[15, 40, 16, 40],
|
||||
[16, 0, 17, 0],
|
||||
[16, 1, 16, 2],
|
||||
[16, 1, 17, 1],
|
||||
[16, 2, 16, 3],
|
||||
[16, 3, 17, 3],
|
||||
[16, 4, 16, 5],
|
||||
[16, 4, 17, 4],
|
||||
[16, 5, 16, 6],
|
||||
[16, 6, 16, 7],
|
||||
[16, 7, 17, 7],
|
||||
[16, 8, 17, 8],
|
||||
[16, 16, 16, 17],
|
||||
[16, 17, 17, 17],
|
||||
[16, 29, 17, 29],
|
||||
[16, 32, 17, 32],
|
||||
[16, 33, 16, 34],
|
||||
[16, 34, 17, 34],
|
||||
[16, 38, 16, 39],
|
||||
[16, 38, 17, 38],
|
||||
[16, 40, 17, 40],
|
||||
[17, 0, 18, 0],
|
||||
[17, 1, 18, 1],
|
||||
[17, 3, 18, 3],
|
||||
[17, 4, 18, 4],
|
||||
[17, 7, 17, 8],
|
||||
[17, 16, 17, 17],
|
||||
[17, 16, 18, 16],
|
||||
[17, 28, 17, 29],
|
||||
[17, 28, 18, 28],
|
||||
[17, 32, 18, 32],
|
||||
[17, 34, 17, 35],
|
||||
[17, 35, 17, 36],
|
||||
[17, 36, 17, 37],
|
||||
[17, 37, 17, 38],
|
||||
[17, 40, 18, 40],
|
||||
[18, 0, 19, 0],
|
||||
[18, 1, 19, 1],
|
||||
[18, 3, 19, 3],
|
||||
[18, 4, 19, 4],
|
||||
[18, 7, 18, 8],
|
||||
[18, 7, 19, 7],
|
||||
[18, 8, 19, 8],
|
||||
[18, 16, 18, 17],
|
||||
[18, 17, 19, 17],
|
||||
[18, 28, 18, 29],
|
||||
[18, 29, 19, 29],
|
||||
[18, 32, 19, 32],
|
||||
[18, 34, 18, 35],
|
||||
[18, 34, 19, 34],
|
||||
[18, 35, 18, 36],
|
||||
[18, 36, 18, 37],
|
||||
[18, 37, 18, 38],
|
||||
[18, 38, 19, 38],
|
||||
[18, 40, 19, 40],
|
||||
[19, 0, 20, 0],
|
||||
[19, 1, 20, 1],
|
||||
[19, 3, 20, 3],
|
||||
[19, 4, 19, 5],
|
||||
[19, 5, 19, 6],
|
||||
[19, 6, 19, 7],
|
||||
[19, 8, 20, 8],
|
||||
[19, 16, 19, 17],
|
||||
[19, 16, 20, 16],
|
||||
[19, 29, 20, 29],
|
||||
[19, 32, 20, 32],
|
||||
[19, 33, 19, 34],
|
||||
[19, 33, 20, 33],
|
||||
[19, 38, 19, 39],
|
||||
[19, 39, 20, 39],
|
||||
[19, 40, 20, 40],
|
||||
[20, 0, 21, 0],
|
||||
[20, 1, 21, 1],
|
||||
[20, 3, 20, 4],
|
||||
[20, 4, 20, 5],
|
||||
[20, 5, 20, 6],
|
||||
[20, 6, 20, 7],
|
||||
[20, 7, 20, 8],
|
||||
[20, 14, 20, 15],
|
||||
[20, 14, 21, 14],
|
||||
[20, 15, 20, 16],
|
||||
[20, 28, 20, 29],
|
||||
[20, 28, 21, 28],
|
||||
[20, 32, 20, 33],
|
||||
[20, 39, 21, 39],
|
||||
[20, 40, 21, 40],
|
||||
[21, 0, 22, 0],
|
||||
[21, 1, 21, 2],
|
||||
[21, 2, 21, 3],
|
||||
[21, 3, 21, 4],
|
||||
[21, 4, 21, 5],
|
||||
[21, 5, 21, 6],
|
||||
[21, 6, 21, 7],
|
||||
[21, 7, 21, 8],
|
||||
[21, 8, 22, 8],
|
||||
[21, 13, 21, 14],
|
||||
[21, 13, 22, 13],
|
||||
[21, 21, 21, 22],
|
||||
[21, 21, 22, 21],
|
||||
[21, 22, 21, 23],
|
||||
[21, 23, 21, 24],
|
||||
[21, 24, 21, 25],
|
||||
[21, 25, 21, 26],
|
||||
[21, 26, 22, 26],
|
||||
[21, 28, 22, 28],
|
||||
[21, 31, 21, 32],
|
||||
[21, 31, 22, 31],
|
||||
[21, 32, 22, 32],
|
||||
[21, 33, 21, 34],
|
||||
[21, 33, 22, 33],
|
||||
[21, 34, 22, 34],
|
||||
[21, 39, 22, 39],
|
||||
[21, 40, 22, 40],
|
||||
[22, 0, 23, 0],
|
||||
[22, 1, 22, 2],
|
||||
[22, 1, 23, 1],
|
||||
[22, 2, 22, 3],
|
||||
[22, 3, 22, 4],
|
||||
[22, 4, 22, 5],
|
||||
[22, 5, 22, 6],
|
||||
[22, 6, 22, 7],
|
||||
[22, 7, 23, 7],
|
||||
[22, 8, 23, 8],
|
||||
[22, 12, 22, 13],
|
||||
[22, 12, 23, 12],
|
||||
[22, 21, 22, 22],
|
||||
[22, 22, 22, 23],
|
||||
[22, 23, 22, 24],
|
||||
[22, 24, 22, 25],
|
||||
[22, 25, 23, 25],
|
||||
[22, 26, 23, 26],
|
||||
[22, 28, 23, 28],
|
||||
[22, 31, 23, 31],
|
||||
[22, 32, 22, 33],
|
||||
[22, 34, 22, 35],
|
||||
[22, 35, 23, 35],
|
||||
[22, 39, 23, 39],
|
||||
[22, 40, 23, 40],
|
||||
[23, 0, 24, 0],
|
||||
[23, 1, 24, 1],
|
||||
[23, 5, 23, 6],
|
||||
[23, 5, 24, 5],
|
||||
[23, 6, 23, 7],
|
||||
[23, 8, 24, 8],
|
||||
[23, 11, 23, 12],
|
||||
[23, 11, 24, 11],
|
||||
[23, 25, 24, 25],
|
||||
[23, 26, 24, 26],
|
||||
[23, 28, 24, 28],
|
||||
[23, 31, 24, 31],
|
||||
[23, 35, 23, 36],
|
||||
[23, 36, 24, 36],
|
||||
[23, 39, 24, 39],
|
||||
[23, 40, 24, 40],
|
||||
[24, 0, 25, 0],
|
||||
[24, 1, 25, 1],
|
||||
[24, 5, 24, 6],
|
||||
[24, 6, 24, 7],
|
||||
[24, 7, 25, 7],
|
||||
[24, 8, 25, 8],
|
||||
[24, 10, 24, 11],
|
||||
[24, 10, 25, 10],
|
||||
[24, 25, 25, 25],
|
||||
[24, 26, 25, 26],
|
||||
[24, 28, 25, 28],
|
||||
[24, 31, 25, 31],
|
||||
[24, 36, 25, 36],
|
||||
[24, 39, 25, 39],
|
||||
[24, 40, 25, 40],
|
||||
[25, 0, 26, 0],
|
||||
[25, 1, 26, 1],
|
||||
[25, 3, 25, 4],
|
||||
[25, 3, 26, 3],
|
||||
[25, 4, 25, 5],
|
||||
[25, 5, 25, 6],
|
||||
[25, 6, 25, 7],
|
||||
[25, 8, 26, 8],
|
||||
[25, 10, 25, 11],
|
||||
[25, 11, 25, 12],
|
||||
[25, 12, 25, 13],
|
||||
[25, 13, 26, 13],
|
||||
[25, 25, 26, 25],
|
||||
[25, 26, 26, 26],
|
||||
[25, 27, 25, 28],
|
||||
[25, 27, 26, 27],
|
||||
[25, 30, 25, 31],
|
||||
[25, 30, 26, 30],
|
||||
[25, 35, 25, 36],
|
||||
[25, 35, 26, 35],
|
||||
[25, 39, 26, 39],
|
||||
[25, 40, 26, 40],
|
||||
[26, 0, 27, 0],
|
||||
[26, 1, 27, 1],
|
||||
[26, 3, 26, 4],
|
||||
[26, 4, 26, 5],
|
||||
[26, 5, 26, 6],
|
||||
[26, 6, 26, 7],
|
||||
[26, 7, 26, 8],
|
||||
[26, 13, 26, 14],
|
||||
[26, 14, 26, 15],
|
||||
[26, 15, 26, 16],
|
||||
[26, 16, 26, 17],
|
||||
[26, 17, 26, 18],
|
||||
[26, 18, 26, 19],
|
||||
[26, 19, 26, 20],
|
||||
[26, 20, 26, 21],
|
||||
[26, 21, 27, 21],
|
||||
[26, 25, 27, 25],
|
||||
[26, 26, 27, 26],
|
||||
[26, 27, 27, 27],
|
||||
[26, 29, 26, 30],
|
||||
[26, 29, 27, 29],
|
||||
[26, 34, 26, 35],
|
||||
[26, 34, 27, 34],
|
||||
[26, 39, 27, 39],
|
||||
[26, 40, 27, 40],
|
||||
[27, 0, 28, 0],
|
||||
[27, 1, 28, 1],
|
||||
[27, 4, 27, 5],
|
||||
[27, 4, 28, 4],
|
||||
[27, 5, 27, 6],
|
||||
[27, 6, 28, 6],
|
||||
[27, 21, 27, 22],
|
||||
[27, 22, 27, 23],
|
||||
[27, 23, 27, 24],
|
||||
[27, 24, 28, 24],
|
||||
[27, 25, 28, 25],
|
||||
[27, 26, 28, 26],
|
||||
[27, 27, 27, 28],
|
||||
[27, 28, 27, 29],
|
||||
[27, 33, 27, 34],
|
||||
[27, 33, 28, 33],
|
||||
[27, 39, 28, 39],
|
||||
[27, 40, 28, 40],
|
||||
[28, 0, 29, 0],
|
||||
[28, 1, 28, 2],
|
||||
[28, 2, 28, 3],
|
||||
[28, 3, 28, 4],
|
||||
[28, 6, 28, 7],
|
||||
[28, 7, 29, 7],
|
||||
[28, 11, 28, 12],
|
||||
[28, 11, 29, 11],
|
||||
[28, 12, 28, 13],
|
||||
[28, 13, 28, 14],
|
||||
[28, 14, 28, 15],
|
||||
[28, 15, 29, 15],
|
||||
[28, 24, 29, 24],
|
||||
[28, 25, 29, 25],
|
||||
[28, 26, 29, 26],
|
||||
[28, 32, 28, 33],
|
||||
[28, 32, 29, 32],
|
||||
[28, 39, 28, 40],
|
||||
[29, 0, 30, 0],
|
||||
[29, 1, 29, 2],
|
||||
[29, 1, 30, 1],
|
||||
[29, 2, 29, 3],
|
||||
[29, 3, 29, 4],
|
||||
[29, 4, 30, 4],
|
||||
[29, 7, 29, 8],
|
||||
[29, 8, 30, 8],
|
||||
[29, 10, 29, 11],
|
||||
[29, 10, 30, 10],
|
||||
[29, 12, 29, 13],
|
||||
[29, 12, 30, 12],
|
||||
[29, 13, 29, 14],
|
||||
[29, 14, 30, 14],
|
||||
[29, 15, 29, 16],
|
||||
[29, 16, 30, 16],
|
||||
[29, 24, 30, 24],
|
||||
[29, 25, 30, 25],
|
||||
[29, 26, 30, 26],
|
||||
[29, 31, 29, 32],
|
||||
[29, 31, 30, 31],
|
||||
[29, 39, 29, 40],
|
||||
[29, 39, 30, 39],
|
||||
[29, 40, 30, 40],
|
||||
[30, 0, 31, 0],
|
||||
[30, 1, 31, 1],
|
||||
[30, 3, 30, 4],
|
||||
[30, 3, 31, 3],
|
||||
[30, 7, 30, 8],
|
||||
[30, 7, 31, 7],
|
||||
[30, 10, 31, 10],
|
||||
[30, 11, 30, 12],
|
||||
[30, 11, 31, 11],
|
||||
[30, 14, 30, 15],
|
||||
[30, 15, 31, 15],
|
||||
[30, 16, 31, 16],
|
||||
[30, 24, 30, 25],
|
||||
[30, 26, 31, 26],
|
||||
[30, 31, 31, 31],
|
||||
[30, 39, 31, 39],
|
||||
[30, 40, 31, 40],
|
||||
[31, 0, 32, 0],
|
||||
[31, 1, 32, 1],
|
||||
[31, 3, 31, 4],
|
||||
[31, 4, 32, 4],
|
||||
[31, 6, 31, 7],
|
||||
[31, 6, 32, 6],
|
||||
[31, 10, 32, 10],
|
||||
[31, 11, 32, 11],
|
||||
[31, 12, 31, 13],
|
||||
[31, 12, 32, 12],
|
||||
[31, 13, 31, 14],
|
||||
[31, 14, 32, 14],
|
||||
[31, 15, 32, 15],
|
||||
[31, 16, 31, 17],
|
||||
[31, 17, 32, 17],
|
||||
[31, 26, 32, 26],
|
||||
[31, 30, 31, 31],
|
||||
[31, 30, 32, 30],
|
||||
[31, 38, 31, 39],
|
||||
[31, 38, 32, 38],
|
||||
[31, 40, 32, 40],
|
||||
[32, 0, 33, 0],
|
||||
[32, 1, 33, 1],
|
||||
[32, 4, 32, 5],
|
||||
[32, 5, 32, 6],
|
||||
[32, 10, 33, 10],
|
||||
[32, 11, 33, 11],
|
||||
[32, 12, 32, 13],
|
||||
[32, 13, 33, 13],
|
||||
[32, 14, 33, 14],
|
||||
[32, 15, 33, 15],
|
||||
[32, 17, 32, 18],
|
||||
[32, 18, 33, 18],
|
||||
[32, 26, 33, 26],
|
||||
[32, 29, 32, 30],
|
||||
[32, 29, 33, 29],
|
||||
[32, 38, 33, 38],
|
||||
[32, 40, 33, 40],
|
||||
[33, 0, 34, 0],
|
||||
[33, 1, 34, 1],
|
||||
[33, 4, 33, 5],
|
||||
[33, 4, 34, 4],
|
||||
[33, 5, 33, 6],
|
||||
[33, 6, 34, 6],
|
||||
[33, 10, 34, 10],
|
||||
[33, 11, 33, 12],
|
||||
[33, 12, 34, 12],
|
||||
[33, 13, 34, 13],
|
||||
[33, 14, 34, 14],
|
||||
[33, 15, 33, 16],
|
||||
[33, 16, 34, 16],
|
||||
[33, 18, 33, 19],
|
||||
[33, 19, 33, 20],
|
||||
[33, 20, 34, 20],
|
||||
[33, 26, 34, 26],
|
||||
[33, 28, 33, 29],
|
||||
[33, 28, 34, 28],
|
||||
[33, 37, 33, 38],
|
||||
[33, 37, 34, 37],
|
||||
[33, 40, 34, 40],
|
||||
[34, 0, 35, 0],
|
||||
[34, 1, 34, 2],
|
||||
[34, 2, 34, 3],
|
||||
[34, 3, 34, 4],
|
||||
[34, 6, 34, 7],
|
||||
[34, 7, 35, 7],
|
||||
[34, 10, 34, 11],
|
||||
[34, 11, 35, 11],
|
||||
[34, 12, 34, 13],
|
||||
[34, 14, 35, 14],
|
||||
[34, 16, 34, 17],
|
||||
[34, 17, 35, 17],
|
||||
[34, 20, 34, 21],
|
||||
[34, 21, 35, 21],
|
||||
[34, 25, 34, 26],
|
||||
[34, 25, 35, 25],
|
||||
[34, 27, 34, 28],
|
||||
[34, 27, 35, 27],
|
||||
[34, 29, 34, 30],
|
||||
[34, 29, 35, 29],
|
||||
[34, 30, 35, 30],
|
||||
[34, 36, 34, 37],
|
||||
[34, 36, 35, 36],
|
||||
[34, 40, 35, 40],
|
||||
[35, 0, 36, 0],
|
||||
[35, 1, 35, 2],
|
||||
[35, 1, 36, 1],
|
||||
[35, 2, 35, 3],
|
||||
[35, 3, 35, 4],
|
||||
[35, 4, 36, 4],
|
||||
[35, 7, 35, 8],
|
||||
[35, 8, 36, 8],
|
||||
[35, 11, 35, 12],
|
||||
[35, 12, 35, 13],
|
||||
[35, 13, 35, 14],
|
||||
[35, 17, 35, 18],
|
||||
[35, 18, 35, 19],
|
||||
[35, 19, 36, 19],
|
||||
[35, 21, 35, 22],
|
||||
[35, 22, 35, 23],
|
||||
[35, 23, 35, 24],
|
||||
[35, 24, 35, 25],
|
||||
[35, 26, 35, 27],
|
||||
[35, 26, 36, 26],
|
||||
[35, 28, 35, 29],
|
||||
[35, 28, 36, 28],
|
||||
[35, 30, 35, 31],
|
||||
[35, 31, 36, 31],
|
||||
[35, 35, 35, 36],
|
||||
[35, 35, 36, 35],
|
||||
[35, 40, 36, 40],
|
||||
[36, 0, 37, 0],
|
||||
[36, 1, 37, 1],
|
||||
[36, 3, 36, 4],
|
||||
[36, 3, 37, 3],
|
||||
[36, 7, 36, 8],
|
||||
[36, 7, 37, 7],
|
||||
[36, 14, 36, 15],
|
||||
[36, 14, 37, 14],
|
||||
[36, 15, 37, 15],
|
||||
[36, 19, 36, 20],
|
||||
[36, 20, 36, 21],
|
||||
[36, 21, 36, 22],
|
||||
[36, 22, 37, 22],
|
||||
[36, 26, 37, 26],
|
||||
[36, 27, 36, 28],
|
||||
[36, 27, 37, 27],
|
||||
[36, 31, 36, 32],
|
||||
[36, 32, 37, 32],
|
||||
[36, 34, 36, 35],
|
||||
[36, 34, 37, 34],
|
||||
[36, 40, 37, 40],
|
||||
[37, 0, 38, 0],
|
||||
[37, 1, 38, 1],
|
||||
[37, 3, 37, 4],
|
||||
[37, 4, 38, 4],
|
||||
[37, 6, 37, 7],
|
||||
[37, 6, 38, 6],
|
||||
[37, 12, 37, 13],
|
||||
[37, 12, 38, 12],
|
||||
[37, 13, 37, 14],
|
||||
[37, 15, 37, 16],
|
||||
[37, 16, 37, 17],
|
||||
[37, 17, 38, 17],
|
||||
[37, 22, 37, 23],
|
||||
[37, 23, 37, 24],
|
||||
[37, 24, 37, 25],
|
||||
[37, 25, 38, 25],
|
||||
[37, 26, 38, 26],
|
||||
[37, 27, 37, 28],
|
||||
[37, 28, 38, 28],
|
||||
[37, 30, 37, 31],
|
||||
[37, 30, 38, 30],
|
||||
[37, 31, 38, 31],
|
||||
[37, 32, 38, 32],
|
||||
[37, 33, 37, 34],
|
||||
[37, 33, 38, 33],
|
||||
[37, 40, 38, 40],
|
||||
[38, 0, 39, 0],
|
||||
[38, 1, 39, 1],
|
||||
[38, 4, 38, 5],
|
||||
[38, 5, 38, 6],
|
||||
[38, 12, 38, 13],
|
||||
[38, 13, 38, 14],
|
||||
[38, 14, 39, 14],
|
||||
[38, 15, 38, 16],
|
||||
[38, 15, 39, 15],
|
||||
[38, 16, 38, 17],
|
||||
[38, 25, 39, 25],
|
||||
[38, 26, 38, 27],
|
||||
[38, 27, 39, 27],
|
||||
[38, 28, 38, 29],
|
||||
[38, 29, 38, 30],
|
||||
[38, 31, 39, 31],
|
||||
[38, 32, 38, 33],
|
||||
[38, 40, 39, 40],
|
||||
[39, 0, 40, 0],
|
||||
[39, 1, 39, 2],
|
||||
[39, 2, 39, 3],
|
||||
[39, 3, 39, 4],
|
||||
[39, 4, 39, 5],
|
||||
[39, 5, 39, 6],
|
||||
[39, 6, 39, 7],
|
||||
[39, 7, 39, 8],
|
||||
[39, 8, 39, 9],
|
||||
[39, 9, 39, 10],
|
||||
[39, 10, 39, 11],
|
||||
[39, 11, 39, 12],
|
||||
[39, 12, 39, 13],
|
||||
[39, 13, 39, 14],
|
||||
[39, 15, 39, 16],
|
||||
[39, 16, 39, 17],
|
||||
[39, 17, 39, 18],
|
||||
[39, 18, 39, 19],
|
||||
[39, 19, 39, 20],
|
||||
[39, 20, 39, 21],
|
||||
[39, 21, 39, 22],
|
||||
[39, 22, 39, 23],
|
||||
[39, 23, 39, 24],
|
||||
[39, 24, 40, 24],
|
||||
[39, 25, 39, 26],
|
||||
[39, 26, 40, 26],
|
||||
[39, 27, 39, 28],
|
||||
[39, 28, 39, 29],
|
||||
[39, 29, 39, 30],
|
||||
[39, 30, 39, 31],
|
||||
[39, 40, 40, 40],
|
||||
[40, 0, 40, 1],
|
||||
[40, 1, 40, 2],
|
||||
[40, 2, 40, 3],
|
||||
[40, 3, 40, 4],
|
||||
[40, 4, 40, 5],
|
||||
[40, 5, 40, 6],
|
||||
[40, 6, 40, 7],
|
||||
[40, 7, 40, 8],
|
||||
[40, 8, 40, 9],
|
||||
[40, 9, 40, 10],
|
||||
[40, 10, 40, 11],
|
||||
[40, 11, 40, 12],
|
||||
[40, 12, 40, 13],
|
||||
[40, 13, 40, 14],
|
||||
[40, 14, 40, 15],
|
||||
[40, 15, 40, 16],
|
||||
[40, 16, 40, 17],
|
||||
[40, 17, 40, 18],
|
||||
[40, 18, 40, 19],
|
||||
[40, 19, 40, 20],
|
||||
[40, 20, 40, 21],
|
||||
[40, 21, 40, 22],
|
||||
[40, 22, 40, 23],
|
||||
[40, 23, 40, 24],
|
||||
[40, 26, 40, 27],
|
||||
[40, 27, 40, 28],
|
||||
[40, 28, 40, 29],
|
||||
[40, 29, 40, 30],
|
||||
[40, 30, 40, 31],
|
||||
[40, 31, 40, 32],
|
||||
[40, 32, 40, 33],
|
||||
[40, 33, 40, 34],
|
||||
[40, 34, 40, 35],
|
||||
[40, 35, 40, 36],
|
||||
[40, 36, 40, 37],
|
||||
[40, 37, 40, 38],
|
||||
[40, 38, 40, 39],
|
||||
[40, 39, 40, 40],
|
||||
],
|
||||
}
|
||||
@@ -0,0 +1,56 @@
|
||||
@use "sass:color"
|
||||
|
||||
$color-dot: #aaa
|
||||
$color-line: #90A4AEFF
|
||||
$color-cross: #ff7f7f
|
||||
|
||||
@debug color.scale($color-line, $alpha: -30%)
|
||||
|
||||
.puzzle-grid
|
||||
position: relative
|
||||
user-select: none
|
||||
|
||||
.grid-number
|
||||
position: absolute
|
||||
width: 20px
|
||||
height: 20px
|
||||
text-align: center
|
||||
font-size: 11px
|
||||
|
||||
&.error
|
||||
color: $color-cross
|
||||
|
||||
&.complete
|
||||
opacity: 0.5
|
||||
|
||||
.grid-line
|
||||
position: absolute
|
||||
|
||||
&.vertical
|
||||
width: 4px
|
||||
height: 20px
|
||||
border-top: 4px solid $color-dot
|
||||
border-bottom: 4px solid $color-dot
|
||||
|
||||
&.crossed:before, &.auto-crossed:before
|
||||
left: 0
|
||||
top: 2px
|
||||
|
||||
&:not(.vertical)
|
||||
width: 24px
|
||||
height: 4px
|
||||
|
||||
&.selected
|
||||
background: $color-line
|
||||
|
||||
&.crossed:before, &.auto-crossed:before
|
||||
content: "x"
|
||||
font-size: 10px
|
||||
color: $color-cross
|
||||
position: absolute
|
||||
top: -7px
|
||||
|
||||
&:hover
|
||||
background: color.scale($color-line, $alpha: -50%)
|
||||
|
||||
|
||||
@@ -0,0 +1,15 @@
|
||||
<script lang="ts">
|
||||
import { cfg, pos } from "../utils";
|
||||
|
||||
interface Props { sx: number, sy: number, vertical?: boolean, state: number }
|
||||
let { sx, sy, vertical, state }: Props = $props()
|
||||
|
||||
let left = cfg.totalW * sx
|
||||
let top = cfg.totalW * sy
|
||||
let styles = pos(left, top)
|
||||
</script>
|
||||
|
||||
<div class="grid-line" style="{styles}"
|
||||
class:vertical={vertical}
|
||||
class:selected={state === 1} class:crossed={state === 2} class:auto-crossed={state === 5}>
|
||||
</div>
|
||||
@@ -0,0 +1,17 @@
|
||||
<script lang="ts">
|
||||
import { cfg, nStates, pos, sty } from "../utils";
|
||||
|
||||
interface Props { x: number, y: number, n: number, masked: boolean, state: number }
|
||||
let { x, y, n, masked, state }: Props = $props()
|
||||
|
||||
let left = cfg.totalW * x + cfg.lineW
|
||||
let top = cfg.totalW * y + cfg.lineW
|
||||
let styles = pos(left, top)
|
||||
</script>
|
||||
|
||||
<div class="grid-number" style="{styles}"
|
||||
class:error={state === nStates.error} class:complete={state === nStates.complete}>
|
||||
{#if !masked}
|
||||
{n % 4}
|
||||
{/if}
|
||||
</div>
|
||||
@@ -0,0 +1,37 @@
|
||||
|
||||
export const cfg = {
|
||||
cellW: 20,
|
||||
lineW: 4,
|
||||
totalW: 24
|
||||
}
|
||||
|
||||
export const eStates = {
|
||||
none: 0,
|
||||
selected: 1,
|
||||
crossed: 2,
|
||||
autoCrossed: 5
|
||||
}
|
||||
|
||||
export const nStates = {
|
||||
none: 0,
|
||||
error: 1,
|
||||
complete: 2
|
||||
}
|
||||
|
||||
export function sty(styles: any) {
|
||||
return Object.entries(styles)
|
||||
.map(([key, value]) => `${key}:${value}`)
|
||||
.join(';');
|
||||
}
|
||||
|
||||
export function pos(x: number, y: number) {
|
||||
return `top:${y}px;left:${x}px;`;
|
||||
}
|
||||
|
||||
export function randInt(min: number, max: number) {
|
||||
return Math.floor(Math.random() * (max - min + 1)) + min;
|
||||
}
|
||||
|
||||
export function range(n: number) {
|
||||
return Array.from({length: n}, (_, i) => i);
|
||||
}
|
||||
Reference in New Issue
Block a user