readmes

docs/building.md

@@ -1,20 +1,24 @@
-You can customize your sheetsee build with just the parts you want to use. If you want to just use the full version, you can grab it here in [js/sheetsee.js]().
+# Just Right
 
-**To build your sheetsee you'll need [Node.js]() on your computer and a command line**
+You can customize your sheetsee build with just the parts you want to use. If you want to just use the full version, you can grab it here at [github.com/jlord/sheetsee.js]().
+
+**To build your sheetsee you'll need [Node.js](http://www.nodejs.org) and [NPM](http://www.npmjs.org) on your computer and a command line**
 
 ## Install sheetsee from NPM
 The sheetsee module contains the basic sorting, organizing data functions and the script for building on the other modules. Create a folder for you new project and `cd` into it. Then install `sheetsee`.
 
-```cd myNewProject```
-```npm install sheetsee```
+```bash
+cd myNewProject
+npm install sheetsee
+```
 
-Once you've decided which modules you want run this command `sheetsee ` adding:
+Here are the options for the different modules. If you want save the generated file as _sheetsee.js_ then add the `save` option.
 
 - `-m` or `-maps` for maps
 - `-t` or `-tables` for tables
 - `-c` or `-charts` for charts
 - `--save` to write out the file*
 
-* _defaults to standardout on your console which you can `| pbcopy`
+_* defaults to standardout on your console which you can_ `| pbcopy`
 
-So for instance, `sheetsee -m -t --save` will build you a sheetsee with the map and tables sections built in and save it as a file named sheetsee.js.
+So for instance, `sheetsee -m -t --save` will build you a sheetsee with the basic **data** functions, the **map** and **tables** sections built in and save it as a file named **sheetsee.js**.

docs/changelog.md

@@ -0,0 +1,28 @@
+## _____
+### Sheetsee v3
+
+
+## August 13, 2013
+### Charting Intake
+
+D3 charts need an array of objects, and something to chart: the thing itself (aka labels) and the corresponding value (aka units). Your data usually contains more than D3 needs to make the chart, so you have to tell it what to chart from your data to chart. 
+
+Previously Sheetsee required you pass your data through a function, `addUnitsAndLabels()` which took in your data and the things you wanted to chart, reformatted your data for you so that you could pass it into one of the d3 charts. This is one more step than actually needs to happen.
+
+Now Sheetsee just asks for what you want your _labels_ and _units_ to be in the options you give it when calling the chart function. It then sorts the data correctly on the inside of the chart function. Yay, easier! 
+
+```
+  var options = {
+    labels: "name", 
+    units: "cuddleability", 
+    m: [60, 60, 30, 150], 
+    w: 600, h: 400, 
+    div: "#barChart", 
+    xaxis: "no. of pennies", 
+    hiColor: "#FF317D"
+  }
+```
+
+Thanks @maxogden for the help with this.
+
+### Started doing this changelong pretty late in the game.

docs/custom-charts.md

@@ -0,0 +1 @@
+**Coming Soon**

docs/sheetsee-charts.md

@@ -1,10 +1,6 @@
 # sheetsee-charts
 
-![sheetsee](https://raw.github.com/jllord/sheetsee-cache/master/img/sheetsee-03.png)
-
-Module for working with charts with sheetsee.js. It provides three d3 chart options to use with your spreadsheet data. Below is a portion of the sheetsee.js documentation regarding charts, for the full sheetsee.js documentation, go [here](http://jlord.github.io/sheetsee.js)!
-
----
+Sheetsee provides three d3 chart options to use with your spreadsheet data: a bar chart, line chart and pie graph. You can also plug in your own custom d3 chart to sheetsee, read about that [here](custom-charts.md).
 
 ## Make a Chart
 
@@ -18,15 +14,21 @@ You can also make your own d3 chart in a separate .js file, link to that and pas
 
 To create a bar chart you'll need to add a placeholder `<div>` in your HTML with an id.
 
-    <div id="barChart"></div>
+```HTML
+<div id="barChart"></div>
+```
 
 In your CSS, give it dimensions.
 
-    #barChart {height: 400px; max-width: 600px; background: #F8CDCD;}
+```CSS
+#barChart {height: 400px; max-width: 600px; background: #F8CDCD;}
+```
 
 In a `<script>` tag set up your options.
 
-    var barOptions = {m: [60, 60, 30, 150], w: 600, h: 400, div: "#barChart", xaxis: "no. of pennies", hiColor: "#FF317D"}
+```javascript
+var barOptions = {m: [60, 60, 30, 150], w: 600, h: 400, div: "#barChart", xaxis: "no. of pennies", hiColor: "#FF317D"}
+```
 
 * **m** is margins: top, right, bottom, left
 * **w** and **h** are width and height, this should match your CSS specs
@@ -36,21 +38,29 @@ In a `<script>` tag set up your options.
 
 Then call the `d3BarChart()` function with your **data** and **options**.
 
-    Sheetsee.d3BarChart(data, barOptions)
+```javascript
+Sheetsee.d3BarChart(data, barOptions)
+```
 
 ### Line Chart
 
 To create a line chart you'll need to add a placeholder `<div>` in your html with an id.
 
-    <div id="lineChart"></div>
+```HTML
+<div id="lineChart"></div>
+```
 
 In your CSS, give it dimensions.
 
-    #lineChart {height: 400px; max-width: 600px; background: #F8CDCD;}
+```CSS
+#lineChart {height: 400px; max-width: 600px; background: #F8CDCD;}
+```
 
 In a `<script>` tag set up your options.
 
-    var lineOptions = {m: [80, 100, 120, 100], w: 600, h: 400, div: "#lineChart", yaxis: "no. of pennies", hiColor: "#14ECC8"}
+```
+var lineOptions = {m: [80, 100, 120, 100], w: 600, h: 400, div: "#lineChart", yaxis: "no. of pennies", hiColor: "#14ECC8"}
+```
 
 * **m** is your margins: top, right, bottom, left
 * **w** and **h** are width and height, this should match your CSS specs
@@ -60,21 +70,28 @@ In a `<script>` tag set up your options.
 
 Then call the `d3LineChart()` function with your **data** and **options**.
 
-    Sheetsee.d3LineChart(data, lineOptions)
+```
+Sheetsee.d3LineChart(data, lineOptions)
+```
 
 ### Pie Chart
 
 To create a bar chart you'll need to add a placeholder `<div>` in your html with an id.
 
-    <div id="pieChart"></div>
-
+```HTML
+<div id="pieChart"></div>
+```
 In your CSS, give it dimensions.
 
-    #pieChart {height: 400px; max-width: 600px; background: #F8CDCD;}
+```CSS
+#pieChart {height: 400px; max-width: 600px; background: #F8CDCD;}
+```
 
 In a `<script>` tag set up your options.
 
-    var pieOptions = {m: [80, 80, 80, 80], w: 600, h: 400, div: "#pieChart", hiColor: "#14ECC8"}
+```javascript
+var pieOptions = {m: [80, 80, 80, 80], w: 600, h: 400, div: "#pieChart", hiColor: "#14ECC8"}
+```
 
 * **m** is your margins: top, right, bottom, left
 * **w** and **h** are width and height, this should match your CSS specs
@@ -83,4 +100,6 @@ In a `<script>` tag set up your options.
 
 Then call the `d3PieChart()` function with your **data** and **options**.
 
-    Sheetsee.d3PieChart(data, pieOptions)
+```javascript
+Sheetsee.d3PieChart(data, pieOptions)
+```

docs/sheetsee.md

@@ -1,10 +1,6 @@
 # sheetsee
 
-![sheetsee](https://raw.github.com/jllord/sheetsee-cache/master/img/sheetsee-03.png)
-
-This module contains the basic functions for sorting and munipulating data for use in your [sheetsee.js](http://jlord.github.io/sheetsee.js) endeavors. Below is the portion of the [sheetsee.js](http://jlord.github.io/sheetsee.js) readme that covers the use of these functions. For the complete documentation including genera what is sheetsee, go [here](http://jlord.github.io/sheetsee.js)!
-
----
+This is the core module to create a sheetsee.js library. It contains the functions for building your custom file as well as the basic data manipulation functions.
 
 ## Working With Your Data
 
@@ -14,44 +10,56 @@ Tabletop.js will return all of your data and it will be passed into your site as
 
 This takes in your data, an _array of objects_, and searches for a _string_, **groupTerm**, in each piece of your **data** (formerly the cells of your spreadsheet). It returns the number of times it found the **groupTerm**.
 
-    getGroupCount(gData, "cat")
-    // returns 2
+```javascript
+getGroupCount(gData, "cat")
+// returns 2
+```
 
 ### Sheetsee.getColumnTotal(data, column)
 
 Given your **data**, an _array of objects_ and a _string_ **column** header, this functions sums each cell in that column, so they best be numbers.
 
-    getColumnTotal(gData, "cuddlability")
-    // returns 11
+```javascript
+getColumnTotal(gData, "cuddlability")
+// returns 11
+```
 
 ### Sheetsee.getAveragefromColumn(data, column)
 
 A really simple function that builds on `getColumnTotal()` by returning the average number in a **column** of numbers.
 
-    getColumnAverage(gData, "cuddlability")
-    // returns 1.8333333333333333
+```javascript
+getColumnAverage(gData, "cuddlability")
+// returns 1.8333333333333333
+```
 
 ### Sheetsee.getMin(data, column)
 
 This will return an _array_ of _object_ or _objects_ (if there is a tie) of the element with the lowest number value in the **column** you specify from your **data**.
 
-    getMin(gData, "cuddlability")
-    // returns {breed: "Fat", cuddlability: "0", hexcolor: "#CDCF83"...}, {breed: "Grey", cuddlability: "0", hexcolor: "#9C9B9A"...}, {breed: "Creepy", cuddlability: "0", hexcolor: "#918376"...}
+```javascript
+getMin(gData, "cuddlability")
+// returns {breed: "Fat", cuddlability: "0", hexcolor: "#CDCF83"...}, {breed: "Grey", cuddlability: "0", hexcolor: "#9C9B9A"...}, {breed: "Creepy", cuddlability: "0", hexcolor: "#918376"...}
+```
 
 ### Sheetsee.getMax(data, column)
 
 This will return an _array_ of _object_ or _objects_ (if there is a tie) of the element with the highest number value in the **column** you specify from your **data**.
 
-    getMin(gData, "cuddlability")
-    // returns {breed: "Teacup Maltese", cuddlability: "5", hexcolor: "#ECECEC", kind: "Dog", lat: "37.74832", long: "-122.402158", name: "Coco"...}
+```javascript
+getMin(gData, "cuddlability")
+// returns {breed: "Teacup Maltese", cuddlability: "5", hexcolor: "#ECECEC", kind: "Dog", lat: "37.74832", long: "-122.402158", name: "Coco"...}
+```
 
 ### Don't Forget JavaScript Math
 
 Create variables that are the sums, differences, multiples and so forth of others. Lots of info on that [here on MDN](https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Math).
 
-    var profit09 = Sheetsee.getColumnTotal(gData, "2009")
-    var profit10 = Sheetsee.getColumnTotal(gData, "2010")
-    var difference = profit09 - profit10
+```javascript
+var profit09 = Sheetsee.getColumnTotal(gData, "2009")
+var profit10 = Sheetsee.getColumnTotal(gData, "2010")
+var difference = profit09 - profit10
+```
 
 #### What These Little Bits are Good For
 
@@ -61,50 +69,67 @@ You don't have to just create tables of your data. You can have other portions o
 
 Takes **data** as an _array of objects_, a _string_ you'd like to **filter** and a _string_ of the **category** you want it to look in (a column header from your spreadsheet).
 
-    getMatches(gData, "dog", "kind")
+```javascript
+getMatches(gData, "dog", "kind")
+```
 
 Returns an _array of objects_ matching the category's filter.
 
-    [{"name": "coco", "kind": "dog"...}, {"name": "wolfgang", "kind": "dog"...},{"name": "cooc", "kind": "dog"...} ]
-
+```javascript
+[{"name": "coco", "kind": "dog"...}, {"name": "wolfgang", "kind": "dog"...},{"name": "cooc", "kind": "dog"...} ]
+```
 
 ### Sheetsee.getOccurance(data, category)
 
 Takes **data** as an _array of objects_ and a _string_ for **category** (a column header from your spreadsheet) you want tally how often an element occured.
 
-    getOccurance(gData, "kind")
+```javascript
+getOccurance(gData, "kind")
+```
 
 Returns an object with keys and values for each variation of the category and its occurance.
 
-    {"dog": 3, "cat": 3}
+```javascript
+{"dog": 3, "cat": 3}
+```
 
 ### Sheetsee.makeColorArrayOfObject(data, colors)
 
 If you use `getOccurance()` and want to then chart that data with d3.js, you'll need to make it into an _array_ (instead of an object) and add colors back in (since the hexcolor column applies to the datapoints in your original dataset and not this new dataset).
 
 This function takes in your data, as an _object_, and an _array_ of hexidecimal color strings which you define.
 
-    var kinds = getOccurance(gData, "kind")
-    var kindColors = ["#ff00ff", "#DCF13C"]
+```javascript
+var kinds = getOccurance(gData, "kind")
+var kindColors = ["#ff00ff", "#DCF13C"]
 
-    var kindData = makeColorArrayOfObjects(mostPopBreeds, breedColors)
+var kindData = makeColorArrayOfObjects(mostPopBreeds, breedColors)
+```
 
 It will return an array of objects formatted to go directly into a d3 chart with the appropriate _units_ and _label keys_, like so:
 
-    [{"label": "dog", "units": 2, "hexcolor": "#ff00ff"}, {"label": "cat", "units": 3, "hexcolor": "#DCF13C"}]
+```javascript
+[{"label": "dog", "units": 2, "hexcolor": "#ff00ff"}, {"label": "cat", "units": 3, "hexcolor": "#DCF13C"}]
+```
 
 If you pass in an array of just one color it will repeat that color for all items. If you pass fewer colors than data elements it will repeat the sequences of colors for the remainder elements.
 
 ### Sheetsee.addUnitsLabels(arrayObj, oldLabel, oldUnits)
 
 If you're using gData, the data directly from Tabletop, you'll need to format it before you use the d3 charts. You'll need to determine what part of your data you want to chart - what will be your label, what your charting, and what will be your units, how many of them are there (this should be a number).
 
-    var gData =  [{"name": "coco", "kind": "dog", "cuddablity": 5}, {"name": "unagi", "kind": "cat", "cuddlability": 0}]
+```javascript
+var gData =  [{"name": "coco", "kind": "dog", "cuddablity": 5}, {"name": "unagi", "kind": "cat", "cuddlability": 0}]
+```
 
 For istance, if from our original data above we want to chart the age of each cat, we'll use:
 
-    Sheetsee.addUnitsLabels(gData, "name", "cuddlability")
+```javascript
+Sheetsee.addUnitsLabels(gData, "name", "cuddlability")
+```
 
 Which will return an array, ready for the d3 charts:
 
-    [{"label": "coco", "kind": "dog", "units": 5}, {"label": "unagi", "kind": "cat", "units": 0}]
+```javascript
+[{"label": "coco", "kind": "dog", "units": 5}, {"label": "unagi", "kind": "cat", "units": 0}]
+```

docs/tips.md

@@ -0,0 +1 @@
+**coming soon!**