Gitiles
Code Review Sign In
asterix-gerrit.ics.uci.edu / asterixdb / 724476d511d5a89722ad7a454669a1b4decf510e / . / asterix-examples / src / main / resources / black-cherry / cherry.tpl
blob: b4bc416351197dae58bf0fc32a13d58998249cc0 [file] [log] [blame]
genia.likes.science@gmail.com6d6aa8e2013-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.comd42b4022013-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.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]8
genia.likes.science@gmail.com724476d2013-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.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]12
genia.likes.science@gmail.com724476d2013-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.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]15
genia.likes.science@gmail.com724476d2013-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.com6d6aa8e2013-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.com4259a542013-08-18 20:06:58 -0700[diff] [blame]37 padding: 0.5em;
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]38 }
genia.likes.science@gmail.com724476d2013-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.com6d6aa8e2013-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.com724476d2013-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.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]82 </div>
genia.likes.science@gmail.com724476d2013-10-04 03:31:16 -0700[diff] [blame^]83 </div><!-- /Nav -->
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]84
85 <!-- Search Box -->
genia.likes.science@gmail.com724476d2013-10-04 03:31:16 -0700[diff] [blame^]86 <div class="container">
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]87
genia.likes.science@gmail.com724476d2013-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.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]91
genia.likes.science@gmail.com724476d2013-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>
144
145 </ul>
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]146 </div>
147 </div>
genia.likes.science@gmail.com724476d2013-10-04 03:31:16 -0700[diff] [blame^]148 </div>
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]149
genia.likes.science@gmail.com724476d2013-10-04 03:31:16 -0700[diff] [blame^]150 <div class="col-md-7">
151 <div class="container well" id="right-col">
152 <div id="map_canvas" style="width: 100%; height: 100%;"></div>
153 <div id="map_canvas_legend" style="display:none;"></div>
154 </div>
155 </div>
156 </div>
157
158 <!-- Modals and Dialogs -->
159 <div class="row">
160 <!-- Show Query -> Error TODO Doesn't need to be this... -->
161 <div id="dialog"><h4>You must submit a query first.</h4></div>
162
163 <!-- On Drilldown, here is a nice modal -->
164 <div class="modal hide fade" id="drilldown_modal" tabindex="-1" role="dialog">
165 <div class="modal-dialog">
166 <div class="modal-content">
167 <div class="modal-header">
168 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
169 <h4 class="modal-title">Explore Tweets</h4>
170 </div>
171 <div class="modal-body" id="drilldown_modal_body"></div>
172 <div class="modal-footer">
173 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
174 </div>
175 </div>
176 </div>
177 </div>
178
179 </div><!-- Row -->
180
181 </div><!-- container -->
182 </body>
183</html>
184
185 <!--
186 <div class="col-md-4 well" id="review-well" style="display:none;">
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]187 <div class="btn-group" style="margin-bottom: 10px;" id="group-tweetbooks">
188 <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
189 Tweetbooks
190 <span class="caret"></span>
191 </a>
192 <ul class="dropdown-menu" id="review-tweetbook-dropdown">
193 <li><a href="#" class="holdmenu">
194 <input type="text" id="new-tweetbook-entry" placeholder="Name a new tweetbook">
195 <button type="button" class="btn" id="new-tweetbook-button">Add</button>
196 </a></li>
197 <li class="divider"></li>
198 <div id="review-tweetbook-titles">
199 </div>
200 </ul>
201 </div><br/>
202
203 <div class="btn-group" id="group-background-query" style="margin-bottom: 10px;">
204 <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
205 Background Queries
206 <span class="caret"></span>
207 </a>
208 <ul class="dropdown-menu" id="review-handles-dropdown">
genia.likes.science@gmail.com4259a542013-08-18 20:06:58 -0700[diff] [blame]209 <div id="async-handle-controls">
210 </div>
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]211 </ul>
212 </div>
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]213 </div>
214
genia.likes.science@gmail.com6d6aa8e2013-07-23 01:23:21 -0700[diff] [blame]215 </div><!--/row-->