scrollfit/index.html at gh-pages · flash42/scrollfit · GitHub

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
<html>
    <body style="overflow-y:scroll">
        <p>
        <div style="font-size: 48px; letter-spacing: 1.5px;">
            Help defining <strong><span class="speedValue"></span></strong> scroll/swipe speed.
        </div>
        <div style="margin-top: 32px"> We are collecting Your input to be able to define <strong><span class="speedValue"></span></strong> scroll speed. For this you only need to use your mouse scroll or touchpad and we will measure the movements and save it for later use.<br/>
            How to measure?<br/>
            <ul>
                <li>Scroll <strong>once</strong> with <strong><span class="speedValue"></span></strong> speed in the textbox below</li>
                <li>Send Data button will appear. Click it to send the collected data.</li>
            </ul>

            Use Reset Data if you made a mistake and want to try again without sending data. <br/><br/>

            <strong> Send multiple measurements and use <a id="otherSpeedLink">the other link</a> too! Thanks!</strong>
        </div>
        <br/><br/>

        <button id="resetButton" onclick="resetHandler()" style="visibility:hidden; font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase; border: none; color: #fff; background-color: #ff3131; outline: 0;line-height: 14px; padding: 13px 25px; display: inline-block;">Reset data</button>

        <button id="sendButton" onclick="saveMeasurement()" style="visibility:hidden; font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase; border: none; color: #fff; background-color: #3181ff; outline: 0;line-height: 14px; padding: 13px 25px; display: inline-block;">Send data</button>
        <textarea rows="14" cols="110" id="scrollArea" style="display: block; margin-top: 20px;margin-bottom:20px">
            ==================
            Top of the textbox
            ==================
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            Scroll here!!
            =======================
            You reached the bottom!
            =======================
        </textarea>
        <div id="dataToSend">

        </div>
        </p>

    </body>
<script src="jquery-2.1.3.min.js"></script>
<script src="jquery-mousewheel.js"></script>
<script src="firebase.js"></script>
<script src="detection.js"></script>
<script src="main.js"></script>
</html>