ensl_gathers/public/js/app.js

"use strict";

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var VoteButton = React.createClass({
	displayName: "VoteButton",

	cancelVote: function cancelVote(e) {
		socket.emit("gather:vote", {
			leader: {
				candidate: null
			}
		});
	},

	vote: function vote(e) {
		e.preventDefault();
		socket.emit("gather:vote", {
			leader: {
				candidate: parseInt(e.target.value, 10)
			}
		});
	},

	render: function render() {
		if (this.props.currentGatherer === null) {
			return false;
		}
		if (this.props.currentGatherer.leaderVote === this.props.candidate.id) {
			return React.createElement(
				"button",
				{
					onClick: this.cancelVote,
					className: "btn btn-xs btn-success" },
				"Voted"
			);
		} else {
			return React.createElement(
				"button",
				{
					onClick: this.vote,
					className: "btn btn-xs btn-default",
					value: this.props.candidate.id },
				"Vote"
			);
		}
	}
});

var SelectPlayerButton = React.createClass({
	displayName: "SelectPlayerButton",

	selectPlayer: function selectPlayer(e) {
		e.preventDefault();
		socket.emit("gather:select", {
			player: parseInt(e.target.value, 10)
		});
	},

	render: function render() {
		if (this.props.gatherer.leader) {
			return React.createElement(
				"button",
				{
					className: "btn btn-xs btn-default",
					"data-disabled": "true" },
				"Leader"
			);
		} else if (this.props.gatherer.team !== "lobby") {
			return React.createElement(
				"button",
				{
					onClick: this.selectPlayer,
					value: this.props.gatherer.id,
					className: "btn btn-xs btn-default" },
				" Reselect"
			);
		} else {
			return React.createElement(
				"button",
				{
					onClick: this.selectPlayer,
					value: this.props.gatherer.id,
					className: "btn btn-xs btn-primary" },
				" Select"
			);
		}
	}
});

var GathererList = React.createClass({
	displayName: "GathererList",

	memberList: function memberList() {
		var self = this;
		return this.props.gather.gatherers.filter(function (gatherer) {
			return gatherer.team === self.props.team;
		}).sort(function (gatherer) {
			return gatherer.leader ? 1 : -1;
		});
	},

	render: function render() {
		var extractGatherer = function extractGatherer(gatherer) {
			var image;
			if (gatherer.leader) {
				image = React.createElement("img", { src: "/images/commander.png",
					alt: "Commander",
					height: "20",
					width: "20" });
			}
			return React.createElement(
				"tr",
				{ key: gatherer.id },
				React.createElement(
					"td",
					{ className: "col-md-1" },
					image
				),
				React.createElement(
					"td",
					{ className: "col-md-11" },
					gatherer.user.username
				)
			);
		};
		var members = this.memberList().map(extractGatherer);
		return React.createElement(
			"table",
			{ className: "table" },
			React.createElement(
				"tbody",
				null,
				members
			)
		);
	}
});

var GatherTeams = React.createClass({
	displayName: "GatherTeams",

	render: function render() {
		return React.createElement(
			"div",
			{ className: "panel-body" },
			React.createElement(
				"div",
				{ className: "row" },
				React.createElement(
					"div",
					{ className: "col-md-6" },
					React.createElement(
						"div",
						{ className: "panel panel-default" },
						React.createElement(
							"div",
							{ className: "panel-heading" },
							"Aliens"
						),
						React.createElement(GathererList, { gather: this.props.gather, team: "alien" })
					)
				),
				React.createElement(
					"div",
					{ className: "col-md-6" },
					React.createElement(
						"div",
						{ className: "panel panel-default" },
						React.createElement(
							"div",
							{ className: "panel-heading" },
							"Marines"
						),
						React.createElement(GathererList, { gather: this.props.gather, team: "marine" })
					)
				)
			)
		);
	}
});

var ElectionProgressBar = React.createClass({
	displayName: "ElectionProgressBar",

	componentDidMount: function componentDidMount() {
		var self = this;
		this.timer = setInterval(function () {
			self.forceUpdate();
		}, 900);
	},

	progress: function progress() {
		var interval = this.props.gather.election.interval;
		var startTime = new Date(this.props.gather.election.startTime).getTime();
		var msTranspired = Math.floor(new Date().getTime() - startTime);

		return {
			num: msTranspired,
			den: interval,
			barMessage: Math.floor((interval - msTranspired) / 1000) + "s remaining"
		};
	},

	componentWillUnmount: function componentWillUnmount() {
		clearInterval(this.timer);
	},

	render: function render() {
		return React.createElement(ProgressBar, { progress: this.progress() });
	}
});

var ProgressBar = React.createClass({
	displayName: "ProgressBar",

	render: function render() {
		var style = {
			width: Math.round(this.props.progress.num / this.props.progress.den * 100) + "%"
		};
		var barMessage = this.props.progress.barMessage || "";
		return React.createElement(
			"div",
			{ className: "progress" },
			React.createElement(
				"div",
				{ className: "progress-bar progress-bar-striped active",
					"data-role": "progressbar",
					"data-aria-valuenow": this.props.progress.num,
					"data-aria-valuemin": "0",
					"data-aria-valuemax": this.props.progress.den,
					style: style },
				barMessage
			)
		);
	}
});

var GatherProgress = React.createClass({
	displayName: "GatherProgress",

	stateDescription: function stateDescription() {
		switch (this.props.gather.state) {
			case "gathering":
				return "Waiting for more gatherers.";
			case "election":
				return "Currently voting for team leaders.";
			case "selection":
				return "Waiting for leaders to pick teams.";
			case "done":
				return "Gather completed.";
			default:
				return "Initialising gather.";
		}
	},

	gatheringProgress: function gatheringProgress() {
		var num = this.props.gather.gatherers.length;
		var den = 12;
		var remaining = den - num;
		var message = remaining === 1 ? "Waiting for last player" : "Waiting for " + remaining + " more players";
		return {
			num: num,
			den: den,
			message: message
		};
	},

	electionProgress: function electionProgress() {
		var num = this.props.gather.gatherers.reduce(function (acc, gatherer) {
			if (gatherer.leaderVote) acc++;
			return acc;
		}, 0);
		var den = 12;
		return {
			num: num,
			den: den,
			message: den - num + " more votes required"
		};
	},

	selectionProgress: function selectionProgress() {
		var num = this.props.gather.gatherers.reduce(function (acc, gatherer) {
			if (gatherer.team !== "lobby") acc++;
			return acc;
		}, 0);
		var den = 12;

		return {
			num: num,
			den: den,
			message: num + " out of " + den + " players assigned"
		};
	},

	render: function render() {
		var progress, progressBar;
		var gatherState = this.props.gather.state;
		if (gatherState === 'gathering' && this.props.gather.gatherers.length) {
			progress = this.gatheringProgress();
			progressBar = React.createElement(ProgressBar, { progress: progress });
		} else if (gatherState === 'election') {
			progress = this.electionProgress();
			progressBar = React.createElement(ElectionProgressBar, _extends({}, this.props, { progress: progress }));
		} else if (gatherState === 'selection') {
			progress = this.selectionProgress();
			progressBar = React.createElement(ProgressBar, { progress: progress });
		}

		if (!progress) return false;

		return React.createElement(
			"div",
			{ className: "panel-body no-bottom" },
			React.createElement(
				"p",
				null,
				React.createElement(
					"strong",
					null,
					this.stateDescription()
				),
				" ",
				progress.message
			),
			progressBar
		);
	}
});

var GatherActions = React.createClass({
	displayName: "GatherActions",

	joinGather: function joinGather(e) {
		e.preventDefault();
		socket.emit("gather:join");
	},

	leaveGather: function leaveGather(e) {
		e.preventDefault();
		socket.emit("gather:leave");
	},

	confirmTeam: function confirmTeam(e) {
		e.preventDefault();
		socket.emit("gather:select:confirm");
	},

	inviteToGather: function inviteToGather(e) {
		e.preventDefault();
		alert("Boop!");
	},

	render: function render() {
		var joinButton;
		if (this.props.currentGatherer) {
			joinButton = React.createElement(
				"li",
				null,
				React.createElement(
					"button",
					{
						onClick: this.leaveGather,
						className: "btn btn-danger" },
					"Leave Gather"
				)
			);
		} else if (this.props.gather.state === 'gathering') {
			joinButton = React.createElement(
				"button",
				{
					onClick: this.joinGather,
					className: "btn btn-success" },
				"Join Gather"
			);
		}

		var confirmTeam;
		if (this.props.currentGatherer && this.props.currentGatherer.leader && this.props.gather.state === 'selection' && this.props.gather.gatherers.every(function (gatherer) {
			return gatherer.team !== 'lobby';
		})) {
			if (this.props.currentGatherer.confirm) {
				confirmTeam = React.createElement(
					"li",
					null,
					React.createElement(
						"button",
						{
							className: "btn btn-default",
							"data-disabled": "true"
						},
						"Confirmed"
					)
				);
			} else {
				confirmTeam = React.createElement(
					"li",
					null,
					React.createElement(
						"button",
						{
							className: "btn btn-success",
							onClick: this.confirmTeam
						},
						"Confirm Team"
					)
				);
			}
		}

		var inviteButton;
		if (this.props.gather.state === 'gathering') {
			inviteButton = React.createElement(
				"li",
				null,
				React.createElement(
					"button",
					{
						onClick: this.inviteToGather,
						className: "btn btn-primary" },
					"Invite to Gather"
				)
			);
		}

		return React.createElement(
			"div",
			{ className: "panel-footer text-right" },
			React.createElement(
				"ul",
				{ className: "list-inline no-bottom" },
				confirmTeam,
				inviteButton,
				joinButton
			)
		);
	}
});

var ServerVoting = React.createClass({
	displayName: "ServerVoting",

	handleServerVote: function handleServerVote(e) {
		e.preventDefault();
		socket.emit("gather:vote", {
			server: {
				id: parseInt(e.target.value, 10)
			}
		});
	},

	votesForServer: function votesForServer(server) {
		return this.props.gather.gatherers.reduce(function (acc, gatherer) {
			if (server.id === gatherer.serverVote) acc++;
			return acc;
		}, 0);
	},

	render: function render() {
		var self = this;
		var servers = self.props.servers.map(function (server) {
			var voteButton;
			if (self.props.currentGatherer.serverVote === server.id) {
				voteButton = React.createElement(
					"button",
					{
						"data-disabled": "true",
						className: "btn btn-xs btn-success" },
					"Voted"
				);
			} else {
				voteButton = React.createElement(
					"button",
					{
						onClick: self.handleServerVote,
						value: server.id,
						className: "btn btn-xs btn-primary" },
					"Vote"
				);
			}
			return React.createElement(
				"tr",
				{ key: server.id },
				React.createElement(
					"td",
					{ className: "col-md-6" },
					server.description || server.dns
				),
				React.createElement(
					"td",
					{ className: "col-md-6 text-right" },
					self.votesForServer(server),
					" Votes ",
					voteButton
				)
			);
		});
		return React.createElement(
			"div",
			{ className: "panel panel-default" },
			React.createElement(
				"div",
				{ className: "panel-heading" },
				"Server Voting"
			),
			React.createElement(
				"table",
				{ id: "serverVoteTable", className: "table table-condensed table-hover voting-table" },
				servers
			)
		);
	}
});

var MapVoting = React.createClass({
	displayName: "MapVoting",

	handleMapVote: function handleMapVote(e) {
		e.preventDefault();
		socket.emit("gather:vote", {
			map: {
				id: parseInt(e.target.value, 10)
			}
		});
	},

	votesForMap: function votesForMap(map) {
		return this.props.gather.gatherers.reduce(function (acc, gatherer) {
			if (map.id === gatherer.mapVote) acc++;
			return acc;
		}, 0);
	},

	render: function render() {
		var self = this;
		var maps = self.props.maps.map(function (map) {
			var voteButton;
			if (self.props.currentGatherer.mapVote === map.id) {
				voteButton = React.createElement(
					"button",
					{
						"data-disabled": "true",
						className: "btn btn-xs btn-success" },
					"Voted"
				);
			} else {
				voteButton = React.createElement(
					"button",
					{
						onClick: self.handleMapVote,
						value: map.id,
						className: "btn btn-xs btn-primary" },
					"Vote"
				);
			}
			return React.createElement(
				"tr",
				{ key: map.id },
				React.createElement(
					"td",
					{ className: "col-md-6" },
					map.name
				),
				React.createElement(
					"td",
					{ className: "col-md-6 text-right" },
					self.votesForMap(map),
					" Votes ",
					voteButton
				)
			);
		});
		return React.createElement(
			"div",
			{ className: "panel panel-default" },
			React.createElement(
				"div",
				{ className: "panel-heading" },
				"Map Voting"
			),
			React.createElement(
				"table",
				{ className: "table table-condensed table-hover voting-table" },
				maps
			)
		);
	}
});

var Gather = React.createClass({
	displayName: "Gather",

	getDefaultProps: function getDefaultProps() {
		return {
			gather: {
				gatherers: []
			}
		};
	},

	componentDidMount: function componentDidMount() {
		var self = this;
		socket.on("gather:refresh", function (data) {
			return self.setProps(data);
		});
	},

	render: function render() {
		if (this.props.gather.state === 'done') {
			return React.createElement(CompletedGather, this.props);
		}

		var voting;
		if (this.props.currentGatherer) {
			voting = React.createElement(
				"div",
				{ className: "panel-body" },
				React.createElement(
					"div",
					{ className: "row" },
					React.createElement(
						"div",
						{ className: "col-md-6" },
						React.createElement(MapVoting, this.props)
					),
					React.createElement(
						"div",
						{ className: "col-md-6" },
						React.createElement(ServerVoting, this.props)
					)
				)
			);
		}

		var gatherTeams;
		if (this.props.gather.state === 'selection') {
			gatherTeams = React.createElement(GatherTeams, { gather: this.props.gather });
		}

		var previousGather;
		if (this.props.previousGather) {
			previousGather = React.createElement(CompletedGather, _extends({}, this.props, { gather: this.props.previousGather }));
		}
		return React.createElement(
			"div",
			null,
			React.createElement(
				"div",
				{ className: "panel panel-default" },
				React.createElement(
					"div",
					{ className: "panel-heading" },
					React.createElement(
						"strong",
						null,
						"Current Gather"
					),
					React.createElement(
						"span",
						{ className: "badge add-left" },
						this.props.gather.gatherers.length
					)
				),
				React.createElement(GatherProgress, this.props),
				React.createElement(Gatherers, this.props),
				gatherTeams,
				voting,
				React.createElement(GatherActions, this.props)
			),
			previousGather
		);
	}
});

var Gatherers = React.createClass({
	displayName: "Gatherers",

	joinGather: function joinGather(e) {
		e.preventDefault();
		socket.emit("gather:join");
	},

	render: function render() {
		var self = this;
		var gatherers = this.props.gather.gatherers.map(function (gatherer) {

			// Country
			var country;

			if (gatherer.user.country) {
				country = React.createElement("img", { src: "images/blank.gif",
					className: "flag flag-" + gatherer.user.country.toLowerCase(),
					alt: gatherer.user.country });
			};

			var division = React.createElement(
				"span",
				{ className: "label label-primary" },
				gatherer.user.ability.division
			);
			var lifeform = gatherer.user.ability.lifeforms.map(function (lifeform) {
				return React.createElement(
					"span",
					{ className: "label label-default",
						key: [lifeform, gatherer.id].join("-") },
					lifeform
				);
			});
			var team;

			if (gatherer.user.team) {
				team = React.createElement(
					"span",
					{ className: "label label-primary" },
					gatherer.user.team.name
				);
			}

			var action;

			if (self.props.gather.state === "election") {
				var votes = self.props.gather.gatherers.reduce(function (acc, voter) {
					if (voter.leaderVote === gatherer.id) acc++;
					return acc;
				}, 0);
				action = React.createElement(
					"span",
					null,
					React.createElement(
						"small",
						null,
						votes + " votes",
						"  "
					),
					React.createElement(VoteButton, { currentGatherer: self.props.currentGatherer, candidate: gatherer })
				);
			}

			if (self.props.gather.state === 'selection') {
				if (self.props.currentGatherer && self.props.currentGatherer.leader) {
					action = React.createElement(
						"span",
						null,
						React.createElement(SelectPlayerButton, { gatherer: gatherer })
					);
				} else {
					if (gatherer.team !== "lobby") {
						action = React.createElement(
							"span",
							{ className: "label label-success" },
							gatherer.team
						);
					}
				}
			}

			return React.createElement(
				"tr",
				{ key: gatherer.user.id },
				React.createElement(
					"td",
					{ className: "col-md-5" },
					country,
					" ",
					gatherer.user.username,
					"  (",
					gatherer.user.id,
					")"
				),
				React.createElement(
					"td",
					{ className: "col-md-5" },
					lifeform,
					" ",
					division,
					" ",
					team,
					" "
				),
				React.createElement(
					"td",
					{ className: "col-md-2 text-right" },
					action,
					" "
				)
			);
		});
		if (this.props.gather.gatherers.length) {
			return React.createElement(
				"div",
				{ className: "panel-body" },
				React.createElement(
					"div",
					{ className: "panel panel-default" },
					React.createElement(
						"table",
						{ className: "table roster-table" },
						React.createElement(
							"tbody",
							null,
							gatherers
						)
					)
				)
			);
		} else {
			return React.createElement(
				"div",
				{ className: "panel-body text-center join-hero" },
				React.createElement(
					"button",
					{
						onClick: this.joinGather,
						className: "btn btn-success btn-lg" },
					"Start a Gather"
				)
			);
		}
	}
});

var CompletedGather = React.createClass({
	displayName: "CompletedGather",

	countVotes: function countVotes(voteType) {
		return this.props.gather.gatherers.reduce(function (acc, gatherer) {
			if (gatherer[voteType] !== null) acc.push(gatherer[voteType]);
			return acc;
		}, []);
	},

	selectedMaps: function selectedMaps() {
		return rankVotes(this.countVotes('mapVote'), this.props.maps).slice(0, 2);
	},

	selectedServer: function selectedServer() {
		return rankVotes(this.countVotes('serverVote'), this.props.servers).slice(0, 1);
	},

	render: function render() {
		var maps = this.selectedMaps();
		var server = this.selectedServer().pop();
		return React.createElement(
			"div",
			{ className: "panel panel-default" },
			React.createElement(
				"div",
				{ className: "panel-heading" },
				React.createElement(
					"strong",
					null,
					"Previous Gather"
				)
			),
			React.createElement(GatherTeams, { gather: this.props.gather }),
			React.createElement(
				"div",
				{ className: "panel-body" },
				React.createElement(
					"dl",
					{ className: "dl-horizontal" },
					React.createElement(
						"dt",
						null,
						"Maps"
					),
					React.createElement(
						"dd",
						null,
						maps.map(function (map) {
							return map.name;
						}).join(" & ")
					),
					React.createElement(
						"dt",
						null,
						"Server"
					),
					React.createElement(
						"dd",
						null,
						server.name
					),
					React.createElement(
						"dt",
						null,
						"Address"
					),
					React.createElement(
						"dd",
						null,
						server.ip,
						":",
						server.port
					),
					React.createElement(
						"dt",
						null,
						"Password"
					),
					React.createElement(
						"dd",
						null,
						server.password
					),
					React.createElement("br", null),
					React.createElement(
						"dt",
						null,
						" "
					),
					React.createElement(
						"dd",
						null,
						React.createElement(
							"a",
							{ href: ["steam://run/4920/connect", server.ip + ":" + server.port, server.password].join("/"),
								className: "btn btn-primary" },
							"Click to Join"
						)
					)
				)
			)
		);
	}
});

"use strict";

var socket;

function initialiseVisibilityMonitoring(socket) {
	var hidden, visibilityChange;
	if (typeof document.hidden !== "undefined") {
		// Opera 12.10 and Firefox 18 and later support
		hidden = "hidden";
		visibilityChange = "visibilitychange";
	} else if (typeof document.mozHidden !== "undefined") {
		hidden = "mozHidden";
		visibilityChange = "mozvisibilitychange";
	} else if (typeof document.msHidden !== "undefined") {
		hidden = "msHidden";
		visibilityChange = "msvisibilitychange";
	} else if (typeof document.webkitHidden !== "undefined") {
		hidden = "webkitHidden";
		visibilityChange = "webkitvisibilitychange";
	}

	document.addEventListener(visibilityChange, function () {
		if (document[hidden]) {
			socket.emit("users:away");
		} else {
			socket.emit("users:online");
		}
	}, false);
}

function initialiseComponents() {
	var socketUrl = window.location.protocol + "//" + window.location.host;
	socket = io(socketUrl).on("connect", function () {
		console.log("Connected");
	}).on("reconnect", function () {
		console.log("Reconnected");
	}).on("disconnect", function () {
		console.log("Disconnected");
	});

	initialiseVisibilityMonitoring(socket);

	// Render Page
	React.render(React.createElement(UserMenu, null), document.getElementById('side-menu'));
	React.render(React.createElement(Chatroom, null), document.getElementById('chatroom'));
	React.render(React.createElement(Gather, null), document.getElementById('gathers'));
	React.render(React.createElement(CurrentUser, null), document.getElementById('currentuser'));
	React.render(React.createElement(AdminPanel, null), document.getElementById('admin-menu'));
};

"use strict";

var Chatroom = React.createClass({
	displayName: "Chatroom",

	getDefaultProps: function getDefaultProps() {
		return {
			history: []
		};
	},
	componentDidMount: function componentDidMount() {
		var self = this;
		var TIMER_INTERVAL = 5000; // Every minute

		socket.on("message:new", function (data) {
			var history = self.props.history;
			history.push(data);
			self.setProps({
				history: history
			});
			self.scrollToBottom();
		});

		// Message History Retrieved
		socket.on("message:refresh", function (data) {
			self.setProps({
				history: data.chatHistory
			});
			self.scrollToBottom();
		});

		socket.emit("message:refresh", {});

		self.timer = setInterval(function () {
			self.forceUpdate();
		}, TIMER_INTERVAL);
	},

	componentDidUnmount: function componentDidUnmount() {
		clearInterval(this.timer);
	},
	sendMessage: function sendMessage(message) {
		socket.emit("newMessage", { message: message });
	},
	scrollToBottom: function scrollToBottom() {
		var node = React.findDOMNode(this.refs.messageContainer);
		node.scrollTop = node.scrollHeight;
	},
	render: function render() {
		var messages = this.props.history.map(function (message) {
			return React.createElement(ChatMessage, {
				message: message,
				key: message.id });
		});
		return React.createElement(
			"div",
			{ className: "panel panel-default" },
			React.createElement(
				"div",
				{ className: "panel-heading" },
				"Gather Chat"
			),
			React.createElement(
				"div",
				{ className: "panel-body" },
				React.createElement(
					"ul",
					{ className: "chat", id: "chatmessages", ref: "messageContainer" },
					messages
				)
			),
			React.createElement(
				"div",
				{ className: "panel-footer" },
				React.createElement(MessageBar, null)
			)
		);
	}
});

var updateMessageCallbacks = [];

var timer = setInterval(function () {
	updateMessageCallbacks.forEach(function (callback) {
		callback();
	});
}, 60000);

var ChatMessage = React.createClass({
	displayName: "ChatMessage",

	componentDidMount: function componentDidMount() {
		var self = this;
		updateMessageCallbacks.push(function () {
			self.forceUpdate();
		});
	},
	render: function render() {
		return React.createElement(
			"li",
			{ className: "left clearfix" },
			React.createElement(
				"span",
				{ className: "chat-img pull-left" },
				React.createElement("img", {
					src: this.props.message.author.avatar,
					alt: "User Avatar",
					height: "40",
					width: "40",
					className: "img-circle" })
			),
			React.createElement(
				"div",
				{ className: "chat-body clearfix" },
				React.createElement(
					"div",
					{ className: "header" },
					React.createElement(
						"strong",
						{ className: "primary-font" },
						this.props.message.author.username
					),
					React.createElement(
						"small",
						{ className: "pull-right text-muted" },
						React.createElement("i", { className: "fa fa-clock-o fa-fw" }),
						" ",
						$.timeago(this.props.message.createdAt)
					)
				),
				React.createElement(
					"p",
					null,
					this.props.message.content
				)
			)
		);
	}
});

var MessageBar = React.createClass({
	displayName: "MessageBar",

	sendMessage: function sendMessage(content) {
		socket.emit("message:new", {
			content: content
		});
	},
	handleSubmit: function handleSubmit(e) {
		e.preventDefault();
		var content = React.findDOMNode(this.refs.content).value.trim();
		if (!content) return;
		React.findDOMNode(this.refs.content).value = '';
		this.sendMessage(content);
		return;
	},
	render: function render() {
		return React.createElement(
			"form",
			{ onSubmit: this.handleSubmit },
			React.createElement(
				"div",
				{ className: "input-group" },
				React.createElement("input", {
					id: "btn-input",
					type: "text",
					className: "form-control",
					ref: "content",
					placeholder: "Be polite please..." }),
				React.createElement(
					"span",
					{ className: "input-group-btn" },
					React.createElement("input", {
						type: "submit",
						className: "btn btn-primary",
						id: "btn-chat",
						value: "Send" })
				)
			)
		);
	}
});

"use strict";

var UserLogin = React.createClass({
	displayName: "UserLogin",

	authorizeId: function authorizeId(id) {
		socket.emit("users:authorize", {
			id: parseInt(id, 10)
		});
		setTimeout(function () {
			socket.emit("gather:refresh");
		}, 1000);
	},
	handleSubmit: function handleSubmit(e) {
		e.preventDefault();
		var id = React.findDOMNode(this.refs.authorize_id).value.trim();
		if (!id) return;
		React.findDOMNode(this.refs.authorize_id).value = '';
		this.authorizeId(id);
	},
	render: function render() {
		return React.createElement(
			"form",
			{ onSubmit: this.handleSubmit },
			React.createElement(
				"div",
				{ className: "input-group signin" },
				React.createElement("input", {
					id: "btn-input",
					type: "text",
					className: "form-control",
					ref: "authorize_id",
					placeholder: "Choose an ID..." }),
				React.createElement(
					"span",
					{ className: "input-group-btn" },
					React.createElement("input", {
						type: "submit",
						className: "btn btn-primary",
						id: "btn-chat",
						value: "Login" })
				)
			),
			React.createElement(
				"div",
				{ className: "signin" },
				React.createElement(
					"p",
					{ className: "text-center" },
					React.createElement(
						"small",
						null,
						"Just a temporary measure until genuine authentication is implemented"
					)
				)
			)
		);
	}
});

var UserMenu = React.createClass({
	displayName: "UserMenu",

	getDefaultProps: function getDefaultProps() {
		return {
			users: []
		};
	},
	componentDidMount: function componentDidMount() {
		var self = this;
		socket.on('users:update', function (data) {
			self.setProps({
				users: data.users
			});
		});
	},
	render: function render() {
		var users = this.props.users.map(function (user) {
			return React.createElement(
				"li",
				{ key: user.id },
				React.createElement(
					"a",
					{ href: "#" },
					user.username
				)
			);
		});
		return React.createElement(
			"ul",
			{ className: "nav", id: "side-menu" },
			React.createElement(
				"li",
				null,
				React.createElement(
					"a",
					{ href: "#" },
					React.createElement("i", { className: "fa fa-users fa-fw" }),
					" Online",
					React.createElement(
						"span",
						{ className: "badge add-left" },
						" ",
						this.props.users.length,
						" "
					)
				)
			),
			users,
			React.createElement(
				"li",
				null,
				React.createElement("br", null),
				React.createElement(UserLogin, null),
				React.createElement("br", null)
			)
		);
	}
});

var AdminPanel = React.createClass({
	displayName: "AdminPanel",

	handleGatherReset: function handleGatherReset() {
		socket.emit("gather:reset");
	},
	render: function render() {
		return React.createElement(
			"ul",
			{ className: "nav", id: "admin-menu" },
			React.createElement(
				"li",
				null,
				React.createElement(
					"div",
					{ className: "admin-panel" },
					React.createElement(
						"h5",
						null,
						"Admin"
					),
					React.createElement(
						"button",
						{
							className: "btn btn-danger max-width",
							onClick: this.handleGatherReset },
						"Reset Gather"
					),
					React.createElement(
						"p",
						{ className: "text-center add-top" },
						React.createElement(
							"small",
							null,
							"Only responds for admins on staging.ensl.org"
						)
					)
				)
			)
		);
	}
});

var CurrentUser = React.createClass({
	displayName: "CurrentUser",

	componentDidMount: function componentDidMount() {
		var self = this;
		socket.on("users:update", function (data) {
			self.setProps({
				user: data.currentUser
			});
		});
		socket.emit("users:refresh");
	},
	render: function render() {
		if (this.props.user) {
			return React.createElement(
				"li",
				{ className: "dropdown" },
				React.createElement(
					"a",
					{ className: "dropdown-toggle", "data-toggle": "dropdown", href: "#" },
					this.props.user.username,
					"  ",
					React.createElement("img", { src: this.props.user.avatar,
						alt: "User Avatar",
						height: "20",
						width: "20" }),
					" ",
					React.createElement("i", { className: "fa fa-caret-down" })
				),
				React.createElement(
					"ul",
					{ className: "dropdown-menu dropdown-user" },
					React.createElement(
						"li",
						null,
						React.createElement(
							"a",
							{ href: "#" },
							React.createElement("i", { className: "fa fa-gear fa-fw" }),
							" Profile"
						)
					),
					React.createElement(
						"li",
						null,
						React.createElement(
							"a",
							{ href: "#" },
							React.createElement("i", { className: "fa fa-flag fa-fw" }),
							" Notifications"
						)
					),
					React.createElement(
						"li",
						null,
						React.createElement(
							"a",
							{ href: "#" },
							React.createElement("i", { className: "fa fa-music fa-fw" }),
							" Sounds"
						)
					),
					React.createElement(
						"li",
						null,
						React.createElement(
							"a",
							{ href: "#", "data-toggle": "modal", "data-target": "#designmodal" },
							"Design Goals"
						)
					),
					React.createElement("li", { className: "divider" }),
					React.createElement(
						"li",
						null,
						React.createElement(
							"a",
							{ href: "login.html" },
							React.createElement("i", { className: "fa fa-sign-out fa-fw" }),
							" Logout"
						)
					)
				)
			);
		} else {
			return false;
		}
	}
});