Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
<!DOCTYPE HTML>
<html>
<head>
<script src="sharedworker.multi-connect.renderer.js"></script>
</head>
<body>
<pre id="shared-worker-log"></pre>
<pre id="shared-worker-connection-log"></pre>
</body>
</html>
<!DOCTYPE HTML>
<html>
<head>
<title>SharedWorker: Multiple Connections</title>
<script src="sharedworker.multi-connect.renderer.js"></script>
</head>
<body>
<pre id="shared-worker-log"></pre>
<iframe style="width:100%" src="sharedworker.multi-connect-inner.html"></iframe>
<pre id="shared-worker-connection-log"></pre>
</body>
</html>
document.addEventListener('DOMContentLoaded', function () {
var SW = {
worker: (function () {
// CREATE SHARED WORKER AND RETURN IT
return new SharedWorker('sharedworker.multi-connect.worker.js');
})(),
logTo: document.getElementById('shared-worker-log'),
reportTo: document.getElementById('shared-worker-connection-log')
};
// REFLECT SW OBJECT
console.log(SW);
// LISTEN ON THE SHAREDWORKER'S PORT FOR NEW MESSAGES
SW.worker.port.addEventListener('message', function(event) {
// INITIAL CONNECTION
if ( event.data.connected ) {
var workerLog = 'ConnectionId #' + event.data.connectionId +
' ' + event.data.pathName +
' - Connected: ' + event.data.connected ;
// APPEND TO LOG FIELD
SW.logTo.textContent += "\n" + workerLog;
return;
}
// REPORTED CONNECTION ID #
if ( event.data.connectionId ) {
console.log( event.data.connectionId );
}
// REPORTING CONNECTIONS TO SHARED WORKER
if ( event.data.connections ) {
var connectionPaths = event.data.connections;
console.log('Total Connections: ' + connectionPaths.length);
for ( var id in connectionPaths ) {
if ( id !== 'length' ) {
var connectionLog = '#' + id + ' ' + connectionPaths[id];
// WRITE TO CONSOLE
console.log( connectionLog );
// APPEND TO REPORT FIELD
SW.reportTo.textContent += "\n" + connectionLog;
}
}
return;
}
}, false);
// START THE CONNECTION TO SHAREDWORKER
// REQUIRED WHEN USING "addEventListener()"
SW.worker.port.start();
// FIRE CONNECTING MESSAGE TO SHAREDWORKER
SW.worker.port.postMessage({
'pathName': location.pathname,
'connected' : false
});
}, false);
var Connection = {
count: 0,
isConnected: false,
paths: {
length: 0
}
};
self.addEventListener('connect', function (event) {
var port = event.ports[0];
port.addEventListener('message', function (event) {
// INCREMENT CONNECTION COUNT
Connection.count++;
// REPLY TO RENDERER, CONFIRMING CONNECTION
port.postMessage({
'connectionId' : Connection.count
});
// STORE A REF TO THE CONNECTING RENDERER PAGE
Connection.paths[Connection.count] = event.data.pathName;
Connection.paths.length++;
// UPDATE CONNECTION TO TRUE
event.data.connected = true;
// UPDATE WITH THIS CONNECTION ID
event.data.connectionId = Connection.count;
// REPLY TO RENDERER
port.postMessage(event.data);
}, false);
// REQUIRES `start()` WHEN USING
// `addEventListener` SYNTAX
port.start();
// REPORT CONNECTIONS
setTimeout(function () {
port.postMessage({
'connections' : Connection.paths
});
}, 1000);
}, false);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment