E.W.O. Next / All files / src/client/Game/States States.tsx

77.78% Statements 14/18
50% Branches 2/4
66.67% Functions 2/3
76.47% Lines 13/17

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90            1x   1x 1x 1x             10x       1x   10x   10x 4x     6x         6x                         6x                                                                             1x      
/**
 * @module Client.Game.States
 * All states
 */
 
import { IStateFrontend } from '@client/reducers';
import { getSelectedCharacter } from '@client/selector';
import { CharacterFrontend } from '@models';
import React from 'react';
import { connect } from 'react-redux';
import { DoubleBar, InfoBar, SimpleBar } from './Bar';
 
// tslint:disable-next-line: no-empty-interface
export interface StatesProps {
  character: CharacterFrontend;
}
 
const mapStateToProps = (state: IStateFrontend) => ({
  character: getSelectedCharacter(state),
});
 
export const StatesComponent = (props: StatesProps) => {
 
  const { character } = props;
 
  if (character === undefined) {
    return null;
  }
 
  const bmDefault = {
    def: 0,
    resMagie: 0,
  };
 
  const bonusMalus = character.buffs.reduce(
    (total, buff) => {
 
      if (buff.operation === 'bonus') {
        total[buff.type] += buff.value;
      } else {
        total[buff.type] -= buff.value;
      }
 
      return total;
    },
    bmDefault);
 
  return (
    <div className="States Game__Container">
      <div className="Title">States</div>
      <div>Px {character.xp} | Pi {character.ep}</div>
      <div>(Rang 0)</div>
 
      <div>Pv</div>
      <DoubleBar actual={character.currentHp} max={character.hp} large={true} />
 
      <div>Malus</div>
      <SimpleBar actual={Math.abs(bonusMalus.def)} inverted={true} />
 
      <div>Pa</div>
      <DoubleBar actual={character.currentAgility} max={character.agility} />
 
      <div>Mouv</div>
      <DoubleBar actual={character.currentSpeed} max={character.speed} />
 
      <div>Res Magique</div>
      <SimpleBar actual={bonusMalus.resMagie} inverted={true} backgroundColor="blue" />
 
      <div>Récupération Pv</div>
      <DoubleBar actual={character.regenHp} max={character.maxRegenHp} />
 
      <div>Récup'Malus</div>
      <DoubleBar actual={character.regenAgility} max={character.maxRegenAgility} />
 
      <div>Force</div>
      <DoubleBar actual={character.currentStrength} max={character.strength} />
 
      <div>Perception</div>
      <DoubleBar actual={character.currentInsight} max={character.insight} />
 
      <div>Niveau de magie</div>
      <InfoBar message={String(character.currentMagic)} />
    </div>
  );
};
 
export const States = connect(
  mapStateToProps,
)(StatesComponent);