Permalink
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Browse files
refactoring for multisnek
- Loading branch information
Showing
with
8 additions
and
6 deletions.
-
+8
−6
soat.html
|
@@ -55,16 +55,16 @@ |
|
|
/> |
|
|
); |
|
|
|
|
|
const SVG = ({ circles }) => ( |
|
|
<svg> |
|
|
const Snake = ({ circles }) => ( |
|
|
<g> |
|
|
{ |
|
|
circles.map((position, i) => <Circle key={i} position={position} index={i}/>) |
|
|
} |
|
|
</svg> |
|
|
</g> |
|
|
); |
|
|
|
|
|
|
|
|
class Snake extends React.Component { |
|
|
class Arena extends React.Component { |
|
|
constructor(props) { |
|
|
super(props); |
|
|
this.changeThing = this.changeThing.bind(this); |
|
@@ -129,13 +129,15 @@ |
|
|
render() { |
|
|
return ( |
|
|
<div tabIndex="1" ref="playArea" onKeyDown={this.changeThing}> |
|
|
<SVG circles={this.state.body} /> |
|
|
<svg> |
|
|
<Snake circles={this.state.body} /> |
|
|
</svg> |
|
|
</div> |
|
|
); |
|
|
} |
|
|
} |
|
|
|
|
|
ReactDOM.render(<Snake />, document.getElementById("root")); |
|
|
ReactDOM.render(<Arena />, document.getElementById("root")); |
|
|
|
|
|
|
|
|
</script> |
|
|