Skip to content

Commit 1b26b88

Browse files
KinanBabKinanBab
committed
Add web worker
1 parent 8d7fe4a commit 1b26b88

16 files changed

+187
-149
lines changed

‎demo/client.html

Lines changed: 8 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -70,67 +70,20 @@ <h3 style="margin-top: 0em;">Choose your circuit (<a href="https://homes.esat.ku
7070
<option value="number">Decimal</option>
7171
<option value="bits">Binary</option>
7272
<option value="hex">Hexidecimal</option>
73-
</select>&nbsp;<input id="input" onkeyup="countbits()" autocomplete="off" style="margin-top: 1em; margin-bottom: 0.5em; font-family: monospace; width: 40em;" value="">
73+
</select>&nbsp;<input id="input" onkeyup="countbits()" autocomplete="off" style="margin-top: 1em; margin-bottom: 0.5em; font-family: monospace; width: 40em;">
7474
<button id="button" onclick="start()">Compute</button>
7575
<br>
7676
<pre id="bitsCount">Entered 0 bits</pre><br>
7777
<div id="results"></div>
7878
</body>
7979

80+
<script type="text/javascript" src="client/client.js"></script>
8081
<script type="text/javascript">
81-
const getCircuit = function () {
82-
return $.ajax('/circuits/bristol/' + $('#circuit').val());
83-
};
84-
const countbits = function () {
85-
const input = $('#input').val();
86-
const base = $('#base').val();
87-
88-
let count = input.length;
89-
if (base === 'hex') {
90-
count *= 4;
91-
}
92-
if (base === 'number') {
93-
count = Number(input).toString(2).length;
94-
}
95-
96-
$('#bitsCount').text('Entered ' + count + ' bits');
97-
};
98-
const progress = function (status, start, total, error) {
99-
if (status === 'error') {
100-
document.getElementById('results').innerHTML += '<h3 style="color: red;">' + error.toString() + '</h3>';
101-
console.log(error);
102-
return;
103-
}
104-
if (status === 'garbling' || status === 'evaluating') {
105-
document.getElementById('results').innerHTML += '<h4>' + status + ': ' + start + '/' + total + '</h4>';
106-
return;
107-
}
108-
document.getElementById('results').innerHTML += '<h4>' + status + '</h4>';
109-
};
110-
const start = function () {
111-
const role = $('#partytype').val();
112-
const base = $('#base').val();
113-
114-
let input = $('#input').val();
115-
if (base === 'bits') {
116-
input = input.split('').map(Number).reverse();
117-
} else if (base === 'number') {
118-
input = Number(input);
119-
}
120-
121-
getCircuit().then(function (circuit) {
122-
const agent = new JIGG(role);
123-
agent.addProgressListener(progress);
124-
agent.loadCircuit(circuit);
125-
agent.setInput(input, base);
126-
agent.getOutput(base).then(function (output) {
127-
if (base === 'bits') {
128-
output = output.reverse().join('');
129-
}
130-
document.getElementById('results').innerHTML = '<h3 style="color: green;">Results: ' + output + '</h3>';
131-
});
132-
agent.start();
133-
});
134-
};
82+
if (window.Worker) {
83+
document.getElementById('results').innerHTML += '<h4>Web Workers are supported on your browser! Circuits will evaluate in the background</h4>';
84+
} else {
85+
document.getElementById('results').innerHTML += '<h4>Web Workers are not supported on your browser! Circuits will evaluate in the foreground.' +
86+
'The webpage may become irresponsive for a few seconds with large circuits.</h4>';
87+
}
13588
</script>
13689
</html>

‎demo/client/client.js

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
/* global JIGG */
2+
let timeStart;
3+
4+
const getCircuit = function () {
5+
return $.ajax('/circuits/bristol/' + $('#circuit').val());
6+
};
7+
const countbits = function () {
8+
const input = $('#input').val();
9+
const base = $('#base').val();
10+
11+
let count = input.length;
12+
if (base === 'hex') {
13+
count *= 4;
14+
}
15+
if (base === 'number') {
16+
count = Number(input).toString(2).length;
17+
}
18+
19+
$('#bitsCount').text('Entered ' + count + ' bits');
20+
};
21+
22+
const progress = function (status, start, total, error) {
23+
if (status === 'connected') {
24+
timeStart = new Date().getTime();
25+
}
26+
if (status === 'error') {
27+
document.getElementById('results').innerHTML += '<h3 style="color: red;">' + error.toString() + '</h3>';
28+
console.log(error);
29+
return;
30+
}
31+
if (status === 'garbling' || status === 'evaluating') {
32+
document.getElementById('results').innerHTML += '<h4>' + status + ': ' + start + '/' + total + '</h4>';
33+
return;
34+
}
35+
document.getElementById('results').innerHTML += '<h4>' + status + '</h4>';
36+
};
37+
const displayOutput = function (output) {
38+
const timeEnd = new Date().getTime();
39+
const time = (timeEnd - timeStart) / 1000;
40+
41+
const base = $('#base').val();
42+
if (base === 'bits') {
43+
output = output.reverse().join('');
44+
}
45+
document.getElementById('results').innerHTML += '<h3 style="color: green;">Results: ' + output + ' &nbsp;&nbsp;&nbsp; Took: ' + time + 'ms</h3>';
46+
};
47+
48+
const start = function () {
49+
getCircuit().then(function (circuit) {
50+
const role = $('#partytype').val();
51+
const base = $('#base').val();
52+
53+
let input = $('#input').val();
54+
if (base === 'bits') {
55+
input = input.split('').map(Number).reverse();
56+
} else if (base === 'number') {
57+
input = Number(input);
58+
}
59+
60+
if (window.Worker) {
61+
const worker = new Worker('client/worker.js');
62+
worker.postMessage({role: role, circuit: circuit, input: input, base: base});
63+
worker.onmessage = function (e) {
64+
if (e.data.type === 'progress') {
65+
progress.apply(window, e.data.args);
66+
} else {
67+
displayOutput(e.data.args);
68+
}
69+
};
70+
} else {
71+
const agent = new JIGG(role);
72+
agent.addProgressListener(progress);
73+
agent.loadCircuit(circuit);
74+
agent.setInput(input, base);
75+
agent.getOutput(base).then(displayOutput);
76+
agent.start();
77+
}
78+
});
79+
};

‎demo/client/worker.js

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
/* global JIGG importScripts */
2+
importScripts('/dist/jigg.js');
3+
4+
onmessage = function (e) {
5+
const role = e.data.role;
6+
const circuit = e.data.circuit;
7+
const input = e.data.input;
8+
const base = e.data.base;
9+
10+
const agent = new JIGG(role);
11+
agent.loadCircuit(circuit);
12+
agent.setInput(input, base);
13+
14+
agent.addProgressListener(function (status, start, total, error) {
15+
postMessage({type: 'progress', args: [status, start, total, error]});
16+
});
17+
18+
agent.getOutput(base).then(function (output) {
19+
postMessage({type: 'output', args: output});
20+
});
21+
22+
agent.start();
23+
};

‎demo/party.js

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -30,12 +30,15 @@ const circuitPath = __dirname + '/../circuits/bristol/' + circuitName;
3030
const circuit = fs.readFileSync(circuitPath, 'utf8');
3131

3232
// Application code.
33-
console.time('time');
34-
3533
const agent = new JIGG.Client(role, 'http://localhost:' + port, {debug: debug});
3634
agent.loadCircuit(circuit);
3735
agent.setInput(input, encoding);
38-
agent.start();
36+
37+
agent.addProgressListener(function (status) {
38+
if (status === 'connected') {
39+
console.time('time');
40+
}
41+
});
3942

4043
agent.getOutput(encoding).then(function (output) {
4144
if (debug) {
@@ -45,3 +48,5 @@ agent.getOutput(encoding).then(function (output) {
4548
console.log(output);
4649
agent.disconnect();
4750
});
51+
52+
agent.start();

‎demo/server.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ const httpServer = http.createServer(app);
99

1010
// Static routes
1111
app.get('/', (request, response) => response.sendFile(__dirname + '/client.html'));
12+
app.use('/client', express.static(__dirname + '/client/'));
1213
app.use('/dist', express.static(__dirname + '/../dist/'));
1314
app.use('/circuits', express.static(__dirname + '/../circuits/'));
1415

0 commit comments

Comments
 (0)