more icons

This commit is contained in:
ntr 2019-04-03 17:31:25 +11:00
parent 31d8516652
commit cdf0cd6cfe
3 changed files with 18 additions and 20 deletions

View File

@ -3,6 +3,10 @@ const range = require('lodash/range');
const molecule = require('./molecule'); const molecule = require('./molecule');
const { STATS } = require('../utils');
console.log(STATS);
// const SKILL_HOT_KEYS = ['Q', 'W', 'E', 'R']; // const SKILL_HOT_KEYS = ['Q', 'W', 'E', 'R'];
function GamePanel(props) { function GamePanel(props) {
@ -82,12 +86,9 @@ function GamePanel(props) {
); );
}); });
const stats = [ const stats = Object.values(STATS).map((s, i) => (
{ stat: 'hp', colour: '#1FF01F' },
{ stat: 'red_shield', colour: '#a52a2a' },
{ stat: 'blue_shield', colour: '#3498db' },
].map((s, i) => (
<figure key={i} alt={s.stat}> <figure key={i} alt={s.stat}>
{s.svg(`stat-icon ${s.colour}`)}
<figcaption>{cryp[s.stat].value} / {cryp[s.stat].max}</figcaption> <figcaption>{cryp[s.stat].value} / {cryp[s.stat].max}</figcaption>
</figure> </figure>
)); ));
@ -127,12 +128,9 @@ function GamePanel(props) {
} }
function OpponentCryp(cryp, i) { function OpponentCryp(cryp, i) {
const stats = [ const stats = [STATS.hp, STATS.redShield, STATS.blueShield].map((s, j) => (
{ stat: 'hp', colour: '#1FF01F' },
{ stat: 'red_shield', colour: '#a52a2a' },
{ stat: 'blue_shield', colour: '#3498db' },
].map((s, j) => (
<figure key={j} alt={s.stat}> <figure key={j} alt={s.stat}>
{s.svg(`stat-icon ${s.colour}`)}
<figcaption>{cryp[s.stat].value} / {cryp[s.stat].max}</figcaption> <figcaption>{cryp[s.stat].value} / {cryp[s.stat].max}</figcaption>
</figure> </figure>
)); ));

View File

@ -30,7 +30,7 @@ function Cryp(cryp, sendVboxApply, setInfo) {
return sendVboxApply(cryp.id, item); return sendVboxApply(cryp.id, item);
} }
const stats = STATS.map((s, i) => ( const stats = Object.values(STATS).map((s, i) => (
<figure key={i} alt={s.stat}> <figure key={i} alt={s.stat}>
{s.svg(`stat-icon ${s.colour}`)} {s.svg(`stat-icon ${s.colour}`)}
<figcaption>{cryp[s.stat].value}</figcaption> <figcaption>{cryp[s.stat].value}</figcaption>

View File

@ -54,15 +54,15 @@ function requestAvatar(name) {
const NULL_UUID = '00000000-0000-0000-0000-000000000000'; const NULL_UUID = '00000000-0000-0000-0000-000000000000';
const STATS = [ const STATS = {
{ stat: 'hp', colour: 'green', svg: shapes.square }, hp: { stat: 'hp', colour: 'green', svg: shapes.square },
{ stat: 'green_damage', colour: 'green', svg: shapes.diamond }, greenDamage: { stat: 'green_damage', colour: 'green', svg: shapes.diamond },
{ stat: 'red_shield', colour: 'red', svg: shapes.hexagon }, redShield: { stat: 'red_shield', colour: 'red', svg: shapes.hexagon },
{ stat: 'red_damage', colour: 'red', svg: shapes.pentagon }, redDamage: { stat: 'red_damage', colour: 'red', svg: shapes.pentagon },
{ stat: 'blue_shield', colour: 'blue', svg: shapes.squircle }, blueShield: { stat: 'blue_shield', colour: 'blue', svg: shapes.squircle },
{ stat: 'blue_damage', colour: 'blue', svg: shapes.circle }, blueDamage: { stat: 'blue_damage', colour: 'blue', svg: shapes.circle },
{ stat: 'speed', colour: 'yellow', svg: shapes.triangle }, speed: { stat: 'speed', colour: 'yellow', svg: shapes.triangle },
]; };
module.exports = { module.exports = {
stringSort, stringSort,