LICENSE

@@ -1,21 +0,0 @@
-The MIT License (MIT)
-
-Copyright (c) 2016 Charles Reid
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

README.md

@@ -1,83 +0,0 @@
-# graphene
-
-Using Cantera and graphs to explore chemical reactions.
-
-Graphene is a repository with scripts for simulating chemical reactions using [Cantera](http://cantera.org/docs/sphinx/html/index.html),
-extracting information about those reactions, and visualizing that information
-using the [D3.js](https://d3js.org/) library.
-
-## Directories
-
-`cantera/` - Scripts to run Cantera to create a tabulated list of gas states for a particular reaction scenario.
-
-`cantera_data/` - Contains (sample) Cantera data.
-
-`postprocessing/` - Scripts to post-process Cantera data using Python. This takes the gas states in the `cantera_data/` directory and creates JSON data for D3.
-
-`d3_data/` - Contains JSON data for D3 visualizations.
-
-`pelican/` - Contains the contents of the Github pages site, which uses Pelican to turn Javascript/HTML/Markdown into a website.
-
-## Cantera
-
-Scripts for creating reactors, running simulations, and saving the state of the gas at specified intervals for post-processing. 
-
-Data does not go here; data goes into the `data/` directory.
-
-(Currently, the example script that is hacked together outputs a D3-ready JSON file directly from the script running Cantera simulations. 
-This method is faster, but skips intermediate steps and is less extensible/limited to simpler stuff.
-Doing this in a better way will require supporting structure in the form of object-oriented extensions to Cantera.
-That's where the <a href="https://charlesreid1.github.io/pantera">Pantera</a> library comes in. Pantera is not implemented in graphene yet.)
-
-
-## Cantera Data
-
-TODO
-
-This is the data folder. It contains example reaction data, so that you can get up and running with Graphene without the need for Cantera. 
-It also contains data output by the scripts in `create/`, which create reactors and generate reaction data.
-
-Data files in this directory are read in and processed by various Python post-processing scripts.
-These dump out JSON data that is readable by D3.
-
-(Also being skipped by a more straightforward Cantera-D3 process.)
-
-## Postprocessing
-
-TODO
-
-Contains Python scripts for post-processing Cantera data in `cantera_data/` directory 
-and turning it into JSON data for D3 in the `d3_data/` directory.
-
-(Also being skipped by a more straightforward Cantera-D3 process.)
-
-## Pelican
-
-The Pelican site hosts all of the D3 visualizations. Once a D3 data set has been generated in the `d3_data` directory,
-the D3 visualization that uses it are developed in the D3 directory, where Pelican can readily turn them into static HTML pages.
-
-# D3 visualizations
-
-## Species Generation Rates
-
-The first D3 viz I did was to illustrate how to extend the simple bar chart Block into an Angular.js app. 
-While this is not exciting, and requires much more code and much more labor than, say, a Matplotlib code,
-it is also extendable to other, more complex visualizations - such as the bubble chart version of species
-generation rates.
-
-These charts, in turn, can be embedded in pages with other charts and cross-linked, or made interactive by adding
-a panel to display information about elements that are clicked. While a single, static, simple bar chart may not 
-be utilizing all the amazing powers of D3, it does show how to work out some of the details, before moving on 
-to more complex visualizations.
-
-
-
-
-
-
-
-
-
-
-
-

authors.html

@@ -1,36 +1,35 @@
 <!DOCTYPE html>
-<html lang="{{ DEFAULT_LANG }}">
+<html lang="en">
 <head>
-        {% block head %}
-        <title>{% block title %}{{ SITENAME }}{% endblock title %}</title>
+        <title>graphene - Authors</title>
         <meta charset="utf-8" />
 
         <!--
         my CSS styles
         -->
-        <link href="{{ SITEURL }}/theme/css/bootstrap.css"      rel="stylesheet" type="text/css">
-        <link href="{{ SITEURL }}/theme/css/main.css"           rel="stylesheet" type="text/css">
+        <link href="/graphene/theme/css/bootstrap.css"      rel="stylesheet" type="text/css">
+        <link href="/graphene/theme/css/main.css"           rel="stylesheet" type="text/css">
 
-        <link href="{{ SITEURL }}/theme/css/cosmo.css"          rel="stylesheet" type="text/css">
-        <link href="{{ SITEURL }}/theme/css/font-awesome.css"   rel="stylesheet" type="text/css"/>
-        <link href="{{ SITEURL }}/theme/css/pygment.css"        rel="stylesheet" type="text/css"/>
+        <link href="/graphene/theme/css/cosmo.css"          rel="stylesheet" type="text/css">
+        <link href="/graphene/theme/css/font-awesome.css"   rel="stylesheet" type="text/css"/>
+        <link href="/graphene/theme/css/pygment.css"        rel="stylesheet" type="text/css"/>
 
         <!--
         include Angular first
-        <script type="text/javascript" src="{{ SITEURL }}/theme/js/angular-1.3.15.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/angular-1.3.15.js"></script>
         -->
         <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.20/angular.min.js"></script>
 
-        {% endblock head %}
 </head>
 
 <body id="index" class="home">
     <div class="container">
-        <h1><a href="{{SITEURL}}/">{{ SITENAME }} <strong>{{ SITESUBTITLE }}</strong></a></h1>
+        <h1><a href="/graphene/">graphene <strong></strong></a></h1>
         <hr />
 
-        {% block content %}
-        {% endblock %}
+    <h1>Authors on graphene</h1>
+
+    <ul>    </ul>
     </div>
 
     <footer id="contentinfo" class="body">
@@ -56,16 +55,16 @@
     </p>
 
         <!--
-        <script type="text/javascript" src="{{ SITEURL }}/theme/js/jquery-1.11.2.js"></script>
-        <script type="text/javascript" src="{{ SITEURL }}/theme/js/bootstrap-3.3.4.js"></script>
-        <script type="text/javascript" src="{{ SITEURL }}/theme/js/d3-3.5.5.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/jquery-1.11.2.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/bootstrap-3.3.4.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/d3-3.5.5.js"></script>
         -->
         <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
         <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/js/bootstrap.min.js"></script> 
         <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.js"></script> 
         <!--
-        <script type="text/javascript" src="{{ SITEURL }}/theme/js/leaflet-0.7.3.js"></script>
-        <script type="text/javascript" src="{{ SITEURL }}/theme/js/leaflet.ajax.min.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/leaflet-0.7.3.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/leaflet.ajax.min.js"></script>
         -->
     </footer><!-- /#contentinfo -->
 

cantera/README.md

@@ -1,66 +0,0 @@
-# Cantera
-
-These scripts will run Cantera, create reactors with the specified conditions, and operate them. 
-
-The resulting data winds up in `cantera_data/`. It consists of a set of simulation times and corresponding objects 
-representing the gas's thermochemical state (specified completely by specifying TPX, temperature pressure composition).
-With this list, post-processing scripts can create a Cantera gas object and set it to the exact condition of the gas 
-in that reaction scenario.
-
-Let's walk through a simple Cantera reactor setup - useful to test out whether Cantera works. 
-
-The sequence of steps needed is as follows:
-* Create a gas
-* Set the initial gas state (TPX)
-* Create a reactor
-* Fill the reactor with the gas
-* Create a reactor network
-* Set specified parameters (timestep, total time, etc.)
-* Advance the reactor network
-* Save and plot results, if desired
-
-Let's consider a mixture of ethylene and air autoigniting, simulated using the GRIMech 3.0 combustion mechanism.
-The above steps are performed for this ethylene air mixture in the `EthyleneTest.py` script.
-
-```
-import cantera as ct
-
-# Set the timestep and total simulation time
-dt = 0.001
-ttotal = 2.0
-
-# Use GRI Mech 3.0
-g = ct.Solution('gri30.xml')
-
-# Set the initial state of the gas
-g.TPX = 298.15 + 900, ct.one_atm, "CH4:4.0, O2:1.0, N2:3.762, H:0.00001"
-
-# Create a reactor, and a reactor network to simulate it.
-r = ct.Reactor(g)
-n = ct.ReactorNet([r])
-
-# This loop advances the reactor until we've reached the final time.
-c = 0
-t = dt
-time_data = []
-temp_data = []
-while True:
-    n.advance(t)
-
-    time_data.append(t)
-    temp_data.append(r.T)
-
-    t = t + dt
-
-    if(c % 10==0):
-        print "Current reactor time:",t
-    if t > ttotal:
-        break
-
-import matplotlib.pyplot as plt
-plt.plot(time_data,temp_data)
-plt.draw()
-plt.show()
-
-```
-

cantera/cantera_test_ethylene.py

@@ -1,39 +0,0 @@
-import cantera as ct
-
-# Set the timestep and total simulation time
-dt = 0.001
-ttotal = 2.0
-
-# Use GRI Mech 3.0
-g = ct.Solution('gri30.xml')
-
-# Set the initial state of the gas
-g.TPX = 298.15 + 900, ct.one_atm, "CH4:4.0, O2:1.0, N2:3.762, H:0.00001"
-
-# Create a reactor, and a reactor network to simulate it.
-r = ct.Reactor(g)
-n = ct.ReactorNet([r])
-
-# This loop advances the reactor until we've reached the final time.
-c = 0
-t = dt
-time_data = []
-temp_data = []
-while True:
-    n.advance(t)
-
-    time_data.append(t)
-    temp_data.append(r.T)
-
-    t = t + dt
-
-    if(c % 10==0):
-        print "Current reactor time:",t
-    if t > ttotal:
-        break
-
-import matplotlib.pyplot as plt
-plt.plot(time_data,temp_data)
-plt.draw()
-plt.show()
-

cantera/species_rxn_rates.py

@@ -1,85 +0,0 @@
-import cantera as ct
-import json
-'''
-Species reaction rate data
-
-This script exports species reaction rate data directly to JSON format - no postprocessing intermediate.
-
-This simulates ethylene autoignition for 1 second. 
-However, because we're hacking this, and not doing postprocessing,
-this will only output the state of the gas at one instant in time. 
-Specifically, t = 0.2 s.
-
-The JSON format is as follows:
-
-[
-    { 'species': 'C2H4', 'fwd_rxn_rate': 0.10, 'rev_rxn_rate': 0.25}
-    { 'species': 'O2', 'fwd_rxn_rate': 1.93, 'rev_rxn_rate': 0.00}
-]
-
-A generic JSON data set looks like this:
-
-[ 
-  { 'letter': 'A', 'frequency': 0.08},
-  { 'letter': 'B', 'frequency': 0.05}
-]
-
-'''
-
-# Set the timestep and total simulation time
-dt = 0.001
-ttotal = 0.5
-
-# Use GRI Mech 3.0
-g = ct.Solution('gri30.xml')
-
-# Set the initial state of the gas
-g.TPX = 298.15 + 900, ct.one_atm, "CH4:4.0, O2:1.0, N2:3.762, H:0.00001"
-
-# Create a reactor, and a reactor network to simulate it.
-r = ct.Reactor(g)
-n = ct.ReactorNet([r])
-
-# This loop advances the reactor until we've reached the final time.
-c = 0
-t = dt
-json_data = []
-while True:
-    n.advance(t)
-
-    if(c==200):
-
-        # Create species reaction data 
-        fr = g.forward_rates_of_progress
-        rr = g.reverse_rates_of_progress
-
-        for sp in g.species_names:
-            i = g.species_index(sp)
-            dat = {}
-            dat['species'] = sp
-            dat['fwd_rxn_rate'] = fr[i]
-            dat['rev_rxn_rate'] = rr[i]
-            json_data.append(dat)
-
-    t = t + dt
-    c = c + 1
-
-    if(c % 10==0):
-        print "Current reactor time:",t
-
-    if t > ttotal:
-        break
-
-# Note that we're writing data into d3_data/, not cantera_data/, 
-# because we're skipping the usual Python postprocessing.
-# Pantera classes and simple reactor and reactonet wrappers
-# will clean this whole thing up. For now, jump into D3: 
-# that's what we're really interested in, anyway.
-with open('../d3_data/species_rxn_rates.json','w') as f:
-    json.dump(json_data,f)
-
-#import matplotlib.pyplot as plt
-#plt.plot(time_data,temp_data)
-#plt.draw()
-#plt.show()
-

cantera_data/README.md

@@ -1,5 +0,0 @@
-# data
-
-Contains the output of the Cantera programs. As mentioned above, this data consists of a list of simulation times, 
-and a corresponding list of objects that will allow the thermochemical state of the gas to be completely specified.
-

hello/index.html

@@ -0,0 +1,108 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+        <title>Hello</title>
+        <meta charset="utf-8" />
+
+        <!--
+        my CSS styles
+        -->
+        <link href="/graphene/theme/css/bootstrap.css"      rel="stylesheet" type="text/css">
+        <link href="/graphene/theme/css/main.css"           rel="stylesheet" type="text/css">
+
+        <link href="/graphene/theme/css/cosmo.css"          rel="stylesheet" type="text/css">
+        <link href="/graphene/theme/css/font-awesome.css"   rel="stylesheet" type="text/css"/>
+        <link href="/graphene/theme/css/pygment.css"        rel="stylesheet" type="text/css"/>
+
+        <!--
+        include Angular first
+        <script type="text/javascript" src="/graphene/theme/js/angular-1.3.15.js"></script>
+        -->
+        <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.20/angular.min.js"></script>
+
+</head>
+
+<body id="index" class="home">
+    <div class="container">
+        <h1><a href="/graphene/">graphene <strong></strong></a></h1>
+        <hr />
+
+
+<div ng-app="myApp">
+
+    <div ng-controller="HelloController">
+        <p>
+        Angular has something to say: [[message]]
+        </p>
+    
+        <button class="btn btn-large btn-primary" ng-click="changeMessage()">
+          Change Message
+        </button>
+    
+    </div>
+
+</div>
+
+
+<script type="text/javascript">
+
+(function() {
+
+    function HelloController($scope) {
+        $scope.message = "Hello Cruel Angular World!";
+
+        $scope.changeMessage = function() {
+            $scope.message = "Goodbye Cruel Angular World!";
+        };
+    };
+
+    var a = angular.module("myApp", [], function($interpolateProvider) {
+                $interpolateProvider.startSymbol('[[');
+                $interpolateProvider.endSymbol(']]');
+            }
+        );
+    var c = a.controller("HelloController", ["$scope", HelloController]);
+
+})();
+
+</script>
+    </div>
+
+    <footer id="contentinfo" class="body">
+    <hr />
+    <p style="text-align: center">
+        <span class="fa-stack fa-lg">
+            <i class="fa fa-square fa-stack-2x"></i>
+            <i class="fa fa-terminal fa-stack-1x fa-inverse"></i>
+        </span>
+        Made from the command line with vim by 
+        <a href="http://charlesreid1.com">charlesreid1</a>.
+    </p>
+
+    <p style="text-align: center;">Made with HTML (
+    <a href="http://http://bootstrap.org/">Bootstrap</a>),
+    Javascript (
+    <a href="http://http://d3js.org/">D3.js</a>, 
+    <a href=https://angularjs.org/">Angular.js</a>),
+    Python (
+    <a href="http://getpelican.com">Pelican</a>,
+    <a href="http://cantera.org/docs/sphinx/html/index.html">Cantera</a>,
+    <a href="http://matplotlib.org">Matplotlib</a>).
+    </p>
+
+        <!--
+        <script type="text/javascript" src="/graphene/theme/js/jquery-1.11.2.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/bootstrap-3.3.4.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/d3-3.5.5.js"></script>
+        -->
+        <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
+        <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/js/bootstrap.min.js"></script> 
+        <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.js"></script> 
+        <!--
+        <script type="text/javascript" src="/graphene/theme/js/leaflet-0.7.3.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/leaflet.ajax.min.js"></script>
+        -->
+    </footer><!-- /#contentinfo -->
+
+</body>
+</html>

index.html

@@ -0,0 +1,156 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+        <title>graphene</title>
+        <meta charset="utf-8" />
+
+        <!--
+        my CSS styles
+        -->
+        <link href="/graphene/theme/css/bootstrap.css"      rel="stylesheet" type="text/css">
+        <link href="/graphene/theme/css/main.css"           rel="stylesheet" type="text/css">
+
+        <link href="/graphene/theme/css/cosmo.css"          rel="stylesheet" type="text/css">
+        <link href="/graphene/theme/css/font-awesome.css"   rel="stylesheet" type="text/css"/>
+        <link href="/graphene/theme/css/pygment.css"        rel="stylesheet" type="text/css"/>
+
+        <!--
+        include Angular first
+        <script type="text/javascript" src="/graphene/theme/js/angular-1.3.15.js"></script>
+        -->
+        <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.20/angular.min.js"></script>
+
+</head>
+
+<body id="index" class="home">
+    <div class="container">
+        <h1><a href="/graphene/">graphene <strong></strong></a></h1>
+        <hr />
+
+
+<style>
+    img.index_img {
+        width: 500px;
+        border-style: solid;
+        border-color: #ddd;
+        border-width: thin;
+    }
+    a.index_btn {
+        margin-top: 10px;
+    }
+    div.row {
+        margin-top: 25px;
+        margin-bottom: 25px;
+    }
+</style>
+
+<div class="container">
+<div class="row">
+
+
+
+<h2><b>welcome to graphene!</b></h2>
+
+<p class="lead">Graphene is a project to create D3.js graphs for thermodynamic and kinetic simulations
+performed with Cantera. Graphene is currently underway.
+</p>
+<p class="lead">Graphene utilizes the following languages, libraries, and utilities:
+<ul>
+    <li><b>Cantera (C++ and Python)</b> for running thermodynamic and kinetic models to create rich data sets.</li>
+    <li><b>Advanced object-oriented Python</b> for post-processing data</li>
+    <li><b>D3.js (Javascript)</b> for visualizing data</li>
+    <li><b>Angular.js (Javascript)</b> for stitching the pages, page elements, and graphs together.</li>
+    <li><b>Pelican (Pelican)</b> for managing page content and generating static HTML/JS/CSS content from markup files and Javascript code.</li>
+    <li><b>vim</b> is the best text editor
+</ul>
+</p>
+
+<p>&nbsp;</p>
+
+<p class="lead">Before we get started, let's just demonstrate how Angular works, with a simple Angular.js Hello World app. 
+This app is a lot more complicated on the backend than on the frontend, but it shows how to make a sekeleton Angular app.
+We'll be using Angular apps to make D3.js charts. Click the button below to visit the Hello Angular World test app:</p>
+<p><a class="index_btn btn btn-large btn-primary" href="hello/">Hello Angular World</a></p>
+
+<p>&nbsp;</p>
+<p>&nbsp;</p>
+
+</div>
+<div class="row">
+
+<p>&nbsp;</p>
+
+<h2><b>Species Generation Rates Rank Chart</b></h2>
+
+<p class="lead">Species are listed and ranked according to their generation rates.
+</p>
+<p>
+<img src="/graphene/images/speciesgenrank.png" class="index_img img-responsive" />
+</p>
+<p>
+<a class="index_btn btn btn-large btn-primary" 
+    href="speciesgenrates.html">Species Generation Rates</a></p>
+
+</div>
+
+<p>&nbsp;</p>
+<p>&nbsp;</p>
+
+</div>
+<div class="row">
+
+<p>&nbsp;</p>
+
+<h2><b>Species Consumption Rates Rank Chart</b></h2>
+
+<p class="lead">Species are listed and ranked according to their consumption rates.
+</p>
+<p>
+<img src="/graphene/images/speciesconrank.png" class="index_img img-responsive" />
+</p>
+<p>
+<a class="index_btn btn btn-large btn-primary" 
+    href="speciesconrates.html">Species Consumption Rates</a></p>
+
+</div>
+
+    </div>
+
+    <footer id="contentinfo" class="body">
+    <hr />
+    <p style="text-align: center">
+        <span class="fa-stack fa-lg">
+            <i class="fa fa-square fa-stack-2x"></i>
+            <i class="fa fa-terminal fa-stack-1x fa-inverse"></i>
+        </span>
+        Made from the command line with vim by 
+        <a href="http://charlesreid1.com">charlesreid1</a>.
+    </p>
+
+    <p style="text-align: center;">Made with HTML (
+    <a href="http://http://bootstrap.org/">Bootstrap</a>),
+    Javascript (
+    <a href="http://http://d3js.org/">D3.js</a>, 
+    <a href=https://angularjs.org/">Angular.js</a>),
+    Python (
+    <a href="http://getpelican.com">Pelican</a>,
+    <a href="http://cantera.org/docs/sphinx/html/index.html">Cantera</a>,
+    <a href="http://matplotlib.org">Matplotlib</a>).
+    </p>
+
+        <!--
+        <script type="text/javascript" src="/graphene/theme/js/jquery-1.11.2.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/bootstrap-3.3.4.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/d3-3.5.5.js"></script>
+        -->
+        <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
+        <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/js/bootstrap.min.js"></script> 
+        <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.js"></script> 
+        <!--
+        <script type="text/javascript" src="/graphene/theme/js/leaflet-0.7.3.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/leaflet.ajax.min.js"></script>
+        -->
+    </footer><!-- /#contentinfo -->
+
+</body>
+</html>

pelican/angular/hello.html

@@ -1,52 +0,0 @@
-{% extends 'base.html' %}
-
-{% set mytitle="Hello" %}
-
-{# ----------- title -------------- #}
-
-{% block title %}{{ mytitle }}{% endblock %}
-
-{# ----------- content ------------- #}
-
-{% block content %}
-
-<div ng-app="myApp">
-
-    <div ng-controller="HelloController">
-        <p>
-        Angular has something to say: [[message]]
-        </p>
-    
-        <button class="btn btn-large btn-primary" ng-click="changeMessage()">
-          Change Message
-        </button>
-    
-    </div>
-
-</div>
-
-
-<script type="text/javascript">
-
-(function() {
-
-    function HelloController($scope) {
-        $scope.message = "Hello Cruel Angular World!";
-
-        $scope.changeMessage = function() {
-            $scope.message = "Goodbye Cruel Angular World!";
-        };
-    };
-
-    var a = angular.module("myApp", [], function($interpolateProvider) {
-                $interpolateProvider.startSymbol('[[');
-                $interpolateProvider.endSymbol(']]');
-            }
-        );
-    var c = a.controller("HelloController", ["$scope", HelloController]);
-
-})();
-
-</script>
-{% endblock %}
-

pelican/angular/index.html

@@ -1,101 +0,0 @@
-{% extends 'base.html' %}
-
-{% set mytitle="graphene" %}
-
-{# ----------- title -------------- #}
-
-{% block title %}{{ mytitle }}{% endblock %}
-
-{# ----------- content ------------- #}
-
-{% block content %}
-
-<style>
-    img.index_img {
-        width: 500px;
-        border-style: solid;
-        border-color: #ddd;
-        border-width: thin;
-    }
-    a.index_btn {
-        margin-top: 10px;
-    }
-    div.row {
-        margin-top: 25px;
-        margin-bottom: 25px;
-    }
-</style>
-
-<div class="container">
-<div class="row">
-
-
-
-<h2><b>welcome to graphene!</b></h2>
-
-<p class="lead">Graphene is a project to create D3.js graphs for thermodynamic and kinetic simulations
-performed with Cantera. Graphene is currently underway.
-</p>
-<p class="lead">Graphene utilizes the following languages, libraries, and utilities:
-<ul>
-    <li><b>Cantera (C++ and Python)</b> for running thermodynamic and kinetic models to create rich data sets.</li>
-    <li><b>Advanced object-oriented Python</b> for post-processing data</li>
-    <li><b>D3.js (Javascript)</b> for visualizing data</li>
-    <li><b>Angular.js (Javascript)</b> for stitching the pages, page elements, and graphs together.</li>
-    <li><b>Pelican (Pelican)</b> for managing page content and generating static HTML/JS/CSS content from markup files and Javascript code.</li>
-    <li><b>vim</b> is the best text editor
-</ul>
-</p>
-
-<p>&nbsp;</p>
-
-<p class="lead">Before we get started, let's just demonstrate how Angular works, with a simple Angular.js Hello World app. 
-This app is a lot more complicated on the backend than on the frontend, but it shows how to make a sekeleton Angular app.
-We'll be using Angular apps to make D3.js charts. Click the button below to visit the Hello Angular World test app:</p>
-<p><a class="index_btn btn btn-large btn-primary" href="hello/">Hello Angular World</a></p>
-
-<p>&nbsp;</p>
-<p>&nbsp;</p>
-
-</div>
-<div class="row">
-
-<p>&nbsp;</p>
-
-<h2><b>Species Generation Rates Rank Chart</b></h2>
-
-<p class="lead">Species are listed and ranked according to their generation rates.
-</p>
-<p>
-<img src="{{SITEURL}}/images/speciesgenrank.png" class="index_img img-responsive" />
-</p>
-<p>
-<a class="index_btn btn btn-large btn-primary" 
-    href="speciesgenrates.html">Species Generation Rates</a></p>
-
-</div>
-
-<p>&nbsp;</p>
-<p>&nbsp;</p>
-
-</div>
-<div class="row">
-
-<p>&nbsp;</p>
-
-<h2><b>Species Consumption Rates Rank Chart</b></h2>
-
-<p class="lead">Species are listed and ranked according to their consumption rates.
-</p>
-<p>
-<img src="{{SITEURL}}/images/speciesconrank.png" class="index_img img-responsive" />
-</p>
-<p>
-<a class="index_btn btn btn-large btn-primary" 
-    href="speciesconrates.html">Species Consumption Rates</a></p>
-
-</div>
-
-{% endblock %}
-
-

pelican/angular/speciesgenrates/speciesconrates.html

@@ -1,47 +0,0 @@
-{% extends 'base.html' %}
-
-{% set mytitle="Species Generation Rates Rank Chart" %}
-
-{# ----------- title -------------- #}
-
-{% block title %}{{ mytitle }}{% endblock %}
-
-{# ----------- content ------------- #}
-
-{% block content %}
-
-<link href="{{ SITEURL }}/speciesconrates.css" rel="stylesheet" stype="text/css" />
-
-<div ng-app="speciesconratesApp">
-
-    <div ng-controller="speciesconratesController" ng-init="initialize()">
-
-        <div class="row">
-            <div class="col-md-12" id="head">
-                <speciesconrates-head></speciesconrates-head>
-            </div>
-        </div>
-
-        <div class="row">
-            <div class="col-md-12" id="chart">
-                <speciesconrates-chart></speciesconrates-chart>
-            </div>
-        </div>
-        
-        <div class="row">
-            <div class="col-md-12" id="text">
-                {% include 'speciesconrates.md' %}
-            </div>
-        </div>
-
-
-    </div>
-
-</div>
-
-<script type="text/javascript" src="{{ SITEURL }}/speciesconrates_modcontrol.js"></script>
-<script type="text/javascript" src="{{ SITEURL }}/speciesconrates_directives.js"></script>
-
-{% endblock %}
-
-

pelican/angular/speciesgenrates/speciesconrates.md

@@ -1,16 +0,0 @@
-This chart is based on a 
-<a href="http://bl.ocks.org/mbostock/3885304">bar chart block</a>.
-
-<p>&nbsp;</p>
-
-<h2>Ethylene-Air Flame</h2>
-
-<p>The bar chart above shows consumption rates of various species as predicted from
-a Cantera simulation of an idealized ethylene-air mixture. The species are ranked in order
-of decreasing consumption rates.
-</p>
-
-<p>The reaction rate is given in units of [mol/s].
-</p>
-
-

pelican/angular/speciesgenrates/speciesgenrates.html

@@ -1,47 +0,0 @@
-{% extends 'base.html' %}
-
-{% set mytitle="Species Generation Rates Rank Chart" %}
-
-{# ----------- title -------------- #}
-
-{% block title %}{{ mytitle }}{% endblock %}
-
-{# ----------- content ------------- #}
-
-{% block content %}
-
-<link href="{{ SITEURL }}/speciesgenrates.css" rel="stylesheet" stype="text/css" />
-
-<div ng-app="speciesgenratesApp">
-
-    <div ng-controller="speciesgenratesController" ng-init="initialize()">
-
-        <div class="row">
-            <div class="col-md-12" id="head">
-                <speciesgenrates-head></speciesgenrates-head>
-            </div>
-        </div>
-
-        <div class="row">
-            <div class="col-md-12" id="chart">
-                <speciesgenrates-chart></speciesgenrates-chart>
-            </div>
-        </div>
-        
-        <div class="row">
-            <div class="col-md-12" id="text">
-                {% include 'speciesgenrates.md' %}
-            </div>
-        </div>
-
-
-    </div>
-
-</div>
-
-<script type="text/javascript" src="{{ SITEURL }}/speciesgenrates_modcontrol.js"></script>
-<script type="text/javascript" src="{{ SITEURL }}/speciesgenrates_directives.js"></script>
-
-{% endblock %}
-
-

pelican/angular/speciesgenrates/speciesgenrates.md

@@ -1,16 +0,0 @@
-This chart is based on a 
-<a href="http://bl.ocks.org/mbostock/3885304">bar chart block</a>.
-
-<p>&nbsp;</p>
-
-<h2>Ethylene-Air Flame</h2>
-
-<p>The bar chart above shows consumption rates of various species as predicted from
-a Cantera simulation of an idealized ethylene-air mixture. The species are ranked in order
-of decreasing consumption rates.
-</p>
-
-<p>The reaction rate is given in units of [mol/s].
-</p>
-
-

pelican/pelicanconf.py

@@ -1,60 +0,0 @@
-#!/usr/bin/env python
-# -*- coding: utf-8 -*- #
-from __future__ import unicode_literals
-import re
-import os
-
-
-#SITEURL = ''
-AUTHOR = u'charlesreid1'
-SITENAME = u'graphene'
-SITEURL = '/graphene' ### DO IT LIVE
-
-PATH = 'content'
-TIMEZONE = 'America/Los_Angeles'
-DEFAULT_LANG = u'en'
-
-# the theme 
-THEME = 'simpleangular'
-
-# template locations
-EXTRA_TEMPLATES_PATHS = ['angular/',
-                         'angular/speciesgenrates']
-
-# template files 
-TEMPLATE_PAGES = {}
-
-# our custom index page
-TEMPLATE_PAGES['index.html'] = 'index.html'
-
-# hello angular world is at /hello/ --> /hello/index.html
-TEMPLATE_PAGES['hello.html'] = 'hello/index.html'
-
-# species rxn rates
-TEMPLATE_PAGES['speciesgenrates.html']          = 'speciesgenrates.html'
-TEMPLATE_PAGES['speciesgenrates.css']           = 'speciesgenrates.css'
-TEMPLATE_PAGES['speciesgenrates_modcontrol.js'] = 'speciesgenrates_modcontrol.js'
-TEMPLATE_PAGES['speciesgenrates_directives.js'] = 'speciesgenrates_directives.js'
-TEMPLATE_PAGES['speciesgenrates.json']          = 'speciesgenrates.json'
-
-TEMPLATE_PAGES['speciesconrates.html']          = 'speciesconrates.html'
-TEMPLATE_PAGES['speciesconrates.css']           = 'speciesconrates.css'
-TEMPLATE_PAGES['speciesconrates_modcontrol.js'] = 'speciesconrates_modcontrol.js'
-TEMPLATE_PAGES['speciesconrates_directives.js'] = 'speciesconrates_directives.js'
-TEMPLATE_PAGES['speciesconrates.json']          = 'speciesconrates.json'
-
-
-
-# --------------8<---------------------
-
-# Feed generation is usually not desired when developing
-FEED_ALL_ATOM = None
-CATEGORY_FEED_ATOM = None
-TRANSLATION_FEED_ATOM = None
-AUTHOR_FEED_ATOM = None
-AUTHOR_FEED_RSS = None
-
-DEFAULT_PAGINATION = False
-
-# Uncomment following line if you want document-relative URLs when developing
-#RELATIVE_URLS = True

pelican/simpleangular/templates/_index.html

@@ -1,4 +0,0 @@
-{% extends "base.html" %}
-{% block content %}
-<h2>welcome to the reluctant index <small>a page which is only here because it has to be</small></h2>
-{% endblock content %}

pelican/simpleangular/templates/article.html

@@ -1,29 +0,0 @@
-{% extends "base.html" %}
-{% block head %}
-  {{ super() }}
-  {% for keyword in article.keywords %}
-    <meta name="keywords" contents="{{keyword}}" />
-  {% endfor %}
-
-  {% for description in article.description %}
-    <meta name="description" contents="{{description}}" />
-  {% endfor %}
-
-  {% for tag in article.tags %}
-    <meta name="tags" contents="{{tag}}" />
-  {% endfor %}
-
-{% endblock %}
-
-{% block content %}
-<section id="content" class="body">
-  <header>
-  <h2 class="entry-title">
-      <a href="{{ SITEURL }}/{{ article.url }}" rel="bookmark"
-         title="Permalink to {{ article.title|striptags }}">{{ article.title }}</a></h2>
-  </header>
-  <div class="entry-content">
-    {{ article.content }}
-  </div><!-- /.entry-content -->
-</section>
-{% endblock %}

pelican/simpleangular/templates/authors.html

@@ -1,13 +0,0 @@
-{% extends "base.html" %}
-
-{% block title %}{{ SITENAME }} - Authors{% endblock %}
-
-{% block content %}
-    <h1>Authors on {{ SITENAME }}</h1>
-
-    <ul>
-    {%- for author, articles in authors|sort %}
-        <li><a href="{{ SITEURL }}/{{ author.url }}">{{ author }}</a> ({{ articles|count }})</li>
-    {% endfor %}
-    </ul>
-{% endblock %}

pelican/simpleangular/templates/page.html

@@ -1,5 +0,0 @@
-{% extends "base.html" %}
-{% block title %}{{ page.title }}{%endblock%}
-{% block content %}
-    {{ page.content }}
-{% endblock %}

postprocessing/README.md

@@ -1,16 +0,0 @@
-# postprocessing
-
-These postprocessing scripts will process the Cantera data listed above and turn it into usable JSON data sets 
-that D3 can read and use to build pretty charts.
-
-Just to illustrate, we can look at a simple example. Suppose we run a simulation of a mixture of ethylene and air combusting.
-We set up a Cantera script that creates a gas, a reactor, and a reactornet. It then dumps out the state of the gas, 
-along with the time, at fixed intervals. At this point, we may still have no idea what we're going to visualize.
-
-In the Python postprocessing script, we start to make decisions about our variables: what are the independent and dependent variables?
-What kind of relationship exists between them? What kind of information are we trying to show with a visualization? 
-What D3 chart type would lend itself to visualizing this information? We decide what information we want to extract
-(for example, we may be interested in species reaction rates for one chart, and reaction enthalpies for another chart.)
-
-The information we can visualize is only limited by what Cantera can compute - and that's a LOT.
-

speciesconrates.css

@@ -24,4 +24,3 @@
 .x.axis path {
   display: none;
 }
-

speciesconrates.html

@@ -0,0 +1,116 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+        <title>Species Generation Rates Rank Chart</title>
+        <meta charset="utf-8" />
+
+        <!--
+        my CSS styles
+        -->
+        <link href="/graphene/theme/css/bootstrap.css"      rel="stylesheet" type="text/css">
+        <link href="/graphene/theme/css/main.css"           rel="stylesheet" type="text/css">
+
+        <link href="/graphene/theme/css/cosmo.css"          rel="stylesheet" type="text/css">
+        <link href="/graphene/theme/css/font-awesome.css"   rel="stylesheet" type="text/css"/>
+        <link href="/graphene/theme/css/pygment.css"        rel="stylesheet" type="text/css"/>
+
+        <!--
+        include Angular first
+        <script type="text/javascript" src="/graphene/theme/js/angular-1.3.15.js"></script>
+        -->
+        <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.20/angular.min.js"></script>
+
+</head>
+
+<body id="index" class="home">
+    <div class="container">
+        <h1><a href="/graphene/">graphene <strong></strong></a></h1>
+        <hr />
+
+
+<link href="/graphene/speciesconrates.css" rel="stylesheet" stype="text/css" />
+
+<div ng-app="speciesconratesApp">
+
+    <div ng-controller="speciesconratesController" ng-init="initialize()">
+
+        <div class="row">
+            <div class="col-md-12" id="head">
+                <speciesconrates-head></speciesconrates-head>
+            </div>
+        </div>
+
+        <div class="row">
+            <div class="col-md-12" id="chart">
+                <speciesconrates-chart></speciesconrates-chart>
+            </div>
+        </div>
+        
+        <div class="row">
+            <div class="col-md-12" id="text">
+This chart is based on a 
+<a href="http://bl.ocks.org/mbostock/3885304">bar chart block</a>.
+
+<p>&nbsp;</p>
+
+<h2>Ethylene-Air Flame</h2>
+
+<p>The bar chart above shows consumption rates of various species as predicted from
+a Cantera simulation of an idealized ethylene-air mixture. The species are ranked in order
+of decreasing consumption rates.
+</p>
+
+<p>The reaction rate is given in units of [mol/s].
+</p>
+
+            </div>
+        </div>
+
+
+    </div>
+
+</div>
+
+<script type="text/javascript" src="/graphene/speciesconrates_modcontrol.js"></script>
+<script type="text/javascript" src="/graphene/speciesconrates_directives.js"></script>
+
+    </div>
+
+    <footer id="contentinfo" class="body">
+    <hr />
+    <p style="text-align: center">
+        <span class="fa-stack fa-lg">
+            <i class="fa fa-square fa-stack-2x"></i>
+            <i class="fa fa-terminal fa-stack-1x fa-inverse"></i>
+        </span>
+        Made from the command line with vim by 
+        <a href="http://charlesreid1.com">charlesreid1</a>.
+    </p>
+
+    <p style="text-align: center;">Made with HTML (
+    <a href="http://http://bootstrap.org/">Bootstrap</a>),
+    Javascript (
+    <a href="http://http://d3js.org/">D3.js</a>, 
+    <a href=https://angularjs.org/">Angular.js</a>),
+    Python (
+    <a href="http://getpelican.com">Pelican</a>,
+    <a href="http://cantera.org/docs/sphinx/html/index.html">Cantera</a>,
+    <a href="http://matplotlib.org">Matplotlib</a>).
+    </p>
+
+        <!--
+        <script type="text/javascript" src="/graphene/theme/js/jquery-1.11.2.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/bootstrap-3.3.4.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/d3-3.5.5.js"></script>
+        -->
+        <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
+        <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/js/bootstrap.min.js"></script> 
+        <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.js"></script> 
+        <!--
+        <script type="text/javascript" src="/graphene/theme/js/leaflet-0.7.3.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/leaflet.ajax.min.js"></script>
+        -->
+    </footer><!-- /#contentinfo -->
+
+</body>
+</html>

speciesconrates_directives.js

@@ -187,4 +187,3 @@ ng = a.directive('speciesconratesChart', function($compile) {
 dir.push(ng);
 
 
-

speciesconrates_modcontrol.js

@@ -70,4 +70,3 @@ function speciesconratesController($scope,myfactory) {
 // the first few arguments of the list should correspond to the Angular-namespace stuff to feed to HelloController
 var c = a.controller("speciesconratesController", ["$scope", "myfactory", speciesconratesController]);
 
-

speciesgenrates.css

@@ -24,4 +24,3 @@
 .x.axis path {
   display: none;
 }
-

speciesgenrates.html

@@ -0,0 +1,116 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+        <title>Species Generation Rates Rank Chart</title>
+        <meta charset="utf-8" />
+
+        <!--
+        my CSS styles
+        -->
+        <link href="/graphene/theme/css/bootstrap.css"      rel="stylesheet" type="text/css">
+        <link href="/graphene/theme/css/main.css"           rel="stylesheet" type="text/css">
+
+        <link href="/graphene/theme/css/cosmo.css"          rel="stylesheet" type="text/css">
+        <link href="/graphene/theme/css/font-awesome.css"   rel="stylesheet" type="text/css"/>
+        <link href="/graphene/theme/css/pygment.css"        rel="stylesheet" type="text/css"/>
+
+        <!--
+        include Angular first
+        <script type="text/javascript" src="/graphene/theme/js/angular-1.3.15.js"></script>
+        -->
+        <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.20/angular.min.js"></script>
+
+</head>
+
+<body id="index" class="home">
+    <div class="container">
+        <h1><a href="/graphene/">graphene <strong></strong></a></h1>
+        <hr />
+
+
+<link href="/graphene/speciesgenrates.css" rel="stylesheet" stype="text/css" />
+
+<div ng-app="speciesgenratesApp">
+
+    <div ng-controller="speciesgenratesController" ng-init="initialize()">
+
+        <div class="row">
+            <div class="col-md-12" id="head">
+                <speciesgenrates-head></speciesgenrates-head>
+            </div>
+        </div>
+
+        <div class="row">
+            <div class="col-md-12" id="chart">
+                <speciesgenrates-chart></speciesgenrates-chart>
+            </div>
+        </div>
+        
+        <div class="row">
+            <div class="col-md-12" id="text">
+This chart is based on a 
+<a href="http://bl.ocks.org/mbostock/3885304">bar chart block</a>.
+
+<p>&nbsp;</p>
+
+<h2>Ethylene-Air Flame</h2>
+
+<p>The bar chart above shows consumption rates of various species as predicted from
+a Cantera simulation of an idealized ethylene-air mixture. The species are ranked in order
+of decreasing consumption rates.
+</p>
+
+<p>The reaction rate is given in units of [mol/s].
+</p>
+
+            </div>
+        </div>
+
+
+    </div>
+
+</div>
+
+<script type="text/javascript" src="/graphene/speciesgenrates_modcontrol.js"></script>
+<script type="text/javascript" src="/graphene/speciesgenrates_directives.js"></script>
+
+    </div>
+
+    <footer id="contentinfo" class="body">
+    <hr />
+    <p style="text-align: center">
+        <span class="fa-stack fa-lg">
+            <i class="fa fa-square fa-stack-2x"></i>
+            <i class="fa fa-terminal fa-stack-1x fa-inverse"></i>
+        </span>
+        Made from the command line with vim by 
+        <a href="http://charlesreid1.com">charlesreid1</a>.
+    </p>
+
+    <p style="text-align: center;">Made with HTML (
+    <a href="http://http://bootstrap.org/">Bootstrap</a>),
+    Javascript (
+    <a href="http://http://d3js.org/">D3.js</a>, 
+    <a href=https://angularjs.org/">Angular.js</a>),
+    Python (
+    <a href="http://getpelican.com">Pelican</a>,
+    <a href="http://cantera.org/docs/sphinx/html/index.html">Cantera</a>,
+    <a href="http://matplotlib.org">Matplotlib</a>).
+    </p>
+
+        <!--
+        <script type="text/javascript" src="/graphene/theme/js/jquery-1.11.2.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/bootstrap-3.3.4.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/d3-3.5.5.js"></script>
+        -->
+        <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
+        <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/js/bootstrap.min.js"></script> 
+        <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.js"></script> 
+        <!--
+        <script type="text/javascript" src="/graphene/theme/js/leaflet-0.7.3.js"></script>
+        <script type="text/javascript" src="/graphene/theme/js/leaflet.ajax.min.js"></script>
+        -->
+    </footer><!-- /#contentinfo -->
+
+</body>
+</html>

speciesgenrates_directives.js

@@ -187,4 +187,3 @@ ng = a.directive('speciesgenratesChart', function($compile) {
 dir.push(ng);
 
 
-

speciesgenrates_modcontrol.js

@@ -70,4 +70,3 @@ function speciesgenratesController($scope,myfactory) {
 // the first few arguments of the list should correspond to the Angular-namespace stuff to feed to HelloController
 var c = a.controller("speciesgenratesController", ["$scope", "myfactory", speciesgenratesController]);
 
-