From 0ea341128963a8f7d61cabc191c13041d5fab9ee Mon Sep 17 00:00:00 2001
From: Joni Laukka <joni.laukka.overflow@gmail.com>
Date: Mon, 15 Jul 2019 15:45:41 +0300
Subject: [PATCH] Playerlist promotion wip
---
src/components/PlayerlistFaction.js | 9 ++++---
src/components/PlayerlistPlayerCard.js | 35 ++++++++++++++++++++++++++
src/components/PlayerlistView.js | 8 +++++-
3 files changed, 48 insertions(+), 4 deletions(-)
create mode 100644 src/components/PlayerlistPlayerCard.js
diff --git a/src/components/PlayerlistFaction.js b/src/components/PlayerlistFaction.js
index 13638fd..1d12d6a 100644
--- a/src/components/PlayerlistFaction.js
+++ b/src/components/PlayerlistFaction.js
@@ -1,4 +1,5 @@
import React from "react";
+import PlayerlistPlayerCard from "./PlayerlistPlayerCard";
export default class PlayerlistFaction extends React.Component {
state = {
@@ -26,9 +27,11 @@ export default class PlayerlistFaction extends React.Component {
let members = this.state.factionMembers.map(member => {
return (
- <div key={member.gamepersonId}>
- {member.person.name} : {member.role}
- </div>
+ <PlayerlistPlayerCard
+ key={member.gamepersonId}
+ player={member}
+ role={this.props.role}
+ />
);
});
diff --git a/src/components/PlayerlistPlayerCard.js b/src/components/PlayerlistPlayerCard.js
new file mode 100644
index 0000000..c29944e
--- /dev/null
+++ b/src/components/PlayerlistPlayerCard.js
@@ -0,0 +1,35 @@
+import React, { Fragment } from "react";
+
+export default class PlayerlistPlayerCard extends React.Component {
+ state = {
+ edit: false
+ };
+
+ render() {
+ console.log(this.props.player);
+ return (
+ <div>
+ {this.props.player.person.name} :{" "}
+ {this.state.edit && (
+ <select>
+ <option value="soldier">Soldier</option>
+ <option value="factionleader">Faction Leader</option>
+ <option value="admin">Admin</option>
+ </select>
+ )}
+ {!this.state.edit && this.props.player.role}
+ {this.props.role === "admin" && !this.state.edit && (
+ <button onClick={() => this.setState({ edit: !this.state.edit })}>
+ Edit
+ </button>
+ )}
+ {this.state.edit && (
+ <Fragment>
+ <button>Save</button>
+ <button>Cancel</button>
+ </Fragment>
+ )}
+ </div>
+ );
+ }
+}
diff --git a/src/components/PlayerlistView.js b/src/components/PlayerlistView.js
index 3c98fdd..e6014ad 100644
--- a/src/components/PlayerlistView.js
+++ b/src/components/PlayerlistView.js
@@ -46,7 +46,13 @@ export default class PlayerlistView extends React.Component {
}
let factionlistItems = this.state.factions.map(faction => {
- return <PlayerlistFaction faction={faction} />;
+ return (
+ <PlayerlistFaction
+ key={faction.factionId}
+ faction={faction}
+ role={this.props.role}
+ />
+ );
});
return <div className="fade-main">{factionlistItems}</div>;
--
GitLab