diff --git a/README b/README
deleted file mode 100644
index 769e6ad4..00000000
--- a/README
+++ /dev/null
@@ -1,9 +0,0 @@
-Genoverse is a portable, customizable, back-end independent JavaScript and HTML5 based genome browser which allows the user to explore data in a dynamic and interactive manner.
-
-Data is visualized in the browser, meaning Genoverse can be installed on any website and show data from a wide range of online or local sources.
-
-Genoverse works with a variety of formats, such as XML, JSON, BED, VCF, GFF, GFF3 or delimited text files, and can be customized to parse and display any data source as required.
-
-More information coming soon. If you have any questions, please contact info@genoverse.org
-
-Example: http://genoverse.org
diff --git a/README.md b/README.md
new file mode 100644
index 00000000..34ba9347
--- /dev/null
+++ b/README.md
@@ -0,0 +1,48 @@
+# Genoverse
+
+Genoverse is a portable, customizable, back-end independent JavaScript and HTML5 based genome browser which allows the user to explore data in a dynamic and interactive manner.
+
+Data is visualized in the browser, meaning Genoverse can be installed on any website and show data from a wide range of online or local sources.
+
+Genoverse works with a variety of formats, such as JSON, BED, BAM, VCF, GFF, delimited text files, or XML, and can be customized to parse and display any data source as required.
+
+Genoverse works using a system of [**tracks**](docs/tracks.md) - essentially horizontal sections of the genome browser which display **features** - genes, variants, etc. with defined genomic start and end points. Each track has its own data set stored in a **model**, a method for displaying that data, stored in a **view**, and a **controller** to manage the creation of DOM elements, and user interactions with them. 
+
+Tracks can have multiple models and views, which allows for switching between displays at different zoom levels. An example of this would be a track where you show genes when looking at a large region of a chromosome, and then switch to showing transcripts as the user zooms in.
+
+In addition to this, Genoverse has a set of [plugins](docs/plugins.md), which allow additional functionality beyond the core genome browser. These include a control panel for adding and removing tracks, and interacting with the browser more easily, a way to add controls to each individual track, and a way to enable drag and drop of local data files onto the genome browser.
+
+## Installation
+
+1. Download the latest version from GitHub
+  ```
+  git clone git@github.com:wtsi-web/Genoverse.git
+  ```
+
+2. Embed Genoverse using either
+  ```html
+  <script src="/path/to/Genoverse/js/genoverse.combined.js"></script>
+  ```
+
+  which comes with jQuery and jQuery UI included, or 
+  ```html
+  <script src="/path/to/Genoverse/js/genoverse.combined.nojquery.js"></script>
+  ```
+    
+  if you already have them in the page
+
+3. Add a script tag or JavaScript file which initializes Genoverse, e.g.
+  ```html
+  <script>
+    $(document).ready(function () {
+      var genoverse = new Genoverse({ ... configuration ... });
+    });
+  </script>
+  ```
+  See [index.html](/index.html) for example configuration, or the [documentation](docs/configuration.md) for more details about configuration properties.
+  
+Once initalized, the instance of Genoverse is avaliable as a jQuery data attribute on the container DOM element, and can be accessed by
+```javascript
+var genoverse = $(container).data('genoverse');
+```
+
diff --git a/docs/api.md b/docs/api.md
new file mode 100644
index 00000000..7b94f47e
--- /dev/null
+++ b/docs/api.md
@@ -0,0 +1,168 @@
+# API
+
+The following are methods that can be called on an instance of Genoverse or Genoverse.Track to perform actions required by UI changes external to the instance (i.e. from the website you have integrated Genoverse into).
+
+## Genoverse API
+
+#### genoverse.addTracks(tracks [, after ])
+> Add a number of tracks to the genome browser
+>
+> Argument | Type | Description
+> --- | --- | ---
+> tracks | Array | An array of `Genoverse.Track` class definitions to be added
+> after | Integer or undefined | The existing track after which the new tracks will be inserted. For example, if the existing tracks are `[ A, B, C, D, E ]`, `genoverse.addTracks([ X, Y ], 2)` will result in `[ A, B, X, Y, C, D, E ]`. If `undefined` , the tracks will be inserted after the existing tracks.
+
+#### genoverse.addTrack(track [, after ])
+> Add a single track to the genome browser
+>
+> Argument | Type | Description
+> --- | --- | ---
+> track | `Genoverse.Track` class | A `Genoverse.Track` class definition to be added
+> after | Integer or undefined | See `genoverse.addTracks`
+
+#### genoverse.removeTracks(tracks)
+> Remove a number of tracks from the genome browser
+>
+> Argument | Type | Description
+> --- | --- | ---
+> tracks | Array | An array of existing `Genoverse.Track` instances to be removed
+
+#### genoverse.removeTrack(track)
+> Remove a single track from the genome browser
+>
+> Argument | Type | Description
+> --- | --- | ---
+> track | `Genoverse.Track` instance | An existing `Genoverse.Track` instance to be removed
+
+#### genoverse.addHighlights(highlights)
+> Add a number of highlighted regions to the genome browser
+>
+> Argument | Type | Description
+> --- | --- | ---
+> tracks | Array | An array of highlighted regions to be added. See [configuration](configuration.md#highlights-default-) for the structure of highlights.
+
+#### genoverse.addHighlight(highlight)
+> Add a single highlighted regions to the genome browser
+>
+> Argument | Type | Description
+> --- | --- | ---
+> highlight | Object | A highlighted region to be added. See [configuration](configuration.md#highlights-default-) for the structure of highlights.
+
+#### genoverse.moveTo(chr, start, end [, update] [, keepLength])
+> Moves the viewpoint to the region between `start` and `end`
+>
+> Argument | Type | Description
+> --- | --- | ---
+> chr | String or undefined | The name of a chromosome defined by `genoverse.genome`. If `genoverse.genome` is undefined, `chr` must be undefined, or the current value of `genoverse.chr`.
+> start | Integer | A number between `1` and `genoverse.chromosomeSize`
+> end | Integer | A number between `start` and `genoverse.chromosomeSize`
+> update | Boolean or undefined | If `true`, the URL will be updated with the new `start` and `end`
+> keepLength | Boolean or undefined | if `true`, the new viewpoint will have the same zoom level as before (`end - start` remains unchanged), centered on the given `start` and `end`.
+
+#### genoverse.setWidth(width)
+> Resizes the `container` element for the instance of Genoverse
+>
+> Argument | Type | Description
+> --- | --- | ---
+> width | Integer | The width to resize to, in pixel
+
+#### genoverse.setDragAction(action)
+> Sets [`genoverse.dragAction`](/docs/configuration.md#dragaction-default-scroll), determining whether a drag (mousedown, mousemove, mouseup) results in the browser region moving, a region being selected, or nothing
+>
+> Argument | Type | Description
+> --- | --- | ---
+> action | `"select"`, `"scroll"`, or `"off"` | The value which `genoverse.dragAction` will be set to
+
+#### genoverse.setWheelAction(action)
+> Sets [`genoverse.wheelAction`](/docs/configuration.md#wheelaction-default-off), determining whether a mousewheel scroll zooms the browser in and out, or does nothing
+>
+> Argument | Type | Description
+> --- | --- | ---
+> action | `"zoom"` or `"off"` | The value which `genoverse.wheelAction` will be set to
+
+#### genoverse.closeMenus([ track ])
+> If `track` is a Genoverse.Track instance, closes (hides) all popup menus for that track. 
+> If `track` is `undefined`, closes all popup menus.
+> 
+> Argument | Type | Description
+> --- | --- | ---
+> track | Genoverse.Track instance or undefined | The object whose popup menus will be closed
+
+#### genoverse.on(events, [, onTracks ], callback)
+> Execute functions before or after Genoverse or Genoverse.Track functions
+>
+> Argument | Type | Description
+> --- | --- | ---
+> events | String | One or more space-separated events. Events are function names with an uppercase first letter, appended to "before" or "after", e.g. "beforeAddTrack" or "afterSetWidth".
+> onTracks | `"tracks"` or `Genoverse.Track` instance | If present, the callback will be executed on any track in the genome browser. *Note that providing a specific track instance does not mean the callback will be executed only for that track.* If omitted (i.e. `genoverse.on(events, callback)`, the callback will be executed on the instance of Genoverse.
+> callback | Function | The function to be executed for all of the space-separated events
+
+#### genoverse.on(events [, onTracks ])
+> Execute functions before or after Genoverse or Genoverse.Track functions
+>
+> Argument | Type | Description
+> --- | --- | ---
+> events | Object | An object whose keys are one or more space-separated events (see above), and whose values are the functions to be executed for those events
+> onTracks | `"tracks"` or `Genoverse.Track` instance | See above
+
+#### genoverse.once(events, [, onTracks ], callback)
+> Like [`genoverse.on`](#genoverseonevents--ontracks--callback), but the functions will only be called one time
+
+#### genoverse.once(events, [, onTracks ])
+> Like [`genoverse.on`](#genoverseonevents--ontracks-), but the functions will only be called one time
+
+#### genoverse.reset()
+> Removes all existing data visualizations, and recreates them
+
+#### genoverse.resetTrackHeights()
+> Sets all track heights to their initial values
+
+#### genoverse.destroy()
+> Removes the instance of Genoverse from the web page
+
+## Genoverse.Track API
+
+#### track.prop(key [, value ])
+> Get or set a property on the track or it's model, view or controller, without needing to know specifically which of these objects the property belongs to. Also available on `track.model`, `track.view`, and `track.controller` with identical functionality.
+>
+> Argument | Type | Description
+> --- | --- | ---
+> key | String | The name of the property to be returned.
+> value | Anything | If defined, the value of the property will be set to this argument. If `null`, the property will be removed from its object.
+
+#### track.setConfig(type, name)
+> Set the track's [configuration](/docs/tracks/configuration.md#changing-track-settings) after initalization
+>
+> Argument | Type | Description
+> --- | --- | ---
+> type | String | One of the keys in `track.configSettings`
+> name | String | One of the keys in `track.configSettings[type]`
+
+#### track.setConfig(config)
+> Set the track's [configuration](/docs/tracks/configuration.md#changing-track-settings) after initalization
+>
+> Argument | Type | Description
+> --- | --- | ---
+> config | Object | An object in the form `{ type1: "name1", type2, "name2" }`, where each `type` and `name` fulfills the criteria of `track.setConfig(type, name)`, above
+
+#### track.remove()
+> Remove the track from the genome browser
+
+#### track.disable()
+> Hide the track in the genome browser, without removing it
+
+#### track.enable()
+> Show the track in the genome browser, if it had previously been disabled
+
+#### track.reset()
+> Clears all data stored by the track's models and views, removes the images that have been drawn by the track so far, and then requests new data, and creates new images for the current location in the genome browser
+
+#### track.resetHeight()
+> Sets the track's height to its initial value
+
+#### track.updateName(name)
+> Changes the name of the track, as displayed in the label to the left of its images.
+>
+> Argument | Type | Description
+> --- | --- | ---
+> name | String | The name for the track.
diff --git a/docs/configuration.md b/docs/configuration.md
new file mode 100644
index 00000000..13e0c90f
--- /dev/null
+++ b/docs/configuration.md
@@ -0,0 +1,125 @@
+# Configuration
+
+Genoverse has a large number of configurable properties, in order to allow customization. A basic example with two tracks (a scalebar and some genes) and no plugins would be
+
+```js
+var genoverse = new Genoverse({ 
+  genome: 'grch38', 
+  tracks: [ Genoverse.Track.Scalebar, Genoverse.Track.Gene ] 
+});
+```
+
+The following properties can be provided to the constructor for Genoverse:
+
+## DOM element
+
+#### container (default `undefined`)
+> A DOM node, jQuery selector, or string to create a jQuery selector (e.g. `"#genoverse"`) inside which the instance of Genoverse will be created. 
+If `undefined`, a `<div>` element will be appended to `document.body`.
+
+#### width (default `1000`)
+> The width that the `container` DOM element will be
+
+## Genomic coordinates
+
+#### chr (default `1`)
+> A string or number defining the initial chromosome to display
+
+#### start (default `1`)
+> A string or number defining the initial start position
+
+#### end (default `1000000`)
+> A string or number defining the initial end position
+
+#### assembly (default `undefined`)
+> A string defining the assembly, which can be used by [track URL templates](/docs/tracks/configuration.md#url-default-undefined)
+
+#### genome (default `undefined`)
+> The genome to be used. Can be:
+>
+>  - an object with keys of the number/letter/name of the chromosomes, and values in the form `{ "size": 10000 }`. 
+>  Additionally an array of bands can be supplied for each chromosome for drawing purposes - see [js/genomes/grch38.js](https://github.com/wtsi-web/Genoverse/blob/gh-pages/js/genomes/grch38.js) for an example. These files can be created for species present in [Ensembl](http://www.ensembl.org/info/about/species.html) by modifying the example node script [utils/createGenome.js](https://github.com/wtsi-web/Genoverse/blob/gh-pages/utils/createGenome.js) for the species required.
+>  - a string (e.g. `"grch38"`) which will be used to obtain a javascript file from the [js/genomes](https://github.com/wtsi-web/Genoverse/tree/gh-pages/js/genomes) directory
+>  - `undefined`, in which case `chromosomeSize` **MUST** be set (see below)
+
+#### chromosomeSize (default `undefined`)
+> If `genome` not is provided, `chromosomeSize` **MUST** be set to the length of the chromosome. 
+>
+> If `genome` is provided, `chromosomeSize` will be set to the chromosome's `size` property, as defined by the genome object.
+
+## What is displayed
+
+#### tracks (default `[]`)
+> An array of `Genoverse.Track` definitions to be displayed
+
+#### highlights (default `[]`)
+> An array of regions to highlight, in the form 
+```
+{ "start": 100, "end", 200, "label": "My highlight", "removable": false }
+``` 
+> `label` defaults to "start-end" (e.g. "100-200") if not provided. 
+> 
+> If `removable === false`, the highlight cannot be removed.
+
+#### plugins (default `[]`)
+> An array of `Genoverse.Plugins` to be used (from the [js/plugins](https://github.com/wtsi-web/Genoverse/tree/gh-pages/js/plugins) directory), e.g. 
+```
+[ "controlPanel", "trackControls" ]
+```
+> The strings in this array correspond to the namespace of each plugin, which are the same as their file names. 
+
+## Interaction with the URL
+
+#### urlParamTemplate (default `"r=__CHR__:__START__-__END__"`)
+> The template used to alter the web browser's URL. Should contain placeholders for chr, start and end.
+>
+> If `false` or empty string, no changes will be made to the URL when navigation occurs. 
+
+#### useHash (default `undefined`)
+> Determines how the browser's URL gets updated on navigation. Can be:
+>
+> - `true` - use `window.location.hash`
+> - `false` - use `window.history.pushState`
+> - `undefined` - use `window.history.pushState` if present in the browser, else use `window.location.hash`
+
+## User actions
+
+#### dragAction (default `"scroll"`) 
+> The action performed when a mouse drag happens on the genome browser. Can be:
+>
+>  - `"scroll"` - Move the browser left or right
+>  - `"select"` - Select the region
+>  - `"off"`    - Do nothing
+
+#### wheelAction (default `"off"`) 
+> The action performed when a mouse drag happens on the genome browser. Can be:
+>
+>  - `"zoom"` - Zoom in or out
+>  - `"off"`    - Do nothing
+
+#### isStatic (default `false`)
+> If `true`, will stop drag, select and zoom actions occurring
+
+## Saving user configurations
+
+#### saveable (default `false`)
+> If `true`, track configuration and ordering will be saved in `window.sessionStorage`/`window.localStorage` (defined by `storageType`, below) so that users will see the same display when they refresh the page
+
+#### storageType (default `"sessionStorage"`)
+> The storage object used to save track configuration. Set to `"localStorage"` for permanence.
+>
+> See Mozilla's [sessionStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage) and [localStorage](https://developer.mozilla.org/en/docs/Web/API/Window/localStorage) documentation for further details.
+
+#### saveKey (default empty string)
+> The default key used in configuration storage is `"genoverse"`. `saveKey` will be appended to this to allow different configurations for different instances of Genoverse.
+
+## Default track display settings
+
+#### autoHideMessages (default `true`)
+> Determines whether to collapse track messages (toggleable pop-outs on the left side of a track's image)  by default when the user interacts with the genome browser
+
+#### trackAutoHeight (default `false`)
+> Determines whether to automatically resize tracks to show all their features (can be overridden by `track.autoHeight`)
+
+#### hideEmptyTracks (default `true`)
+> Determines whether to hide an automatically resized tracks if it has no features, or to show it empty (can be overridden by `track.hideEmpty`)
diff --git a/docs/functions.md b/docs/functions.md
new file mode 100644
index 00000000..78e0d688
--- /dev/null
+++ b/docs/functions.md
@@ -0,0 +1,266 @@
+# Genoverse functions
+
+The following are functions that exist in the Genoverse object. Any of these can have before/after hooks added to them, or be overwritten by supplying them as properties in configuration.
+
+## Initialization 
+
+#### genoverse.init()
+> Called once the Genoverse instance is created. Sets initial properties of the instance and calls functions to creates its DOM elements, event handlers, tracks and highlights, and set the starting location.
+
+#### genoverse.addDomElements(width)
+> Creates the DOM elements required by the instance of Genoverse
+>
+> Argument | Type | Description
+> --- | --- | ---
+> width | Integer | The width for the container DOM element (usually this should be the initial value of [`genoverse.width`](/docs/configuration.md#width-default-1000))
+
+#### genoverse.addUserEventHandlers()
+> Creates the event handlers required for users to interact with the instance of Genoverse
+
+## Configuration
+
+#### genoverse.loadConfig()
+> If [`genoverse.saveable`](/docs/configuration.md#saveable-default-false) is `true`, configuration will be loaded from `window[`[`genoverse.storageType`](/docs/configuration.md#storagetype-default-sessionstorage)`].getItem(`[`genoverse.saveKey`](/docs/configuration.md#savekey-default-empty-string)`)`. This configuration contains the user's previous tracks, their ordering, heights, and any other [track configuration settings](/docs/tracks/configuration.md#changing-track-settings). If no configuration exists, the default set of tracks will be used instead.
+
+#### genoverse.saveConfig()
+> If [`genoverse.saveable`](/docs/configuration.md#saveable-default-false) is `true`, the user's current tracks, their ordering, heights, and any other [track configuration settings](/docs/tracks/configuration.md#changing-track-settings) will be saved to `window[`[`genoverse.storageType`](/docs/configuration.md#storagetype-default-sessionstorage)`].getItem(`[`genoverse.saveKey`](/docs/configuration.md#savekey-default-empty-string)`)`.
+
+#### genoverse.resetConfig()
+> If [`genoverse.saveable`](/docs/configuration.md#saveable-default-false) is `true`, removes all tracks and unremovable highlights, adds the default set of tracks, and removes the value in [`genoverse.saveKey`](/docs/configuration.md#savekey-default-empty-string) from `window[`[`genoverse.storageType`](/docs/configuration.md#storagetype-default-sessionstorage)`]`.
+
+## Changing browser location
+
+#### genoverse.moveTo(chr, start, end [, update] [, keepLength])
+> See the [api documentation](/docs/api.md#genoversemovetochr-start-end--update--keeplength)
+
+#### genoverse.move(delta)
+> Move the browser region a number of pixels left or right. This will be translated into a new chromosomal location based on the current value of `genoverse.scale` (width of the browser's containing DOM element in pixels / size of genomic region being viewed).
+>
+> **Note:** [`genoverse.moveTo`](/docs/api.md#genoversemovetochr-start-end--update--keeplength) should be used instead to change the location of a Genoverse instance externally.
+> 
+> Argument | Type | Description
+> --- | --- | ---
+> delta | Integer | The number of pixels to move the browser region by (> 1 for left to right, < 1 for right to left)
+
+#### genoverse.setRange(start, end [, update] [, keepLength])
+> Sets [`genoverse.start`](/docs/configuration.md#start-default-1) and [`genoverse.end`](/docs/configuration.md#end-default-1000000), moving the browser region in the process.
+> 
+> **Note:** [`genoverse.moveTo`](/docs/api.md#genoversemovetochr-start-end--update--keeplength) should be used instead to change the location of a Genoverse instance externally.
+>
+> Argument | Type | Description
+> --- | --- | ---
+> start | Integer | A number between `1` and [`genoverse.chromosomeSize`](/docs/configuration.md#chromosomesize-default-undefined)
+> end | Integer | A number between `start` and [`genoverse.chromosomeSize`](/docs/configuration.md#chromosomesize-default-undefined)
+> update | Boolean or undefined | If `true`, the URL will be updated with the new `start` and `end`
+> keepLength | Boolean or undefined | if `true`, the new viewpoint will have the same zoom level as before (`end - start` remains unchanged), centered on the given `start` and `end`.
+
+#### genoverse.setScale()
+> Sets `genoverse.scale` to (width of the browser's containing DOM element in pixels / size of genomic region being viewed). If the scale changes, forces all tracks to draw new images at the new scale.
+
+## Track interactions
+
+#### genoverse.addTracks
+> See the [api documentation](/docs/api.md#genoverseaddtrackstracks--after-)
+
+#### genoverse.addTrack
+> See the [api documentation](/docs/api.md#genoverseaddtracktrack--after-)
+
+#### genoverse.removeTracks
+> See the [api documentation](/docs/api.md#genoverseremovetrackstracks)
+
+#### genoverse.removeTrack
+> See the [api documentation](/docs/api.md#genoverseremovetracktrack)
+
+#### genoverse.updateTrackOrder(e, ui)
+> Called when a user moves track labels to reorder tracks in the browser. Set the moved track's `order` property such that it is between the `order` properties of its new immediate siblings. [`genoverse.sortTracks`](#genoversesorttracks) is then called to update the position of the track's image element.
+> 
+> See [jQuery UI sortable update event](http://api.jqueryui.com/sortable/#event-update) for argument details.
+
+#### genoverse.sortTracks
+> Reorders the tracks' DOM elements based on each track's `order` property, lowest first.
+
+## Highlight interactions
+
+#### genoverse.addHighlights(highlights)
+> See the [api documentation](/docs/api.md#genoverseaddhighlightshighlights)
+
+#### genoverse.addHighlight(highlight)
+> See the [api documentation](/docs/api.md#genoverseaddhighlighthighlight)
+
+## URL interactions
+
+#### genoverse.updateURL
+> If [`genoverse.urlParamTemplate`](/docs/configuration.md#urlparamtemplate-default-r__chr____start__-__end__) is set, the URL will be updated to reflect the current browser region. This will be done either by using [`window.history.pushState`](https://developer.mozilla.org/en-US/docs/Web/API/History_API#The_pushState()_method), or by updating `window.location.hash`, depending on the value of [`genoverse.useHash`](/docs/configuration.md#usehash-default-undefined).
+
+#### genoverse.popState
+> Called by [`window.onpopstate`](https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onpopstate) or [`window.onhashchange`](https://developer.mozilla.org/en/docs/Web/API/WindowEventHandlers/onhashchange) to update the browser region if the user uses the back or forward buttons in their web browser.
+
+#### genoverse.getURLCoords
+> Returns an object in the form `{ "chr": "1", "start": 123, "end": 456 }` by parsing the URL using the value of [`genoverse.urlParamTemplate`](/docs/configuration.md#urlparamtemplate-default-r__chr____start__-__end__)
+
+#### genoverse.getQueryString
+> Returns a string of [`genoverse.urlParamTemplate`](/docs/configuration.md#urlparamtemplate-default-r__chr____start__-__end__) with the placeholders replaced with their relevant values, to be used in updating the URL. If [`genoverse.useHash`](/docs/configuration.md#usehash-default-undefined) is `false`, this will be appended to any existing value of `window.location.search` such that other parameters are unchanged.
+
+## Popup menus
+
+#### genoverse.makeMenu(features [, event, track ])
+> Creates a popup menu for one or more features. If more than one feature is provided, the popup will contain one link per feature which each create another popup for that feature
+> 
+> Argument | Type | Description
+> --- | --- | ---
+> features | Feature object or array of feature objects | The feature(s) to make the menu for
+> event | [jQuery event](http://api.jquery.com/category/events/) or undefined | The click event that created the menu, used to position the menu at the mouse pointer
+> track | Genoverse.Track or undefined | The track which was clicked on
+
+#### genoverse.makeFeatureMenu(features [, event, track ])
+> Called by [`genoverse.makeMenu`](#genoversemakemenufeatures--event-track-) to create a popup menu for a single feature
+> 
+> Argument | Type | Description
+> --- | --- | ---
+> feature | Feature object | The feature to make the menu for
+> event | [jQuery event](http://api.jquery.com/category/events/) or undefined | The click event that created the menu, used to position the menu at the mouse pointer
+> track | Genoverse.Track instance or undefined | The track which was clicked on
+
+#### genoverse.closeMenus([ track ])
+> See the [api documentation](/docs/api.md#genoverseclosemenus-track-)
+
+## User events
+
+#### genoverse.setDragAction(action)
+> See the [api documentation](/docs/api.md#genoversesetdragactionaction)
+
+#### genoverse.setWheelAction(action)
+> See the [api documentation](/docs/api.md#genoversesetwheelactionaction)
+
+#### genoverse.startDragScroll(e)
+> Initializes a scroll action
+>
+> Argument | Type | Description
+> --- | --- | ---
+> e | [jQuery event](http://api.jquery.com/category/events/) | The user event which starts a scroll operation
+
+#### genoverse.stopDragScroll([ update ])
+> Ends a scroll action
+>
+> Argument | Type | Description
+> --- | --- | ---
+> update | Boolean or undefined | If not `false`, will update the URL to the new location (providing the URL is changeable by the instance of Genoverse)
+
+#### genoverse.startDragSelect(e)
+> Initializes a select action
+>
+> Argument | Type | Description
+> --- | --- | ---
+> e | [jQuery event](http://api.jquery.com/category/events/) | The user event which starts a select operation
+
+#### genoverse.stopDragSelect(e)
+> Ends a select action, showing an actions menu for the selected region
+>
+> Argument | Type | Description
+> --- | --- | ---
+> e | [jQuery event](http://api.jquery.com/category/events/) | The user event which ends a select operation
+
+#### genoverse.cancelSelect()
+> Hides the region selection element
+
+#### genoverse.dragSelect(e)
+> Resizes the region selection element based on a mousemove event
+> 
+> Argument | Type | Description
+> --- | --- | ---
+> e | [jQuery event](http://api.jquery.com/category/events/) | The mousemove event
+
+#### genoverse.keydown(e)
+> If the shift key is pressed, region selection is enabled while it is held down (nothing happens if [`genoverse.dragAction`](/docs/configuration.md#dragaction-default-scroll) was already `"select"`). If the escape key is pressed, any popup menus (for track features or the region select menu) are hidden.
+>
+> Argument | Type | Description
+> --- | --- | ---
+> e | [jQuery event](http://api.jquery.com/category/events/) | The keydown event
+
+#### genoverse.keyup(e)
+> If the shift key is released, region selection is disabled if it was enabled by pressing the key initially (nothing happens if [`genoverse.dragAction`](/docs/configuration.md#dragaction-default-scroll) was already `"select"`).
+>
+> Argument | Type | Description
+> --- | --- | ---
+> e | [jQuery event](http://api.jquery.com/category/events/) | The keyup event
+
+#### genoverse.mousedown(e)
+> Starts a scroll or select action by calling [`genoverse.startDragScroll(e)`](#genoversestartdragscrolle) or [`genoverse.startDragSelect(e)`](#genoversestartdragselecte), based on the value of [`genoverse.dragAction`](/docs/configuration.md#dragaction-default-scroll)
+>
+> Argument | Type | Description
+> --- | --- | ---
+> e | [jQuery event](http://api.jquery.com/category/events/) | The mousedown event
+
+#### genoverse.mouseup(e)
+> Ends the current scroll or select action by calling [`genoverse.stopDragScroll(update)`](#genoversestopdragscroll-update-) or [`genoverse.stopDragSelect(e)`](#genoversestopdragselecte), as applicable
+>
+> Argument | Type | Description
+> --- | --- | ---
+> e | [jQuery event](http://api.jquery.com/category/events/) | The mouseup event
+
+#### genoverse.mousemove(e)
+> If a scroll action is taking place, moves the browser region as the mouse moves.
+> If a region select is taking place, changes the size of the selected region as the mouse moves.
+> If [`genoverse.dragAction`](/docs/configuration.md#dragaction-default-scroll) is `"select"` and a region select is not taking place, moves the region select element (a dotted red vertical line) to the location of the mouse pointer.
+>
+> Argument | Type | Description
+> --- | --- | ---
+> e | [jQuery event](http://api.jquery.com/category/events/) | The mousemove event
+
+#### genoverse.mousewheelZoom(e, delta)
+> Performs zoom in and zoom out operations
+>
+> Argument | Type | Description
+> --- | --- | ---
+> e | [jQuery event](http://api.jquery.com/category/events/) | The user event which will cause a zoom operation
+> delta | `1` or `-1` | `1` for zoom in, `-1` for zoom out
+
+#### genoverse.zoomIn([ x ])
+> Calls [`genoverse.setRange`](#genoversesetrangestart-end--update--keeplength) to zoom in, halving the size of the browser region (e.g. 100-200 becomes 125-175). If an `x` argument is provided, the zoom will step towards that point, instead of directly inward. `x`is the difference between the x coordinate of a mousewheel zoom event and the left offset of the browser images on the page.
+>
+> Argument | Type | Description
+> --- | --- | ---
+> x | Integer or undefined | The point to zoom towards
+
+#### genoverse.zoomOut([ x ])
+> Calls [`genoverse.setRange`](#genoversesetrangestart-end--update--keeplength) to zoom out, doubling the size of the browser region (e.g. 100-200 becomes 50-250). If an `x` argument is provided, the zoom will step towards that point, instead of directly outward. `x`is the difference between the x coordinate of a mousewheel zoom event and the left offset of the browser images on the page.
+>
+> Argument | Type | Description
+> --- | --- | ---
+> x | Integer or undefined | The point to zoom towards
+
+## Misc
+
+#### genoverse.on()
+> See the [api documentation](/docs/api.md#genoverseonevents--ontracks--callback)
+
+#### genoverse.once()
+> See the [api documentation](/docs/api.md#genoverseonceevents--ontracks--callback)
+
+#### genoverse.reset()
+> See the [api documentation](/docs/api.md#genoversereset)
+
+#### genoverse.destroy()
+> See the [api documentation](/docs/api.md#genoversedestroy)
+
+#### genoverse.setWidth(width)
+> See the [api documentation](/docs/api.md#genoversesetwidthwidth)
+
+#### genoverse.getChromosomeSize(chr)
+> If [`genoverse.genome`](/docs/configuration.md#genome-default-undefined) is an object, returns the size of the chromosome in the genome, else returns [`genoverse.chromosomeSize`](/docs/configuration.md#chromosomesize-default-undefined)
+>
+> Argument | Type | Description
+> --- | --- | ---
+> chr | String | The name of the chromosome
+
+#### genoverse.getSelectorPosition()
+> Returns an object in the form `{ "start": 1, "end": 2, "left": 1, "width", 1 }` representing the position of the region selector DOM element.
+> `start` and `end` are the genomic coordinates selected by the region, `left` and `width` are the CSS positional values of the element.
+
+#### genoverse.onTracks(functionName [, arg1, arg2, ...argN ])
+> Calls the function `functionName` on all tracks in the instance of Genoverse, with the arguments provided
+>
+> Argument | Type | Description
+> --- | --- | ---
+> functionName | String | The name of the function to call. This function can be in `Genoverse.Track`, `Genoverse.Track.Controller`, `Genoverse.Track.Model`, or `Genoverse.Track.View`
+> args | Anything | A list of arguments to be passed to the function being called
diff --git a/docs/plugins.md b/docs/plugins.md
new file mode 100644
index 00000000..009fd15a
--- /dev/null
+++ b/docs/plugins.md
@@ -0,0 +1,34 @@
+# Plugins
+
+Genoverse browser provides constitutive core functionality. `Genoverse.Plugins` namespace contains a set of optional, additional pieces of functionality - plugins - some projects may need and others might not.
+
+Genoverse can asynchronously load plugins from its [js/plugins](https://github.com/wtsi-web/Genoverse/tree/gh-pages/js/plugins) directory on your server itself. Or you may explicitly import plugins in your html with, for example, `<script src="Genoverse/js/plugins/controlPanel.js">` for slightly faster load times.
+
+## List of plugins
+
+### controlPanel
+Adds
+ - a "Tracks" button to the top left of the genome browser, which when clicked displays a list of enabled and available tracks, to be added or removed.
+ - a suite of buttons to the right of the genome browser, for scrolling, zooming and selecting regions of the genome
+ - the `karyotype` plugin
+
+### karyotype
+Adds an ideogram of the chromosome being used by the genome browser, with a marker showing the currently viewed region. The marker and be dragged and resized to change region, and chromosome bands can be jumped to by clicked on them.
+
+### trackControls
+Adds a toggleable pop-out menu on the right side of the track, containing buttons to view track information, remove the track, toggle the track between fixed height and auto resizing, and change track filters/configuration settings, if there are any.
+
+### resizer
+Adds a draggable handle to the bottom of each track, to allow the user to resize it to their desired height. If this plugin is not in use, tracks can only be resized to show all features currently in view.
+
+### focusRegion
+Adds a button to the control panel to move the viewpoint to a particular region of the genome. The `controlPanel` plugin will be added if not already in use.
+
+### fullscreen
+Adds a button to the control panel to enable the toggling of a full screen view of the genome browser. The `controlPanel` plugin will be added if not already in use.
+
+### tooltips
+Adds a button to the control panel to enable the toggling of a help tooltips for the genome browser. The `controlPanel` plugin will be added if not already in use.
+
+### fileDrop
+Adds the ability to drag and drop a local data file onto the genome browser, and have its data displayed as a track.
diff --git a/docs/tracks.md b/docs/tracks.md
new file mode 100644
index 00000000..bc43a8ed
--- /dev/null
+++ b/docs/tracks.md
@@ -0,0 +1,180 @@
+# Tracks
+
+Genoverse's tracks are responsible for obtaining data from a source (a URL, file, or JavaScript array) and visualizing it in the genome browser.
+
+Tracks are defined in the `Genoverse.Track` namespace. Each track has its own data, set stored in a [`Genoverse.Track.Model`](/docs/tracks/models.md), a method for displaying that data, stored in a [`Genoverse.Track.View`](/docs/tracks/views.md), and a [`Genoverse.Track.Controller`](/docs/tracks/controllers.md) to manage the creation of DOM elements, and user interactions with them. 
+
+Tracks and their MVC components are object-oriented, created using Dean Edward's [Base.js](http://dean.edwards.name/weblog/2006/03/base/) library. This library provides the `extend` function for inheritance, and the ability to call `this.base()` inside any inherited function in order to access it parent's method of the same name, for example:
+
+```javascript
+// Adapted from the example on http://dean.edwards.name/weblog/2006/03/base/
+var Parent = Base.extend({
+  method: function() {
+    alert("Hello World!");
+  }
+});
+
+var Child = Parent.extend({
+  method: function() {
+    // call the "super" method
+    this.base();
+    // add some code
+    alert("Hello again!");
+  }
+});
+
+new Child().method();
+// ==> Hello World!
+// ==> Hello again!
+```
+
+## Configuration
+
+The tracks to be used by an instance of Genoverse are defined by the [tracks configuration property](/docs/configuration.md#tracks-default-). This is an array containing either tracks from the [library](/docs/tracks/library.md), or extensions of them or `Genoverse.Track` itself, for example:
+
+```javascript
+[
+  Genoverse.Track.Scalebar,
+  Genoverse.Track.Gene.extend({
+    url: 'http://my.website.com/path/to/gene/data?chr=__CHR__&start=__START__&end=__END__'
+  }),
+  Genoverse.Track.extend({
+    id   : 'myTrack',
+    name : 'My track',
+    url  : 'http://my.website.com/path/to/track/data?chr=__CHR__&start=__START__&end=__END__'
+  })
+]
+```
+
+This would create a genome browser with three tracks - a scalebar, genes from your data source (rather than the default, which is Ensembl's REST API), and a set of rectangles drawn based on start and end coordinates given by `http://my.website.com/path/to/track/data`. 
+
+Track definitions can be extended to inherit or overwrite any functions existing in the `Genoverse.Track`, `Genoverse.Track.Model`, `Genoverse.Track.View` or `Genoverse.Track.Controller` namespaces, without having to know which namespace those functions are in. For example, the `draw` function is located in `Genoverse.Track.View`, but you can create a track which extends it as follows:
+
+```javascript
+Genoverse.Track.MyTrack = Genoverse.Track.extend({
+  draw: function () {
+    // Do my drawing operations
+
+    this.base.apply(this, arguments); // Call the parent function will all the input arguments
+  }
+});
+```
+
+The same is true for non-function properties of the MVC components. This makes it easy to create your own tracks without having to explicitly define their models, views and controllers. It should be noted however that if you want, for example, a reusable view, you will need to create a `Genoverse.Track.View`, at which point it is important to know what properties belong to it.
+
+For more details of the properties and functions which can be extended or overwritten to create new types of tracks, see [here](/docs/tracks/configuration.md).
+
+## Multiple models and views
+
+In addition to its default configuration, a track can also have multiple models and views, which are swapped in and out depending on the size of the region being viewed in the genome browser. These region size configurations are defined using numerical keys whose values are objects of properties to be used at or below those sizes. A good example of this is `Genoverse.Track.Gene`, which is defined as:
+
+```javascript
+Genoverse.Track.extend({
+  ...
+  2000000: { // This one applies when > 2M base-pairs per screen
+    labels : false
+  },
+  100000: { // more than 100K but less then 2M
+    labels : true,
+    model  : Genoverse.Track.Model.Gene.Ensembl,
+    view   : Genoverse.Track.View.Gene.Ensembl
+  },
+  1: { // > 1 base-pair, but less then 100K
+    labels : true,
+    model  : Genoverse.Track.Model.Transcript.Ensembl,
+    view   : Genoverse.Track.View.Transcript.Ensembl
+  }
+});
+```
+
+In regions between 1 (inclusive) and 100kb (exclusive), transcripts are displayed, with labels. In regions between 100k (inclusive) and 2Mb  (exclusive), genes are displayed with labels. Above 2Mb (inclusive), genes are displayed without labels. Note that the 2Mb configuration does not provide a model or view class - these are copied from the previous (next biggest numerical key, i.e. 100000) configuration. If smaller configurations do not provide model or view classes, the values for `track.model` and `track.view` are used. These default to `Genoverse.Track.Model` and `Genoverse.Track.View`.
+
+Another example would be:
+
+```javascript
+Genoverse.Track.extend({
+  ...
+  bump  : true,
+  10000 : false,
+  5000  : { bump: false }
+});
+```
+
+In this case, features in the track are "bumped" - moved vertically within the track so that no features overlap horizontally - between 1 and 4999bp. Between 5000 and 9999bp, the features are not bumped. At 10kb and above, features are not displayed. At all times, the track will use instances of `Genoverse.Track.Model` and `Genoverse.Track.View`. In fact, in this scenario the track has two views - one with bumping, the other without - but only one model, since no model properties are changed between configurations.
+
+## Allowing a user to change a track's configuration
+
+As well as multiple models and views, it is possible to add user controls to tracks, providing the [trackControls plugin](/docs/plugins.md#trackcontrols) is enabled. This plugin provides a pop-out menu on the right side of the track, containing a set of buttons for interacting with the track.
+
+It is possible to prepend additional controls to this menu by defining [`configSettings`](/docs/tracks/configuration.md#configsettings-default-undefined), [`defaultConfig`](/docs/tracks/configuration.md#defaultconfig-default-undefined), and [`controls`](/docs/tracks/configuration.md#controls-default-undefined), properties for a track. 
+
+### An example
+
+```javascript
+Genoverse.Track.extend({
+  data: [
+    { chr: 1, start: 1,    end: 1000, type: 'A', subtype: 1, color: 'black'  },
+    { chr: 1, start: 2000, end: 3000, type: 'A', subtype: 2, color: 'blue'   },
+    { chr: 1, start: 4000, end: 5000, type: 'B', subtype: 2, color: 'orange' },
+    { chr: 1, start: 6000, end: 7000, type: 'B', subtype: 1, color: 'purple' }
+  ],
+  controls: [
+    '<select data-control="type">' +
+      '<option value="all">All</option>' +
+      '<option value="a">Type A only</option>' +
+      '<option value="b">Type B only</option>' +
+    '</select>',
+    '<select data-control="subtype">' +
+      '<option value="all">All</option>' +
+      '<option value="1">Sub-type 1 only</option>' +
+      '<option value="2">Sub-type 2 only</option>' +
+    '</select>',
+    '<select data-control="colorscheme">' +
+      '<option value="default">Default</option>' +
+      '<option value="red">All red</option>' +
+      '<option value="green">All green</option>' +
+    '</select>',
+    $('<a title="Change feature height">Squish</a>').on('click', function () {
+      var track = $(this).text(function (i, text) { return /Un/.test(text) ? 'Squish' : 'Unsquish'; }).data('track');
+      track.setConfig('squish', !track.config.squish);
+    })
+  ],
+  configSettings: {
+    type: {
+      all : { featureFilter: false },
+      a   : { featureFilter: function (feature) { return feature.type == 'A'; } },
+      b   : { featureFilter: function (feature) { return feature.type == 'B'; } }
+    },
+    subtype: {
+      all : { featureFilter: false },
+      1   : { featureFilter: function (feature) { return feature.subtype == 1; } },
+      2   : { featureFilter: function (feature) { return feature.subtype == 2; } }
+    },
+    colorscheme: {
+      default : { beforeDrawFeature: false },
+      red     : { beforeDrawFeature: function (f) { f.color = 'red';   } },
+      green   : { beforeDrawFeature: function (f) { f.color = 'green'; } }
+    },
+    squish: {
+      true: {
+        featureHeight : 2,
+        featureMargin : { top: 1, right: 1, bottom: 1, left: 0 },
+        labels        : false
+      },
+      false: {
+        featureHeight : 6,
+        featureMargin : { top: 2, right: 2, bottom: 2, left: 0 },
+        labels        : true
+      }
+    }
+  },
+  defaultConfig: {
+    type        : 'all',
+    subtype     : 'all',
+    colorscheme : 'default',
+    squish      : false
+  }
+})
+```
+
+This example defines a track with four controls: one to filter features based on their `type` attribute, and a second to filter features based on their `subtype` attribute, a third to change the color used to draw those features, and a fourth to "squish" the features, giving them a smaller height and removing their labels. The `defaultConfig` attribute defines the initial state of those controls. Note that `featureFilter` controls can be combined so that, for example, it is possible to display only those features of type A and subtype 1.
diff --git a/docs/tracks/configuration.md b/docs/tracks/configuration.md
new file mode 100644
index 00000000..76183526
--- /dev/null
+++ b/docs/tracks/configuration.md
@@ -0,0 +1,179 @@
+# Track configuration
+
+The following are properties for `Genoverse.Track` and its MVC components. These can be overwritten to customize the way tracks get data and display it in the browser.
+
+## Track display, resizing, and reordering
+
+#### name (default `undefined`)
+> The name of the track, which appears in its label on the left of the genome browser
+
+#### height (default `12`)
+> The initial height in pixels of the DOM element containing the track
+
+#### resizable (default `true`)
+> Determines whether the track's height can changed. Can be:
+>
+> - `true` - the user can resize the track
+> - `false` - the track cannot be resized
+> - `"auto"` - the track will automatically resize to show all features, but the user cannot resize it themselves
+
+#### autoHeight (default `undefined`)
+> Determines whether the track automatically resize so that all the features are visible. Can be:
+>
+> - `true` - identical to `resizable = "auto"`, above
+> - `false` - the track will not automatically resize
+> - `undefined` - the track will use [`genoverse.trackAutoHeight`](/docs/configuration.md#trackautoheight-default-false) to set `track.autoHeight`
+
+#### hideEmpty (default `undefined`)
+> If the track automatically resizes, determines whether should it be hidden when there are no features
+>
+> - `true` - the track will be hidden if there are no features in view
+> - `false` - the track will be displayed if there are no features in view 
+> - `undefined` - the track will use [`genoverse.hideEmptyTracks`](/docs/configuration.md#hideemptytracks-default-true) to set `track.hideEmpty`
+
+#### margin (default `2`)
+> The whitespace in pixels between this track and the one below it in the genome browser. This will appear as extra pixels in height at the bottom of the track.
+
+#### border (default `true`)
+> If `true`, the track will have a 1px grey bottom border
+
+#### unsortable (default `false`)
+> If `true`, the track cannot be moved by the user. If `false`, a drag handle will appear next to the track's name, allowing the user to change its vertical position within the genome browser.
+
+## Fetching data
+
+#### url (default `undefined`)
+> The URL template used to fetch data from a server. Can contain placeholders for `__ASSEMBLY__`, `__CHR__`, `__START__`, and `__END__`, for example 
+> ```
+> http://my.website.com/__ASSEMBLY__/path/to/track/data?chr=__CHR__&start=__START__&end=__END__
+> ```
+> These placeholders will be replaces with [`genoverse.assembly`](/docs/configuration.md#assembly-default-undefined), `genoverse.chr`, and the start and end for the request respectively, before data is fetched from the server.
+
+#### urlParams (default `undefined`)
+> An object of query parameters to be added to each request for data, for example:
+> ```
+> url: "http://my.website.com/data?chr=__CHR__&start=__START__&end=__END__",
+> urlParams: { "foo": "bar" }
+> ```
+> will result in a URL like `http://my.website.com/data?chr=1&start=1&end=10000&foo=bar`
+
+#### data (default `undefined`)
+> Will be used instead of fetching data from a source, if defined as an array of objects (these objects should fulfill the requirements of a Genoverse **feature**). `track.url` is not required if `track.data` is supplied.
+
+#### allData (default `false`)
+> If `true`, the initial request for data is assumed to contain all the track's data for the current chromosome. No subsequent requests will be made as the user navigates the genome.
+
+#### dataType (default `"json"`)
+> The dataType setting to be used in the [jQuery.ajax](http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings) requests to get data for the track
+
+#### xhrFields (default `undefined`)
+> The xhrFields setting to be used in the [jQuery.ajax](http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings) requests to get data for the track
+
+## Drawing features
+
+#### featureHeight (default `undefined`)
+> The height of each feature, if `feature.height` is not set. If `undefined`,  will be set to `track.height`
+
+#### featureMargin (default `{ top: 3, right: 1, bottom: 1, left: 0 }`)
+> The space in pixels around each feature, used when positioning the feature on the canvas, and for bumping (below). If any property is left undefined, it will default to 0. Top and right margins can be overwritten for individual features using `feature.marginTop` and `feature.marginRight`. To draw features that should touch each other (e.g. bases of sequence), `featureMargin` should be set to `{ top: 0, right: 0, bottom: 0, left: 0 }`.
+
+#### color (default `"#000000"`)
+> The color for each features, if `feature.color` is not set
+
+#### fontColor (default `undefined`)
+> The default color for feature labels. If `undefined`, a feature's label color will be `feature.color`, or `track.color` (above), in that order of precedence.
+
+#### fontWeight (default ` "normal"`)
+> Combined with `fontHeight` and `fontFamily` to set the font for the canvas element used to draw the track's features
+
+#### fontHeight (default `10`)
+> Combined with `fontWeight` and `fontFamily` to set the font for the canvas element used to draw the track's features. Value is given in pixels.
+
+#### fontFamily (default `"sans-serif"`)
+> Combined with `fontHeight` and `fontWeight` to set the font for the canvas element used to draw the track's features
+
+#### labels (default `true`)
+> Determines how feature labels are drawn. Can be:
+> 
+> - `true` - display a feature's label directly below the feature, at the start of the feature
+> - `"overlay"` - display a feature's label within the feature, if the feature is wide enough to contain the label, in the center of the feature
+> - `"separate"` - display all features' labels on a separate canvas, below all of the features, in line with the start of their feature. Labels will be bumped (see below) to ensure they are all visible.
+> - `false` - do not display feature labels
+
+#### repeatLabels (default `false`)
+> If `true`, a feature's label is repeated along the length of the feature, such that an instance of the label will always be in view
+
+#### bump (default `false`)
+> Determines whether features are moved vertically within the track so that the do not overlap horizontally. Can be:
+> 
+> - `true` - features are moved vertically
+> - `false` - features are not moved vertically, and can overlap
+> `"labels"` - features are not moved vertically, but if `track.labels === true`, `track.labels` is set to `"separate"`, so labels can be bumped while features are not
+
+#### depth (default `undefined`)
+> If set to an integer, this is the maximum bumping depth for features in the track. Features which need to be moved vertically to beyond this depth (e.g. if depth = 2 and three features have the same start and end) will not be drawn.
+
+#### threshold (default `Infinity`)
+> The integer size of region above which the track's features are not drawn. Synonymous with `[numerical key]: false` ([see here](/docs/tracks.md#multiple-models-and-views)), such that 
+> ```
+> Genoverse.Track.extend({ threshold: 100000 })
+> ``` 
+> and 
+> ```
+> Genoverse.Track.extend({ 100000: false })
+> ```
+> have the same effect.
+
+## Interacting with features
+
+#### clickTolerance (default `0`)
+> Pixels of tolerance added to a click position when finding features for popup menus, when scale < 1. Increase to make it easier to click on small features (e.g. 1bp variants) when looking at large regions, at the cost of possibly showing feature menus for more features than expected.
+
+## Changing track settings
+
+#### configSettings (default `undefined`)
+> An object defining properties of the track (including its models, views, and controller) which can be changed after initialization, as follows:
+> ```javascript
+> {
+>   example1: {
+>     config1: { property1: "a", property2: "b", function1: function () { ... }, ... },
+>     config2: { property1: "x", property2: "y", function1: function () { ... }, ... }
+>   },
+>   example2: {
+>     config1: { property3: "a", property4: "b", function2: function () { ... }, ... },
+>     config2: { property3: "x", property4: "y", function2: function () { ... }, ... }
+>   }
+> }
+> ```
+> See [`track.setConfig`](/docs/tracks/api.md#tracksetconfigconfig) for details of how to change between different settings.
+
+#### defaultConfig (default `undefined`)
+> An object defining which `configSettings` are used on track initialization, in the form:
+> ```javascript
+> { example1: "config1", example2: "config2" }
+> ```
+> __Required__ when `configSettings` is provided.
+
+#### controls (default `undefined`)
+> An array providing users with the ability to change the track's configuration, providing the [trackControls plugin](/docs/plugins.md#trackcontrols) is enabled. 
+> The elements of the array can be:
+>
+> - a HTML string including a `"data-control"` attribute that can be made into a [jQuery](http://api.jquery.com/jQuery/#jQuery2) object 
+> - a jQuery object with a [data](http://api.jquery.com/jQuery.data/) `"control"` value, which will be cloned (data and events bound to the object will be included in the clone)
+> - an object as follows:
+>  
+>    ```javascript
+>    {
+>      "type": "select", // A type of DOM node
+>      "name": "example1", // Equivalent of data-control attribute
+>      "options": [ // other types of DOM node can be give, and don't require an options property
+>        { "value": "config1", "text": "Config 1" },
+>        { "value": "config2", "text": "Config 2" },
+>      ]
+>    }
+>    ```
+> 
+> In each case, the data-control attribute will be used as keys in the `configSettings` property (above), and the values of the control's option DOM elements will be used as keys within that. Alternatively, for non-select controls, a click handler could be added directly to the control, to perform modifications to the track.
+>
+
+[See here](/docs/tracks.md#allowing-a-user-to-change-a-tracks-configuration) for more information about track configurations.
diff --git a/docs/tracks/controllers.md b/docs/tracks/controllers.md
new file mode 100644
index 00000000..8b137891
--- /dev/null
+++ b/docs/tracks/controllers.md
@@ -0,0 +1 @@
+
diff --git a/docs/tracks/functions.md b/docs/tracks/functions.md
new file mode 100644
index 00000000..bcdc67e6
--- /dev/null
+++ b/docs/tracks/functions.md
@@ -0,0 +1,106 @@
+## Initialization
+
+The following functions are called during track creation and do not have before/after hooks.
+
+#### track.setInterface()
+> Creates a `track._interface` object which is used to determine whether properties and functions belong to the track's model, view, or controller
+
+#### track.setDefaults()
+> Sets initial properties of the track instance
+
+#### track.setDefaultConfig()
+> If [`track.defaultConfig`](/docs/tracks/configuration.md#defaultconfig-default-undefined) is defined, uses it to set the current config, and add the correct settings to the track
+
+#### track.setEvents()
+> Can be used to add events to the instance of Genoverse with [`genoverse.on`](/docs/api.md#genoverseonevents--ontracks--callback) if required by a particular type of track. By default does nothing.
+
+## [MVC interactions](/docs/tracks.md#multiple-models-and-views)
+
+#### track.setLengthMap()
+> Finds [numerical keys](/docs/tracks.md#multiple-models-and-views) in the track definition, and uses them to create a `track.lengthMap` array containing `Genoverse.Track.Model` and `Genoverse.Track.View` instances as required. 
+> 
+> `track.lengthMap` is in the form 
+> ```
+> [ 
+  [ 1,    { "model": modelInstance1,    "view": viewInstance1    } ], 
+  [ 1000, { "model": modelInstance1000, "view": viewInstance1000 } ],
+  ...
+]
+> ```
+> where the first element in each array is the relevant numerical key.
+> 
+> Also creates `track.models` and `tracks.views` objects in the form
+> ```
+> track.models = { "1": modelInstance1, "1000": modelInstance1000, ... }
+> track.views  = { "1": viewInstance1,  "1000": viewInstance1000,  ... }
+> ```
+> Called once during track initalization. Does not have before/after hooks.
+
+#### track.setMVC()
+> Creates the instance of `Genoverse.Track.Controller` required by the track the first time it is called.
+> Sets the model and view of a track, based on the current size of the browser region, determined by calling [`track.getSettingsForLength`](#trackgetsettingsforlength). 
+
+#### track.newMVC(object [, functions, properties ])
+> Returns a new instance of a `Genoverse.Track.Model`, `Genoverse.Track.View`, or `Genoverse.Track.Controller`
+> 
+> Argument | Type | Description
+> --- | --- | ---
+> object | `Genoverse.Track.Model`, `Genoverse.Track.View` or `Genoverse.Track.Controller` class | The class to be instantiated
+> functions | Object or `undefined` | An object whose values are functions to be overwritten in the instance
+> properties | Object or `undefined` | An object whose values are non-function properties to be overwritten in the instance
+
+#### track.getSettingsForLength()
+> Returns the value of [`track.lengthMap`](#tracksetlengthmap) with the lowest first element value which is less that the current size of the browser region
+
+## [User configuration](/docs/tracks.md#allowing-a-user-to-change-a-tracks-configuration)
+
+#### track.setConfig()
+> See the [api documentation](/docs/api.md#tracksetconfigtype-name)
+
+#### track.getConfig(type)
+> Returns the name of the current [`track.configSetting`](/docs/tracks/configuration.md#configsettings-default-undefined) in use for the given `type` of config
+> 
+> Argument | Type | Description
+> --- | --- | ---
+> type | String | The type of config setting
+
+## Enabling and disabling
+
+#### track.enable()
+> See the [api documentation](/docs/api.md#trackenable)
+
+#### track.disable()
+> See the [api documentation](/docs/api.md#trackdisable)
+
+#### track.reset()
+> See the [api documentation](/docs/api.md#trackreset)
+ 
+#### track.remove()
+> See the [api documentation](/docs/api.md#trackremove)
+
+## Misc
+
+#### track.setHeight(height [, forceShow ])
+> Sets `track.height`. If the track needs to be hidden, `track.height` will be set to `0`. 
+> 
+> Argument | Type | Description
+> --- | --- | ---
+> height | Integer | The new height for the track
+> forceShow | Boolean or `undefined` | If `true`, `height` will be used even if the track would normally be hidden
+
+#### track.resetHeight()
+> See the [api documentation](/docs/api.md#trackresetheight)
+
+#### track.addLegend([ config, class ])
+> Creates a `Genoverse.Track.Legend` instance for the track, adding it to the browser.
+>
+> Argument | Type | Description
+> --- | --- | ---
+> config | Object or `undefined` | Properties to be given to the legend class constructor
+> class | Child class of `Genoverse.Track.Legend` or `undefined` | The class to be used for the legend. Defaults to `Genoverse.Track.Legend`.
+
+#### track.updateName(name)
+> See the [api documentation](/docs/api.md#trackupdatenamename)
+
+#### track.prop(key [, value ])
+> See the [api documentation](/docs/api.md#trackpropkey--value-)
diff --git a/docs/tracks/library.md b/docs/tracks/library.md
new file mode 100644
index 00000000..8b137891
--- /dev/null
+++ b/docs/tracks/library.md
@@ -0,0 +1 @@
+
diff --git a/docs/tracks/models.md b/docs/tracks/models.md
new file mode 100644
index 00000000..8b137891
--- /dev/null
+++ b/docs/tracks/models.md
@@ -0,0 +1 @@
+
diff --git a/docs/tracks/views.md b/docs/tracks/views.md
new file mode 100644
index 00000000..8b137891
--- /dev/null
+++ b/docs/tracks/views.md
@@ -0,0 +1 @@
+