8. Removing Viewers

In this section we will add a method to our front-end that will allow us to remove WebViewers from the page. Our HTML template is already setup a method called removeViewer to be called with the viewer’s id when it’s Remove button has been clicked.

The implementation for this method is straightforward and can be added just below the createNewViewer method:

function removeViewer(id) {
let viewer = viewerMap.get(id);
if (viewer) {
viewer.shutdown();
$(`#container-${id}`).remove();
viewerMap.delete(id);
}
}

In this method, we simply retrieve the viewer from our map, and call its shutdown method. This will in turn cause the spawned server to signal it’s disconnect message and terminate. We also remove the viewer’s container from the page.

After restarting the Node.js application, you will notice disconnect messages appearing in the terminal when you click the remove button for a viewer on your front-end page.