let picture = 0;

const Character = function (name) {
  this.name = name;
  this.votes = 0;
};

const characters = [
  new Character('daenarys-targaryen'),
  new Character('maester-varys'),
  new Character('margarey-tyrell'),
  new Character('petyr-baelish'),
  new Character('samwell-tarly')
];

const updateImage = function () {
  const character = characters[picture];
  const image = `<li><img src='images/${character.name}-1920.jpg' alt='samwell' title='${character.name}'></li>`;
  $('.carousel').html(image);
};

const nextImage = function () {
  if (picture < characters.length - 1) picture += 1;
  updateImage();
};

const previousImage = function () {
  if (picture > 0) picture -= 1 ;
  updateImage();
};

const redrawVotes = function () {

};

const vote = function () {
  characters[picture].votes += 1;
  characters.forEach(character => {
    console.log(`${character.name} has ${character.votes}`);
  });
};

$(() => {
  updateImage();
  $('.carrousel ')
  $('.next').on('click', nextImage);
  $('.previous').on('click', previousImage);
  $('.vote').on('click', vote);
});