genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 1 | <!DOCTYPE html> |
| 2 | <html style="width: 100%; height: 100%;"> |
| 3 | <head> |
| 4 | <title>ASTERIX Demo</title> |
| 5 | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| 6 | |
genia.likes.science@gmail.com | d42b402 | 2013-08-09 05:05:23 -0700 | [diff] [blame] | 7 | <link rel="shortcut icon" type="image/png" href="static/img/hyrax.png"> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 8 | |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 9 | <!-- Bootstrap & jQuery Styles --> |
| 10 | <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> |
| 11 | <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" type="text/css"> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 12 | |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 13 | <!-- Bootstrap Javascript --> |
| 14 | <script src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places" type="text/javascript"></script> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 15 | |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 16 | <script src="http://code.jquery.com/jquery.min.js"></script> |
| 17 | <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> |
| 18 | <script src="static/js/bootstrap.min.js"></script> |
| 19 | <script src="static/js/geostats.js"></script> |
| 20 | <script src="static/js/asterix-sdk-stable.js"></script> |
| 21 | <script src="static/js/cherry.js"></script> |
| 22 | |
| 23 | <style type="text/css"> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 24 | |
| 25 | #map_canvas img { |
| 26 | max-width: none; |
| 27 | } |
| 28 | |
| 29 | #legend-holder { |
| 30 | background: white; |
| 31 | padding: 10px; |
| 32 | margin: 10px; |
| 33 | text-align: center; |
| 34 | } |
| 35 | |
| 36 | #review-handles-dropdown { |
genia.likes.science@gmail.com | 4259a54 | 2013-08-18 20:06:58 -0700 | [diff] [blame] | 37 | padding: 0.5em; |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 38 | } |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 39 | |
| 40 | .panel-primary { |
| 41 | border-color: #273f93; |
| 42 | } |
| 43 | |
| 44 | .panel-primary .panel-heading { |
| 45 | color: white; |
| 46 | background-color: #273f93; |
| 47 | border-color: #273f93; |
| 48 | } |
| 49 | |
| 50 | #start-date, #end-date { |
| 51 | position: relative; z-index:100; |
| 52 | } |
| 53 | |
| 54 | #keyword-textbox, #location-text-box { |
| 55 | width: 100%; |
| 56 | } |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 57 | |
| 58 | </style> |
| 59 | </head> |
| 60 | <body style="width: 100%; height: 100%;"> |
| 61 | |
| 62 | <!-- Nav --> |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 63 | <div class="navbar navbar-default navbar-static-top"> |
| 64 | <div class="container"> |
| 65 | <div class="navbar-header"> |
| 66 | <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> |
| 67 | <span class="icon-bar"></span> |
| 68 | <span class="icon-bar"></span> |
| 69 | <span class="icon-bar"></span> |
| 70 | </button> |
| 71 | <a class="navbar-brand" href="#" style="padding: 0.25em;"> |
| 72 | <img src="static/img/finalasterixlogo.png"> |
| 73 | </a> |
| 74 | </div> |
| 75 | <div class="navbar-collapse collapse"> |
| 76 | <ul class="nav navbar-nav"> |
| 77 | <li id="about-demo" class="active"><a id="about-mode" href="#">About</a></li> |
| 78 | <li id="explore-active"><a id="explore-mode" href="#">Explore</a></li> |
| 79 | <li id="review-active"><a id="review-mode" href="#">Review</a></li> |
| 80 | </ul> |
| 81 | </div> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 82 | </div> |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 83 | </div><!-- /Nav --> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 84 | |
| 85 | <!-- Search Box --> |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 86 | <div class="container"> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 87 | |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 88 | <div class="row" id="r1"> |
| 89 | <div class="col-md-5"> |
| 90 | <div class="container well" id="explore-well"> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 91 | |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 92 | <!-- Query Builder --> |
| 93 | <div class="panel panel-primary"> |
| 94 | <div class="panel-heading"><h4><b>Query Builder</b></h4></div> |
| 95 | |
| 96 | <!-- List group --> |
| 97 | <ul class="list-group"> |
| 98 | |
| 99 | <!-- Search Keyword --> |
| 100 | <li class="list-group-item"> |
| 101 | <h4 class="list-group-item-heading">Keyword</h4> |
| 102 | <input type="text" id="keyword-textbox" placeholder="Enter a keyword, e.g., verizon"> |
| 103 | </li> |
| 104 | |
| 105 | <!-- Location --> |
| 106 | <li class="list-group-item"> |
| 107 | <h4 class="list-group-item-heading">Location</h4> |
| 108 | <input class="textbox" type="text" id="location-text-box"> |
| 109 | <div class="btn-group" data-toggle="buttons"> |
| 110 | <label class="btn btn-default"> |
| 111 | <input type="radio" id="location-button"> Location |
| 112 | </label> |
| 113 | <label class="btn btn-default"> |
| 114 | <input type="radio" id="selection-button"> Selection |
| 115 | </label> |
| 116 | </div> |
| 117 | </li> |
| 118 | |
| 119 | <!-- Date Range --> |
| 120 | <li class="list-group-item"> |
| 121 | <h4 class="list-group-item-heading">Limit Date Range</h4> |
| 122 | <input type="text" class="textbox" id="start-date"><span class="badge">Start Date</span><br/> |
| 123 | <input type="text" class="textbox" id="end-date"><span class="badge">End Date</span> |
| 124 | </li> |
| 125 | |
| 126 | <!-- Results Resolution --> |
| 127 | <li class="list-group-item"> |
| 128 | <h4 class="list-group-item-heading">Result Group Size</h4> |
| 129 | <div class="grid-slider" id="grid-lat-slider"></div> |
| 130 | <div class="control-label">Latitude: <span id="gridlat">3.0</span></div> |
| 131 | |
| 132 | <div class="grid-slider" id="grid-lng-slider"></div> |
| 133 | <div class="control-label">Longitude: <span id="gridlng">3.0</span></div> |
| 134 | </li> |
| 135 | |
| 136 | <!-- Submission Buttons --> |
| 137 | <li class="list-group-item"> |
| 138 | <button id="submit-button">Submit</button> |
| 139 | <button id="clear-button">Clear</button> |
| 140 | <button id="show-query-button">Show Query</button><br/> |
| 141 | <input type="checkbox" value="Submit Asynchronously" name="async" id="asbox" /> |
| 142 | Submit asynchronously? |
| 143 | </li> |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 144 | </ul> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 145 | </div> |
genia.likes.science@gmail.com | 1400a75 | 2013-10-04 04:59:12 -0700 | [diff] [blame^] | 146 | |
| 147 | <!-- On Drilldown, here is a nice modal --> |
| 148 | <div class="modal hide fade" id="drilldown_modal" tabindex="-1" role="dialog"> |
| 149 | <div class="modal-dialog"> |
| 150 | <div class="modal-content"> |
| 151 | <div class="modal-header"> |
| 152 | <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> |
| 153 | <h4 class="modal-title">Explore Tweets</h4> |
| 154 | </div> |
| 155 | <div class="modal-body" id="drilldown_modal_body"></div> |
| 156 | <div class="modal-footer"> |
| 157 | <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> |
| 158 | </div> |
| 159 | </div> |
| 160 | </div> |
| 161 | </div> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 162 | </div> |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 163 | </div> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 164 | |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 165 | <div class="col-md-7"> |
| 166 | <div class="container well" id="right-col"> |
| 167 | <div id="map_canvas" style="width: 100%; height: 100%;"></div> |
| 168 | <div id="map_canvas_legend" style="display:none;"></div> |
| 169 | </div> |
| 170 | </div> |
| 171 | </div> |
| 172 | |
| 173 | <!-- Modals and Dialogs --> |
| 174 | <div class="row"> |
| 175 | <!-- Show Query -> Error TODO Doesn't need to be this... --> |
| 176 | <div id="dialog"><h4>You must submit a query first.</h4></div> |
| 177 | |
genia.likes.science@gmail.com | 724476d | 2013-10-04 03:31:16 -0700 | [diff] [blame] | 178 | </div><!-- Row --> |
| 179 | |
| 180 | </div><!-- container --> |
| 181 | </body> |
| 182 | </html> |
| 183 | |
| 184 | <!-- |
| 185 | <div class="col-md-4 well" id="review-well" style="display:none;"> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 186 | <div class="btn-group" style="margin-bottom: 10px;" id="group-tweetbooks"> |
| 187 | <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> |
| 188 | Tweetbooks |
| 189 | <span class="caret"></span> |
| 190 | </a> |
| 191 | <ul class="dropdown-menu" id="review-tweetbook-dropdown"> |
| 192 | <li><a href="#" class="holdmenu"> |
| 193 | <input type="text" id="new-tweetbook-entry" placeholder="Name a new tweetbook"> |
| 194 | <button type="button" class="btn" id="new-tweetbook-button">Add</button> |
| 195 | </a></li> |
| 196 | <li class="divider"></li> |
| 197 | <div id="review-tweetbook-titles"> |
| 198 | </div> |
| 199 | </ul> |
| 200 | </div><br/> |
| 201 | |
| 202 | <div class="btn-group" id="group-background-query" style="margin-bottom: 10px;"> |
| 203 | <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> |
| 204 | Background Queries |
| 205 | <span class="caret"></span> |
| 206 | </a> |
| 207 | <ul class="dropdown-menu" id="review-handles-dropdown"> |
genia.likes.science@gmail.com | 4259a54 | 2013-08-18 20:06:58 -0700 | [diff] [blame] | 208 | <div id="async-handle-controls"> |
| 209 | </div> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 210 | </ul> |
| 211 | </div> |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 212 | </div> |
| 213 | |
genia.likes.science@gmail.com | 6d6aa8e | 2013-07-23 01:23:21 -0700 | [diff] [blame] | 214 | </div><!--/row--> |