/* eslint no-unused-vars: ["error", {"varsIgnorePattern": "React|imageForDesign|Button|Glyphicon"}]*/
import React, { Component } from "react";
import {Button,
        Glyphicon} from "react-bootstrap";
import {imageForDesign} from "./Vote/Helpers";

class Vote extends Component {
  constructor(props) {
    super(props);
    this.state = {
      designs: props.designs || [],
      cursor: 0
    };
  }

  render() {
    const state = this.state;
    const currentDesign = (state.cursor >= state.designs.length)
                        ? {description: "", resources: []}
                        : state.designs[state.cursor];
    return (
      <div>
        <img src={imageForDesign(currentDesign)}
             alt={currentDesign.description} />
        <div>
          <Button ref="searchButton" onClick={this.props.searchButton}>
            <Glyphicon glyph="search"/>
          </Button>
          <Button ref="statisticsButton" onClick={this.props.statisticsButton}>
            <Glyphicon glyph="stats"/>
          </Button>
          <Button ref="voteDownButton" bsStyle="danger"
                  onClick={this.props.voteDownButton}>
            <Glyphicon glyph="chevron-down"/>
          </Button>
          <Button ref="voteUpButton" bsStyle="success"
                  onClick={this.props.voteUpButton}>
            <Glyphicon glyph="chevron-up"/>
          </Button>
        </div>
      </div>
    );
  }
}

export default Vote;

@@ -399,16 +399,93 @@
 %7D;%0A  %7D%0A%0A
+  vote(%CE%BB)%7B%0A    this.setState(%7Bcursor: this.state.cursor + 1%7D);%0A    %CE%BB();%0A  %7D%0A%0A
   render
@@ -1180,32 +1180,49 @@
        onClick=%7B
+() =%3E %7Bthis.vote(
 this.props.voteD
@@ -1226,24 +1226,27 @@
 teDownButton
+);%7D
 %7D%3E%0A         
@@ -1376,32 +1376,49 @@
        onClick=%7B
+() =%3E %7Bthis.vote(
 this.props.voteU
@@ -1420,24 +1420,27 @@
 voteUpButton
+);%7D
 %7D%3E%0A         

Add method Vote.vote