hw-js-06/websockets/public/chat.js

// Make connection
var socket = io.connect('http://localhost:4000');

// Query DOM
var message = document.getElementById('message'),
	nickName = document.getElementById('nick'),
	btn = document.getElementById('send'),
	output = document.getElementById('output'),
	feedback = document.getElementById('feedback');

// Emit events
btn.addEventListener('click', function () {
	socket.emit('chat', {
		message: message.value,
		nickName: nickName.value,
	});
	const youTubeReg =
		'(?:.+?)?(?:/v/|watch/|?v=|&v=|youtu.be/|/v=|^youtu.be/)([a-zA-Z0-9_-]{11})+';

	console.log(message.matches(youTubeReg));
	message.value = '';
});

message.addEventListener('keypress', function () {
	socket.emit('typing', nickName.value);
});

// Listen for events
socket.on('chat', function (data) {
	feedback.innerHTML = '';
	output.innerHTML +=
		'<p><strong>' + data.nickName + ': </strong>' + data.message + '</p>';
});

socket.on('typing', function (data) {
	feedback.innerHTML = '<p><em>' + data + ' is typing a message...</em></p>';
});