forked from wa0x6e/cal-heatmap
-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
127 lines (120 loc) · 4 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
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<html>
<head>
<title>Git Calendar</title>
<link rel="stylesheet" type="text/css" href="cal-heatmap.css">
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="cal-heatmap.min.js" type="text/javascript" charset="utf-8"></script>
<script src="src/font.js" type="text/javascript"></script>
</head>
<body>
<div class="container">
<h1>Github Calendar</h1>
<div>
<p>Start to push from next Sunday!</p>
<label>Input the word you want to show: </label>
<input name="word" type="text" id="word" onkeyup="printCalendar();" placeholder="Type Here" />
<p>Charactors avaluable: <pre>[A-Za-z0-9\!\*=#\-\_\.:\?]</pre></p>
</div>
<div id="cal-heatmap"></div>
<div>
<h2>Dates you need to push</h2>
<p id="total"></p>
<ul id="push-date"></ul>
</div>
</div>
<script type="text/javascript">
var weight = 2,
daySec = 86400,
weekSec = daySec * 7;
function printCalendar() {
document.getElementById('cal-heatmap').innerHTML = "";
document.getElementById('push-date').innerHTML = "";
document.getElementById('total').innerHTML = "";
var word = document.getElementById('word').value,
startTime = getNextSunday(),
datas = [],
dataJson = "{",
totalCommit = 0;
for (var i = 0; i < word.length; i++) {
var foo = word.charAt(i);
var result = getCharJson(foo, datas, startTime);
startTime = result[0];
dataJson += result[1];
datas = result[2];
totalCommit += result[3];
}
document.getElementById('total').innerHTML = "Total commit: " + totalCommit;
var currentYear = new Date().getFullYear(),
currentMonth = new Date().getMonth();
var cal = new CalHeatMap();
cal.init({
startWeekOnMonday: 0,
id: "cal-heatmap",
range: 2,
domain: "year",
subDomain: "day",
data: datas,
afterLoadData: parser,
start: new Date(currentYear, currentMonth),
scale: [1, 2, 3, 4, 5]
});
}
function getCharJson(c, datas, startTime, font) {
font = typeof font !== 'undefined' ? font : charAssets;
c = font[c];
var charJson = "",
nextStartTime = startTime,
totalCommit = 0;
var pushDateDiv = document.getElementById('push-date');
// if not found, c = undefined, return {startTime, ""}
if (c != undefined && c != null & c.length > 0) {
for (var i = 0; i < c.length; i++) {
var posX = c[i][0],
posY = c[i][1];
var posTimestamp = weekSec * posX + daySec * posY;
nextStartTime = startTime + posTimestamp;
var date = new Date(nextStartTime * 1000);
pushDateDiv.insertAdjacentHTML('beforeend', '<li>' +
date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate() + '</li>')
charJson += '"' + nextStartTime + '" : ' + weight + ',';
if (posY < 2) {
weight = 5;
} else if (posY < 4) {
weight = 4;
} else if (posY < 6) {
weight = 3;
}
var tempArr = {date: nextStartTime, "value": weight};
totalCommit += weight;
weight = 2;
datas.push(tempArr);
}
} else {
console.log("not found");
}
var weekCount = (nextStartTime - startTime) / weekSec;
weekCountTest = Math.floor(weekCount);
weekCount = Math.ceil(weekCount);
weekCount = ((weekCount - weekCountTest) > 0) ? weekCount : weekCount + 1;
nextStartTime = startTime + weekSec * (weekCount + 1);
var result = {0: nextStartTime, 1: charJson, 2: datas, 3: totalCommit};
return result;
}
function getNextSunday(curTime) {
curTime = typeof curTime !== 'undefined' ? curTime : (new Date().getTime() / 1000);
var sundayFlag = 8, // Monday now
date = new Date(curTime * 1000),
diff = sundayFlag - date.getDay();
var sunday = Math.ceil(curTime + diff * daySec);
return sunday;
}
var parser = function(data) {
var stats = {};
for (var d in data) {
stats[data[d].date] = data[d].value;
}
return stats;
};
</script>
</body>
</html>