-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
96 lines (78 loc) · 2.7 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
<!DOCTYPE html>
<head>
<meta name='viewport' content='width=device-width, initial-scale=1.0, user-scalable=0'>
</head>
<html>
<body style="padding-left: 20px; padding-right: 24px; margin: 0; padding-bottom: 20px;">
<h2>Zencode with id="z-zencode" (<a href="https://dev.zenroom.org/#/pages/zencode-cookbook-intro"
target="_blank">link to docs</a>) :</h2>
<textarea rows="10" id="z-zencode" style="width: 100%;">
Scenario 'ecdh': Encrypt a message with the password
Given that I have a 'string' named 'password'
Given that I have a 'string' named 'header'
Given that I have a 'string' named 'message'
When I encrypt the secret message 'message' with 'password'
Then print the 'secret message'
</textarea>
<h2>Keys with id="z-keys":</h2>
<textarea rows="6" cols="50" id="z-keys" style="width: 100%;">
{
"password": "myVerySecretPassword"
}
</textarea>
<h2>Data with id="z-keys":</h2>
<textarea rows="6" id="z-data" style="width: 100%;">
{
"header": "A very important secret",
"message": "Dear Bob, your name is too short, goodbye - Alice."
}
</textarea>
<div style="margin-top: 20px;">
<button id="runBtn" style="font-size: 18px; margin-right: 20px;">Run!</button>
<button id="storeBtn" style="font-size: 18px;">Store in browser</button>
</div>
<div style="width: 100%;">
<h2>Result:</h2>
<div style="width: 100%; overflow: scroll; padding-bottom: 20px;">
<pre id="result"></pre>
</div>
<br />
<hr /> <br />
<pre id="logs" style="color:indianred;"></pre>
</div>
<script type="module">
import zenroom from 'https://jspm.dev/zenroom@next';
document.getElementById("runBtn").addEventListener("click", function () {
document.getElementById("result").textContent = '';
document.getElementById("logs").textContent = '';
var zencode = document.getElementById("z-zencode").value;
var keys = document.getElementById("z-keys").value;
var data = document.getElementById("z-data").value;
const props = {
script: zencode,
keys: keys,
data: data,
print_err: (text) => {
let result = document.getElementById("logs");
result.textContent += text
},
print: (text) => {
let result = document.getElementById("result");
result.textContent += text
}
}
zenroom.init(props).zencode_exec();
});
document.getElementById("storeBtn").addEventListener("click", function () {
var result = document.getElementById("result").textContent;
if (result) {
var item = localStorage.getItem('savedItems') ? parseInt(localStorage.getItem('savedItems')) + 1 : 1;
var itemNumber = toString(item);
var itemName = result;
localStorage.setItem('savedItems', item);
localStorage.setItem(item, itemName);
}
});
</script>
</body>
</html>