Got rid of the mark/plant distinction, player can plant directly.
This commit is contained in:
parent
b2820bbb47
commit
d5b950b541
|
|
@ -1,6 +1,6 @@
|
||||||
import React, { useState } from 'react'
|
import React, { useState } from 'react'
|
||||||
import { useGameStore } from '../store/useGameStore'
|
import { useGameStore } from '../store/useGameStore'
|
||||||
import { CROPS } from '../constants'
|
import { CROPS, ITEMS } from '../constants'
|
||||||
import { FieldTool, PlotState } from '../types'
|
import { FieldTool, PlotState } from '../types'
|
||||||
import Modal from './Modal'
|
import Modal from './Modal'
|
||||||
|
|
||||||
|
|
@ -154,10 +154,6 @@ const PlotInfoModal: React.FC<PlotInfoModalProps> = ({ plot, onClose }) => {
|
||||||
: 'None'}
|
: 'None'}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div style={plotInfoItemStyle}>
|
|
||||||
<span>Intended Crop:</span>
|
|
||||||
<span>{plot.intended ? CROPS[plot.intended].name : 'None'}</span>
|
|
||||||
</div>
|
|
||||||
<div style={plotInfoItemStyle}>
|
<div style={plotInfoItemStyle}>
|
||||||
<span>Water Level:</span>
|
<span>Water Level:</span>
|
||||||
<span>{formatPercentage(plot.moisture)}</span>
|
<span>{formatPercentage(plot.moisture)}</span>
|
||||||
|
|
@ -190,12 +186,12 @@ const FieldComponent: React.FC = () => {
|
||||||
water,
|
water,
|
||||||
harvest,
|
harvest,
|
||||||
remove,
|
remove,
|
||||||
assignCrop,
|
inventory,
|
||||||
actionCooldown,
|
actionCooldown,
|
||||||
} = useGameStore()
|
} = useGameStore()
|
||||||
|
|
||||||
const [selectedCrop, setSelectedCrop] = useState<string | null>(null)
|
const [selectedSeed, setSelectedSeed] = useState<string | null>(null)
|
||||||
const [selectedTool, setSelectedTool] = useState<FieldTool>('mark')
|
const [selectedTool, setSelectedTool] = useState<FieldTool>('plant')
|
||||||
const [inspectedPlot, setInspectedPlot] = useState<{
|
const [inspectedPlot, setInspectedPlot] = useState<{
|
||||||
plot: PlotState
|
plot: PlotState
|
||||||
row: number
|
row: number
|
||||||
|
|
@ -206,13 +202,13 @@ const FieldComponent: React.FC = () => {
|
||||||
if (actionCooldown > 0) return
|
if (actionCooldown > 0) return
|
||||||
|
|
||||||
switch (selectedTool) {
|
switch (selectedTool) {
|
||||||
case 'mark':
|
|
||||||
if (selectedCrop) {
|
|
||||||
assignCrop(row, col, selectedCrop)
|
|
||||||
}
|
|
||||||
break
|
|
||||||
case 'plant':
|
case 'plant':
|
||||||
plant(row, col)
|
if (selectedSeed) {
|
||||||
|
const crop = Object.values(CROPS).find(c => c.seedType === selectedSeed)
|
||||||
|
if (crop && inventory[selectedSeed] > 0) {
|
||||||
|
plant(row, col, crop.id)
|
||||||
|
}
|
||||||
|
}
|
||||||
break
|
break
|
||||||
case 'water':
|
case 'water':
|
||||||
water(row, col)
|
water(row, col)
|
||||||
|
|
@ -246,7 +242,6 @@ const FieldComponent: React.FC = () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
const tools: { id: FieldTool; label: string; icon: string }[] = [
|
const tools: { id: FieldTool; label: string; icon: string }[] = [
|
||||||
{ id: 'mark', label: 'Mark', icon: '🎯' },
|
|
||||||
{ id: 'plant', label: 'Plant', icon: '🌱' },
|
{ id: 'plant', label: 'Plant', icon: '🌱' },
|
||||||
{ id: 'water', label: 'Water', icon: '💧' },
|
{ id: 'water', label: 'Water', icon: '💧' },
|
||||||
{ id: 'harvest', label: 'Harvest', icon: '✂️' },
|
{ id: 'harvest', label: 'Harvest', icon: '✂️' },
|
||||||
|
|
@ -254,6 +249,14 @@ const FieldComponent: React.FC = () => {
|
||||||
{ id: 'inspect', label: 'Inspect', icon: '🔍' },
|
{ id: 'inspect', label: 'Inspect', icon: '🔍' },
|
||||||
]
|
]
|
||||||
|
|
||||||
|
// Get available seeds from inventory
|
||||||
|
const availableSeeds = Object.entries(inventory)
|
||||||
|
.filter(([itemId, count]) => {
|
||||||
|
const crop = Object.values(CROPS).find(c => c.seedType === itemId)
|
||||||
|
return crop && count > 0
|
||||||
|
})
|
||||||
|
.map(([itemId]) => itemId)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div style={fieldContainerStyle}>
|
<div style={fieldContainerStyle}>
|
||||||
<h2 style={titleStyle}>Fields</h2>
|
<h2 style={titleStyle}>Fields</h2>
|
||||||
|
|
@ -271,18 +274,28 @@ const FieldComponent: React.FC = () => {
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{selectedTool === 'mark' && (
|
{selectedTool === 'plant' && (
|
||||||
<div style={cropSelectionContainerStyle}>
|
<div style={cropSelectionContainerStyle}>
|
||||||
<p style={cropSelectionLabelStyle}>Select a crop to mark:</p>
|
<p style={cropSelectionLabelStyle}>Select a seed to plant:</p>
|
||||||
{Object.values(CROPS).map((crop) => (
|
{availableSeeds.length > 0 ? (
|
||||||
<button
|
availableSeeds.map((seedId) => {
|
||||||
key={crop.id}
|
const crop = Object.values(CROPS).find(c => c.seedType === seedId)
|
||||||
style={getCropButtonStyle(selectedCrop === crop.id)}
|
if (!crop) return null
|
||||||
onClick={() => setSelectedCrop(crop.id)}
|
return (
|
||||||
>
|
<button
|
||||||
{crop.name}
|
key={seedId}
|
||||||
</button>
|
style={getCropButtonStyle(selectedSeed === seedId)}
|
||||||
))}
|
onClick={() => setSelectedSeed(seedId)}
|
||||||
|
>
|
||||||
|
{ITEMS[seedId].emoji} {crop.name} ({inventory[seedId]})
|
||||||
|
</button>
|
||||||
|
)
|
||||||
|
})
|
||||||
|
) : (
|
||||||
|
<p style={{ width: '100%', textAlign: 'center', color: '#666' }}>
|
||||||
|
No seeds available in inventory
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
|
@ -299,9 +312,6 @@ const FieldComponent: React.FC = () => {
|
||||||
style={getPlotStyle(bgColor)}
|
style={getPlotStyle(bgColor)}
|
||||||
onClick={() => handlePlotClick(rowIndex, colIndex)}
|
onClick={() => handlePlotClick(rowIndex, colIndex)}
|
||||||
>
|
>
|
||||||
{plot.intended && !plot.current && (
|
|
||||||
<div>🌱 {CROPS[plot.intended]?.name}</div>
|
|
||||||
)}
|
|
||||||
{plot.current && (
|
{plot.current && (
|
||||||
<div>
|
<div>
|
||||||
{plot.current.mature ? '🌿' : '🌱'}{' '}
|
{plot.current.mature ? '🌿' : '🌱'}{' '}
|
||||||
|
|
|
||||||
|
|
@ -98,12 +98,11 @@ const progressRandomImmaturePlot = (
|
||||||
|
|
||||||
export const useGameStore = create<
|
export const useGameStore = create<
|
||||||
GameState & {
|
GameState & {
|
||||||
plant: (row: number, col: number) => void
|
plant: (row: number, col: number, cropId: string) => void
|
||||||
water: (row: number, col: number) => void
|
water: (row: number, col: number) => void
|
||||||
harvest: (row: number, col: number) => void
|
harvest: (row: number, col: number) => void
|
||||||
remove: (row: number, col: number) => void
|
remove: (row: number, col: number) => void
|
||||||
tick: () => void
|
tick: () => void
|
||||||
assignCrop: (row: number, col: number, cropId: string) => void
|
|
||||||
upgradeField: () => void
|
upgradeField: () => void
|
||||||
setGameSpeed: (speed: number) => void
|
setGameSpeed: (speed: number) => void
|
||||||
setActionCooldown: (cooldown: number) => void
|
setActionCooldown: (cooldown: number) => void
|
||||||
|
|
@ -140,15 +139,7 @@ export const useGameStore = create<
|
||||||
equipment: {},
|
equipment: {},
|
||||||
milestones: {},
|
milestones: {},
|
||||||
|
|
||||||
assignCrop: (row, col, cropId) => {
|
plant: (row, col, cropId) => {
|
||||||
set(
|
|
||||||
produce((state) => {
|
|
||||||
state.plots[row][col].intended = cropId
|
|
||||||
}),
|
|
||||||
)
|
|
||||||
},
|
|
||||||
|
|
||||||
plant: (row, col) => {
|
|
||||||
const { plots, inventory, actionCooldown } = get()
|
const { plots, inventory, actionCooldown } = get()
|
||||||
|
|
||||||
if (actionCooldown > 0) {
|
if (actionCooldown > 0) {
|
||||||
|
|
@ -156,24 +147,22 @@ export const useGameStore = create<
|
||||||
}
|
}
|
||||||
|
|
||||||
const plot = plots[row][col]
|
const plot = plots[row][col]
|
||||||
if (plot.intended && !plot.current) {
|
const crop = CROPS[cropId]
|
||||||
const crop = CROPS[plot.intended]
|
const seedId = crop.seedType
|
||||||
const seedId = crop.seedType
|
|
||||||
|
|
||||||
if (inventory[seedId] && inventory[seedId] > 0) {
|
if (!plot.current && inventory[seedId] && inventory[seedId] > 0) {
|
||||||
set(
|
set(
|
||||||
produce((state) => {
|
produce((state) => {
|
||||||
state.plots[row][col].current = {
|
state.plots[row][col].current = {
|
||||||
cropId: plot.intended!,
|
cropId: cropId,
|
||||||
progress: 0,
|
progress: 0,
|
||||||
mature: false,
|
mature: false,
|
||||||
}
|
}
|
||||||
|
|
||||||
state.inventory[seedId] = state.inventory[seedId] - 1
|
state.inventory[seedId] = state.inventory[seedId] - 1
|
||||||
state.actionCooldown = COOLDOWN_DURATION
|
state.actionCooldown = COOLDOWN_DURATION
|
||||||
}),
|
}),
|
||||||
)
|
)
|
||||||
}
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -16,7 +16,6 @@ export interface CropDefinitions {
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface PlotState {
|
export interface PlotState {
|
||||||
intended?: string
|
|
||||||
current?: {
|
current?: {
|
||||||
cropId: string
|
cropId: string
|
||||||
progress: number
|
progress: number
|
||||||
|
|
@ -31,7 +30,7 @@ export interface InventoryItem {
|
||||||
count: number
|
count: number
|
||||||
}
|
}
|
||||||
|
|
||||||
export type FieldTool = 'mark' | 'plant' | 'water' | 'harvest' | 'inspect' | 'remove'
|
export type FieldTool = 'plant' | 'water' | 'harvest' | 'inspect' | 'remove'
|
||||||
|
|
||||||
export interface ConsoleMessage {
|
export interface ConsoleMessage {
|
||||||
id: string
|
id: string
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue