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: ...@@ -45,3 +45,5 @@ update:
* Implemented energy mechanic * Implemented energy mechanic
* Villager consumes food to increase energy stat * 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 React from 'react';
import { Building } from './building'; import { VillageInfo } from './village-info';
import { Stock } from './stock'; import { VillageManagement } from './village-management';
import { Villager } from './villager';
import { GameOver } from './game-over';
export class Village extends React.Component { export class Village extends React.Component {
...@@ -23,11 +21,7 @@ export class Village extends React.Component { ...@@ -23,11 +21,7 @@ export class Village extends React.Component {
//----- push button functions -----// //----- state update functions -----//
getUnassignedVillagers = () => {
return this.props.villagers.slice().filter( villager => villager.assignment === 'IDLE')
}
updateTheBuildings = (building) => { updateTheBuildings = (building) => {
const buildings = this.props.buildings.slice(); const buildings = this.props.buildings.slice();
...@@ -53,81 +47,10 @@ export class Village extends React.Component { ...@@ -53,81 +47,10 @@ export class Village extends React.Component {
}); });
} }
assignVillagers = (building, amount) => { updateTheVillageStore = (villageStore) => {
if (building.capacity - building.assignedVillagers.length <= 0 || this.getUnassignedVillagers().length === 0) { this.setState({
return; villageStore: villageStore,
} });
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);
}
} }
...@@ -150,12 +73,6 @@ export class Village extends React.Component { ...@@ -150,12 +73,6 @@ export class Village extends React.Component {
return flag; return flag;
}; };
updateTheVillageStore = (villageStore) => {
this.setState({
villageStore: villageStore,
});
}
useMaterials = (building) => { useMaterials = (building) => {
const villageStore = this.state.villageStore.slice(); const villageStore = this.state.villageStore.slice();
building.materials.map( building.materials.map(
...@@ -417,48 +334,18 @@ export class Village extends React.Component { ...@@ -417,48 +334,18 @@ export class Village extends React.Component {
}; };
render = () => { render = () => {
const villageStore = this.props.villageStore.slice();
const buildings = this.props.buildings.slice(); const buildings = this.props.buildings.slice();
this.sortBuildings(buildings); this.sortBuildings(buildings);
const villageStore = this.props.villageStore.slice();
const villagers = this.props.villagers.slice(); const villagers = this.props.villagers.slice();
return ( return (
<div className="village"> <div className="village">
<div className="info"> <VillageInfo villageStore={villageStore} score={this.state.score} />
<div className="stock"> <VillageManagement
<h3>Stock</h3> buildings={buildings} villagers={villagers}
{ villageStore.map( item => updateTheBuildings={this.updateTheBuildings}
<Stock key={item.name} item={item} /> updateTheVillagers={this.updateTheVillagers}
)} />
</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>
</div> </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