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
|
class @Calendar
constructor: (timestamps, starting_year, starting_month, calendar_activities_path) ->
# Get the highest value from the timestampes
highestValue = 0
_.each timestamps, (count) ->
if count > highestValue
highestValue = count
timestamps = _.chain(timestamps)
.map (stamp, key) ->
{
count: stamp
date: key
}
.groupBy (stamp, i) ->
Math.floor i / 7
.toArray()
.value()
monthNames = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
months = []
svg = d3.select '#cal-heatmap'
.append 'svg'
.attr 'width', 53 * 17
.attr 'height', 140
# Setup each day box
svg.selectAll 'g'
.data timestamps
.enter()
.append 'g'
.attr 'transform', (group, i) ->
_.each group, (stamp) ->
month = new Date(parseInt(stamp.date) * 1000).getMonth()
x = 17 * i + 1
lastMonth = _.last(months)
# If undefined, push
if !lastMonth?
months.push
month: month
x: x
else if lastMonth.x is x
lastMonth.month = month
else if lastMonth.month isnt month
months.push
month: month
x: x
"translate(#{17 * i + 1}, 18)"
.selectAll 'rect'
.data (stamp) ->
stamp
.enter()
.append 'rect'
.attr 'x', '0'
.attr 'y', (stamp, i) ->
17 * i
.attr 'width', 15
.attr 'height', 15
.attr 'title', (stamp) ->
"#{stamp.count} contributions<br />#{gl.utils.formatDate parseInt(stamp.date) * 1000}"
.attr 'class', (stamp) ->
extraClass = ''
if stamp.count isnt 0
diff = stamp.count / highestValue
classNumber = Math.floor (diff / 0.25) + 1
extraClass += "user-contrib-cell-#{classNumber}"
"user-contrib-cell #{extraClass} js-tooltip"
.attr 'data-container', 'body'
.on 'click', (stamp) ->
date = new Date(parseInt(stamp.date) * 1000)
formated_date = date.getFullYear() + "-" + (date.getMonth()+1) + "-" + date.getDate()
$.ajax
url: calendar_activities_path
data:
date: formated_date
cache: false
dataType: "html"
success: (data) ->
$(".user-calendar-activities").html data
svg.append 'g'
.selectAll 'text'
.data months
.enter()
.append 'text'
.attr 'x', (date) ->
date.x
.attr 'y', 10
.attr 'class', 'user-contrib-text'
.text (date) ->
monthNames[date.month]
$('#cal-heatmap .js-tooltip').tooltip
html: true
|
