43 lines
1.0 KiB
JavaScript
43 lines
1.0 KiB
JavaScript
import React, { useState, useCallback } from "react";
|
|
import "./ChooseCard.css";
|
|
import Paper from '@material-ui/core/Paper';
|
|
import Resource from './Resource.js';
|
|
|
|
const ChooseCard = ({table, type}) => {
|
|
if (!table.game) {
|
|
return <></>;
|
|
}
|
|
|
|
const selectCard = (card) => {
|
|
table.selectResource(card);
|
|
}
|
|
|
|
const resources = [
|
|
'wheat', 'brick', 'stone', 'sheep', 'wood'
|
|
].map(type => {
|
|
return <Resource type={type} key={type} count={1} select={() => selectCard(type)}/>;
|
|
});
|
|
|
|
let title;
|
|
switch (type) {
|
|
case 'monopoly':
|
|
title = <><b>Monopoly</b>! Tap the resource type you want everyone to give you!</>;
|
|
break;
|
|
case 'year-of-plenty':
|
|
title = <><b>Year of Plenty</b>! Tap the resource type and receive <b>2</b> from the bank!</>;
|
|
break;
|
|
}
|
|
|
|
return (
|
|
<div className="ChooseCard">
|
|
<Paper>
|
|
<div className="Title">{ title }</div>
|
|
<div style={{display: 'flex', flexDirection: 'row'}}>
|
|
{ resources }
|
|
</div>
|
|
</Paper>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default ChooseCard; |