-
Notifications
You must be signed in to change notification settings - Fork 24
/
README.html
91 lines (64 loc) · 5.04 KB
/
README.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
<h1>jquery.pivot plugin</h1>
<h2>Description</h2>
<p>The jquery.pivot plugin can be used for presenting table data in pivot form. It is made and maintained me, Janus Schmidt, currently employed by <a href="http://Metalogic.dk">Metalogic.dk</a>.</p>
<p>The project lives on <a href="http://github.com/janusschmidt/jquery.pivot">github</a>.</p>
<h2>Demo</h2>
<p>For further info on how to use the plugin, have a look at the <a href="http://metalogic.dk/jquery.pivot/demo/demo.htm">demo</a></p>
<h2>Compatibility (Jasmine test results)</h2>
<p><a href="https://saucelabs.com/u/janusschmidt"><img src="https://saucelabs.com/browser-matrix/janusschmidt.svg" alt="Selenium Test Status"/></a></p>
<h2>History</h2>
<p>I made this some time ago, for a web application that enables people to keep track of time <a href="http://styrpaatiden.dk">styrpaatiden.dk</a>. As I am a big fan of jQuery, I decided, it was time for<br/>
me to give back to the community.</p>
<h2>Usage:</h2>
<p>This is only a scarce description, so look in the examples to get more information.<br/>
The data can be parsed from a html table with special markup or from json data. As I live in denmark I've added functionality to pass in format and parse functions for numbers.<br/>
You can also supply a function that will be called when the user clicks a result cell. The function is passed info on which groupby value and pivot value is clicked. This can be used<br/>
to fetch and present more details from the server.</p>
<p>To use the plugin you need a script reference to <code>jquery</code>, the plugin <code>build/jquery.pivot.min.js</code> and maybe the <code>demo/stylesheet.css</code> if you don't want to style the pivot<br/>
yourself. The fold unfold images are defined in the css.</p>
<p>The plugins accepts these parameters:</p>
<p><code>javascript<br/>
$.fn.pivot.defaults = {<br/>
source: null, //Must be json or a jquery element containing a table<br/>
bTotals: true, //Includes total row and column<br/>
bCollapsible: true, // Set to false to expand all and remove open/close buttons<br/>
aggregatefunc: calcsum, //defaults to sum. Set to null for no totals. Set to function that concatenates for strings.<br/>
formatFunc: function (n) { return n; }, //A function to format numeric result/total cells. Ie. for non US numeric formats<br/>
parseNumFunc: function (n) { return +n; }, //Can be used if parsing a html table and want a non standard method of parsing data. <br/>
//Ie. for non US numeric formats.<br/>
//Set to null if result column should be considered string data.<br/>
onResultCellClicked: null, //Method thats called when a result cell is clicked. This can be used to call server and present details for that cell. <br/>
//Signature = function(dataObjectWithInformationOnClikedCell, jqueryElementThatsClicked)<br/>
noGroupByText: "No value", //Text used if no data is available for specific groupby and pivot value.<br/>
noDataText: "No data" //Text used if source data is empty.<br/>
sortPivotColumnHeaders: true //if false pivot columns will appear in the order they are discovered in the source.<br/>
};<br/>
</code></p>
<h2>Development</h2>
<p>The source is in Typescript.</p>
<p>If you for some reason don't want to use typescript, You're welcome to send bugs/change suggestions in plain javascript.</p>
<p>The project is setup to use grunt.</p>
<h3>To use <em>grunt</em> via <em>node</em></h3>
<ol>
<li>Install node.</li>
<li>In <em>node</em> console install grunt <code>npm install -g grunt-cli</code>.</li>
<li>In <em>node</em> console <code>cd</code> to project directory and run <code>npm install</code></li>
<li>In <em>node</em> console run <code>grunt</code> command</li>
</ol>
<h3><em>grunt</em> is set up to:</h3>
<ol>
<li>Generate javascript files from typescripts.</li>
<li>Jshint all (non minified) javascript.</li>
<li>Minify selected files.</li>
<li>Run jasmine tests via phantomjs.</li>
</ol>
<p>When developing edit the <code>typescript\src\*.ts</code> files run <code>grunt typescript:dev</code> in a nodejs console and check your<br/>
changes in <code>demo\demo.htm</code> and/or <code>tests\run.html</code>.<br/>
When you're done coding and think everything is in order run <code>grunt</code> without arguments to run everything. <br/>
Always complete this step without errors before sending a pull request.</p>
<p>If you want to send a pull request, make sure you run <em>grunt</em> without errors first.</p>
<p><strong>Secret bonus <em>grunt</em> task.</strong> If you have a saucelab account you can fill in set your sauce credentials in the environment variables and run <code>grunt sauce</code> to<br/>
get the unittest run in different target browsers. You must have java installed and added to your nodejs environment path. Also you must have local webserver serving you web on localhost/jquery.pivot.<br/>
Don't sweat it if you skip this step. :-)</p>
<h2>License</h2>
<p>The project uses the <a href="license.txt">MIT license</a>.</p>