forked from stevermeister/mousometer
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
111 lines (99 loc) · 3.78 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
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
99
100
101
102
103
104
105
106
107
108
109
110
111
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<meta charset="utf-8">
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
<title>Mousometer by Stepan Suvorov</title>
<style>
html,body{
height: 100%
}
footer {
bottom: 15px;
position: absolute;
width: 100%;
}
#highscore {
margin: 0 3px;
color: #20B188;
vertical-align: -3px;
font-weight: bold;
font-size: 250%;
}
</style>
<script src="storage.js"></script>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId: '774122049319308', cookie: true, status: true, xfbml: true, oauth: true
});
var fbAuth = null;
var fbShare = function() {
speed = persistentStorage.get('maxSpeed');
FB.ui({
method: "feed",
display: "iframe",
link: "http://stepansuvorov.com/useIt/mousometer/",
caption: "Mouseometer",
description: "I can run my mouse at <b>{speed}</b>km/h! How fast are you with your mouse?".replace('{speed}', speed),
picture: "https://camo.githubusercontent.com/ad2ba9ba77b388c535e89c6f9b60cfbe37787b0c/687474703a2f2f73746570616e7375766f726f762e636f6d2f626c6f672f77702d636f6e74656e742f75706c6f6164732f323031342f30372f6e584e6c7266357a4e59436259724a4f5259506b426854324a616c5574616e5253636f6f4146566d2d65492e706e67"
});
};
$("#fb-publish").click(function() {
if (!fbAuth) {
FB.login(function(response) {
if (response.authResponse) {
fbAuth = response.authResponse;
fbShare();
}
}, {scope: 'publish_stream'});
} else {
fbShare();
}
});
};
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
<br/><br/><br/>
<div id="container" style="min-width: 310px; max-width: 400px; height: 300px; margin: 0 auto"></div>
<p style="text-align: center">Your highscore is <span id="highscore"></span>km/h! <button id="fb-publish">Share to Facebook</button></p>
<footer class="footer">
<div class="container text-center small grey">
<p>
Created by
<a href="http://stepansuvorov.com">Stepan Suvorov</a> with
<a href="http://www.highcharts.com/">Highcharts</a> and
<a href="https://gist.github.com/ripper234/5757309" title="gist">this</a> piece of code
</p>
<p>
<a href="https://github.com/stevermeister/mousometer">GitHub Page</a>
</p>
</div>
</footer>
<script src="app.js"></script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-12112718-4']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>