-
Notifications
You must be signed in to change notification settings - Fork 21
Expand file tree
/
Copy pathscroll.html
More file actions
81 lines (67 loc) · 6.14 KB
/
scroll.html
File metadata and controls
81 lines (67 loc) · 6.14 KB
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
<html>
<head>
<script src="javascripts/lib/three.min.js"></script>
<script src="//js.leapmotion.com/leap-0.6.0-beta1.js"></script>
<script src="javascripts/lib/leap-plugins-0.1.3-master.js"></script>
<script src="javascripts/lib/leap.rigged-hand-0.2.0.min.js"></script>
<script src="leap-playback.js"></script>
<style>
body{
font-family: Helvetica;
line-height: 2em;
}
section{
width: 400px;
}
canvas {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
</style>
</head>
<body>
<h1>This page has the rigged hand play back on scroll.</h1>
<section data-playback="brian.json">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi mattis, libero ut congue congue, tortor neque egestas nunc, in malesuada erat nibh ut nulla. Quisque vel luctus mauris. Curabitur sodales urna scelerisque nulla volutpat pharetra. Phasellus pulvinar sem non lacus rhoncus, ut vestibulum lacus pharetra. Phasellus ornare velit in felis rutrum tincidunt. Aliquam fermentum ultricies sapien eu congue. Donec tincidunt sapien sit amet dui condimentum suscipit. Mauris et facilisis leo. Aenean lobortis felis ut condimentum fermentum. Pellentesque eleifend metus justo, vitae pretium ligula dapibus sit amet. Aenean et turpis diam. Nullam congue turpis ac ipsum egestas, at iaculis quam rhoncus. Nulla sed malesuada nulla. Mauris placerat posuere massa, non dictum odio adipiscing eu.
</p>
<p>
Aliquam erat volutpat. Aliquam sit amet ultrices elit, et venenatis lacus. Nulla vitae facilisis ligula. Integer ac tempus nulla, ut eleifend nisl. Curabitur dignissim enim risus, in euismod nisi ultrices et. Donec vitae libero vitae ante ornare faucibus. Aliquam sem nisi, accumsan at ipsum nec, ornare rhoncus arcu. Vivamus libero augue, tristique eu lacus sit amet, posuere malesuada tellus. Praesent faucibus ultrices lacinia. Nam leo nisl, dapibus a feugiat sit amet, aliquet fringilla nunc. Nulla vel quam ac ipsum ultricies congue. Vivamus fringilla ipsum nibh, sed accumsan urna condimentum at.
</p>
<p>
Suspendisse commodo fringilla mauris sit amet tristique. Morbi quis euismod diam, a vestibulum erat. Curabitur sagittis ante ut dictum scelerisque. Vivamus lobortis ut enim id tristique. Vivamus convallis nisi ac dapibus posuere. Donec adipiscing diam mauris, nec interdum turpis mattis quis. Curabitur eu pulvinar risus. Aliquam pellentesque orci id elit ultrices, vitae lobortis massa blandit. Duis consequat mattis nisl, sit amet faucibus diam porta nec.
</p>
<p>
Phasellus commodo blandit ligula nec dignissim. Maecenas mi mauris, convallis at mi ut, ornare volutpat nulla. In sed elit suscipit, convallis augue a, ultricies massa. Vivamus at placerat dui, sagittis cursus libero. Cras non luctus mauris, vitae imperdiet massa. Vivamus mattis, justo vitae pharetra eleifend, nibh nulla lobortis sem, id ultricies lorem augue sollicitudin erat. Vestibulum tortor mi, varius a nisi non, sagittis imperdiet nulla. Nulla sed cursus eros. Morbi ut risus ipsum. Nunc a quam nec odio semper bibendum vel vel dui. Nullam rhoncus tincidunt diam, eget vehicula sapien tincidunt sodales. Proin nec ullamcorper justo. Aliquam eu tortor ac purus rhoncus aliquam.
</p>
</section>
<section data-playback="brian.json" style="background: #ccc;">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi mattis, libero ut congue congue, tortor neque egestas nunc, in malesuada erat nibh ut nulla. Quisque vel luctus mauris. Curabitur sodales urna scelerisque nulla volutpat pharetra. Phasellus pulvinar sem non lacus rhoncus, ut vestibulum lacus pharetra. Phasellus ornare velit in felis rutrum tincidunt. Aliquam fermentum ultricies sapien eu congue. Donec tincidunt sapien sit amet dui condimentum suscipit. Mauris et facilisis leo. Aenean lobortis felis ut condimentum fermentum. Pellentesque eleifend metus justo, vitae pretium ligula dapibus sit amet. Aenean et turpis diam. Nullam congue turpis ac ipsum egestas, at iaculis quam rhoncus. Nulla sed malesuada nulla. Mauris placerat posuere massa, non dictum odio adipiscing eu.
</p>
<p>
Aliquam erat volutpat. Aliquam sit amet ultrices elit, et venenatis lacus. Nulla vitae facilisis ligula. Integer ac tempus nulla, ut eleifend nisl. Curabitur dignissim enim risus, in euismod nisi ultrices et. Donec vitae libero vitae ante ornare faucibus. Aliquam sem nisi, accumsan at ipsum nec, ornare rhoncus arcu. Vivamus libero augue, tristique eu lacus sit amet, posuere malesuada tellus. Praesent faucibus ultrices lacinia. Nam leo nisl, dapibus a feugiat sit amet, aliquet fringilla nunc. Nulla vel quam ac ipsum ultricies congue. Vivamus fringilla ipsum nibh, sed accumsan urna condimentum at.
</p>
<p>
Suspendisse commodo fringilla mauris sit amet tristique. Morbi quis euismod diam, a vestibulum erat. Curabitur sagittis ante ut dictum scelerisque. Vivamus lobortis ut enim id tristique. Vivamus convallis nisi ac dapibus posuere. Donec adipiscing diam mauris, nec interdum turpis mattis quis. Curabitur eu pulvinar risus. Aliquam pellentesque orci id elit ultrices, vitae lobortis massa blandit. Duis consequat mattis nisl, sit amet faucibus diam porta nec.
</p>
<p>
Phasellus commodo blandit ligula nec dignissim. Maecenas mi mauris, convallis at mi ut, ornare volutpat nulla. In sed elit suscipit, convallis augue a, ultricies massa. Vivamus at placerat dui, sagittis cursus libero. Cras non luctus mauris, vitae imperdiet massa. Vivamus mattis, justo vitae pharetra eleifend, nibh nulla lobortis sem, id ultricies lorem augue sollicitudin erat. Vestibulum tortor mi, varius a nisi non, sagittis imperdiet nulla. Nulla sed cursus eros. Morbi ut risus ipsum. Nunc a quam nec odio semper bibendum vel vel dui. Nullam rhoncus tincidunt diam, eget vehicula sapien tincidunt sodales. Proin nec ullamcorper justo. Aliquam eu tortor ac purus rhoncus aliquam.
</p>
</section>
<script>
(window.controller = new Leap.Controller)
.use('playback', {
scrollSections: [{
recording: 'recordings/brian.lz',
element: document.getElementsByTagName('section')[1],
offset: 0
}]})
.use('riggedHand')
.connect()
</script>
</body>
</html>