forked from masukomi/kudos
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
77 lines (67 loc) · 2.1 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
<html>
<head>
<title>Kudos test</title>
<link href="kudos.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="jquery.cookie.js"></script>
<script type="text/javascript" src="kudos.js"></script>
<script type="text/javascript">
// needs to be a string for jquery.cookie
var postId = '1';
$(function()
{
// initialize kudos
$("figure.kudoable").kudoable();
// check to see if user has already kudod
// fyi cookies do not work when you are viewing this as a file
if($.cookie(postId) == 'true') {
// make kudo already kudod
$("figure.kudoable").removeClass("animate").addClass("complete");
// your server would take care of the proper kudos count, but because this is a
// static page, we need to set it here so it doesn't become -1 when you remove
// the kudos after a reload
$(".num").html(1);
}
// when kudoing
$("figure.kudo").bind("kudo:active", function(e)
{
console.log("kudoing active");
});
// when not kudoing
$("figure.kudo").bind("kudo:inactive", function(e)
{
console.log("kudoing inactive");
});
// after kudo'd
$("figure.kudo").bind("kudo:added", function(e)
{
var element = $(this);
// ajax'y stuff or whatever you want
console.log("Kodo'd:", element.data('id'), ":)");
// set cookie so user cannot kudo again for 7 days
$.cookie(postId, 'true', { expires: 7 });
});
// after removing a kudo
$("figure.kudo").bind("kudo:removed", function(e)
{
var element = $(this);
// ajax'y stuff or whatever you want
console.log("Un-Kudo'd:", element.data('id'), ":(");
// remove cookie
$.removeCookie(postId);
});
});
</script>
</head>
<body>
<figure class="kudo kudoable" data-id="1">
<a class="kudobject">
<div class="opening"><div class="circle"> </div></div>
</a>
<a href="#kudo" class="count">
<span class="num">0</span>
<span class="txt">Kudos</span>
</a>
</figure>
</body>
</html>