edits
edits

--- a/.gitmodules
+++ b/.gitmodules
@@ -1,4 +1,7 @@
 [submodule "php-markdown"]
 	path = php-markdown
 	url = git://github.com/michelf/php-markdown.git
+[submodule "js/toc"]
+	path = js/toc
+	url = https://github.com/jgallen23/toc
 

--- a/css/main.css
+++ b/css/main.css
@@ -92,20 +92,77 @@
 /* ==========================================================================
    Author's custom styles
    ========================================================================== */
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+/* stoc http://www.1stwebdesigner.com/css/jquery-plugin-smooth-scrolling/ */
+.items {
+    float: right;
+    width: 260px;
+    padding-bottom: 10px;
+    margin:0 0 10px 20px;
+    /* rgba with ie compatibility */
+    background-color: transparent;
+    background-color: rgba(255,255,255,0.4);
+    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#20ffffff,endColorstr=#20ffffff);
+    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#20ffffff,endColorstr=#20ffffff)";
+}
+.items ul {
+    margin: 0 0 0 20px;
+    padding: 0 0 5px;
+    list-style-type: none;
+}
+.items ul ul {
+    font-size: 90%;
+}
+.items ul a {
+    font-family: "arial";
+    text-decoration: none;
+    color: #c10000;
+}
+.items ul a:hover { color: #ff0000 }
+ /* toc https://github.com/jgallen23/toc */
+#wrapper {
+    margin: 0 20px 0 170px;
+}
+
+#toc {
+    top: 0px;
+    left: 0px;
+    height: 100%;
+    position: fixed;
+    background: #333;
+    box-shadow: inset -5px 0 5px 0px #000;
+    width: 150px;
+    padding-top: 20px;
+    color: #fff;
+}
+
+#toc ul {
+    margin: 0;
+    padding: 0;
+    list-style: none;
+}
+
+#toc li {
+    padding: 5px 10px;
+}
+
+#toc a {
+    color: #fff;
+    text-decoration: none;
+    display: block;
+}
+
+#toc .toc-h2 {
+    padding-left: 10px;
+}
+
+#toc .toc-h3 {
+    padding-left: 20px;
+}
+
+#toc .toc-active {
+    background: #336699;
+    box-shadow: inset -5px 0px 10px -5px #000;
+}
 
 
 

file:a/index.md -> file:b/index.md
--- a/index.md
+++ b/index.md
@@ -9,11 +9,7 @@
  - what do govhack entries look like?
   - roles; coder, designer UX/graphics
 
-server admin / technical tools
-many projects will require some kind of internet presence, webpage etc.
-video tools, youtube slideshow, FOSS video editing tools
-  - http://ubuntu-tutorials.com/2008/11/11/relaying-postfix-smtp-via-smtpgmailcom/ 
-  - amon
+
 
 geo
   - http://converter.mygeodata.eu/vector kml exporter for shp
@@ -23,21 +19,9 @@
   - http://blog.yhathq.com/posts/10-R-packages-I-wish-I-knew-about-earlier.html
         - excel -> R/rattle/ deducer? http://www.r-bloggers.com/updates-to-the-deducer-family-of-packages/
 
-d3
-  - http://datadrivenjournalism.net/resources/data_driven_documents_defined
-    - http://www.benmcmahen.com/blog/posts/50eb57d55a94d35262000001 d3 svg
-
-API
-  - howto.gov api tutorial
-  - http://shancarter.com/data_converter/
-  - http://training.sunlightfoundation.com/module/data-visualizations-google-docs/
-  - api documentation
-    - WSDL or http://swagger.wordnik.com/ or https://github.com/mashery/iodocs
-    - http://symfony.com/ https://github.com/FriendsOfSymfony/FOSRestBundle http://williamdurand.fr/2012/08/02/rest-apis-with-symfony2-the-right-way/ https://github.com/nelmio/NelmioApiDocBundle better apis https://github.com/liip/LiipHelloBundle
-      - https://github.com/elc/rapi_doc https://github.com/Pajk/apipie-rails
-      - 
+
+
 - tools.disclo.gs - how to use data
-  - https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet#wiki-images reference style images?
   - developer tools inc. linked data
         - gephi -> neo4j
           - neo4j lets you build on, do massive queries of who is friends with who
@@ -55,8 +39,6 @@
         - three.js with cables vis? Overviewer from AP?
   - govhack library
     - http://hpneo.github.com/gmaps/examples.html 
-    - android datviz
-      - http://code.google.com/p/afreechart/ http://code.google.com/p/snowdon/ http://code.google.com/p/chartdroid/ http://androidplot.com/ http://code.google.com/p/achartengine/
     - https://graphics.stanford.edu/wikis/cs448b-12-fall/ data viz theory
     - https://mixpanel.com/education/understanding-the-first-five-minutes
     - http://drawingbynumbers.org/toolsandresources
@@ -65,37 +47,32 @@
     - http://craigkerstiens.com/2012/10/01/understanding-postgres-performance/
     - https://github.com/clips/pattern for easy NLP/network analysis/data mining
     - https://github.com/theodi/open-data-tech-review/wiki othr cleanup/linked data toola
-    - http://www.opentripplanner.org/apidoc/rest.plan.html 
     - http://selection.datavisualization.ch/ data viz tools catalog
-    - http://www.slideshare.net/OReillyStrata/visualizing-networks-beyond-the-hairball
-    - http://blog.sciencenet.cn/blog-554179-622011.html SNA tools catalog
-    - https://github.com/jacomyal/osdc2012-sigmajs-demo sigmajs filtering/searching
     - manipulating data - grep/find replace/sed/regex
     - d3 tools and tutorial http://enjalot.com/ http://news.ycombinator.com/item?id=4608440 
       - Why d3 is the way it is and how to make charts http://bost.ocks.org/mike/chart/
       - how to make an xkcd chart http://bl.ocks.org/3914862
-    - http://blog.josephwilk.net/ruby/latent-semantic-analysis-in-ruby.html similar terms usually found together
+
     - data viz
     - http://k2company.com/blog/2012/09/06/toolbox-for-learning-machine-learning-and-data-science/
     - http://williamparry.blogspot.com.au/2011/04/putting-data-into-google-fusion-tables.html google fusion tutorial
     - andrewharvey4.wordpress.com postgis/asgs tutorial
     - http://www.slideshare.net/maxdemarzi/etl-into-neo4j 
+
     - http://www.twotorials.com/ for R
       - http://www.r-bloggers.com/gradient-word-clouds/ http://www.rstudio.com/shiny/ http://blog.ouseful.info/2012/11/28/quick-shiny-demo-exploring-nhs-winter-sit-rep-data/ https://github.com/timelyportfolio/shiny-d3-plot https://github.com/trestletech/shiny-sandbox/tree/master/grn
       - http://is-r.tumblr.com/post/38240018815/making-prettier-network-graphs-with-sna-and-igraph
       - http://www.r-bloggers.com/video-simpler-tricks-and-tools-help-debugging-git-latex-and-workflow-with-r-by-prof-rob-hyndman/
       - http://yihui.name/knitr/ makes reports including google widgets/charts/maps via http://www.r-bloggers.com/googlevis-0-3-2-is-released-better-integration-with-knitr/
       - http://chartsnthings.tumblr.com/post/36978271916/r-tutorial-simple-charts http://flowingdata.com/2012/12/17/getting-started-with-charts-in-r/
-    - http://dydra.com/ 
+
+    - http://dydra.com/
     - http://selection.datavisualization.ch/ data viz tools list
     - http://nodexl.codeplex.com/ network graphs for excel
-    - http://sunfoundation.tumblr.com/ 
-    - css framework like bootstrap or zurb foundation
+    - http://sunfoundation.tumblr.com/
     - analysing - linked data tools
       - http://govcampau.wikispaces.com/useful+tools 
       - http://linkeddata.org/home 
-    - analysing - unstructured/nlp incl overviewer, opennlp/nltk, lucene/solr
-      - http://www.r-bloggers.com/simple-text-mining-with-r/ 
 
 
 # Hosted Developer Tools {#hosted-developer-tools}
@@ -116,9 +93,9 @@
 
 # The basics of being a data scientist
 

+*   Have a hypothesis � even if you’re making a tool/api that helps people with their questions too, remember what the objective of that is.
 *   Find the people and tools you need to prove/show/find. This rest of this page will help with the latter.

+*   Analyse and present results � were they what you expected? Do they help explain to others what you have found out? Can present as a interactive data visualisation or a web/mobile application or just a infographic/motion graphics video that tells a story.
 Please note, there are a combination of Analysis and Visualisation tools in each of the major categories below.
 
 # API Development {#api-development}
@@ -140,11 +117,21 @@
 
 Atlassian have a great page on what makes a good API [https](https://developer.atlassian.com/display/REST/Atlassian+REST+API+Design+Guidelines+version+1)[://](https://developer.atlassian.com/display/REST/Atlassian+REST+API+Design+Guidelines+version+1)[developer.atlassian.<wbr>com</wbr>](https://developer.atlassian.com/display/REST/Atlassian+REST+API+Design+Guidelines+version+1)[/display/REST/](https://developer.atlassian.com/display/REST/Atlassian+REST+API+Design+Guidelines+version+1)[Atlassian](https://developer.atlassian.com/display/REST/Atlassian+REST+API+Design+Guidelines+version+1)[+<wbr>REST+API+Design+Guidelines+<wbr>version+1</wbr></wbr>](https://developer.atlassian.com/display/REST/Atlassian+REST+API+Design+Guidelines+version+1)
 
-
-
-
-
-# Data Visualisation {#data-visualisation}
+API
+  - howto.gov api tutorial
+  - http://shancarter.com/data_converter/
+  - http://training.sunlightfoundation.com/module/data-visualizations-google-docs/
+  - api documentation
+    - WSDL or http://swagger.wordnik.com/ or https://github.com/mashery/iodocs
+    - http://symfony.com/ https://github.com/FriendsOfSymfony/FOSRestBundle http://williamdurand.fr/2012/08/02/rest-apis-with-symfony2-the-right-way/ https://github.com/nelmio/NelmioApiDocBundle better apis https://github.com/liip/LiipHelloBundle
+      - https://github.com/elc/rapi_doc https://github.com/Pajk/apipie-rails
+      -
+
+
+
+# Infographics and Data Visualisation {#data-visualisation}
+
+Infographics try to contextualise charts and graphs to tell a story. Data vis builds on this to find new ways to design insight.
 
 Most of the categories to follow have visualisation tools specific to their purpose.
 
@@ -154,6 +141,10 @@
 
 Also check out [http://thejit.org](http://thejit.org/) &amp; [http://www.senchalabs.org/<wbr>philogl/</wbr>](http://www.senchalabs.org/philogl/) (contributed by Matt Adcock)
 
+# Mobile
+html5 jquery mobile like directory.gov.au
+    - android datviz
+      - http://code.google.com/p/afreechart/ http://code.google.com/p/snowdon/ http://code.google.com/p/chartdroid/ http://androidplot.com/ http://code.google.com/p/achartengine/
 
 
 
@@ -213,7 +204,7 @@
 
 [Miso Dataset](http://misoproject.com/dataset/)
 

+[![](http://www.govhack.org/wp-content/uploads/How-to-participate-in-GovHack_html_m53b7ee38-293x300.png "miso screenshot")](http://www.govhack.org/wp-content/uploads/How-to-participate-in-GovHack_html_m53b7ee38.png)Javascript data transformation library � especially good if you want to use the output for javascript interactive visualisations because the transformations can be done on-the-fly by users.
 
 ### R Statistical Language
 
@@ -232,23 +223,35 @@
 ### D3.js (Data-Driven Documents)
 
 [![](http://www.govhack.org/wp-content/uploads/How-to-participate-in-GovHack_html_m90d8020-300x277.jpg "d3 screenshot")](http://www.govhack.org/wp-content/uploads/How-to-participate-in-GovHack_html_m90d8020.jpg)Javascript visualisations that are more interactive or intricate than charts. Can be hard to learn but there are examples and easier to use premade visualisations such as [word clouds](http://www.jasondavies.com/wordcloud/), [realtime filtering of barcharts](http://square.github.com/crossfilter/), or [bubble trees for comparing amount sizes](https://github.com/okfn/bubbletree).
+d3
+  - http://datadrivenjournalism.net/resources/data_driven_documents_defined
+    - http://www.benmcmahen.com/blog/posts/50eb57d55a94d35262000001 d3 svg
 
 ### Processing.js
 
 # Unstructured (text documents, webpages, metadata, tweets etc) Data Tools
 
 Scraperwiki
-Overviewer
+Overviewer/ Jigsaw
+http://www.cc.gatech.edu/gvu/ii/jigsaw/
+    -  opennlp/nltk, lucene/solr
+      - http://www.r-bloggers.com/simple-text-mining-with-r/
+
 R
-
+    - http://blog.josephwilk.net/ruby/latent-semantic-analysis-in-ruby.html similar terms usually found together
 
 # Graph (relationships and networks) Data Tools {#graph-relationships-and-networks-data-tools}
 
+    - http://www.slideshare.net/OReillyStrata/visualizing-networks-beyond-the-hairball
+    - http://blog.sciencenet.cn/blog-554179-622011.html SNA tools catalog
+    - https://github.com/jacomyal/osdc2012-sigmajs-demo sigmajs filtering/searching
+
+
 ## Analysis
 
 ### Neo4j
 

+[![](http://www.govhack.org/wp-content/uploads/webadmin-data-300x127.png "Neo4\. web admin screenshot")](http://www.govhack.org/wp-content/uploads/webadmin-data.png)Help understand relationships � how is X connected to Y and via what other entities they both are connected to. Imports and exports
 
 can be done using a preexisting tool like Gremlin or by writing a simple Java/Python/Ruby application. Queries can be tested in the built in data browser.
 
@@ -268,7 +271,7 @@
 
 ### [Graphviz](http://www.graphviz.org/)
 

+[![](http://www.govhack.org/wp-content/uploads/How-to-participate-in-GovHack_html_7579906d-300x184.png "Graphviz Screenshot")](http://www.govhack.org/wp-content/uploads/How-to-participate-in-GovHack_html_7579906d.png)Classic directed graph visualisation tool, can even [generate images online without installing](http://ashitani.jp/gv/) or use in webpages with [javascript port of software](http://code.google.com/p/canviz/). File format [�dot� very easy to learn](http://en.wikipedia.org/wiki/DOT_language)
 
 ### Gephi
 
@@ -329,7 +332,7 @@
 Illustration from Data Journalism Handbook, CC BY-SA 3.0</dd>
 
 

+The best high level reference is the �Understanding Data� and �Delivering Data� chapters of the Data Journalism Handbook which is available online for free at
 
 [datajournalismhandbook.org](http://datajournalismhandbook.org/)
 
@@ -363,6 +366,13 @@
 
 # Developer Tools For Your Computer {#developer-tools-for-your-computer}
 
+server admin / technical tools
+many projects will require some kind of internet presence, webpage etc.
+    - css framework like bootstrap or zurb foundation
+    video tools, youtube video editor/slideshow, FOSS video editing tools
+  - http://ubuntu-tutorials.com/2008/11/11/relaying-postfix-smtp-via-smtpgmailcom/
+  - amon
+
 ### Source Control &#8211\. Git / Subversion
 
 [![](http://www.govhack.org/wp-content/uploads/Screenshot-at-2012-04-29-172132-300x235.png "Git Screenshot")](http://progit.org/book/)

file:a/index.php -> file:b/index.php
--- a/index.php
+++ b/index.php
@@ -22,17 +22,33 @@
         <![endif]-->
 
         <!-- Add your site or application content here -->
-   
+        <div id="toc"></div>
+        <div id="wrapper">
+        <section>
 <?php
 include_once "php-markdown/markdown.php";
 echo Markdown(file_get_contents("index.md"));
 ?>
-
+</div>
+        </section>
         <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
         <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.8.0.min.js"><\/script>')</script>
         <script src="js/plugins.js"></script>
         <script src="js/main.js"></script>
+        <script src="js/jquery.stoc.js"></script>
+        <script src="js/toc/dist/jquery.toc.min.js"></script>
+        <script>
+            $('#toc').toc({
+                'selectors': 'h1'
+            });
+            /*$(function(){
 
+                $('<div class="items"></div>').insertAfter('h1');
+                $(".items").each(function() {
+                    $(this).stoc();
+                });
+            });*/
+        </script>
         <!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
         <script>
             var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];

file:b/js/jquery.stoc.js (new)
--- /dev/null
+++ b/js/jquery.stoc.js
@@ -1,1 +1,110 @@
+(function ($) {
+    $.fn.stoc = function (options) {
+        //Our default options
+        var defaults = {
+            depth: 6, //how many hN should we search
+            start: 1, //which hN will be the first (and after it we go just deeper)
+            stocTitle: "<h2>Contents</h2>", //what to display before our box
+            listType: "ul", //could be ul or ol
+            smoothScroll: 1
+        };
 
+        //let's extend our plugin with default or user options when defined
+        var options = $.extend(defaults, options);
+
+        return function () {
+            //"cache" our target and search objects
+            obj = $(this); //target
+            //let's declare some variables. We need this var declaration to create them as local variables (not global)
+            var appHTML = "", tagNumber = 0, txt = "", id = "", before = "", after = "", previous = options.start, start = options.start, depth = options.depth, i = 0, srcTags = "h" + options.start, cacheHN = "";
+
+            obj.nextUntil('h1').each(function () {
+                if ($(this).tagName == "h2" || $(this).tagName == "h3") {
+                    //we will cache our current H element
+                    cacheHN = $(this);
+                    //if we are on h1, 2, 3...
+                    tagNumber = ( cacheHN.get(0).tagName ).substr(1);
+
+                    //sets the needed id to the element
+                    id = cacheHN.attr('id');
+                    if (id == "") { //if it doesn't have only, of course
+                        id = "h" + tagNumber + "_" + i;
+                        cacheHN.attr('id', id);
+                    }
+                    //our current text
+                    txt = cacheHN.text();
+
+                    switch (true) { //with switch(true) we can do comparisons in each case
+                        case (tagNumber > previous) : //it means that we went down one level (e.g. from h2 to h3)
+                            appHTML = appHTML + "<" + options.listType + "><li>" + before + "<a href=\"#" + id + "\">" + txt + "</a>";
+                            previous = tagNumber;
+                            break;
+                        case (tagNumber == previous) : //it means that stay on the same level (e.g. h3 and stay on it)
+                            appHTML = appHTML + "</li><li>" + before + "<a href=\"#" + id + "\">" + txt + "</a>";
+                            break;
+                        case (tagNumber < previous) : //it means that we went up but we don't know how much levels  (e.g. from h3 to h2)
+                            while (tagNumber != previous) {
+                                appHTML = appHTML + "</" + options.listType + "></li>";
+                                previous--;
+                            }
+                            appHTML = appHTML + "<li>" + before + "<a href=\"#" + id + "\">" + txt + "</a></li>";
+                            break;
+                    }
+                    i++;
+                }
+            });
+            //corrects our last item, because it may have some opened ul's
+            while (tagNumber != options.start) {
+                appHTML = appHTML + "</" + options.listType + ">";
+                tagNumber--;
+            }
+            //append our html to our object
+            appHTML = options.stocTitle + "<" + options.listType + ">" + appHTML + "</" + options.listType + ">";
+            obj.append(appHTML);
+
+            //our pretty smooth scrolling here
+            // acctually I've just compressed the code so you guys will think that I'm the man . Source: http://css-tricks.com/snippets/jquery/smooth-scrolling/
+            if (options.smoothScroll == 1) {
+                $(window).load(function () {
+                    function filterPath(string) {
+                        return string.replace(/^\//, '').replace(/(index|default).[a-zA-Z]{3,4}$/, '').replace(/\/$/, '')
+                    }
+
+                    var locationPath = filterPath(location.pathname);
+                    var scrollElem = scrollableElement('html', 'body');
+                    obj.find('a[href*=#]').each(function () {
+                        var thisPath = filterPath(this.pathname) || locationPath;
+                        if (locationPath == thisPath && (location.hostname == this.hostname || !this.hostname) && this.hash.replace(/#/, '')) {
+                            var $target = $(this.hash), target = this.hash;
+                            if (target) {
+                                var targetOffset = $target.offset().top;
+                                $(this).click(function (event) {
+                                    event.preventDefault();
+                                    $(scrollElem).animate({scrollTop: targetOffset}, 400, function () {
+                                        location.hash = target
+                                    })
+                                })
+                            }
+                        }
+                    });
+                    function scrollableElement(els) {
+                        for (var i = 0, argLength = arguments.length; i < argLength; i++) {
+                            var el = arguments[i], $scrollElement = $(el);
+                            if ($scrollElement.scrollTop() > 0) {
+                                return el
+                            } else {
+                                $scrollElement.scrollTop(1);
+                                var isScrollable = $scrollElement.scrollTop() > 0;
+                                $scrollElement.scrollTop(0);
+                                if (isScrollable) {
+                                    return el
+                                }
+                            }
+                        }
+                        return[]
+                    }
+                });
+            }
+        };
+    };
+})(jQuery);

directory:b/js/toc (new)
--- /dev/null
+++ b/js/toc

file:b/tools.iml (new)
--- /dev/null
+++ b/tools.iml
@@ -1,1 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
 
+

file:b/tools/tools.iml (new)
--- /dev/null
+++ b/tools/tools.iml
@@ -1,1 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$/.." />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
 
+