blob: e3c2dc0739bd8fbfb10ba44df552c24c6c93b76d (
plain)
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
|
<!DOCTYPE html>
<html>
<body>
<h1> Graffiti x JS </h1>
<p id="ID"></p>
<h2 id="status"></h2>
<button onclick="Subscribe()">
Subscribe
</button>
<button onclick="Unsubscribe()">
Unsubscribe
</button>
<button onclick="Update()">
Update
</button>
<button onclick="Remove()">
Remove
</button>
<button onclick="LogOut()">
Log Out
</button>
<script type="module">
import Graffiti from "./graffiti.js"
// Connect to a local Graffiti instance
// (see the server README for how to n locally)
window.graffiti = new Graffiti("http://localhost:5001")
await graffiti.opened()
// Log in automatically if not already
// and supply a log out button
if (!graffiti.myID) graffiti.toggleLogIn()
window.LogOut = ()=> graffiti.toggleLogIn()
document.getElementById('ID').innerHTML = `Your Graffiti ID is: ${graffiti.myID}`
const myTag = "asdf"
// Make a display
async function displayObjects() {
let display = 'not subscribed'
try {
const objects = graffiti.objectsByTags(myTag)
display = `objects: ${JSON.stringify(objects)}`
} catch {}
document.getElementById('status').innerHTML = display
}
// Create an object containing a special string
window.Subscribe = async function() {
await graffiti.subscribe(myTag)
await new Promise(r => setTimeout(r, 1000));
displayObjects()
}
window.Unsubscribe = async function() {
await graffiti.unsubscribe(myTag)
await new Promise(r => setTimeout(r, 1000));
displayObjects()
}
// Create an object containing a special string
window.Update = async function() {
await graffiti.update({_tags: [myTag]})
displayObjects()
}
// Remove an existing object
window.Remove = async function() {
await graffiti.objectsByTags(myTag)[0]._remove()
displayObjects()
}
</script>
</body>
</html>
|
