Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 | 12x 1x 1x 1x | export default function SideDisplay({ tableState, fryTimeLeft, onDragStart, manager }) {
return (<div className="Table" style={{ ...(manager && { width: '5rem' }) }}>
{tableState === "empty" && <p>Table is empty</p>}
{tableState === "potatoes" && (<img src="/images/aac_icons/potato.png" alt="Potato" className="TableImages" />)}
{tableState === "onions" && (<img src="/images/aac_icons/onion.png" alt="Onions" className="TableImages" />)}
{tableState === "cheese" && (<img src="/images/food_side_view/Mozzarella.png" alt="Cheese" className="TableImages" />)}
{tableState === "choppedPotatoes" && (
<div
className="DraggableItem"
draggable="true"
onDragStart={(event) => onDragStart(event, "choppedPotatoes")}
>
<img src="/images/station_specific/choppedPotatoes.png" alt="ChoppedPotatoes" className={`TableImages ${tableState}-img`} />
</div>
)}
{tableState === "choppedOnions" && (
<div
className="DraggableItem"
draggable="true"
onDragStart={(event) => onDragStart(event, "choppedOnions")}
>
<img src="/images/food_side_view/slicedOnion.png" alt="ChoppedOnions" className={`TableImages ${tableState}-img`} />
</div>
)}
{tableState === "choppedCheese" && (
<div
className="DraggableItem"
draggable="true"
onDragStart={(event) => onDragStart(event, "choppedCheese")}
>
<img src="/images/food_side_view/SlicedMozzarella.png" alt="ChoppedCheese" className={`TableImages ${tableState}-img`} />
</div>
)}
{tableState === "frying" && (
<>
<p>Time left: {fryTimeLeft} seconds</p>
</>
)}
{tableState === "fries" && (<img src="/images/aac_icons/fries.png" alt="Fries" className="TableImages" style={{
transform: 'scale(0.8)',
position: 'relative',
top: '-1.5rem',
}} />)}
{tableState === "onionRings" && (<img src="/images/aac_icons/OnionRings.png" alt="OnionRings" className="TableImages" />)}
{tableState === "mozzarellaSticks" && (<img src="/images/aac_icons/mozzarella_sticks.png" alt="Mozzarella Sticks" className="TableImages" />)}
</div>)
}
|