diff --git a/assets/city.png b/src/assets/city.png old mode 100644 new mode 100755 similarity index 100% rename from assets/city.png rename to src/assets/city.png diff --git a/assets/continent.png b/src/assets/continent.png old mode 100644 new mode 100755 similarity index 100% rename from assets/continent.png rename to src/assets/continent.png diff --git a/assets/country.png b/src/assets/country.png old mode 100644 new mode 100755 similarity index 100% rename from assets/country.png rename to src/assets/country.png diff --git a/assets/data center.png b/src/assets/data center.png old mode 100644 new mode 100755 similarity index 100% rename from assets/data center.png rename to src/assets/data center.png diff --git a/assets/galaxy.png b/src/assets/galaxy.png old mode 100644 new mode 100755 similarity index 100% rename from assets/galaxy.png rename to src/assets/galaxy.png diff --git a/assets/god.png b/src/assets/god.png old mode 100644 new mode 100755 similarity index 100% rename from assets/god.png rename to src/assets/god.png diff --git a/assets/keyboard.png b/src/assets/keyboard.png old mode 100644 new mode 100755 similarity index 100% rename from assets/keyboard.png rename to src/assets/keyboard.png diff --git a/assets/monitor.png b/src/assets/monitor.png old mode 100644 new mode 100755 similarity index 100% rename from assets/monitor.png rename to src/assets/monitor.png diff --git a/assets/moon.png b/src/assets/moon.png old mode 100644 new mode 100755 similarity index 100% rename from assets/moon.png rename to src/assets/moon.png diff --git a/assets/mouse.png b/src/assets/mouse.png old mode 100644 new mode 100755 similarity index 100% rename from assets/mouse.png rename to src/assets/mouse.png diff --git a/assets/office.png b/src/assets/office.png old mode 100644 new mode 100755 similarity index 100% rename from assets/office.png rename to src/assets/office.png diff --git a/assets/server room.png b/src/assets/server room.png old mode 100644 new mode 100755 similarity index 100% rename from assets/server room.png rename to src/assets/server room.png diff --git a/assets/solar system.png b/src/assets/solar system.png old mode 100644 new mode 100755 similarity index 100% rename from assets/solar system.png rename to src/assets/solar system.png diff --git a/assets/universe.png b/src/assets/universe.png old mode 100644 new mode 100755 similarity index 100% rename from assets/universe.png rename to src/assets/universe.png diff --git a/assets/world.png b/src/assets/world.png old mode 100644 new mode 100755 similarity index 100% rename from assets/world.png rename to src/assets/world.png diff --git a/src/components/BuildingButton.tsx b/src/components/BuildingButton.tsx index efd19dd..416532f 100644 --- a/src/components/BuildingButton.tsx +++ b/src/components/BuildingButton.tsx @@ -5,10 +5,47 @@ import { Text, Badge, Tooltip, - HStack + HStack, + Image } from '@chakra-ui/react' import { useGameStore } from '../store/gameStore' +// Import all building images +import mouseImg from '../assets/mouse.png' +import keyboardImg from '../assets/keyboard.png' +import monitorImg from '../assets/monitor.png' +import officeImg from '../assets/office.png' +import serverRoomImg from '../assets/server room.png' +import dataCenterImg from '../assets/data center.png' +import cityImg from '../assets/city.png' +import countryImg from '../assets/country.png' +import continentImg from '../assets/continent.png' +import worldImg from '../assets/world.png' +import moonImg from '../assets/moon.png' +import solarSystemImg from '../assets/solar system.png' +import galaxyImg from '../assets/galaxy.png' +import universeImg from '../assets/universe.png' +import godImg from '../assets/god.png' + +// Create an image mapping object +const buildingImages = { + mouseFarms: mouseImg, + keyboardFactories: keyboardImg, + monitorDisplays: monitorImg, + officeSpace: officeImg, + serverRooms: serverRoomImg, + dataCenters: dataCenterImg, + dataCities: cityImg, + dataCountries: countryImg, + dataContinents: continentImg, + dataWorlds: worldImg, + dataMoons: moonImg, + dataSolarSystems: solarSystemImg, + dataGalaxies: galaxyImg, + dataUniverses: universeImg, + dataGods: godImg +} + interface BuildingButtonProps { title: string cost: number @@ -62,6 +99,25 @@ export function BuildingButton({ Level: {level} + + {/* Add the building image */} + + {title} + + {description} Production: