mnml/client/src/utils.jsx
2019-04-04 12:50:01 +10:00

110 lines
3.8 KiB
JavaScript

const get = require('lodash/get');
const shapes = require('./components/shapes');
const stringSort = (k, desc) => {
if (desc) {
return (a, b) => {
if (!get(a, k)) return 1;
if (!get(b, k)) return -1;
return get(b, k).localeCompare(get(a, k));
};
}
return (a, b) => {
if (!get(a, k)) return 1;
if (!get(b, k)) return -1;
return get(a, k).localeCompare(get(b, k));
};
};
const numSort = (k, desc) => {
if (desc) {
return (a, b) => {
if (!get(a, k)) return 1;
if (!get(b, k)) return -1;
return get(b, k) - get(a, k);
};
}
return (a, b) => {
if (!get(a, k)) return 1;
if (!get(b, k)) return -1;
return get(a, k) - get(b, k);
};
};
const genAvatar = (name) => {
let hash = 0;
if (name.length === 0) return hash;
// Probs don't need to hash using the whole string
for (let i = 0; i < name.length; i += 1) {
const chr = name.charCodeAt(i);
hash = ((hash << 5) - hash) + chr;
hash = hash & 10000; // We have avatars named 0-19
}
return `sprite${hash}`;
};
function requestAvatar(name) {
const id = genAvatar(name);
const req = new Request(`/assets/molecules/${id}.svg`);
return fetch(req)
.then(res => res.text())
.then(svg => svg);
}
const NULL_UUID = '00000000-0000-0000-0000-000000000000';
const STATS = {
hp: { stat: 'hp', colour: 'green', svg: shapes.square },
greenDamage: { stat: 'green_damage', colour: 'green', svg: shapes.diamond },
redShield: { stat: 'red_shield', colour: 'red', svg: shapes.hexagon },
redDamage: { stat: 'red_damage', colour: 'red', svg: shapes.pentagon },
blueShield: { stat: 'blue_shield', colour: 'blue', svg: shapes.squircle },
blueDamage: { stat: 'blue_damage', colour: 'blue', svg: shapes.circle },
speed: { stat: 'speed', colour: '', svg: shapes.triangle },
};
const SPECS = {
Hp: { colour: 'white', caption: 'Hp', svg: shapes.square },
RedShieldI: { colour: 'red', caption: 'HpI', svg: shapes.square },
BlueShieldI: { colour: 'blue', caption: 'HpI', svg: shapes.square },
LifeI: { colour: 'green', caption: 'HpI', svg: shapes.square },
LRSI: { colour: 'yellow', caption: 'HpI', svg: shapes.square },
LBSI: { colour: 'cyan', caption: 'HpI', svg: shapes.square },
RBSI: { colour: 'purple', caption: 'HpI', svg: shapes.square },
Damage: { colour: 'white', caption: 'Damage', svg: shapes.hexagon },
RedDamageI: { colour: 'red', caption: 'DamageI', svg: shapes.hexagon },
BlueDamageI: { colour: 'blue', caption: 'DamageI', svg: shapes.hexagon },
GreenDamageI: { colour: 'green', caption: 'DamageI', svg: shapes.hexagon },
GRDI: { colour: 'yellow', caption: 'DamageI', svg: shapes.hexagon },
GBDI: { colour: 'cyan', caption: 'DamageI', svg: shapes.hexagon },
RBDI: { colour: 'purple', caption: 'DamageI', svg: shapes.hexagon },
Speed: { colour: 'white', caption: 'Speed', svg: shapes.diamond },
RedSpeed: { colour: 'red', caption: 'SpeedI', svg: shapes.diamond },
BlueSpeedI: { colour: 'blue', caption: 'SpeedI', svg: shapes.diamond },
GreenSpeedI: { colour: 'green', caption: 'speed', svg: shapes.diamond },
GRSpeedI: { colour: 'yellow', caption: 'SpeedI', svg: shapes.diamond },
GBSpeedI: { colour: 'cyan', caption: 'SpeedI', svg: shapes.diamond },
RBSpeedI: { colour: 'purple', caption: 'SpeedI', svg: shapes.diamond },
};
const COLOUR_ICONS = {
red: { colour: 'red', caption: 'red', svg: shapes.circle },
blue: { colour: 'blue', caption: 'blue', svg: shapes.circle },
green: { colour: 'green', caption: 'green', svg: shapes.circle },
};
module.exports = {
stringSort,
numSort,
genAvatar,
requestAvatar,
NULL_UUID,
STATS,
SPECS,
COLOUR_ICONS,
};