socket io tutorial - Handling users accessing modals - socket io android - socket io client
Handling users accessing modals
This example shows how you might handle users interacting with modals on a 1-1 basis.
//client side
function modals(socket) {
this.sendModalOpen = (modalIdentifier) => {
socket.emit('openedModal', {
modal: modalIdentifier
});
};
this.closeModal = () => {
socket.emit('closedModal', {
modal: modalIdentifier
});
};
}
socket.on('recModalInfo', (data) => {
for (let x = 0; x < data.info.length; x++) {
console.log(data.info[x][0] + " has open " + data.info[x][1]);
}
});
//server side
let modal = new Map();
io.on('connection', (socket) => {
//Here we are sending any new connections a list of all current modals being viewed with Identifiers.
//You could send all of the items inside the map() using map.entries
let currentInfo = [];
modal.forEach((value, key) => {
currentInfo.push([key, value]);
});
socket.emit('recModalInfo', {
info: currentInfo
});
socket.on('openedModal', (data) => {
modal.set(socket.id, data.modalIdentifier);
});
socket.on('closedModal', (data) => {
modal.delete(socket.id);
});
});
click below button to copy the code. By Socket tutorial team
By handling all of the modal interactions here all newly connected users will have all information about which ones are currently being viewed allow us to make decisions based on current users within our system.