server/www/game.js

function Game(modules) {
  var turned = document.getElementById("turned");
  var status = {
    dom: document.getElementById("status"),
    playing: false,
    step: null,
    month: null,
  };
  var sets = {
    river: {
      card: null,
      dom: document.getElementById("river")
    },
    hand: {
      card: null,
      dom: document.getElementById("you").getElementsByClassName("hand")[0]
    }
  };
  var selected = null;

  modules.messaging.addEventListener(["Game"], function(o) {
    status.step = o.game.step.tag;
    setStatus(o.game);
    setCaptures(o.game);
    [
      ['river', o.game.river, RiverCard],
      ['hand', o.game.players[modules.session.getKey()].hand, HandCard]
    ].forEach(function(args) {setCardSet.apply(null, args)});
    if(status.step == "Turned") {
      setTurned(o.game.step.contents);
    } else {
      turned.classList.add("hidden");
    }
    if(status.playing && status.step == "Scored") {
      play({koiKoi: confirm(
        "You scored ! Do you want to go on ? Press cancel to just get your points and end current month"
      )});
    }
  });

  function play(move) {
    modules.messaging.send({
      tag: "Play",
      move: move
    });
  }

  function matchingInRiver(card) {
    return modules.fun.mapFilter(
      modules.fun.of(sets.river.card),
      modules.fun.isSet
    )(modules.hanafuda.sameMonth(card).map(modules.fun.proj('name')));
  }

  function setStatus(game) {
    modules.dom.clear(status.dom);
    status.month = game.month;
    var month = document.createElement('li');
    month.textContent = "This month's flower is the " + status.month;
    status.dom.appendChild(month);
    var playing = document.createElement('li');
    status.playing = modules.session.is(game.playing);
    if(status.playing) {
      sets.hand.dom.classList.toggle("yourTurn", status.step == "ToPlay");
      playing.textContent = "Your turn";
    } else {
      sets.hand.dom.classList.remove("yourTurn");
      playing.textContent = modules.room.name(game.playing) + " is playing";
    }
    status.dom.appendChild(playing);
  }

  function setCaptures(game) {
    for(var key in game.players) {
      var elem = document.getElementById(modules.session.is(key) ? "you" : "them");
      elem.getElementsByClassName('score')[0].textContent = game.scores[key] + " pts";
      var byClass = {}
      Object.values(modules.hanafuda.Family).forEach(function(family) {
        byClass[family.class] = elem.getElementsByClassName(family.class)[0];
        modules.dom.clear(byClass[family.class]);
      });
      game.players[key].meld.forEach(function(cardName) {
        var card = new Card(cardName);
        byClass[card.value.family.class].appendChild(card.dom);
      });
    }
  }

  function setCardSet(setName, cardNames, constructor) {
    constructor = constructor || Card;
    var set = sets[setName];
    set.card = {};
    modules.dom.clear(set.dom);
    cardNames.forEach(function(cardName) {
      var card = new constructor(cardName);
      set.card[cardName] = card;
      set.dom.appendChild(card.dom);
    });
  }

  function setTurned(cardName) {
    var card = new Card(cardName);
    modules.dom.clear(turned);
    turned.appendChild(card.dom);
    turned.classList.remove("hidden");
    if(status.playing) {
      selected = cardName;
      showCandidates(modules.hanafuda.Card[selected], true);
    }
  }

  function showCandidates(card, yes) {
    matchingInRiver(card).forEach(function(riverCard) {riverCard.setCandidate(yes);});
  }

  function Card(name) {
    this.value = modules.hanafuda.Card[name];
    this.name = name;
    var domElem = document.createElement('li');
    this.dom = domElem;
    [
      "card",
      "value" + modules.hanafuda.getValue(this.value),
      "month" + this.value.flower
    ].forEach(function(c) {domElem.classList.add(c);});
    this.dom.addEventListener('click', this.onClick());
  }

  Card.prototype.onClick = function() {return function() {};};

  function RiverCard() {
    Card.apply(this, arguments);
    this.candidate = false;
  }

  RiverCard.prototype.onClick = function() {
    var card = this;
    return function() {
      if(card.candidate) {
        var withCard = selected;
        selected = null;
        play(
          status.step == 'ToPlay' ? {capture: [withCard, card.name]} : {choose: card.name}
        );
      }
    };
  };

  RiverCard.prototype.setCandidate = function(yes) {
    this.candidate = yes;
    this.dom.classList.toggle("candidate", yes);
  }

  function HandCard() {
    Card.apply(this, arguments);
  }

  HandCard.prototype.onClick = function() {
    if(status.playing && status.step == "ToPlay") {
      var card = this;
      return function() {
        if(selected != undefined) {
          sets.hand.card[selected].setSelected(false);
        } else {
          card.play();
        }
      };
    } else {
      return function() {};
    }
  };

  HandCard.prototype.setSelected = function(yes) {
    selected = yes ? this.name : null;
    this.dom.classList.toggle('selected', yes);
    showCandidates(this.value, yes);
  }

  HandCard.prototype.play = function() {
    var matching = matchingInRiver(this.value);
    if(matching.length > 1) {
      this.setSelected(true);
    } else {
      play({play: this.name});
    }
  }
}