Enable user interaction, but there's no validity check yet.
This commit is contained in:
parent
de6b2e8946
commit
4a4ff7522f
1 changed files with 18 additions and 3 deletions
21
src/Cell.js
21
src/Cell.js
|
@ -1,14 +1,29 @@
|
|||
import React from 'react';
|
||||
import React, {useState} from 'react';
|
||||
|
||||
export default function Cell({spec, rowIndex, cellIndex, showSolution}) {
|
||||
const [mark, setMark] = useState(false);
|
||||
let classes = "cell r" + rowIndex + " c" + cellIndex;
|
||||
if (spec.top) classes += " top";
|
||||
if (spec.right) classes += " right";
|
||||
if (spec.bottom) classes += " bottom";
|
||||
if (spec.left) classes += " left";
|
||||
if (spec.solution && showSolution) classes += " solution";
|
||||
if (spec.user) classes += " user";
|
||||
if (mark) classes += " user";
|
||||
return (
|
||||
<div className={classes}/>
|
||||
<div className={classes}
|
||||
onMouseEnter={(e) => {
|
||||
const leftPressed = e.buttons & 0x1;
|
||||
if (leftPressed) {
|
||||
setMark(!mark);
|
||||
}
|
||||
}}
|
||||
onMouseLeave={(e) => {
|
||||
const leftPressed = e.buttons & 0x1;
|
||||
if (leftPressed) {
|
||||
}
|
||||
}}
|
||||
onClick={(e) => {
|
||||
setMark(!mark);
|
||||
}}/>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue