Admin: Die Seite wurde neu angelegt: „= Erweiterung Chat um Räume = Das bestehende System soll nun ausgebaut werden, um ''Räume'' zu unterstützen. Damit sind mehrere Verbindungen gemeint, welche…“

2018-03-06T21:17:16Z

Die Seite wurde neu angelegt: „= Erweiterung Chat um Räume = Das bestehende System soll nun ausgebaut werden, um ''Räume'' zu unterstützen. Damit sind mehrere Verbindungen gemeint, welche…“

Neue Seite

= Erweiterung Chat um Räume =
Das bestehende System soll nun ausgebaut werden, um ''Räume'' zu unterstützen. Damit sind mehrere Verbindungen gemeint, welche parallel geführt werden können.
Die fertige Anwendung ist [https://pbx.prbox.biz/sipRTC/socketio-rooms.html hier] abrufbar.

Bevor Nachrichten gesendet werden können, muss zuerst ein Raum ausgewählt werden. Pro Raum sind nur zwei Teilnehmer zulässig. Ein dritter Teilnehmer erhält eine Warnung, dass der gewählte Raum schon voll ist.

Teile des Programmcodes stammen von der WebRTC-Demo-Applikation von Lukas Toggenburger.

== Programm-Code ==

=== Serverseitig ===
<syntaxhighlight lang="javascript" line>
var counts = {};

io.on('connection', function(socket) {

socket.on('disconnect', function() {
if (typeof socket.session != "undefined") {
socket.broadcast.to(socket.session).emit('message', {
type : 'leave',
session : socket.session
});
counts[socket.session] = 0;
}
});

socket.on('join', function(session) {
if (typeof counts[session] == "undefined") {
console.log("DEBUG: session = " + session
+ " used for the first time");
counts[session] = 0;
}

var numClients = counts[session];

if (numClients === 0) {
socket.join(session);
socket.session = session;
socket.emit('caller', session);
counts[session]++;
} else if (numClients === 1) {
socket.join(session);
socket.session = session;
socket.emit('callee', session);
counts[session]++;
socket.broadcast.to(session).emit('calleeHasJoined', session);
} else {
socket.emit('full', session);
}

console.log("DEBUG: counts = " + JSON.stringify(counts));
});

socket.on('chat message', function(msg) {
console.log('message: msg = ' + JSON.stringify(msg));
console.log("onmessage: counts = " + JSON.stringify(counts));
socket.broadcast.to(socket.session).emit('chat message', msg);
});

});
</syntaxhighlight>

=== Clientseitig ===
<syntaxhighlight lang="html" line>
<ul id="messages"></ul>

<form action="" id="formJoin">
<input type="text" id="room" size="24" maxlength="24"
value="Kanalnummer"
onblur="if (this.value == '') {this.value = 'Kanalnummer';}"
onfocus="if (this.value == 'Kanalnummer') {this.value = '';}" />
<button id="connectButton">Verbinden</button>
</form>

<form action="" id="formSend">
<input id="m" autocomplete="off" disabled="disabled" />
<button id="sendMessage" disabled="disabled">Senden</button>
</form>

<script>
var isRoomJoined = false;
var socket = io.connect('https://pbx.prbox.biz:3001');
$('#formSend').submit(function() {
socket.emit('chat message', $('#m').val());
$('#m').val('');
return false;
});
$('#formJoin').submit(function() {
joinRoom();
return false;
});
socket.on('chat message', function(msg) {
$('#messages').append($('<li>').text(msg));
});
socket.on('full', function(msg) {
window.alert("Room is already full!");
isRoomJoined = false;
document.getElementById('m').disabled = 'disabled';
document.getElementById('sendMessage').disabled = 'disabled';
});
function joinRoom() {
if (isRoomJoined == false) {
console.log("Raum wird beigetreten...");
isRoomJoined = true;
document.getElementById('m').disabled = false;
document.getElementById('sendMessage').disabled = false;
document.getElementById('room').disabled = 'disabled';
document.getElementById('connectButton').disabled = 'disabled';
socket.emit('join',
document.getElementById('room').value);
}
}
</script>
</syntaxhighlight>

M3 - Versionsgeschichte

Admin: Die Seite wurde neu angelegt: „= Erweiterung Chat um Räume = Das bestehende System soll nun ausgebaut werden, um ''Räume'' zu unterstützen. Damit sind mehrere Verbindungen gemeint, welche…“