Merge pull request #66 from zakandrewking/populate

Updates to website and README for beta 3 release.

README.md

@@ -1,27 +1,28 @@
 Escher
 ======
 
-A web-based tool to build, view, share, and embed metabolic maps.
+Escher is a web-based tool to build, view, share, and embed metabolic maps.
 
 See the [wiki](https://github.com/zakandrewking/escher/wiki) for documentation, examples, and developer information.
 
 Follow [@zakandrewking](https://twitter.com/zakandrewking) for Escher updates, and ask for help on Stack Overflow with the [Escher](http://stackoverflow.com/questions/tagged/escher) tag.
 
 **NOTE**: Escher is still a Beta release, so please be patient with the early version as you may encounter bugs and other unexpected behavior. The documentation is also unfinished. Feel free to submit bugs and feature requests as Issues, or, better yet, Pull Requests.
 
-The easiest way to use Escher it to try our [live demo](http://zak.ucsd.edu:7778). 
+The easiest way to use Escher is to browse or build maps on the  [Escher website](http://zakandrewking.github.io/escher/).
 
 1) Using the Escher web tool
 ======
 
-When you open the [live demo](http://zak.ucsd.edu:7778), you will see a few options:
+When you open [Escher](http://zakandrewking.github.io/escher/), you will see a few options:
 
-- Model: Choose a COBRA model to load, for building reactions. You can also load your own model after you launch the tool.
-- Map: Try viewing and editing a pre-built map, or start from scratch with the Empty Builder
+- Filter by organism: Choose an organism to filter the Maps and Models.
+- Map: Try viewing and editing a pre-built map, or start from scratch with an empty builder by choosing None.
+- Model (Optional): Choose a COBRA model to load, for building reactions. You can also load your own model after you launch the tool.
 - Options:
     1. The Viewer allows you to pan and zoom the map, and to assign data to reactions and metabolites.
     2. The Builder, in addition to the Viewer features, allows you to add reactions, move and rotate existing reactions, and adjust the map canvas.
-    3. The Dev modes utilize local javascript files and are useful (a) if you are editing/developing the Escher source code, or (b) if you want to try using Escher offline.
+    3. Local modes are available if you download Escher and run the local server (see below). These let you view and build Escher maps offline.
 
 ## Supported browsers
 
@@ -37,7 +38,7 @@ https://github.com/opencobra/cobrapy/releases
 
 You can keep an eye on that GitHub repository to follow the progress on the latest version of COBRApy, which will be release along with Escher v1.0.
 
-Once you have COBRApy v0.3.0b1 installed, then you can generate a JSON model by following this example code:
+Once you have COBRApy v0.3.0b1 (or later) installed, then you can generate a JSON model by following this example code:
 
 http://nbviewer.ipython.org/github/zakandrewking/escher/blob/master/docs/notebooks/json_models_in_cobrapy.ipynb
 
@@ -104,15 +105,17 @@ python -m escher.server --port=8005
 4) Using the static javascript files
 =======
 
-You can include the escher-1.0.dev.js script in any html document. The only dependencies are [d3.js](http://d3js.org/), and [Twitter Bootstrap](http://getbootstrap.com) if you are using the option menu='all'.
+You can include the compiled Escher javascript file in any html document. The only dependencies are [d3.js](http://d3js.org/), and [Twitter Bootstrap](http://getbootstrap.com) if you are using the option menu='all'.
+
+These files can be found in `escher/lib`.
 
 5) Building and testing escher
 =======
 
 Build:
 
 ```shell
-python setup.py build
+python setup.py buildjs
 ```
 
 This builds both the minified and non-minified javascript files.

escher/css/index.css

@@ -29,7 +29,10 @@ footer {
     background-color: #291E1E;
     color: #eee;
 }
-footer a, a:hover, a:focus, a:visited {
+ a,  a:hover,  a:focus,  a:visited {
+    color: #CF6965;
+}
+footer a, footer a:hover, footer a:focus, footer a:visited {
     color: #FFA09D;
 }
 @media (max-width: 768px) {
@@ -69,6 +72,9 @@ footer a, a:hover, a:focus, a:visited {
 #logo {
     vertical-align: inherit;
 }
+#faq li {
+    padding-top: 5px;
+}
 @media (max-width: 768px) {
     #title-box {
 	width: 100%;

escher/js/web/index.js

@@ -68,9 +68,10 @@ function draw_models_select(data) {
 	});
     models.exit().remove();
 }
-function draw_maps_select(data) {	/** Draw the models selector.
+function draw_maps_select(data) {
+    /** Draw the models selector.
 
-					 */
+     */
     var filter_maps = function(map_id) {
 	var org = d3.select('#organisms').node().value;
 	if (org=='all')

escher/templates/index.html

@@ -61,7 +61,7 @@ <h3>Options</h3>
 	</div>
 	<div class="col-sm-6">
 	  <button type="button" id="submit" class="btn btn-default column-button">
-	    Submit
+	    Load map
 	  </button>
 	</div>
       </div>
@@ -71,9 +71,29 @@ <h3>Options</h3>
 	<div class="col-sm-12">
 	  <h2>FAQ</h2>
 	  <ol>
+	    <li><h4>What is Escher?</h4>
+	      <p>Escher is a web-based tool for building, viewing, and sharing
+	      visualizations of metabolic pathways. These 'pathway maps' are a
+	      great way to contextualize data about metabolism. More information
+	      and documentation can be found on <a href="{{github}}">Github</a>.
+	      </p>
+	    </li>
+	    <li><h4>Are there more maps available? Can I contribute maps?</h4>
+	      <p>Many maps for organisms in the <a href="http://bigg.ucsd.edu/">BIGG</a> database
+		will be uploaded to Escher before the v1.0 release. I will also
+		be providing details on how to submit maps <i>via</i> Github.</p>
+	    </li>
 	    <li><h4>How do I cite Escher?</h4>
-	      <p>Escher has not yet been published in a peer-review journal, but, in
-		the meantime, you can cite the code by DOI: [Fill in for release v1].</p>
+	      <p>Escher has not yet been published in a peer-reviewed journal,
+	      but, in the meantime, you can cite the code by DOI: [Fill in for
+	      release v1].</p>
+	    </li>
+	    <li><h4>I have more questions. Who do I ask?</h4>
+	      <p>You can follow <a href="https://twitter.com/zakandrewking">@zakandrewking</a>
+		for Escher updates, and ask for help on Stack Overflow with the
+		<a href="http://stackoverflow.com/questions/tagged/escher">Escher</a> tag. If
+		you find bugs or would like to contribute to the project, feel
+		free to submit an issue and or a pull request on <a href="{{github}}">Github</a>.</p> 
 	    </li>
 	  </ol>
 	</div>
@@ -84,7 +104,7 @@ <h2>FAQ</h2>
   <footer>
     <div class="container">
       <p class="more">
-	Learn more about <a href="{{github}}">Escher</a>.
+	Learn more about <a href="{{github}}">Escher</a>
       </p>
       <p class="version">
 	Version {{version}}