mnml/client/src/components/shapes.jsx

const preact = require('preact');

const circle = require('./svgs/circle');
const diamond = require('./svgs/diamond');
const hexagon = require('./svgs/hexagon');
const pentagon = require('./svgs/pentagon');
const saw = require('./svgs/saw');
const square = require('./svgs/square');
const squircle = require('./svgs/squircle');
const triangle = require('./svgs/triangle');
// const vboxColour = require('./svgs/colour');
const vboxColour = require('./svgs/vbox.colour');

module.exports = {
    circle,
    diamond,
    hexagon,
    pentagon,
    square,
    squircle,
    triangle,
    saw,
    vboxColour,

    Red: () => vboxColour('red'),
    Green: () => vboxColour('green'),
    Blue: () => vboxColour('blue'),

    // stats
    RedLife: () => square(['red']),
    GreenLife: () => square(['green']),
    BlueLife: () => square(['blue']),
    RedPower: () => circle(['red']),
    GreenPower: () => circle(['green']),
    BluePower: () => circle(['blue']),
    SpeedStat: () => triangle(['white']),

    POWER: () => circle(['white']),
    LIFE: () => square(['white']),
    SPEED: () => triangle(['white']),
    // specs
    // Base

    None: () =>
    <figure>
        {diamond(['gray'])}
        <figcaption>SPEC</figcaption>
    </figure>,


    Power: () =>
    <figure>
        {circle(['white'])}
        <figcaption>Power</figcaption>
    </figure>,

    Life: () =>
    <figure>
        {square(['white'])}
        <figcaption>Life</figcaption>
    </figure>,

    Speed: () =>
    <figure>
        {triangle(['white'])}
        <figcaption>Speed</figcaption>
    </figure>,

    // Lifes Upgrades
    LifeGG: () =>
    <figure>
        {square(['green'])}
        <figcaption>Life</figcaption>
    </figure>,

    LifeRR: () =>
    <figure>
        {square(['red'])}
        <figcaption>Life</figcaption>
    </figure>,

    LifeBB:() =>
    <figure>
        {square(['blue'])}
        <figcaption>Life</figcaption>
    </figure>,

    LifeRG: () =>
    <figure>
        {square(['red', 'green'])}
        <figcaption>Life</figcaption>
    </figure>,

    LifeGB: () =>
    <figure>
        {square(['green', 'blue'])}
        <figcaption>Life</figcaption>
    </figure>,

    LifeRB:() =>
    <figure>
        {square(['red', 'blue'])}
        <figcaption>Life</figcaption>
    </figure>,
    LifeGGPlus: () =>
    <figure>
        {square(['green'])}
        <figcaption>Life+</figcaption>
    </figure>,

    LifeRRPlus: () =>
    <figure>
        {square(['red'])}
        <figcaption>Life+</figcaption>
    </figure>,

    LifeBBPlus:() =>
    <figure>
        {square(['blue'])}
        <figcaption>Life+</figcaption>
    </figure>,

    LifeRGPlus: () =>
    <figure>
        {square(['red', 'green'])}
        <figcaption>Life+</figcaption>
    </figure>,

    LifeGBPlus: () =>
    <figure>
        {square(['green', 'blue'])}
        <figcaption>Life+</figcaption>
    </figure>,

    LifeRBPlus:() =>
    <figure>
        {square(['red', 'blue'])}
        <figcaption>Life+</figcaption>
    </figure>,

    LifeGGPlusPlus: () =>
    <figure>
        {square(['green'])}
        <figcaption>Life++</figcaption>
    </figure>,

    LifeRRPlusPlus: () =>
    <figure>
        {square(['red'])}
        <figcaption>Life++</figcaption>
    </figure>,

    LifeBBPlusPlus:() =>
    <figure>
        {square(['blue'])}
        <figcaption>Life++</figcaption>
    </figure>,

    LifeRGPlusPlus: () =>
    <figure>
        {square(['red', 'green'])}
        <figcaption>Life++</figcaption>
    </figure>,

    LifeGBPlusPlus: () =>
    <figure>
        {square(['green', 'blue'])}
        <figcaption>Life++</figcaption>
    </figure>,

    LifeRBPlusPlus:() =>
    <figure>
        {square(['red', 'blue'])}
        <figcaption>Life++</figcaption>
    </figure>,

    // Powers Upgrades
    PowerGG: () =>
    <figure>
        {circle(['green'])}
        <figcaption>Power</figcaption>
    </figure>,

    PowerRR: () =>
    <figure>
        {circle(['red'])}
        <figcaption>Power</figcaption>
    </figure>,

    PowerBB:() =>
    <figure>
        {circle(['blue'])}
        <figcaption>Power</figcaption>
    </figure>,

    PowerRG: () =>
    <figure>
        {circle(['red', 'green'])}
        <figcaption>Power</figcaption>
    </figure>,

    PowerGB: () =>
    <figure>
        {circle(['green', 'blue'])}
        <figcaption>Power</figcaption>
    </figure>,

    PowerRB:() =>
    <figure>
        {circle(['red', 'blue'])}
        <figcaption>Power</figcaption>
    </figure>,
    PowerGGPlus: () =>
    <figure>
        {circle(['green'])}
        <figcaption>Power+</figcaption>
    </figure>,

    PowerRRPlus: () =>
    <figure>
        {circle(['red'])}
        <figcaption>Power+</figcaption>
    </figure>,

    PowerBBPlus:() =>
    <figure>
        {circle(['blue'])}
        <figcaption>Power+</figcaption>
    </figure>,

    PowerRGPlus: () =>
    <figure>
        {circle(['red', 'green'])}
        <figcaption>Power+</figcaption>
    </figure>,

    PowerGBPlus: () =>
    <figure>
        {circle(['green', 'blue'])}
        <figcaption>Power+</figcaption>
    </figure>,

    PowerRBPlus:() =>
    <figure>
        {circle(['red', 'blue'])}
        <figcaption>Power+</figcaption>
    </figure>,

    PowerGGPlusPlus: () =>
    <figure>
        {circle(['green'])}
        <figcaption>Power++</figcaption>
    </figure>,

    PowerRRPlusPlus: () =>
    <figure>
        {circle(['red'])}
        <figcaption>Power++</figcaption>
    </figure>,

    PowerBBPlusPlus:() =>
    <figure>
        {circle(['blue'])}
        <figcaption>Power++</figcaption>
    </figure>,

    PowerRGPlusPlus: () =>
    <figure>
        {circle(['red', 'green'])}
        <figcaption>Power++</figcaption>
    </figure>,

    PowerGBPlusPlus: () =>
    <figure>
        {circle(['green', 'blue'])}
        <figcaption>Power++</figcaption>
    </figure>,

    PowerRBPlusPlus:() =>
    <figure>
        {circle(['red', 'blue'])}
        <figcaption>Power++</figcaption>
    </figure>,

    // Speeds Upgrades
    SpeedGG: () =>
    <figure>
        {triangle(['green'])}
        <figcaption>Speed</figcaption>
    </figure>,

    SpeedRR: () =>
    <figure>
        {triangle(['red'])}
        <figcaption>Speed</figcaption>
    </figure>,

    SpeedBB:() =>
    <figure>
        {triangle(['blue'])}
        <figcaption>Speed</figcaption>
    </figure>,

    SpeedRG: () =>
    <figure>
        {triangle(['red', 'green'])}
        <figcaption>Speed</figcaption>
    </figure>,

    SpeedGB: () =>
    <figure>
        {triangle(['green', 'blue'])}
        <figcaption>Speed</figcaption>
    </figure>,

    SpeedRB:() =>
    <figure>
        {triangle(['red', 'blue'])}
        <figcaption>Speed</figcaption>
    </figure>,
    SpeedGGPlus: () =>
    <figure>
        {triangle(['green'])}
        <figcaption>Speed+</figcaption>
    </figure>,

    SpeedRRPlus: () =>
    <figure>
        {triangle(['red'])}
        <figcaption>Speed+</figcaption>
    </figure>,

    SpeedBBPlus:() =>
    <figure>
        {triangle(['blue'])}
        <figcaption>Speed+</figcaption>
    </figure>,

    SpeedRGPlus: () =>
    <figure>
        {triangle(['red', 'green'])}
        <figcaption>Speed+</figcaption>
    </figure>,

    SpeedGBPlus: () =>
    <figure>
        {triangle(['green', 'blue'])}
        <figcaption>Speed+</figcaption>
    </figure>,

    SpeedRBPlus:() =>
    <figure>
        {triangle(['red', 'blue'])}
        <figcaption>Speed+</figcaption>
    </figure>,

    SpeedGGPlusPlus: () =>
    <figure>
        {triangle(['green'])}
        <figcaption>Speed++</figcaption>
    </figure>,

    SpeedRRPlusPlus: () =>
    <figure>
        {triangle(['red'])}
        <figcaption>Speed++</figcaption>
    </figure>,

    SpeedBBPlusPlus:() =>
    <figure>
        {triangle(['blue'])}
        <figcaption>Speed++</figcaption>
    </figure>,

    SpeedRGPlusPlus: () =>
    <figure>
        {triangle(['red', 'green'])}
        <figcaption>Speed++</figcaption>
    </figure>,

    SpeedGBPlusPlus: () =>
    <figure>
        {triangle(['green', 'blue'])}
        <figcaption>Speed++</figcaption>
    </figure>,

    SpeedRBPlusPlus:() =>
    <figure>
        {triangle(['red', 'blue'])}
        <figcaption>Speed++</figcaption>
    </figure>,
};