-
Notifications
You must be signed in to change notification settings - Fork 27
/
index.html
50 lines (47 loc) · 1.75 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
---
layout: example
permalink: /examples/pointer/
exampleId: pointer
stylesheets:
- /examples/pointer/pointer.css
overview: |-
This example demonstrates using an Convergence Activity to share mouse pointer locations
within an element. The pointer location is synchronized across all clients. Mouse clicks
are also shared and rendered as a ripple animation.
---
<nav class="navbar navbar-light">
<a class="navbar-brand">Activity Control</a>
<form class="form-inline">
<button class="btn btn-sm btn-primary" type="button" id="joinButton" onclick="joinActivity()" disabled="disabled">Join</button>
<button class="btn btn-sm btn-primary" type="button" id="leaveButton" onclick="leaveActivity()" disabled="disabled">Leave</button>
</form>
</nav>
<div id="pointer-content">
<div id="cursors">
<div id="titleBar">Move Mouse In Box Below</div>
<div id="cursorBox" onmousemove="mouseMoved(event)" onclick="mouseClicked(event)" onmouseleave="mouseOut(event)"></div>
<div id="statusBar">
<span class="label">Local User: </span><span id="localUser"></span>
<br />
<span class="label">Local Mouse Location: </span><span id="localMouse"> (none)</span>
</div>
</div>
<div id="sessions">
<div id="rightTitle">Mouse Locations</div>
<table id="mouseLocationsTable">
<thead>
<th>User</th>
<th>Mouse Location</th>
<th>FPS</th>
</thead>
<tbody id="mouseLocations">
</tbody>
</table>
</div>
</div>
<script src="/libs/jquery/dist/jquery.slim.min.js"></script>
<!-- Convergence resources -->
<script src="/config.js"></script>
<script src="/libs/rxjs/bundles/rxjs.umd.min.js"></script>
<script src="/libs/@convergence/convergence/convergence.global.js"></script>
<script src="pointer.js"></script>