import { Module, MutationTree, ActionTree, GetterTree } from "vuex";
import { AppState } from "@/store/index";
import RoomClient from "@/roomclient";

const namespaced: boolean = true;

export interface Room {
	id: string;
	game_id: string;
	name: string;
	creator: string;
	players: string[];
	spectators: string[];
	current_players: number;
	current_spectators: number;
	can_spectate: boolean;
	tags: string[];
}

export interface RoomEvent {
	type: string;
	player?: string;
	role?: string;
	room?: Room;
	message?: string;
}

export interface RoomMessage {
	from?: string;
	to?: string;
	channel: string;
	type: string;
	data: Object;
	message?: string;
}

export interface RoomServerMessage {
	time: "string";
	type: "event" | "message" | "welcome";
	event?: RoomEvent;
	message?: RoomMessage;
	error?: string;
	backlog?: RoomServerMessage[];
	room?: Room;
}

export interface RoomState {
	in_room: boolean;
	room: Room | null;
	client: RoomClient | null;
	messages: RoomServerMessage[];
}

const state: RoomState = {
	in_room: false,
	room: null,
	client: null,
	messages: []
};

const mutations: MutationTree<RoomState> = {
	joinedRoom(state: RoomState, ws: RoomClient) {
		state.client = ws;
		state.in_room = true;
		state.room = ws.info;
		state.messages = ws.backlog;
	},
	messageReceived(state: RoomState, msg: RoomServerMessage) {
		state.messages.push(msg);
	}
};

const actions: ActionTree<RoomState, AppState> = {
	setClient({ commit }, ws: RoomClient) {
		ws.setMessageHandler(msg => {
			commit("messageReceived", msg);
		});
		commit("joinedRoom", ws);
	}
};

const getters: GetterTree<RoomState, AppState> = {
	users(state: RoomState): string[] {
		if (!state.room) {
			return [];
		}
		return [...state.room.players, ...state.room.spectators];
	}
};

export const room: Module<RoomState, AppState> = {
	namespaced,
	state,
	mutations,
	actions,
	getters
};