diff options
| author | lonkaars <l.leblansch@gmail.com> | 2021-02-17 22:22:30 +0100 | 
|---|---|---|
| committer | lonkaars <l.leblansch@gmail.com> | 2021-02-17 22:22:30 +0100 | 
| commit | 2a0e24e24f728bbb858e11c47a08ad9d672d840e (patch) | |
| tree | 5cef6c4c4017e39818e0733853dca6cbe1bc0ee2 | |
| parent | d4eb0eac5fc3e2cbcaa10e4cbf677b2459f36e57 (diff) | |
voerbord connector beginnings
| -rw-r--r-- | components/voerBord.tsx | 16 | ||||
| -rw-r--r-- | nginx.conf | 1 | ||||
| -rw-r--r-- | pages/game.tsx | 4 | 
3 files changed, 12 insertions, 9 deletions
| diff --git a/components/voerBord.tsx b/components/voerBord.tsx index 3e319a1..67bc86d 100644 --- a/components/voerBord.tsx +++ b/components/voerBord.tsx @@ -1,18 +1,17 @@ -interface VoerBordProps { +export function VoerBord(props: {  	width: number;  	height: number; -} - -export function VoerBord(props: VoerBordProps) { +	onMove: (move: string) => void; +}) {  	return <table style={{  		borderSpacing: 8,  		width: "100%"  	}}>  		<tbody>  			{ -				[...Array(props.height)].map(() => ( +				[...Array(props.height).keys()].map((row) => (  					<tr> -						{[...Array(props.width)].map(() => ( +						{[...Array(props.width).keys()].map((column) => (  							<td style={{  								position: "relative",  								width: "100%", @@ -27,7 +26,10 @@ export function VoerBord(props: VoerBordProps) {  									top: 0, left: 0, right: 0, bottom: 0,  									borderRadius: 6,  									border: "2px solid var(--background-alt)", -									opacity: .5 +									opacity: .5, +									cursor: "pointer" +								}} id={`pos-${(props.height - row - 1) * props.width + column}`} onClick={event => { +									props.onMove((event.target as HTMLElement).id.split("-")[1])  								}}/>  							</td>  						))} @@ -1,4 +1,5 @@  user nobody; +daemon off;  events {} diff --git a/pages/game.tsx b/pages/game.tsx index f56452f..a206d7a 100644 --- a/pages/game.tsx +++ b/pages/game.tsx @@ -4,7 +4,7 @@ import axios from 'axios';  import { userInfo } from '../api/api';  import * as cookies from 'react-cookies'; -var socket = io("http://localhost:5000/game/socket"); +var socket = io("http://localhost:2080/api/game/socket/");  import { NavBar } from '../components/navbar';  import { CenteredPage } from '../components/page'; @@ -81,7 +81,7 @@ class VoerGame extends Component<VoerGameProps> {  			maxWidth: "100vh",  			margin: "0 auto"  		}}> -			<VoerBord width={7} height={6}/> +			<VoerBord width={7} height={6} onMove={m => this.move(Number(m))}/>  			<GameBar/>  		</div>  	} |