diff options
| author | anonymous | 2023-02-01 19:59:23 -0500 |
|---|---|---|
| committer | anonymous | 2023-02-01 19:59:23 -0500 |
| commit | a2cc33b1de416bef592ecf25816f17017e62fe8e (patch) | |
| tree | 473b7922b8ed1a549a41c41393ee2b7ac8137ece /index.html | |
| parent | df56330d7f0e1716b4a203d2cac811b0986667ca (diff) | |
minor changes
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 84 |
1 files changed, 84 insertions, 0 deletions
diff --git a/index.html b/index.html new file mode 100644 index 0000000..e3c2dc0 --- /dev/null +++ b/index.html @@ -0,0 +1,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> |