2f:T775,game = { let flags = []; let gamestarted = false; svg.node().innerHTML = ''; svg.append('g').attr('id', 'board'); svg.append('g').attr('id', 'mask'); svg.append('g').attr('id', 'uilayer'); let cells = svg.select('#board').selectAll('path') .data(grid.flat()) cells.enter() .append('path') .merge(cells) .attr('d', hexpath) .attr('transform', d => { let h = hexpos(d.position); return `matrix(${hexwidth/2} 0 0 ${hexwidth/2} ${h})` }) .style('fill', d => d.is_mine ? 'white' : theme.cmap(d.count / 4)) //'green') .style('stroke', 'lightgray') .style('stroke-width', '0.1') .on('mouseover', (e, d) => rendercursor(d.position)) let text = svg.select('#board').selectAll('.label') .data(grid.flat().filter(c => c.count > 0)) .join('text') .attr('class', 'label') .text(d => d.count) .attr('transform', d => `matrix(1 0 0 1 ${hexpos(d.position)})`) .style('text-anchor', 'middle') .style('alignment-baseline', 'middle') .style('font-family', 'monospace') .style('font-size', '20pt') .style('pointer-events', 'none') let initmask = () => { svg.select('#mask').selectAll('.mask') .on('click', (e, d) => { if (grid[d.position[0]][d.position[1]].is_mine) { losescreen(); } else { revealfrom(d.position); flags = flags.filter(f => !grid[eval(f)[0]][eval(f)[1]].revealed); renderflags(flags); rendermask(initmask); } }) .on('contextmenu', (e, d) => { e.preventDefault(); let ps_str = `[${d.position.toString()}]`; if (flags.includes(ps_str)) { flags = flags.filter(f => f != ps_str) } else { flags.push(ps_str); } renderflags(flags); }) } rendermask(initmask); return svg.node(); }30:[] 2d:{"title":"Hxswp","cells":[{"id":0,"value":"# Hxswp","pinned":false,"hidden":false,"mode":"md"},{"id":125,"value":"svg = d3.select(DOM.svg()).attr('viewBox', [0, 0, width, width*Math.sin(Math.PI/3)]);","pinned":false,"hidden":false,"mode":"ojs"},{"id":637,"value":"viewof theme = Inputs.select(\n new Map(Object.entries(themes)),\n {value: themes[\"Blue\"], label: \"Theme\"}\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":925,"value":"themes = ({\n Blue: {\n cmap: d3.interpolatePlasma,\n neighborColoring: 'cell',\n tileColoring: p => `hsl(200, ${50}%, ${(((p[0]&1) == 1)? 65 : 70) + (p[1]&1)*2.5}%)`\n },\n Google: {\n cmap: d3.interpolatePlasma,\n neighborColoring: 'text',\n tileColoring: p => `hsl(200, ${50}%, ${(((p[0]&1) == 1)? 65 : 70) + (p[1]&1)*2.5}%)`\n }\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":330,"value":"cs = width / (size+1);","pinned":false,"hidden":false,"mode":"ojs"},{"id":331,"value":"hexwidth = width / ((size+1) * Math.sin(Math.PI/3))","pinned":false,"hidden":false,"mode":"ojs"},{"id":453,"value":"num_mines = size * 2","pinned":false,"hidden":false,"mode":"ojs"},{"id":787,"value":"genMines = (exclude) => {\n const ne = exclude ? neighbor_idxs(exclude).map(c => c.toString()) : [];\n \n let mines = new Set();\n while (mines.size < num_mines) {\n let c = [Math.random()*size|0, Math.random()*size|0].toString();\n if (!ne.includes(c))\n mines.add(c);\n }\n return [...mines].map(m => eval(`[${m}]`)); // To array\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":3,"value":"mutable mines = genMines()","pinned":true,"hidden":false,"mode":"ojs"},{"id":57,"value":"grid = {\n let g = Array(size).fill().map(_=>Array(size).fill());\n g = g.map((row, rowidx) => row.map((cell, colidx) => ({\n position: [rowidx, colidx],\n count: 0,\n is_mine: mines.find(mp => mp[0] == rowidx && mp[1] == colidx) != undefined,\n revealed: false\n })))\n\n // Simpler, stupider, and maybe better\n mines.forEach(m => neighbor_idxs(m, true).forEach(([nx, ny]) => g[nx][ny].count += g[nx][ny].is_mine? 0 : 1));\n \n return g;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":386,"value":"neighbor_idxs = (p, self = false) => {\n return [\n [p[0] - 1, p[1]], \n [p[0] + 1, p[1]],\n [p[0] + ((p[1] % 2 == 0) ? 1 : -1), p[1] - 1],\n [p[0], p[1] - 1],\n [p[0] + ((p[1] % 2 == 0) ? 1 : -1), p[1] + 1],\n [p[0], p[1] + 1]\n ].concat(self ? [p] : []).filter(c => c[0] >= 0 && c[1] >= 0 && c[0] < size && c[1] < size);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":391,"value":"mine_count = p => neighbor_idxs(p, true).filter(n => grid[n[0]][n[1]].is_mine).length","pinned":true,"hidden":false,"mode":"ojs"},{"id":119,"value":"renderflags = (flags) => {\n let f = svg.selectAll('.flag')\n .data(flags.map(f => hexpos(eval(f))), d => d)\n f.enter()\n .append('circle')\n .merge(f, d => d)\n .attr('class', 'flag')\n .attr('cx', d => d[0])\n .attr('cy', d => d[1])\n .attr('r', 10)\n .style('fill', 'red')\n .style('pointer-events', 'none')\n .exit()\n .transition()\n .attr('cy', d => d[1] - 10)\n f.exit()\n .transition()\n //.duration(300)\n .ease(d3.easeBackIn)\n .attr('cy', d => d[1] + 100)\n .style('opacity', 0.0)\n .remove()\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":483,"value":"rendercursor = (cp) => {\n svg.select('#uilayer').selectAll('path')\n .data(neighbor_idxs(cp, true).map(f => hexpos(eval(f))))\n .join('path')\n .attr('d', hexpath)\n .style('pointer-events', 'none')\n .style('fill', 'white')\n .style('opacity', 0.2)\n .attr('transform', d => `matrix(${hexwidth/2 + 0.01} 0 0 ${hexwidth/2 + 0.01} ${d})`)\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":684,"value":"revealfrom = p => {\n function floodrev(x,y) {\n if (grid[x][y].revealed || grid[x][y].count > 0 || grid[x][y].is_mine) {\n if (!grid.is_mine) grid[x][y].revealed = true;\n } else {\n grid[x][y].revealed = true;\n neighbor_idxs([x,y]).forEach(c => floodrev(...c));\n };\n }\n floodrev(...p);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":327,"value":"hexpos = p => {\n return [\n ((p[0]+(p[1] & 1 == 1 ? 0.5 : 1.0)) + 0.25) * cs,\n (p[1]+1) * Math.sin(Math.PI/3) * cs\n ];\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":864,"value":"losescreen = () => {\n let screen = svg.append('g')\n let bg = screen.append('rect')\n .attr('fill', 'black')\n .attr('width', width)\n .attr('height', width)\n .style('opacity', 0.4);\n\n let modal = screen.append('g');\n modal.append('rect')\n .attr('x', '25%')\n .attr('y', '25%')\n .attr('width', '50%')\n .attr('height', '50%')\n .attr('fill', 'lightblue')\n .attr('rx', '30')\n \n modal.append('text')\n .attr('x', '50%')\n .attr('y', '38%')\n .attr('fill', 'white')\n .style('text-anchor', 'middle')\n // .style('alignment-baseline', 'center')\n .style('font-size', '4em')\n .style('font-family', 'monospace')\n .text('Game Over');\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":723,"value":"rendermask = (s) => {\n let mask = svg.select('#mask').selectAll('.mask')\n .data(grid.flat().filter(t => !t.revealed), d => JSON.stringify(d));\n \n mask.enter()\n .append('path')\n .merge(mask)\n .attr('class', 'mask')\n .attr('d', hexpath)\n .attr('transform', d => {\n let h = hexpos(d.position);\n return `matrix(${hexwidth/2+1} 0 0 ${hexwidth/2+1} ${h})`\n })\n .attr('fill', d => theme.tileColoring(d.position))\n .on('mouseover', (e, d) => rendercursor(d.position))\n \n mask.exit()\n .transition()\n .attr('transform', d => {\n let h = hexpos(d.position);\n return ` translate(0 40) matrix(${hexwidth/2 - 10} 0 0 ${hexwidth/2 - 10} ${h}) rotate(45)`\n })\n .style('opacity', 0.0)\n .remove();\n\n s();\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":162,"value":"viewof hexpath = {\n let p = d3.path();\n p.moveTo(0,1);\n for (let s = 1; s < 6; ++s)\n p.lineTo(Math.sin(s * Math.PI/3), Math.cos(s * Math.PI/3));\n p.closePath();\n \n let e = html``;\n \n // Returned with `viewof`\n e.value = p.toString();\n return e;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":78,"value":"$2f","pinned":true,"hidden":false,"mode":"ojs"},{"id":582,"value":"{\n let s = d3.select(DOM.svg()).attr('viewBox', [0,0,100,100]).attr('height', 200).attr('width', 400)\n\n let di = 0;\n let dat = [\n [0,1],\n [0,0.5,0.75,1]\n ]\n \n let but = html``;\n but.onclick = e => {\n let vis = s.selectAll('.test').data(dat[di], d => d)\n\n vis.enter()\n .append('circle')\n .merge(vis)\n .attr('class', 'test')\n .attr('cy', 50)\n .attr('fill', 'red')\n .attr('r', 10)\n .transition()\n .attr('cx', d => 80*d + 10);\n\n vis.exit().transition().attr('cy', 0).remove();\n\n di = (di+1)%2;\n }\n \n return html`${but}${s.node()}`;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":8,"value":"size = 16","pinned":true,"hidden":false,"mode":"ojs"},{"id":18,"value":"mutable revealed = [];","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W30","stdlib":"1","titling":"auto"}