more icons
This commit is contained in:
parent
31d8516652
commit
cdf0cd6cfe
@ -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>
|
||||||
));
|
));
|
||||||
|
|||||||
@ -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>
|
||||||
|
|||||||
@ -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,
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user