diff --git a/asterix-examples/src/main/resources/black-cherry/cherry.tpl b/asterix-examples/src/main/resources/black-cherry/cherry.tpl
index 7989dae..74dfe99 100755
--- a/asterix-examples/src/main/resources/black-cherry/cherry.tpl
+++ b/asterix-examples/src/main/resources/black-cherry/cherry.tpl
@@ -1,190 +1,230 @@
 <!DOCTYPE html>
 <html style="width: 100%; height: 100%;">
-  <head>
-    <title>ASTERIX Demo</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+<head>
+  <title>ASTERIX Demo</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
-    <link rel="shortcut icon" type="image/png" href="static/img/hyrax.png">
+  <link rel="shortcut icon" type="image/png" href="static/img/hyrax.png">
 
-    <!-- Bootstrap & jQuery Styles -->
-    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
-    <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" type="text/css">
-    
-    <!-- Bootstrap Javascript -->
-    <script src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places" type="text/javascript"></script>
-    
-    <script src="http://code.jquery.com/jquery.min.js"></script>
-    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
-    <script src="static/js/bootstrap.min.js"></script>
-    <script src="static/js/asterix-sdk-stable.js"></script>
-    <script src="static/js/rainbowvis.js"></script>
-    <script src="static/js/cherry.js"></script>
-    
-    <style type="text/css">
-        
-        #map_canvas img {
-            max-width: none;
-        }
-        
-        .panel-primary {
-          border-color: #273f93;
-        }
-        
-        .panel-primary .panel-heading {
-            color: white;
-            background-color: #273f93;
-            border-color: #273f93;
-        }
-        
-        #start-date, #end-date {
-            position: relative; z-index:100;
-        }
-        
-        #keyword-textbox, #location-text-box {
-            width: 100%;
-        }
-    </style>
-  </head>
-  <body style="width: 100%; height: 100%;">
-    
-    <!-- Nav -->
-    <div class="navbar navbar-default navbar-static-top">
-      <div class="container">
-        <div class="navbar-header">
-          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
-            <span class="icon-bar"></span>
-            <span class="icon-bar"></span>
-            <span class="icon-bar"></span>
-          </button>
-          <a class="navbar-brand" href="#" style="padding: 0.25em;">
-            <img src="static/img/finalasterixlogo.png">
-          </a>
-        </div>
-        <div class="navbar-collapse collapse">
-          <ul class="nav navbar-nav">
-            <li id="about-active"><a id="about-mode" href="#">About</a></li>
-            <li id="explore-active" class="active"><a id="explore-mode" href="#">Explore</a></li>
-            <li id="review-active"><a id="review-mode" href="#">Review</a></li>
-          </ul>
-        </div>
-      </div>
-    </div><!-- /Nav -->
+  <!-- Bootstrap & jQuery Styles -->
+  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
+  <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" type="text/css">
 
-    <!-- Search Box -->
+  <!-- Bootstrap Javascript -->
+  <script src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places" type="text/javascript"></script>
+
+  <script src="http://code.jquery.com/jquery.min.js"></script>
+  <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
+  <script src="static/js/bootstrap.min.js"></script>
+  <script src="static/js/asterix-sdk-stable.js"></script>
+  <script src="static/js/rainbowvis.js"></script>
+  <script src="static/js/cherry.js"></script>
+
+  <style type="text/css">
+
+  .tab-content {
+    clear: none;
+  }
+
+  #map_canvas img {
+    max-width: none;
+  }
+
+  .panel-primary {
+    border-color: #273f93;
+  }
+
+  .panel-primary .panel-heading {
+    color: white;
+    background-color: #273f93;
+    border-color: #273f93;
+  }
+
+  #start-date, #end-date {
+    position: relative; z-index:100;
+  }
+
+  #keyword-textbox, #location-text-box {
+    width: 100%;
+  }
+  </style>
+</head>
+<body style="width: 100%; height: 100%;">
+
+  <!-- Nav -->
+  <div class="navbar navbar-default navbar-static-top">
     <div class="container">
-    
-      <div class="row" id="r1">
-        <div class="col-md-5">
-          <div class="container well" id="explore-well">
-          
-            <!-- Query Builder -->
-            <div class="panel panel-primary">
-              <div class="panel-heading"><h4><b>Query Builder</b></h4></div>
-              
-              <!-- List group -->
-              <ul class="list-group">
-              
-                <!-- Search Keyword -->
-                <li class="list-group-item">
-                  <h4 class="list-group-item-heading">Keyword</h4>
-                  <input type="text" id="keyword-textbox" placeholder="Enter a keyword, e.g., verizon">
-                </li>
-                
-                <!-- Location -->
-                <li class="list-group-item">
-                  <h4 class="list-group-item-heading">Location</h4>
-                  <input class="textbox" type="text" id="location-text-box">
-                  <div class="btn-group" data-toggle="buttons">
-                    <label class="btn btn-default">
-                      <input type="radio" id="location-button"> Location
-                    </label>
-                    <label class="btn btn-default">
-                      <input type="radio" id="selection-button"> Selection
-                    </label>
-                  </div>
-               </li>
-                
-                <!-- Date Range -->
-                <li class="list-group-item">
-                  <h4 class="list-group-item-heading">Limit Date Range</h4>
-                  <input type="text" class="textbox" id="start-date"><span class="badge">Start Date</span><br/>
-                  <input type="text" class="textbox" id="end-date"><span class="badge">End Date</span>
-                </li>
-                
-                <!-- Results Resolution -->
-                <li class="list-group-item">
-                  <h4 class="list-group-item-heading">Result Group Size</h4>
-                  <div class="grid-slider" id="grid-lat-slider"></div>
-                  <div class="control-label">Latitude: <span id="gridlat">3.0</span></div>
+      <div class="navbar-header">
+        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+          <span class="icon-bar"></span>
+          <span class="icon-bar"></span>
+          <span class="icon-bar"></span>
+        </button>
+        <a class="navbar-brand" href="#" style="padding: 0.25em;">
+          <img src="static/img/finalasterixlogo.png">
+        </a>
+      </div>
+      <div class="navbar-collapse collapse">
+        <ul class="nav navbar-nav" id="mode-tabs">
+          <li id="about-active"><a data-toggle="tab" id="about-mode" href="#about-tab">About</a></li>
+          <li id="explore-active" class="active"><a data-toggle="tab" id="explore-mode" href="#demo-tab">Explore</a></li>
+          <li id="review-active"><a data-toggle="tab" id="review-mode" href="#demo-tab">Review</a></li>
+        </ul>
+      </div>
+    </div>
+  </div><!-- /Nav -->
 
-                  <div class="grid-slider" id="grid-lng-slider"></div>
-                  <div class="control-label">Longitude: <span id="gridlng">3.0</span></div>
-                </li>
-                
-                <!-- Submission Buttons -->
-                <li class="list-group-item">
-                  <button class="btn btn-primary" type="button" id="submit-button">Submit</button>
-                  <button class="btn btn-primary" type="button" id="clear-button">Clear</button>
-                  <button class="btn btn-primary" type="button" id="show-query-button">Show Query</button><br/>
-                  <input type="checkbox" value="Submit Asynchronously" name="async" id="asbox" />
-                  Submit asynchronously?
-                </li>
-              </ul>
-            </div>
+  <div class="tab-content">
+
+    <!-- Begin About Tab -->
+    <div class="tab-pane" id="about-tab">
+      <div class="container">
+        <!-- Welcome Message -->
+        <div class="row">
+          <p>Welcome to the top-level page of the mysteriously named Black Cherry Demo of AsterixDB.  The purpose of this demo is to illustrate how a "cool application" can be built using the JavaScript SDK of AsterixDB and to exercise all of the AsterixDB HTTP APIs.  If you are building an app of your own, reading the code for this app is a great way to get acquainted with what you'll need to know.</p>
+
+          <p>In this demo, which is based on spatial analysis of Tweets (it is 2013, afterall), you will see how to formulate aggregate queries and drill-down queries using the query door of the AsterixDB API.  You will see how to do this either synchronously or asynchronously (for larger queries whose results may take a while to cook).  You will also see how to create and drop datasets (to manage Tweetbooks, notebooks with user commentary on Tweets) and how to perform inserts and deletes (to add/remove Tweetbook entries). Let's walk through the demo.</p>
+
+          <hr/>
+
+          <div style="margin-bottom: 2em; text-align: center;">
+            <img src="static/img/Tutorial1.png" style="max-width:100%;">
+          </div><hr/>
+
+          <!-- Tutorial Part 2: Location Search -->
+          <div style="margin-bottom: 2em; text-align: center;">
+            <img src="static/img/Tutorial2.png" style="max-width:100%;">
+          </div><hr/>
+
+          <!-- Tutorial Part 3: Search Results, Drilling Down, Saving Comments -->
+          <div style="margin-bottom: 2em; text-align: center;">
+            <img src="static/img/Tutorial3.png" style="max-width:100%;">
+          </div><hr/>
+
+          <!-- Tutorial Part 4: Review Mode -->
+          <div style="margin-bottom: 2em; text-align: center;">
+            <img src="static/img/Tutorial4.png" style="max-width:100%;">
           </div>
-        
-          <div class="container well" id="review-well" style="display:none;">
-          
-            <!-- Tweetbooks -->
-            <div class="panel panel-default">
-              <div class="panel-heading">
-                <h4 class="panel-title">Tweetbooks</h4>
+        </div> 
+      </div>
+    </div><!-- End About Tab -->
+
+    <!-- Begin Main Demo Tab -->
+    <div class="tab-pane active" id="demo-tab">
+      <div class="container">
+        <div class="row">
+          <!-- Left Column -->
+          <div class="col-md-5">
+
+            <!-- Explore Mode: Query Builder Column -->
+            <div class="container well" id="explore-well">
+
+              <!-- Query Builder -->
+              <div class="panel panel-primary">
+                <div class="panel-heading"><h4><b>Query Builder</b></h4></div>
+                <ul class="list-group">
+
+                  <!-- Search Keyword -->
+                  <li class="list-group-item">
+                    <h4 class="list-group-item-heading">Keyword</h4>
+                    <input type="text" id="keyword-textbox" placeholder="Enter a keyword, e.g., verizon">
+                  </li>
+
+                  <!-- Location -->
+                  <li class="list-group-item">
+                    <h4 class="list-group-item-heading">Location</h4>
+                    <input class="textbox" type="text" id="location-text-box">
+                    <div class="btn-group" data-toggle="buttons">
+                      <label class="btn btn-default">
+                        <input type="radio" id="location-button"> Location
+                      </label>
+                      <label class="btn btn-default">
+                        <input type="radio" id="selection-button"> Selection
+                      </label>
+                    </div>
+                  </li>
+
+                  <!-- Date Range -->
+                  <li class="list-group-item">
+                    <h4 class="list-group-item-heading">Limit Date Range</h4>
+                    <input type="text" class="textbox" id="start-date"><span class="badge">Start Date</span><br/>
+                    <input type="text" class="textbox" id="end-date"><span class="badge">End Date</span>
+                  </li>
+
+                  <!-- Results Resolution -->
+                  <li class="list-group-item">
+                    <h4 class="list-group-item-heading">Result Group Size</h4>
+
+                    <div class="grid-slider" id="grid-lat-slider"></div>
+                    <div class="control-label">Latitude: <span id="gridlat">3.0</span></div>
+
+                    <div class="grid-slider" id="grid-lng-slider"></div>
+                    <div class="control-label">Longitude: <span id="gridlng">3.0</span></div>
+                  </li>
+
+                  <!-- Submission Buttons -->
+                  <li class="list-group-item">
+                    <button class="btn btn-primary" type="button" id="submit-button">Submit</button>
+                    <button class="btn btn-primary" type="button" id="clear-button">Clear</button>
+                    <button class="btn btn-primary" type="button" id="show-query-button">Show Query</button><br/>
+                    <input type="checkbox" value="Submit Asynchronously" name="async" id="asbox" />
+                    Submit asynchronously?
+                  </li>
+                </ul>
               </div>
-              <div class="panel-body">
-                <!-- Box to add a new Tweetbook -->
-                <div class="input-group">
-                  <input type="text" class="form-control" id="new-tweetbook-entry" placeholder="Name a new tweetbook">
-                  <span class="input-group-btn">
-                    <button type="button" class="btn" id="new-tweetbook-button">Add</button>
-                  </span>
+            </div><!-- End Query Build Column -->
+
+            <!-- Review Mode: Tweetbooks and Async Query Review Column -->
+            <div class="container well" id="review-well" style="display:none;">
+              <div class="panel panel-default">
+                <div class="panel-heading">
+                  <h4 class="panel-title">Tweetbooks</h4>
                 </div>
-                <hr/>
-                
-                <!-- List to add existing tweetbooks -->
-                <div class="btn-group-vertical" id="review-tweetbook-titles"></div>
+                <div class="panel-body">
+                  <!-- Box to add a new Tweetbook -->
+                  <div class="input-group">
+                    <input type="text" class="form-control" id="new-tweetbook-entry" placeholder="Name a new tweetbook">
+                    <span class="input-group-btn">
+                      <button type="button" class="btn" id="new-tweetbook-button">Add</button>
+                    </span>
+                  </div>
+                  <hr/>
+
+                  <!-- List to add existing tweetbooks -->
+                  <div class="btn-group-vertical" id="review-tweetbook-titles"></div>
+                </div>
               </div>
-            </div>
+
+              <!-- Background queries -->
+              <div class="panel panel-default">
+                <div class="panel-heading">
+                  <h4 class="panel-title">Background Queries</h4>
+                </div>
+                <div class="panel-body">
+                  <!-- Add existing background queries to list -->
+                  <div class="btn-group-vertical" id="review-tweetbook-titles"></div>
+                  <div id="async-handle-controls"></div>
+                </div>
+              </div>
+            </div><!-- end Review Mode Column -->
             
-            <!-- Background queries -->
-            <div class="panel panel-default">
-              <div class="panel-heading">
-                <h4 class="panel-title">Background Queries</h4>
-              </div>
-              <div class="panel-body">
-                <!-- Add existing background queries to list -->
-                <div class="btn-group-vertical" id="review-tweetbook-titles"></div>
-                <div id="async-handle-controls"></div>
-              </div>
-            </div>
-          </div>
-        
-          <!-- Div to hold success/error messages -->
-          <div id="report-message"></div>
-        </div>
-        
-        <div class="col-md-7"
+            <!-- Container to hold success/error messages -->
+            <div id="report-message"></div>
+          </div><!-- End Left Column -->
+
+          <!-- Right column holds map & legend -->
+          <div class="col-md-7">
           <!-- Map Container -->
           <div class="container well" id="right-col">
             <div id="map_canvas" style="max-width: 100%; height: auto;"></div>
-          </div>
-          
+          </div> 
+
           <!-- Legend Container -->
           <div id="rainbow-legend-container" class="container well" style="display:none;">
-          
             <div class="row">
               <div class="col-md-5 col-md-offset-2" style="text-align: center;"># Tweets</div>
             </div>
-            
+
             <div class="row">
               <div id="legend-min" class="col-md-2" style="text-align:right;"></div>
               <div id="legend-gradient" class="col-md-5" style="text-align: center;"></div>
@@ -195,112 +235,70 @@
                 </button>
               </div>
             </div>
-          </div>
-          
-        </div>
-      </div>
-      
-      <!-- Modals and Dialogs -->
-      <div class="row">
-        
-        <!-- On Drilldown, here is a nice modal -->
+          </div><!-- End Legend Container -->
+          </div><!-- End Right Column -->
+        </div><!-- End Row -->
+
+        <!-- Tweetbook Comment Container -->
         <div class="modal fade" id="drilldown_modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
-          <div class="modal-dialog">
-            <div class="modal-content">
-              <div class="modal-body" id="drilldown_modal_body">
-              
-                <!-- Tweet -->
-                <div id="modal-body-tweet" class="well well-sm"></div>
-              
-                <!-- Existing comments about this tweet -->
-                <!-- Create new comment -->
-                <div class="panel panel-default" id="modal-existing-note">
-                  <div class="panel-heading">About this Tweetbook</div>
-                  <div class="panel-body" id="modal-body-notes-holder">
-                     
-                    <div class="input-group">
-                      <input type="text" class="form-control" id="modal-body-tweet-note">
-                      <span class="input-group-btn">
-                        <button class="btn btn-default" id="modal-body-trash-icon">
-                          <span class="glyphicon glyphicon-trash"></span>
-                        </button>
-                      </span>
-                      <span class="badge" id="modal-current-tweetbook"></span>
-                    </div>
-                    
-                  </div>
-                </div> 
-                
-                <!-- Create new comment -->
-                <div class="panel panel-default" id="modal-save-tweet-panel">
-                  <div class="panel-heading">Save to tweetbook</div>
-                  <div class="panel-body" id="modal-save-body">
-                    
-                    <div class="input-group">
-                      <span class="input-group-addon">Note</span>
-                      <input type="text" class="form-control" id="modal-body-add-note" placeholder="Add a note about this tweet">
-                    </div>
+        <div class="modal-dialog">
+          <div class="modal-content">
+            <div class="modal-body" id="drilldown_modal_body">
 
-                    <div class="input-group">
-                      <span class="input-group-addon">Add to</span>
-                      <input type="text" class="form-control" id="modal-body-add-to" placeholder="Add it to a Tweetbook">
-                    </div><br/>
-                    
-                    <!-- Comment on tweet to save -->
-                    <button type="button" class="btn btn-default" id="save-comment-tweetbook-modal">Save</button>
-                    
-                    <div id="modal-body-message-holder"></div>
-                                        
+              <!-- Tweet -->
+              <div id="modal-body-tweet" class="well well-sm"></div>
+
+              <!-- Existing comments about this tweet -->
+              <!-- Create new comment -->
+              <div class="panel panel-default" id="modal-existing-note">
+                <div class="panel-heading">About this Tweetbook</div>
+                <div class="panel-body" id="modal-body-notes-holder">
+
+                  <div class="input-group">
+                    <input type="text" class="form-control" id="modal-body-tweet-note">
+                    <span class="input-group-btn">
+                      <button class="btn btn-default" id="modal-body-trash-icon">
+                        <span class="glyphicon glyphicon-trash"></span>
+                      </button>
+                    </span>
+                    <span class="badge" id="modal-current-tweetbook"></span>
                   </div>
-                </div> 
-              </div>
-              <div class="modal-footer">
-                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-              </div>
+
+                </div>
+              </div> 
+
+              <!-- Create new comment -->
+              <div class="panel panel-default" id="modal-save-tweet-panel">
+                <div class="panel-heading">Save to tweetbook</div>
+                <div class="panel-body" id="modal-save-body">
+
+                  <div class="input-group">
+                    <span class="input-group-addon">Note</span>
+                    <input type="text" class="form-control" id="modal-body-add-note" placeholder="Add a note about this tweet">
+                  </div>
+
+                  <div class="input-group">
+                    <span class="input-group-addon">Add to</span>
+                    <input type="text" class="form-control" id="modal-body-add-to" placeholder="Add it to a Tweetbook">
+                  </div><br/>
+
+                  <!-- Comment on tweet to save -->
+                  <button type="button" class="btn btn-default" id="save-comment-tweetbook-modal">Save</button>
+
+                  <div id="modal-body-message-holder"></div>
+
+                </div>
+              </div> 
+            </div>
+            <div class="modal-footer">
+              <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
             </div>
           </div>
-        </div><!-- Modal -->
-        
-      </div><!-- Row -->
-      
-      <!-- About Row -->
-      <div class="row" id="aboutr" style="display:none;">
-        <div class="container">
-        
-          <!-- Welcome Message -->
-          <div class="row">
-          
-            <!-- Welcome Message -->
-            <p>Welcome to the top-level page of the mysteriously named Black Cherry Demo of AsterixDB.  The purpose of this demo is to illustrate how a "cool application" can be built using the JavaScript SDK of AsterixDB and to exercise all of the AsterixDB HTTP APIs.  If you are building an app of your own, reading the code for this app is a great way to get acquainted with what you'll need to know.</p>
-
-            <p>In this demo, which is based on spatial analysis of Tweets (it is 2013, afterall), you will see how to formulate aggregate queries and drill-down queries using the query door of the AsterixDB API.  You will see how to do this either synchronously or asynchronously (for larger queries whose results may take a while to cook).  You will also see how to create and drop datasets (to manage Tweetbooks, notebooks with user commentary on Tweets) and how to perform inserts and deletes (to add/remove Tweetbook entries). Let's walk through the demo.</p>
-            
-            <hr/>
-            
-            <div style="margin-bottom: 2em; text-align: center;">
-                <img src="static/img/Tutorial1.png" style="max-width:100%;">
-            </div><hr/>
-            
-            <!-- Tutorial Part 2: Location Search -->
-            <div style="margin-bottom: 2em; text-align: center;">
-              <img src="static/img/Tutorial2.png" style="max-width:100%;">
-            </div><hr/>
-            
-            <!-- Tutorial Part 3: Search Results, Drilling Down, Saving Comments -->
-            <div style="margin-bottom: 2em; text-align: center;">
-              <img src="static/img/Tutorial3.png" style="max-width:100%;">
-            </div><hr/>
-            
-            <!-- Tutorial Part 4: Review Mode -->
-            <div style="margin-bottom: 2em; text-align: center;">
-              <img src="static/img/Tutorial4.png" style="max-width:100%;">
-            </div>
-          </div>
-
-          
         </div>
-      </div><!-- /About -->
+        </div><!-- Modal -->     
+      </div><!-- End Container -->
+    </div><!-- End Main Demo Tab -->
 
-    </div><!-- container --> 
-  </body>
-</html>
+  </div><!-- End tab list -->
+</body>
+</html>
\ No newline at end of file
diff --git a/asterix-examples/src/main/resources/black-cherry/static/js/cherry.js b/asterix-examples/src/main/resources/black-cherry/static/js/cherry.js
index 81de2c2..6552d70 100755
--- a/asterix-examples/src/main/resources/black-cherry/static/js/cherry.js
+++ b/asterix-examples/src/main/resources/black-cherry/static/js/cherry.js
@@ -36,21 +36,29 @@
 	              }
 	});
 	
-    // Following this is some stuff specific to the Black Cherry demo
-    // This is not necessary for working with AsterixDB
+    // This little bit of code manages period checks of the asynchronous query manager,
+    // which holds onto handles asynchornously received. We can set the handle update
+    // frequency using seconds, and it will let us know when it is ready.
+    var intervalID = setInterval( 
+        function() {
+            asynchronousQueryIntervalUpdate();
+        }, 
+        asynchronousQueryGetInterval()
+    );
+
+
+    // Initialize data structures
     APIqueryTracker = {};
+    asyncQueryManager = {};
     drilldown_data_map = {};
     drilldown_data_map_vals = {};
-    asyncQueryManager = {};
-    
-    // Populate review mode tweetbooks    
-    review_mode_tweetbooks = [];
-    review_mode_handles = [];
-    getAllDataverseTweetbooks();
-    
+
     map_cells = [];
     map_tweet_markers = [];
     map_info_windows = {};
+
+    review_mode_tweetbooks = [];
+    getAllDataverseTweetbooks();
     
     // Legend Container
     // Create a rainbow from a pretty color scheme. 
@@ -59,73 +67,10 @@
     rainbow.setSpectrum("#E8DDCB", "#CDB380", "#036564", "#033649", "#031634");
     buildLegend();
     
-    // UI Elements - Modals & perspective tabs
-    $('#drilldown_modal').modal('hide');
-    $('#explore-mode').click( onLaunchExploreMode );
-    $('#review-mode').click( onLaunchReviewMode );
-    $('#about-mode').click(onLaunchAboutMode);
-   
-    // UI Elements - A button to clear current map and query data
-    $("#clear-button").button().click(function () {
-        mapWidgetResetMap();
-        
-        $('#report-message').html('');
-        $('#query-preview-window').html('');
-        $("#metatweetzone").html('');
-    });
-    
-    // UI Elements - Query setup
-    $("#selection-button").button('toggle');
-    
-    // UI Element - Grid sliders
-    var updateSliderDisplay = function(event, ui) {
-        if (event.target.id == "grid-lat-slider") {
-            $("#gridlat").text(""+ui.value);
-        } else {
-          $("#gridlng").text(""+ui.value);
-        }
-    };
-    
-    sliderOptions = {
-        max: 10,
-        min: 1.5,
-        step: .1,
-        value: 2.0,
-        slidechange: updateSliderDisplay,
-        slide: updateSliderDisplay,
-        start: updateSliderDisplay,
-        stop: updateSliderDisplay
-    };
+    // Initialization of demo datastructures, map, tabs
+    initDemoPrepareTabs();
 
-    $("#gridlat").text(""+sliderOptions.value);
-    $("#gridlng").text(""+sliderOptions.value);
-    $(".grid-slider").slider(sliderOptions);
-    
-    // UI Elements - Date Pickers
-    var dateOptions = {
-        dateFormat: "yy-mm-dd",
-        defaultDate: "2012-01-02",
-        navigationAsDateFormat: true,
-        constrainInput: true
-    };
-    var start_dp = $("#start-date").datepicker(dateOptions);
-    start_dp.val(dateOptions.defaultDate);
-    dateOptions['defaultDate'] = "2012-12-31";
-    var end_dp= $("#end-date").datepicker(dateOptions);
-    end_dp.val(dateOptions.defaultDate);
-    
-    // This little bit of code manages period checks of the asynchronous query manager,
-    // which holds onto handles asynchornously received. We can set the handle update
-    // frequency using seconds, and it will let us know when it is ready.
-    var intervalID = setInterval( 
-        function() {
-    		asynchronousQueryIntervalUpdate();
-    	}, 
-    	asynchronousQueryGetInterval()
-    );
-    
-    // UI Elements - Creates map and location auto-complete
-    onOpenExploreMap();
+    // UI Elements - Creates Map, Location Auto-Complete, Selection Rectangle
     var mapOptions = {
         center: new google.maps.LatLng(38.89, -77.03),
         zoom: 4,
@@ -157,8 +102,8 @@
     
     // UI Elements - Selection Rectangle Drawing
     shouldDraw = false;
-    var startLatLng;
     selectionRect = null;
+    var startLatLng;
     var selectionRadio = $("#selection-button");
     var firstClick = true;
     
@@ -195,7 +140,53 @@
             }
         }
     };
+
+
     
+
+    // Open about tab to start user on a tutorial
+    //$('#mode-tabs a:first').tab('show') // Select first tab
+
+    
+    // UI Elements - A button to clear current map and query data
+    $("#clear-button").click(mapWidgetResetMap); 
+    
+    var updateSliderDisplay = function(event, ui) {
+        if (event.target.id == "grid-lat-slider") {
+            $("#gridlat").text(""+ui.value);
+        } else {
+          $("#gridlng").text(""+ui.value);
+        }
+    };
+    
+    sliderOptions = {
+        max: 10,
+        min: 1.5,
+        step: .1,
+        value: 2.0,
+        slidechange: updateSliderDisplay,
+        slide: updateSliderDisplay,
+        start: updateSliderDisplay,
+        stop: updateSliderDisplay
+    };
+
+    $("#gridlat").text(""+sliderOptions.value);
+    $("#gridlng").text(""+sliderOptions.value);
+    $(".grid-slider").slider(sliderOptions);
+    
+    // UI Elements - Date Pickers
+    var dateOptions = {
+        dateFormat: "yy-mm-dd",
+        defaultDate: "2012-01-02",
+        navigationAsDateFormat: true,
+        constrainInput: true
+    };
+    var start_dp = $("#start-date").datepicker(dateOptions);
+    start_dp.val(dateOptions.defaultDate);
+    dateOptions['defaultDate'] = "2012-12-31";
+    var end_dp= $("#end-date").datepicker(dateOptions);
+    end_dp.val(dateOptions.defaultDate);
+
     // UI Elements - Toggle location search style by location or by map selection
     $('#selection-button').on('click', function (e) {
         $("#location-text-box").attr("disabled", "disabled");
@@ -209,12 +200,8 @@
             selectionRect.setMap(null);
         }
     });
-    
-    // UI Elements - Tweetbook Management
-    $('.dropdown-menu a.holdmenu').click(function(e) {
-        e.stopPropagation();
-    });
-    
+    $("#selection-button").button('toggle');
+
     $('#new-tweetbook-button').on('click', function (e) {
         onCreateNewTweetBook($('#new-tweetbook-entry').val());
         
@@ -223,7 +210,7 @@
     });
      
     // UI Element - Query Submission
-    $("#submit-button").button().click(function () {
+    $("#submit-button").on("click", function () {
     	
         var kwterm = $("#keyword-textbox").val();
         if (kwterm == "") {
@@ -298,6 +285,9 @@
     });
 });
 
+/**
+* Builds AsterixDB REST Query from explore mode form.
+*/
 function buildAQLQueryFromForm(parameters) {
 
     var bounds = {
@@ -374,7 +364,6 @@
     
     // Now, we are ready to run a query. 
     A.meta(getTweetbooksQuery.val(), tweetbooksSuccess);
-    
 }
 
 /** Asynchronous Query Management **/
@@ -499,12 +488,6 @@
 }
 
 /**
-* returns a json object with keys: weight, latSW, lngSW, latNE, lngNE
-*
-* { "cell": { rectangle: [{ point: [22.5, 64.5]}, { point: [24.5, 66.5]}]}, "count": { int64: 5 }}
-*/
-
-/**
 * cleanJSON
 *
 * @param json, a JSON string that is not correctly formatted.
@@ -1001,8 +984,6 @@
     $('#drilldown_modal').modal();
 }
 
-/** Toggling Review and Explore Modes **/
-
 /**
 * Explore mode: Initial map creation and screen alignment
 */
@@ -1013,58 +994,41 @@
     $('#map_canvas').width(right_column_width + "px");
     
     $('#review-well').height(explore_column_height + "px");
-    $('#review-well').css('max-height', explore_column_height + "px");
-    
+    $('#review-well').css('max-height', explore_column_height + "px"); 
     $('#right-col').height(explore_column_height + "px");
 }
 
 /**
-* Launching explore mode: clear windows/variables, show correct sidebar
+* initializes demo - adds some extra events when review/explore
+* mode are clicked, initializes tabs, aligns map box, moves
+* active tab to about tab
 */
-function onLaunchExploreMode() {
-    $('#aboutr').hide();
-    $('#r1').show();
-    $('#about-active').removeClass('active');
+function initDemoPrepareTabs() {
 
-    $('#review-active').removeClass('active');
-    $('#review-well').hide();
-    
-    $('#explore-active').addClass('active'); 
-    $('#explore-well').show();
-    
-    $("#clear-button").trigger("click");
+    // Tab behavior for About, Explore, and Demo
+    $('#mode-tabs a').click(function (e) {
+        e.preventDefault()
+        $(this).tab('show')
+    })
+
+    // Explore mode should show explore-mode query-builder UI
+    $('#explore-mode').click(function(e) {
+        $('#review-well').hide();
+        $('#explore-well').show();
+        mapWidgetResetMap();
+    });
+        
+    // Review mode should show review well and hide explore well
+    $('#review-mode').click(function(e) {
+        $('#explore-well').hide();
+        $('#review-well').show();
+        mapWidgetResetMap();
+    });
+
+    // Does some alignment necessary for the map canvas
+    onOpenExploreMap();
 }
 
-/**
-* Launching review mode: clear windows/variables, show correct sidebar
-*/
-function onLaunchReviewMode() {
-    $('#aboutr').hide();
-    $('#r1').show();
-    $('#about-active').removeClass('active');
-
-    $('#explore-active').removeClass('active');
-    $('#explore-well').hide();
-   
-    $('#review-active').addClass('active');
-    $('#review-well').show();
-    
-    $("#clear-button").trigger("click");
-}
-
-/**
-* Lauching about mode: hides all windows, shows row containing about info
-*/
-function onLaunchAboutMode() {
-    $('#explore-active').removeClass('active');
-    $('#review-active').removeClass('active');
-    $('#about-active').addClass('active');
-    $('#r1').hide();
-    $('#aboutr').show();
-}
-
-/** Icon / Interface Utility Methods **/
-
 /** 
 * Creates a delete icon button using default trash icon
 * @param    {String}    id, id for this element
@@ -1126,9 +1090,6 @@
 
 /**
 * mapWidgetClearMap
-*
-* No parameters
-*
 * Removes data/markers
 */
 function mapWidgetClearMap() {
@@ -1156,8 +1117,6 @@
 
 /**
 * buildLegend
-* 
-* no params
 *
 * Generates gradient, button action for legend bar
 */
@@ -1198,8 +1157,6 @@
     return scale * Math.min(distanceBetweenPoints_(point_center, point_left), distanceBetweenPoints_(point_center, point_top));
 }
 
-/** External Utility Methods **/
-
 /**
  * Calculates the distance between two latlng locations in km.
  * @see http://www.movable-type.co.uk/scripts/latlong.html
@@ -1223,4 +1180,4 @@
   var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
   var d = R * c;
   return d;
-};
+};
\ No newline at end of file