1- import { jsx } from "@b9g/crank/standalone" ;
1+ emport { jsx } from "@b9g/crank/standalone" ;
22import { renderer } from "@b9g/crank/dom" ;
33
44function Hexagon ( { cx = 0 , cy = 0 , r, ...props } ) {
5- if ( ! r ) {
6- return null ;
7- }
5+ if ( ! r ) {
6+ return null ;
7+ }
88
9- const points = [ ] ;
10- for ( let i = 0 , a = 0 ; i < 6 ; i ++ , a += Math . PI / 3 ) {
11- points . push ( [ cx + Math . cos ( a ) * r , cy + Math . sin ( a ) * r ] ) ;
12- }
9+ const points = [ ] ;
10+ for ( let i = 0 , a = 0 ; i < 6 ; i ++ , a += Math . PI / 3 ) {
11+ points . push ( [ cx + Math . cos ( a ) * r , cy + Math . sin ( a ) * r ] ) ;
12+ }
1313
14- return jsx `
14+ return jsx `
1515 <path
1616 ...${ props }
1717 d="M ${ points . map ( ( [ x , y ] , i ) => `${ i > 0 ? "L" : "" } ${ x } ${ y } ) }
@@ -20,26 +20,26 @@ function Hexagon({cx = 0, cy = 0, r, ...props}) {
2020}
2121
2222function centerCoordsFor ( cell , size ) {
23- const colSpacing = ( size * 3 ) / 2 ;
24- const rowSpacing = Math . sqrt ( 3 ) * size ;
25- return {
26- cx : cell . col * colSpacing ,
27- cy : cell . row * rowSpacing + ( cell . col % 2 === 0 ? 0 : rowSpacing / 2 ) ,
28- } ;
23+ const colSpacing = ( size * 3 ) / 2 ;
24+ const rowSpacing = Math . sqrt ( 3 ) * size ;
25+ return {
26+ cx : cell . col * colSpacing ,
27+ cy : cell . row * rowSpacing + ( cell . col % 2 === 0 ? 0 : rowSpacing / 2 ) ,
28+ } ;
2929}
3030
3131function axialCoordsFor ( cell ) {
32- return { q : cell . col , r : cell . row - Math . floor ( cell . col / 2 ) } ;
32+ return { q : cell . col , r : cell . row - Math . floor ( cell . col / 2 ) } ;
3333}
3434
3535function HexagonalGrid ( { radius = 20 , cells /*, testCell*/ } ) {
36- return cells . map ( ( cell /*, i*/ ) => {
37- const onclick = ( ) => {
38- //console.log(neighborsOf(cell, cells));
39- } ;
40- const { cx, cy} = centerCoordsFor ( cell , radius ) ;
41- const { q, r} = axialCoordsFor ( cell ) ;
42- return jsx `
36+ return cells . map ( ( cell /*, i*/ ) => {
37+ const onclick = ( ) => {
38+ //console.log(neighborsOf(cell, cells));
39+ } ;
40+ const { cx, cy} = centerCoordsFor ( cell , radius ) ;
41+ const { q, r} = axialCoordsFor ( cell ) ;
42+ return jsx `
4343 <${ Hexagon }
4444 r=${ radius }
4545 cx=${ cx } ${ cy }
@@ -67,58 +67,58 @@ function HexagonalGrid({radius = 20, cells /*, testCell*/}) {
6767 >${ q } ${ r }
6868 -->
6969 ` ;
70- } ) ;
70+ } ) ;
7171}
7272
7373function shuffle ( arr ) {
74- for ( let i = arr . length - 1 ; i > 0 ; i -- ) {
75- const j = Math . floor ( Math . random ( ) * ( i + 1 ) ) ;
76- [ arr [ i ] , arr [ j ] ] = [ arr [ j ] , arr [ i ] ] ;
77- }
74+ for ( let i = arr . length - 1 ; i > 0 ; i -- ) {
75+ const j = Math . floor ( Math . random ( ) * ( i + 1 ) ) ;
76+ [ arr [ i ] , arr [ j ] ] = [ arr [ j ] , arr [ i ] ] ;
77+ }
7878
79- return arr ;
79+ return arr ;
8080}
8181
8282function neighborsOf ( cell , cells ) {
83- const { q, r} = axialCoordsFor ( cell ) ;
84- const vectors = [
85- [ 1 , 0 ] ,
86- [ 0 , 1 ] ,
87- [ - 1 , 1 ] ,
88- [ - 1 , 0 ] ,
89- [ 0 , - 1 ] ,
90- [ 1 , - 1 ] ,
91- ] ;
92- const axialSet = new Set ( vectors . map ( ( [ q1 , r1 ] ) => `${ q + q1 } ${ r + r1 } ) ) ;
93- return cells . filter ( ( cell1 ) => {
94- const { q, r} = axialCoordsFor ( cell1 ) ;
95- return axialSet . has ( `${ q } ${ r } ) ;
96- } ) ;
83+ const { q, r} = axialCoordsFor ( cell ) ;
84+ const vectors = [
85+ [ 1 , 0 ] ,
86+ [ 0 , 1 ] ,
87+ [ - 1 , 1 ] ,
88+ [ - 1 , 0 ] ,
89+ [ 0 , - 1 ] ,
90+ [ 1 , - 1 ] ,
91+ ] ;
92+ const axialSet = new Set ( vectors . map ( ( [ q1 , r1 ] ) => `${ q + q1 } ${ r + r1 } ) ) ;
93+ return cells . filter ( ( cell1 ) => {
94+ const { q, r} = axialCoordsFor ( cell1 ) ;
95+ return axialSet . has ( `${ q } ${ r } ) ;
96+ } ) ;
9797}
9898
9999function * Minesweeper ( ) {
100- const rows = 12 ,
101- cols = 15 ;
102- const cells = [ ] ;
103- for ( let row = 0 ; row < rows ; row ++ ) {
104- for ( let col = 0 ; col < cols ; col ++ ) {
105- cells . push ( { row, col, bomb : false , bombCount : 0 } ) ;
106- }
107- }
100+ const rows = 12 ,
101+ cols = 15 ;
102+ const cells = [ ] ;
103+ for ( let row = 0 ; row < rows ; row ++ ) {
104+ for ( let col = 0 ; col < cols ; col ++ ) {
105+ cells . push ( { row, col, bomb : false , bombCount : 0 } ) ;
106+ }
107+ }
108108
109- for ( const cell of shuffle ( cells . slice ( ) ) . slice ( 0 , 30 ) ) {
110- cell . bomb = true ;
111- }
109+ for ( const cell of shuffle ( cells . slice ( ) ) . slice ( 0 , 30 ) ) {
110+ cell . bomb = true ;
111+ }
112112
113- for ( const cell of cells ) {
114- cell . bombCount = neighborsOf ( cell , cells ) . reduce (
115- ( a , c ) => a + ( c . bomb ? 1 : 0 ) ,
116- 0 ,
117- ) ;
118- }
113+ for ( const cell of cells ) {
114+ cell . bombCount = neighborsOf ( cell , cells ) . reduce (
115+ ( a , c ) => a + ( c . bomb ? 1 : 0 ) ,
116+ 0 ,
117+ ) ;
118+ }
119119
120- for ( { } of this ) {
121- yield jsx `
120+ for ( { } of this ) {
121+ yield jsx `
122122 <svg
123123 width="500px"
124124 height="500px"
@@ -131,7 +131,7 @@ function* Minesweeper() {
131131 <${ HexagonalGrid } ${ cells } ${ 15 }
132132 </svg>
133133 ` ;
134- }
134+ }
135135}
136136
137137renderer . render ( jsx `<${ Minesweeper } , document . body ) ;
0 commit comments