webclient/js/GUI/Screen/Hall.js

import * as Dom from UnitJS.Dom;
import I18n;
import * as ConnectedForm from GUI.ConnectedForm;
import * as ListSelector from GUI.ListSelector;
import Messaging;
import room as players from Room;
import Session;
import StatusHandler;
import Table;

var room = ConnectedForm.get('room');
var form = room.root;

var playersList = ListSelector.make('players', showPlayer);
var games = Table.make(game, 'date');
var gamesList = ListSelector.make('games', showGame);
var them = null;

return {
	init: init
};

function init() {
	initDOMEvents();
	initMessageHandlers();
}

function initDOMEvents() {
	form.addEventListener('submit', function(e) {
		e.preventDefault();
		Messaging.send({tag: "Invitation", to: them});
	});
	form.them.addEventListener("input", function() {refreshPlayers();});
}

function initMessageHandlers() {
	Messaging.addEventListener(["Okaeri"], function(o) {
		refresh();
	});
	Messaging.addEventListener(["Welcome"], function(o) {
		refresh();
	});
	Messaging.addEventListener(["LogIn"], function(o) {
		if(!Session.is(o.from)) {
			refresh();
		}
	});
	Messaging.addEventListener(["LogOut"], function(o) {
		refresh();
	});
	Messaging.addEventListener(["Relay", "Invitation"], function(o) {
		var from = players.get(o.from);
		// invitations should come only from known players, in doubt say «no»
		if(from != undefined && from.name) {
			StatusHandler.set("🎴");
			games.insert(o.from, from.name);
			refreshGames();
		} else {
			Messaging.send({tag: "Answer", accept: false});
		}
	});
	Messaging.addEventListener(["Relay", "Answer"], function(o) {
		games.remove(o.from);
		refreshGames();
		/*
		if(o.message.accept) {
			modules.screen.select("game");
		}
		*/
	});
	Messaging.addEventListener(["Game"], function(o) {
	});
}

function showPlayer(player) {
	return Dom.make('li', {
		textContent: player.name,
		onClick: function() {form.them.value = player.name; refreshPlayers();},
		class: 'player'
	});
}

function game(key, vs) {
	return {
		key: key,
		vs: vs,
		date: Date.now()
	};
}

function showGame(game) {
	return Dom.make('li', {}, [
		Dom.make('button', {
			textContent: I18n.get('accept'),
			onClick: function() {
				Messaging.send({tag: "Answer", accept: true, to: game.key});
			}
		}),
		Dom.make('span', {textContent: 'A game vs. ' + game.vs}),
	]);
}

function refresh() {
	refreshPlayers();
	refreshGames();
}

function refreshPlayers() {
	var name = form.them.value;
	them = null;
	var filtered = players.getAll(
		function(player) {return player.name.match(name);}
	);
	playersList.refresh(filtered);
	var exact = filtered.find(exactMatch(name));
	if(exact != undefined) {
		them = exact.key;
	} else if(filtered.length == 1) {
		them = filtered[0].key;
	} else if(filtered.length == 0) {
		playersList.message.textContent = I18n.get(
			name.length > 0 ? "notFound" : "alone"
		);
	}
	room.enable(them != undefined);
}

function exactMatch(name) {
	return function(player) {
		return player.name === name;
	};
}

function refreshGames() {
	var sortedGames = games.getAll();
	gamesList.refresh(sortedGames);
	if(sortedGames.length < 1) {
		gamesList.message.textContent = I18n.get('noGames');
	}
}