Commit 1bf2934b authored by Matthew Odle's avatar Matthew Odle

move village-management and village-info to components

parent 3d4ea149
......@@ -45,3 +45,5 @@ update:
* Implemented energy mechanic
* Villager consumes food to increase energy stat
2017-11-06
*
\ No newline at end of file
import React from 'react';
import { Stock } from './stock';
import { GameOver } from './game-over';
export class VillageInfo extends React.Component {
render = () => {
return <div className="info">
<div className="stock">
<h3>Stock</h3>
{ this.props.villageStore.map( item =>
<Stock key={item.name} item={item} />
)}
</div>
<div className="score">
<h3>Score: { this.props.score }</h3>
{/* <button type="button" id="restart" onClick={() => this.props.restart()}>Restart</button> */}
</div>
{this.props.gameOver ? <GameOver /> : null}
</div>
}
}
import React from 'react';
import { Villager } from './villager';
import { Building } from './building';
export class VillageManagement extends React.Component {
increasePriority = (building) => {
const buildings = this.props.buildings.slice();
const buildingsWithLowerPriority = buildings.filter( otherBuilding => otherBuilding.priority < building.priority );
if (buildingsWithLowerPriority.length > 0) {
const currentPriority = building.priority;
const buildingToSwapWith = buildingsWithLowerPriority.reduce((a, b) => a.priority > b.priority ? a : b)
building.priority = buildingToSwapWith.priority;
this.props.updateTheBuildings(building);
buildingToSwapWith.priority = currentPriority;
this.props.updateTheBuildings(buildingToSwapWith);
}
}
decreasePriority = (building) => {
const buildings = this.props.buildings.slice();
const buildingsWithHigherPriority = buildings.filter( otherBuilding => otherBuilding.priority > building.priority );
if (buildingsWithHigherPriority.length > 0) {
const currentPriority = building.priority;
const buildingToSwapWith = buildingsWithHigherPriority.reduce((a, b) => a.priority < b.priority ? a : b)
building.priority = buildingToSwapWith.priority;
this.props.updateTheBuildings(building);
buildingToSwapWith.priority = currentPriority;
this.props.updateTheBuildings(buildingToSwapWith);
}
}
getUnassignedVillagers = () => {
return this.props.villagers.slice().filter( villager => villager.assignment === 'IDLE')
}
assignVillagers = (building, amount) => {
if (building.capacity - building.assignedVillagers.length <= 0 || this.getUnassignedVillagers().length === 0) {
return;
}
const allVillagers = this.props.villagers.slice();
const selectedVillager = allVillagers.find( villager => villager.assignment === 'IDLE' && amount > 0)
selectedVillager.assignment = building.name;
building.assignedVillagers.push(selectedVillager);
this.props.updateTheBuildings(building);
this.props.updateTheVillagers(selectedVillager);
amount -= 1;
if (amount > 0) {
this.assignVillagers(building, amount);
}
}
unassignVillagers = (building, amount) => {
if (building.assignedVillagers.length === 0) {
return;
}
const removedVillager = building.assignedVillagers.pop();
removedVillager.assignment = 'IDLE';
this.props.updateTheBuildings(building);
this.props.updateTheVillagers(removedVillager);
amount -= 1;
if (amount > 0) {
this.unassignVillagers(building, amount);
}
}
manageVillagerAssignments = (building, amount, operation) => {
if (operation === 'assign' && this.getUnassignedVillagers().length > 0) {
this.assignVillagers(building, amount);
}
if (operation === 'unassign') {
this.unassignVillagers(building, amount);
}
};
render = () => {
return <div className="management">
<div className="buildings">
<h3>Buildings</h3>
{ this.props.buildings.map( building =>
<Building
key={building.id}
building={building}
manageVillagerAssignments={this.manageVillagerAssignments}
increasePriority={this.increasePriority}
decreasePriority={this.decreasePriority}
/>
)}
</div>
<div className="villagers">
<h3>Villagers</h3>
{ this.props.villagers.map( villager =>
<Villager
key={villager.id}
villager={villager}
/>
)}
</div>
</div>
}
}
import React from 'react';
import { Building } from './building';
import { Stock } from './stock';
import { Villager } from './villager';
import { GameOver } from './game-over';
import { VillageInfo } from './village-info';
import { VillageManagement } from './village-management';
export class Village extends React.Component {
......@@ -23,11 +21,7 @@ export class Village extends React.Component {
//----- push button functions -----//
getUnassignedVillagers = () => {
return this.props.villagers.slice().filter( villager => villager.assignment === 'IDLE')
}
//----- state update functions -----//
updateTheBuildings = (building) => {
const buildings = this.props.buildings.slice();
......@@ -53,81 +47,10 @@ export class Village extends React.Component {
});
}
assignVillagers = (building, amount) => {
if (building.capacity - building.assignedVillagers.length <= 0 || this.getUnassignedVillagers().length === 0) {
return;
}
const allVillagers = this.props.villagers.slice();
const selectedVillager = allVillagers.find( villager => villager.assignment === 'IDLE' && amount > 0)
selectedVillager.assignment = building.name;
building.assignedVillagers.push(selectedVillager);
this.updateTheBuildings(building);
this.updateTheVillagers(selectedVillager);
amount -= 1;
if (amount > 0) {
this.assignVillagers(building, amount);
}
}
unassignVillagers = (building, amount) => {
if (building.assignedVillagers.length === 0) {
return;
}
const removedVillager = building.assignedVillagers.pop();
removedVillager.assignment = 'IDLE';
this.updateTheBuildings(building);
this.updateTheVillagers(removedVillager);
amount -= 1;
if (amount > 0) {
this.unassignVillagers(building, amount);
}
}
manageVillagerAssignments = (building, amount, operation) => {
if (operation === 'assign' && this.getUnassignedVillagers().length > 0) {
this.assignVillagers(building, amount);
}
if (operation === 'unassign') {
this.unassignVillagers(building, amount);
}
};
increasePriority = (building) => {
const buildings = this.state.buildings.slice();
const buildingsWithLowerPriority = buildings.filter( otherBuilding => otherBuilding.priority < building.priority );
if (buildingsWithLowerPriority.length > 0) {
const currentPriority = building.priority;
const buildingToSwapWith = buildingsWithLowerPriority.reduce((a, b) => a.priority > b.priority ? a : b)
building.priority = buildingToSwapWith.priority;
this.updateTheBuildings(building);
buildingToSwapWith.priority = currentPriority;
this.updateTheBuildings(buildingToSwapWith);
}
}
decreasePriority = (building) => {
const buildings = this.state.buildings.slice();
const buildingsWithHigherPriority = buildings.filter( otherBuilding => otherBuilding.priority > building.priority );
if (buildingsWithHigherPriority.length > 0) {
const currentPriority = building.priority;
const buildingToSwapWith = buildingsWithHigherPriority.reduce((a, b) => a.priority < b.priority ? a : b)
building.priority = buildingToSwapWith.priority;
this.updateTheBuildings(building);
buildingToSwapWith.priority = currentPriority;
this.updateTheBuildings(buildingToSwapWith);
}
updateTheVillageStore = (villageStore) => {
this.setState({
villageStore: villageStore,
});
}
......@@ -150,12 +73,6 @@ export class Village extends React.Component {
return flag;
};
updateTheVillageStore = (villageStore) => {
this.setState({
villageStore: villageStore,
});
}
useMaterials = (building) => {
const villageStore = this.state.villageStore.slice();
building.materials.map(
......@@ -417,48 +334,18 @@ export class Village extends React.Component {
};
render = () => {
const villageStore = this.props.villageStore.slice();
const buildings = this.props.buildings.slice();
this.sortBuildings(buildings);
const villageStore = this.props.villageStore.slice();
const villagers = this.props.villagers.slice();
return (
<div className="village">
<div className="info">
<div className="stock">
<h3>Stock</h3>
{ villageStore.map( item =>
<Stock key={item.name} item={item} />
)}
</div>
<div className="score">
<h3>Score: { this.state.score }</h3>
{/* <button type="button" id="restart" onClick={() => this.props.restart()}>Restart</button> */}
</div>
{this.state.gameOver ? <GameOver /> : null}
</div>
<div className="management">
<div className="buildings">
<h3>Buildings</h3>
{ buildings.map( building =>
<Building
key={building.id}
building={building}
manageVillagerAssignments={this.manageVillagerAssignments}
increasePriority={this.increasePriority}
decreasePriority={this.decreasePriority}
/>
)}
</div>
<div className="villagers">
<h3>Villagers</h3>
{ villagers.map( villager =>
<Villager
key={villager.id}
villager={villager}
/>
)}
</div>
</div>
<VillageInfo villageStore={villageStore} score={this.state.score} />
<VillageManagement
buildings={buildings} villagers={villagers}
updateTheBuildings={this.updateTheBuildings}
updateTheVillagers={this.updateTheVillagers}
/>
</div>
)
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment