Skip to content

Commit e7efa9e

Browse files
Switch charts library to Chartist (#12)
* Init charts based on Chartist * Comments charts via Chartist, remove Highcharts, minifed CSS/JS * Copy minifed assets to /lib * Bugfixes/refactoring; increase version number to 1.1
1 parent 962eb6c commit e7efa9e

16 files changed

+881
-1361
lines changed

.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1 +1,3 @@
11
/vendor/
2+
*.min.css
3+
*.min.js

CHANGELOG.md

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,11 @@ All notable changes to this WordPress plugin will be documented in this file.
44
The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
55
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
66

7-
## Unreleased
7+
## Version 1.1
88

99
### Changed
1010
* Code compliant to WordPress Coding Standards, ensured via Travis build
11+
* Switched charts library
1112

1213

1314
## Version 1.0

assets/functions.js

Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
function exportTableToCSV($table, filename) {
2+
var tmpColDelim = String.fromCharCode(11), tmpRowDelim = String.fromCharCode(0), // Temporary delimiters unlikely to be typed by keyboard to avoid accidentally splitting the actual contents
3+
colDelim = '","', rowDelim = '"\r\n"', // actual delimiters for CSV
4+
$rows = $table.find('tr'),
5+
csv = '"' + $rows.map(function(i, row) {
6+
var $row = jQuery(row), $cols = $row.find('td,th');
7+
return $cols.map(function(j, col) {
8+
var $col = jQuery(col), text = $col.text();
9+
return text.replace(/"/g, '""'); // escape double quotes
10+
}).get().join(tmpColDelim);
11+
}).get().join(tmpRowDelim).split(tmpRowDelim)
12+
.join(rowDelim).split(tmpColDelim)
13+
.join(colDelim) + '"',
14+
csvData = 'data:application/csv;charset=utf-8,' + encodeURIComponent(csv);
15+
jQuery(this).attr({
16+
'download' : filename,
17+
'href' : csvData
18+
});
19+
}
20+
21+
function posts_and_users_stats_bar_chart(div, xData, yData, xAxisTitle, yAxisTitle) {
22+
var data = {
23+
labels: xData,
24+
series: [
25+
yData
26+
]
27+
};
28+
29+
var options = {
30+
seriesBarDistance: 20,
31+
chartPadding: {
32+
top: 20,
33+
right: 30,
34+
bottom: 30,
35+
left: 30
36+
},
37+
axisY: {
38+
onlyInteger: true
39+
},
40+
plugins: [
41+
Chartist.plugins.ctAxisTitle({
42+
axisX: {
43+
axisTitle: xAxisTitle,
44+
axisClass: 'ct-axis-title ct-x-axis-title',
45+
offset: {
46+
x: 0,
47+
y: 40
48+
},
49+
textAnchor: 'middle'
50+
},
51+
axisY: {
52+
axisTitle: yAxisTitle,
53+
axisClass: 'ct-axis-title ct-y-axis-title',
54+
offset: {
55+
x: 0,
56+
y: 25
57+
},
58+
flipTitle: true
59+
}
60+
})
61+
]
62+
};
63+
64+
var responsiveOptions = [
65+
['screen and (max-width: 640px)', {
66+
seriesBarDistance: 5,
67+
axisX: {
68+
labelInterpolationFnc: function (value) {
69+
return value[0];
70+
}
71+
}
72+
}]
73+
];
74+
75+
new Chartist.Bar(div, data, options, responsiveOptions);
76+
}
77+
78+
function posts_and_users_stats_time_line_chart(div, seriesData, dateFormat, xAxisTitle, yAxisTitle) {
79+
var data = {
80+
series: [
81+
{
82+
name: 'series-1',
83+
data: seriesData
84+
}
85+
]
86+
};
87+
88+
var options = {
89+
chartPadding: {
90+
top: 20,
91+
right: 30,
92+
bottom: 30,
93+
left: 30
94+
},
95+
axisX: {
96+
type: Chartist.FixedScaleAxis,
97+
divisor: 5,
98+
labelInterpolationFnc: function(value) {
99+
return moment(value).format(dateFormat);
100+
}
101+
},
102+
lineSmooth: Chartist.Interpolation.step(),
103+
plugins: [
104+
Chartist.plugins.ctAxisTitle({
105+
axisX: {
106+
axisTitle: xAxisTitle,
107+
axisClass: 'ct-axis-title ct-x-axis-title',
108+
offset: {
109+
x: 0,
110+
y: 40
111+
},
112+
textAnchor: 'middle'
113+
},
114+
axisY: {
115+
axisTitle: yAxisTitle,
116+
axisClass: 'ct-axis-title ct-y-axis-title',
117+
offset: {
118+
x: 0,
119+
y: 25
120+
},
121+
flipTitle: true
122+
}
123+
})
124+
]
125+
};
126+
127+
new Chartist.Line(div, data, options)
128+
}
File renamed without changes.

assets/style.css

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
@charset "UTF-8";
2+
3+
.posts-and-users-stats nav li {
4+
display: inline;
5+
}
6+
7+
.posts-and-users-stats section {
8+
margin-bottom: 3em;
9+
}
10+
11+
.posts-and-users-stats legend {
12+
margin: .5em 0;
13+
font-weight: bold;
14+
}
15+
16+
.posts-and-users-stats .chart {
17+
margin: 1em 0;
18+
}
19+
20+
.posts-and-users-stats table {
21+
border-collapse: collapse;
22+
clear: both;
23+
}
24+
25+
.posts-and-users-stats tr:nth-child(2n) {
26+
background: #ddd;
27+
}
28+
29+
.posts-and-users-stats th, .posts-and-users-stats td {
30+
padding: .7em;
31+
vertical-align: top;
32+
}
33+
34+
.posts-and-users-stats .number {
35+
text-align: right;
36+
}
37+
38+
.posts-and-users-stats .chart-container {
39+
background: #fff;
40+
margin: 1em 0;
41+
}
42+
43+
.posts-and-users-stats .chart-title {
44+
text-align: center;
45+
font-size: 1.5em;
46+
padding: 0.5em 0;
47+
}

composer.json

Lines changed: 28 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,10 @@
1515
"source": "https://github.com/patrickrobrecht/posts-and-users-stats"
1616
},
1717
"require": {
18-
"php": "^5.6|^7"
18+
"php": "^5.6|^7",
19+
"npm-asset/chartist": "^0.11.0",
20+
"npm-asset/chartist-plugin-axistitle": "^0.0.5",
21+
"npm-asset/moment": "^2.21.0"
1922
},
2023
"require-dev": {
2124
"dealerdirect/phpcodesniffer-composer-installer": "^0.4",
@@ -25,6 +28,12 @@
2528
"wimg/php-compatibility": "^8.0",
2629
"wp-coding-standards/wpcs": "^0.14"
2730
},
31+
"repositories": [
32+
{
33+
"type": "composer",
34+
"url": "https://asset-packagist.org"
35+
}
36+
],
2837
"scripts": {
2938
"post-install-cmd": [
3039
"@build"
@@ -33,13 +42,30 @@
3342
"@build"
3443
],
3544
"build": [
36-
"@cs"
45+
"@cs",
46+
"@copy-assets",
47+
"@minify"
48+
],
49+
"copy-assets": [
50+
"SlowProg\\CopyFile\\ScriptHandler::copy"
3751
],
3852
"cs": [
3953
"phpcs --standard=phpcs.xml -s"
4054
],
4155
"csfix": [
4256
"phpcbf --standard=phpcs.xml"
57+
],
58+
"minify": [
59+
"minifycss assets/style.css > assets/style.min.css",
60+
"minifyjs assets/functions.js > assets/functions.min.js"
4361
]
62+
},
63+
"extra": {
64+
"copy-file": {
65+
"vendor/npm-asset/chartist/dist/chartist.min.css": "lib/",
66+
"vendor/npm-asset/chartist/dist/chartist.min.js": "lib/",
67+
"vendor/npm-asset/chartist-plugin-axistitle/dist/chartist-plugin-axistitle.min.js": "lib/",
68+
"vendor/npm-asset/moment/min/moment.min.js": "lib/"
69+
}
4470
}
4571
}

composer.lock

Lines changed: 47 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

css/style.css

Lines changed: 0 additions & 12 deletions
This file was deleted.

js/exporting.js

Lines changed: 0 additions & 24 deletions
This file was deleted.

0 commit comments

Comments
 (0)