forked from y0ast/KinectGame
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtest.html
98 lines (78 loc) · 2.36 KB
/
test.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
97
98
<!DOCTYPE html>
<html>
<head>
<title>User Radar</title>
<!-- <script src='zig.js'></script> -->
<script src='http://cdn.zigfu.com/zigjs/zig.min.js'></script>
<style>
#mycursor {
position: fixed;
display : none;
width : 40px;
height : 40px;
background-color : blue;
}
#mycursor.pushed {
background-color: red;
}
</style>
</head>
<body>
<script>
// Create cursor and cursor dom element
var c = zig.controls.Cursor();
var ce = document.createElement('div');
ce.id = 'mycursor';
document.body.appendChild(ce);
var center = [0,0,0];
function clamp(x, min, max) {
if (x < min) return min;
if (x > max) return max;
return x;
}
// 1. show/hide cursor on session start/end
zig.singleUserSession.addEventListener('sessionstart', function(focusPosition) {
ce.style.display = 'block';
center[0] = focusPosition[0];
center[1] = focusPosition[1];
center[2] = focusPosition[2];
});
zig.singleUserSession.addEventListener('sessionend', function() {
ce.style.display = 'none';
});
zig.singleUserSession.addEventListener('sessionupdate', function(position) {
console.log(position);
var d = $V(position).subtract($V(center)).elements;
var val = [clamp((d[0]/300) + 0.5, 0, 1),
clamp((d[1]/250) + 0.5, 0, 1),
clamp(d[2]/ + 0.5, 0, 1)];
console.log("eigen x " + val[0]);
console.log(1 - val[1]);
});
// 2. move the cursor element on cursor move
c.addEventListener('move', function(cursor) {
console.log(c.x);
console.log(c.y);
ce.style.left = (c.x * window.innerWidth - (ce.offsetWidth / 2)) + "px";
ce.style.top = (c.y * window.innerHeight - (ce.offsetHeight / 2)) + "px";
});
// 3. Add/remove 'pushed' class on cursor push/release
c.addEventListener('push', function(c) {
ce.classList.add('pushed');
});
c.addEventListener('release', function(c) {
ce.classList.remove('pushed');
});
// 4. Simulate mouse click on our virtual cursor
c.addEventListener('click', function(c) {
var xpos = c.x * window.innerWidth;
var ypos = c.y * window.innerHeight;
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window, 1, xpos, ypos, xpos, ypos, false, false, false, false, 0, null);
window.dispatchEvent(evt);
});
// Add cursor to our single user UI session
zig.singleUserSession.addListener(c);
</script>
</body>
</html>