interaminense

/**
* Render UI start game
*/
renderStartGame() {
  const {
    state: {lvl, n1, n2, operator, message, errors, hits, countdown},
    props: {showResult}
  } = this;
  const result = CALCULATE(n1, n2, operator);

interaminense

setNextOperation() {
  let n1 = getRandomNumber(0, this.state.lvl.maxNumber);
  let n2 = getRandomNumber(0, this.state.lvl.maxNumber);
  let operator = this.getRandomOperator();
  let result = CALCULATE(n1, n2, operator);

  // If isn't real number, set the next operation
  if (isNaN(result) || !isFinite(result)) {
    this.setNextOperation();
  } else {

interaminense

/**
 * Handle click on buttons inside forms
 * @param {*} event
 */
_handleClickButton(event) {
  // If button is a submit type, return
  if (event.target.type !== 'button') {
    return;
  }

interaminense

/**
 * Handle click to validate expression
 * @param {object} event
 */
_handleClickValidateExpression(event) {
  event.preventDefault();

  if (event.target.result.value === '') return;

  let value = event.target.result.value;

interaminense

/**
 * Render UI finish game
 */
renderFinishGame() {
  const {hits, errors} = this.state;

  return (
    <Layout>
      <Layout.Header>{LANGUAGE.finishGame}</Layout.Header>

interaminense

import Component from 'metal-jsx';
import Mathematics from './components/Mathematics';

class App extends Component {
  render() {
    const {lvlDefault, lvls, showResult, countdown} = this.state;

    return (
      <Mathematics
        countdown={30}

interaminense

import Button from './Button';

export { Button };

interaminense

import Component from 'metal-jsx';

class Button extends Component {}

export default Button;

interaminense

<Button isActive style={'primary'} />

interaminense

import Component, {Config} from 'metal-jsx';

class Button extends Component {}

export default Button;