blob: 3826923afc1254f05b32736a002900f3a7ae17af [file] [log] [blame]
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -07001<!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
7 <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css"
8 rel="stylesheet" type="text/css"/>
genia.likes.science@gmail.comd42b4022013-08-09 05:05:23 -07009 <link href="static/css/bootstrap.min.css" rel="stylesheet" media="screen">
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -070010
genia.likes.science@gmail.comd42b4022013-08-09 05:05:23 -070011 <link rel="shortcut icon" type="image/png" href="static/img/hyrax.png">
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -070012
13 <script src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"
14 type="text/javascript"></script>
15 <script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
16 <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"
17 type="text/javascript"></script>
18
genia.likes.science@gmail.comd42b4022013-08-09 05:05:23 -070019 <script src="static/js/bootstrap.min.js"></script>
20 <script type="text/javascript" src="static/js/geostats.js" ></script>
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -070021
genia.likes.science@gmail.comd42b4022013-08-09 05:05:23 -070022 <script src="static/js/asterix-sdk-stable.js"></script>
23 <script src="static/js/cherry.js" type="text/javascript"></script>
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -070024 <style type="text/css">
25 .column-section {
26 border-top: 2px solid #aaa;
27 margin-top: 10px;
28 }
29
30 .section-title {
31 background: #ddd;
32 padding: 5px 0;
33 }
34
35 .section-title span {
36 margin-left: 10px;
37 font-weight: bold;
38 }
39
40 .control {
41 margin: 0;
42 }
43
44 #map_canvas img {
45 max-width: none;
46 }
47
48 #legend-holder {
49 background: white;
50 padding: 10px;
51 margin: 10px;
52 text-align: center;
53 }
54
55 #review-handles-dropdown {
56 padding: 10px;
57 }
58
59 </style>
60 </head>
61 <body style="width: 100%; height: 100%;">
62
63 <!-- Nav -->
64 <div class="navbar">
65 <div class="navbar-inner">
genia.likes.science@gmail.comd42b4022013-08-09 05:05:23 -070066 <a class="brand" href="#" style="padding: 0.25em;"><img src="static/img/finalasterixlogo.png" height="30" width="72"></a>
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -070067 <ul class="nav">
68 <li id="explore-active" class="active"><a id="explore-mode" href="#">Explore</a></li>
69 <li id="review-active" ><a id="review-mode" href="#">Review</a></li>
70 </ul>
71 </div>
72 </div>
73
74 <!-- Search Box -->
75 <div class="container-fluid">
76
77 <div class="row">
78
79 <!-- Search Bar -->
80 <div class="span4 well" id="explore-well">
81 <div class="column-section" id="location">
82 <div class="section-title"><span>Location</span></div>
83 <!--<div class="section-controls">-->
84 <input class="textbox" type="text" id="location-text-box">
85 <div class="btn-group" data-toggle="buttons-radio">
86 <button type="button" class="btn" id="location-button">Location</button>
87 <button type="button" class="btn" id="selection-button">Selection</button>
88 </div>
89 <!-- </div>-->
90 </div><!-- end #location-->
91
92 <div class="column-section" id="date">
93 <div class="section-title"><span>Date</span></div>
94 <div class="section-controls">
95 <span style="white-space:nowrap; display: block; overflow:hidden;">
96 <label for="start-date">Start Date</label><input type="text" class="textbox" id="start-date">
97 </span>
98 <input type="text" class="textbox" id="end-date">
99 <label for="end-date">End Date</label>
100 </div>
101 </div><!-- end #date-->
102
103 <div class="column-section" id="keyword">
104 <div class="section-title"><span>Keyword</span></div>
105 <div class="section-controls">
106 <input type="text" class="textbox" id="keyword-textbox" value="verizon">
107 </div>
108 </div><!-- end #keyword-->
109
110 <div class="column-section" id="grid">
111 <div class="section-title"><span>Grid: Latitude &amp; Longitude</span></div>
112 <div class="section-controls">
113
114 <div class="grid-slider" id="grid-lat-slider"></div>
115 <div class="control-label">Latitude: <span id="gridlat">3.0</span></div>
116
117 <div class="grid-slider" id="grid-lng-slider"></div>
118 <div class="control-label">Longitude: <span id="gridlng">3.0</span></div>
119 </div>
120 </div><!-- end #grid-->
121
122 <div class="column-section" style="border: none;" id="submit-query">
123 <div class="section-controls">
124 <button id="submit-button">Submit</button>
125 <button id="clear-button">Clear</button>
126 <button id="show-query-button">Show Query</button><br />
127 <input type="checkbox" value="Submit Asynchronously" name="async" id="asbox" />
128 Submit asynchronously?
129 </div>
130 </div><!-- end #submit-query -->
131
132 </div><!--/span-->
133
134 <!-- Drilldown Modal -->
135 <div id="drilldown_modal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
136 <div class="modal-header">
137 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
138 <h3 id="myModalLabel">Explore Tweets</h3>
139 </div>
140 <div class="modal-body" id="drilldown_modal_body"></div>
141 <div class="modal-footer">
142 <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
143 </div>
144 </div>
145
146 <div class="span4 well" id="review-well" style="display:none;">
147 <div class="btn-group" style="margin-bottom: 10px;" id="group-tweetbooks">
148 <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
149 Tweetbooks
150 <span class="caret"></span>
151 </a>
152 <ul class="dropdown-menu" id="review-tweetbook-dropdown">
153 <li><a href="#" class="holdmenu">
154 <input type="text" id="new-tweetbook-entry" placeholder="Name a new tweetbook">
155 <button type="button" class="btn" id="new-tweetbook-button">Add</button>
156 </a></li>
157 <li class="divider"></li>
158 <div id="review-tweetbook-titles">
159 </div>
160 </ul>
161 </div><br/>
162
163 <div class="btn-group" id="group-background-query" style="margin-bottom: 10px;">
164 <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
165 Background Queries
166 <span class="caret"></span>
167 </a>
168 <ul class="dropdown-menu" id="review-handles-dropdown">
169 </ul>
170 </div>
171
172 <div id="query-preview-window" style="overflow: auto; width: 100%; background: white; border: 2px solid black;">
173 </div>
174 </div>
175
176 <!-- Map -->
177 <div class="span8 well" >
178 <div id="map_canvas" style="width: 100%; height: 100%;"></div>
179 </div><!--/span-->
180 <div id="map_canvas_legend">
181 </div>
182
183 </div><!--/row-->
184 <div class="row">
185
186 <div id="dialog">
187 <h4>You must submit a query first.</h4>
188 </div></div>
189 </div><!-- container -->
190 <hr>
191
192 </body>
193</html>