Page 536 - Nodejs 교과서 개정2판

socket.on('newRoom', function (data) { // 새 방 이벤트 시 새 방 생성
const tr = document.createElement('tr');
let td = document.createElement('td');
td.textContent = data.title;
tr.appendChild(td);
td = document.createElement('td');
td.textContent = data.password ? '비밀방' : '공개방';
tr.appendChild(td);
td = document.createElement('td');
td.textContent = data.max;
tr.appendChild(td);
td = document.createElement('td');
td.style.color = data.owner;
td.textContent = data.owner;
tr.appendChild(td);
td = document.createElement('td');
const button = document.createElement('button');
button.textContent = '입장';
button.dataset.password = data.password ? 'true' : 'false';
button.dataset.id = data._id;
button.addEventListener('click', addBtnEvent);
td.appendChild(button);
tr.appendChild(td);
tr.dataset.id = data._id;
document.querySelector('table tbody').appendChild(tr); // 화면에 추가
});

socket.on('removeRoom', function (data) { // 방 제거 이벤트 시 id가 일치하는 방 제거
document.querySelectorAll('tbody tr').forEach(function (tr) {
if (tr.dataset.id === data) {
tr.parentNode.removeChild(tr);
}
});
});

function addBtnEvent(e) { // 방 입장 클릭 시
if (e.target.dataset.password === 'true') {
const password = prompt('비밀번호를 입력하세요');
location.href = '/room/' + e.target.dataset.id + '?password=' + password;
} else {
location.href = '/room/' + e.target.dataset.id;
}
}

document.querySelectorAll('.join-btn').forEach(function (btn) {