95 lines
2.9 KiB
TypeScript
95 lines
2.9 KiB
TypeScript
import React from 'react'
|
|
import ExtraSummons from '~components/ExtraSummons'
|
|
import SummonUnit from '~components/SummonUnit'
|
|
|
|
import './index.scss'
|
|
|
|
// GridType
|
|
export enum GridType {
|
|
Class,
|
|
Character,
|
|
Weapon,
|
|
Summon
|
|
}
|
|
|
|
// Props
|
|
interface Props {
|
|
userId?: string
|
|
partyId?: string
|
|
main?: Summon | undefined
|
|
friend?: Summon | undefined
|
|
grid: GridArray<Summon>
|
|
editable: boolean
|
|
exists: boolean
|
|
found?: boolean
|
|
onSelect: (type: GridType, summon: Summon, position: number) => void
|
|
}
|
|
|
|
const SummonGrid = (props: Props) => {
|
|
const numSummons: number = 4
|
|
|
|
function receiveSummon(summon: Summon, position: number) {
|
|
props.onSelect(GridType.Summon, summon, position)
|
|
}
|
|
|
|
return (
|
|
<div>
|
|
<div className="SummonGrid">
|
|
<div className="LabeledUnit">
|
|
<div className="Label">Main Summon</div>
|
|
<SummonUnit
|
|
editable={props.editable}
|
|
key="grid_main_summon"
|
|
onReceiveData={receiveSummon}
|
|
position={-1}
|
|
unitType={0}
|
|
summon={props.main}
|
|
/>
|
|
</div>
|
|
|
|
<div className="LabeledUnit">
|
|
<div className="Label">Friend Summon</div>
|
|
<SummonUnit
|
|
editable={props.editable}
|
|
key="grid_friend_summon"
|
|
onReceiveData={receiveSummon}
|
|
position={6}
|
|
unitType={2}
|
|
summon={props.friend}
|
|
/>
|
|
</div>
|
|
|
|
<div id="LabeledGrid">
|
|
<div className="Label">Summons</div>
|
|
<ul id="grid_summons">
|
|
{
|
|
Array.from(Array(numSummons)).map((x, i) => {
|
|
return (
|
|
<li key={`grid_unit_${i}`} >
|
|
<SummonUnit
|
|
editable={props.editable}
|
|
onReceiveData={receiveSummon}
|
|
position={i}
|
|
unitType={1}
|
|
summon={props.grid[i]}
|
|
/>
|
|
</li>
|
|
)
|
|
})
|
|
}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<ExtraSummons
|
|
grid={props.grid}
|
|
editable={props.editable}
|
|
exists={false}
|
|
offset={numSummons}
|
|
onSelect={props.onSelect}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default SummonGrid
|