Merge branch 'master' into eugenia/web_ui_beta_fixes
diff --git a/asterix-app/src/main/java/edu/uci/ics/asterix/api/common/APIFramework.java b/asterix-app/src/main/java/edu/uci/ics/asterix/api/common/APIFramework.java
index e1114eb..1afab97 100644
--- a/asterix-app/src/main/java/edu/uci/ics/asterix/api/common/APIFramework.java
+++ b/asterix-app/src/main/java/edu/uci/ics/asterix/api/common/APIFramework.java
@@ -197,7 +197,7 @@
switch (pdf) {
case HTML: {
- out.println("<h3>Rewriten expression tree:</h3>");
+ out.println("<h3>Rewritten expression tree:</h3>");
out.println("<pre>");
break;
}
@@ -380,7 +380,7 @@
hcc.waitForCompletion(jobId);
long endTime = System.currentTimeMillis();
double duration = (endTime - startTime) / 1000.00;
- out.println("<pre>Duration: " + duration + "</pre>");
+ out.println("<pre>Duration: " + duration + " sec</pre>");
}
}
@@ -402,7 +402,7 @@
}
long endTime = System.currentTimeMillis();
double duration = (endTime - startTime) / 1000.00;
- out.println("<pre>Duration: " + duration + "</pre>");
+ out.println("<pre>Duration: " + duration + " sec</pre>");
}
}
diff --git a/asterix-app/src/main/java/edu/uci/ics/asterix/api/http/servlet/APIServlet.java b/asterix-app/src/main/java/edu/uci/ics/asterix/api/http/servlet/APIServlet.java
index 12fa51a..f6f0ef9 100644
--- a/asterix-app/src/main/java/edu/uci/ics/asterix/api/http/servlet/APIServlet.java
+++ b/asterix-app/src/main/java/edu/uci/ics/asterix/api/http/servlet/APIServlet.java
@@ -3,8 +3,11 @@
import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStream;
+import java.io.OutputStream;
import java.io.InputStreamReader;
import java.io.PrintWriter;
+import java.io.File;
+import java.io.FileInputStream;
import java.util.List;
import java.util.logging.Level;
@@ -12,6 +15,7 @@
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
+import javax.activation.MimetypesFileTypeMap;
import edu.uci.ics.asterix.api.common.APIFramework.DisplayFormat;
import edu.uci.ics.asterix.api.common.SessionConfig;
@@ -78,7 +82,7 @@
aqlTranslator.compileAndExecute(hcc, hds, false);
long endTime = System.currentTimeMillis();
duration = (endTime - startTime) / 1000.00;
- out.println("<PRE>Duration of all jobs: " + duration + "</PRE>");
+ out.println("<PRE>Duration of all jobs: " + duration + " sec</PRE>");
} catch (ParseException | TokenMgrError | edu.uci.ics.asterix.aqlplus.parser.TokenMgrError pe) {
out.println("<pre class=\"error\">");
String message = pe.getMessage();
@@ -109,21 +113,44 @@
@Override
public void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException {
String resourcePath = null;
- response.setCharacterEncoding("utf-8");
- PrintWriter out = response.getWriter();
String requestURI = request.getRequestURI();
+
if (requestURI.equals("/")) {
response.setContentType("text/html");
resourcePath = "/webui/querytemplate.html";
} else {
resourcePath = requestURI;
}
-
+
InputStream is = APIServlet.class.getResourceAsStream(resourcePath);
if (is == null) {
response.sendError(HttpServletResponse.SC_NOT_FOUND);
return;
}
+
+ if (resourcePath.endsWith(".png")) {
+ // Handle PNG content for webui
+ response.setContentType(new MimetypesFileTypeMap().getContentType(resourcePath));
+
+ // Read image file size
+ File pngFile = new File(resourcePath);
+ response.setContentLength((int)pngFile.length());
+
+ // Initialize filestreams, and write to output
+ OutputStream pngOut = response.getOutputStream();
+
+ byte[] buf = new byte[1024];
+ int len;
+ while ((len = is.read(buf)) >= 0) {
+ pngOut.write(buf, 0, len);
+ }
+
+ // Close streams
+ pngOut.close();
+ return;
+ }
+
+ response.setCharacterEncoding("utf-8");
InputStreamReader isr = new InputStreamReader(is);
StringBuilder sb = new StringBuilder();
BufferedReader br = new BufferedReader(isr);
@@ -134,6 +161,7 @@
line = br.readLine();
}
+ PrintWriter out = response.getWriter();
out.println(sb.toString());
}
diff --git a/asterix-app/src/main/java/edu/uci/ics/asterix/aql/translator/AqlTranslator.java b/asterix-app/src/main/java/edu/uci/ics/asterix/aql/translator/AqlTranslator.java
index d4e5e22..7f7db19 100644
--- a/asterix-app/src/main/java/edu/uci/ics/asterix/aql/translator/AqlTranslator.java
+++ b/asterix-app/src/main/java/edu/uci/ics/asterix/aql/translator/AqlTranslator.java
@@ -1449,6 +1449,7 @@
}
switch (pdf) {
case HTML:
+ out.println("<h3>Results:</h3>");
out.println("<pre>");
ResultUtils.prettyPrintHTML(out, response);
out.println("</pre>");
@@ -1559,4 +1560,4 @@
throw new IllegalStateException(rootE);
}
}
-}
\ No newline at end of file
+}
diff --git a/asterix-app/src/main/resources/webui/querytemplate.html b/asterix-app/src/main/resources/webui/querytemplate.html
index 95323bb..f0d63ec 100644
--- a/asterix-app/src/main/resources/webui/querytemplate.html
+++ b/asterix-app/src/main/resources/webui/querytemplate.html
@@ -6,6 +6,9 @@
<link href='http://fonts.googleapis.com/css?family=Bitter|PT+Sans+Caption|Open+Sans' rel='stylesheet' type='text/css'>
<script src="/webui/static/js/jquery.min.js"></script>
+<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.no-icons.min.css" rel="stylesheet">
+<link href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css" rel="stylesheet">
+
<link href="/webui/static/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="/webui/static/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" />
@@ -15,10 +18,35 @@
<script type="text/javascript">
$(document).ready(function(){
+
+ $('#checkboxes-on').click(function() {
+ $('#queryform :input').prop('checked', true);
+ return false;
+ });
+
+ $('#checkboxes-off').click(function() {
+ $('form#queryform :input').removeAttr('checked');
+ return false;
+ });
+
+ $('#clear-query-button').click(function() {
+ $("#qry").val('');
+ return false;
+ });
+
$("form#queryform").submit(function() {
$('#output-message').html("");
$.post("/", $("form#queryform").serialize(), function(data) {
- $('#output-message').html(data);
+
+ $('#output-message').html(data);
+
+ var contentString = data.toString();
+ if (contentString.indexOf("<PRE>Duration") !== -1) {
+ $("<div/>")
+ .addClass("alert alert-success")
+ .html("Success: Query Complete")
+ .appendTo('#output-message');
+ }
});
return false;
});
@@ -26,11 +54,11 @@
</script>
<meta charset=utf-8 />
-<title>ASTERIX Demo</title>
+<title>AsterixDB Web Interface</title>
</head>
<body>
- <div class="navbar navbar-inverse navbar-fixed-top">
+ <div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
@@ -38,12 +66,16 @@
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
- <a class="brand" href="#">ASTERIX</a>
+
+ <!-- Temporary logo placeholder -->
+ <!-- <a class="brand" href="#"><img src="/webui/static/img/finalasterixlogo.png"></a> -->
+ <a class="brand" href="#"><img src="http://db.tt/J1MTCdKs"></a>
+
<div class="nav-collapse collapse">
<ul class="nav">
- <li><a href="http://code.google.com/p/asterixdb/source/browse/">Open source</a></li>
- <li><a href="http://code.google.com/p/asterixdb/issues/list">File issues</a></li>
- <li><a href="https://groups.google.com/forum/?fromgroups#!forum/asterixdb-userst">Contact</a></li>
+ <li><a href="http://code.google.com/p/asterixdb/source/browse/" target="_blank">Open source<i class="icon-external-link"></i></a></li>
+ <li><a href="http://code.google.com/p/asterixdb/issues/list" target="_blank">File issues<i class="icon-external-link"></i></a></li>
+ <li><a href="https://groups.google.com/forum/?fromgroups#!forum/asterixdb-userst" target="_blank">Contact<i class="icon-external-link"></i></a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
@@ -53,42 +85,48 @@
<div class="content">
<div class="container">
<div class="row-fluid">
- <div class="span6">
- <form id="queryform" class="form-horizontal" method="post">
- <div>
- <label class="query">Query</label>
- <textarea rows="10" name="query" class="query" value="%s" placeholder="Type your AQL query ..."></textarea>
- </div>
- <div>
- <label class="checkbox"><input type="checkbox" checked="checked" name="print-expr-tree" value="true" /> Print parsed expressions</label>
- <label class="checkbox"><input type="checkbox" checked="checked" name="print-rewritten-expr-tree" value="true" /> Print rewritten expressions</label>
- </div>
- <div>
- <label class="checkbox"><input type="checkbox" checked="checked" name="print-logical-plan" value="true" /> Print logical plan</label>
- <label class="checkbox"><input type="checkbox" checked="checked" name="print-optimized-logical-plan" value="true" /> Print optimized logical plan</label>
- </div>
- <div>
- <label class="checkbox"><input type="checkbox" checked="checked" name="print-job" value="true" /> Print hyracks job</label>
- </div>
- <button type="submit" class="btn btn-danger">Execute</button>
- </form>
- </div>
<div class="span6">
+
+ <form id="queryform" class="form-horizontal" method="post">
+ <div style="margin-bottom: 1em;">
+ <label class="query">Query</label>
+ <textarea rows="10" id="qry" name="query" class="query" value="%s" placeholder="Type your AQL query ..."></textarea>
+ <button id="clear-query-button" style="float:right;" class="btn">Clear Query</button>
+ </div>
+
+ <div class="btn-group">
+ <button id="checkboxes-on" class="btn">Select All Options</button>
+ <button id="checkboxes-off" class="btn">Clear All Options</button>
+ </div>
+
+ <div>
+ <label class="checkbox"><input type="checkbox" class="btn" checked="checked" name="print-expr-tree" value="true" /> Print parsed expressions</label>
+ <label class="checkbox"><input type="checkbox" checked="checked" name="print-rewritten-expr-tree" value="true" /> Print rewritten expressions</label>
+ <label class="checkbox"><input type="checkbox" checked="checked" name="print-logical-plan" value="true" /> Print logical plan</label>
+ <label class="checkbox"><input type="checkbox" checked="checked" name="print-optimized-logical-plan" value="true" /> Print optimized logical plan</label>
+ <label class="checkbox"><input type="checkbox"
+ checked="checked" name="print-job" value="true" /> Print Hyracks job</label>
+ </div>
+ <button type="submit" id="run-btn" class="btn btn-custom-darken">Run</button>
+ </form>
+ </div>
+
+ <div class="span6">
<div class="output">
<label class="heading">Output</label>
<div id="output-message" class="message">
</div>
</div>
</div>
+
</div>
</div>
- </div>
+</div>
<div class="footer">
<section class="line"><hr></section>
<section class="content">
<section class="left">
- Developed by ASTERIX group
</section>
<section class="right">
© Copyright 2013 University of California, Irvine
diff --git a/asterix-app/src/main/resources/webui/static/css/style.css b/asterix-app/src/main/resources/webui/static/css/style.css
index b8688db..d21acab 100644
--- a/asterix-app/src/main/resources/webui/static/css/style.css
+++ b/asterix-app/src/main/resources/webui/static/css/style.css
@@ -1,6 +1,6 @@
body {
background: none repeat scroll 0 0 white;
- color: #222222;
+ color: black;
font-family: 'Bitter';
font-size: 14px;
line-height: 17px;
@@ -8,7 +8,7 @@
}
.content {
- margin-top: 70px;
+ margin-top: 36px;
}
label.query, label.result {
@@ -34,10 +34,10 @@
div.right {
}
-button.btn {
+#run-btn {
clear: both;
float: left;
- margin: 20px 0 0 10px;;
+ margin-top: 2em;
}
textarea.query {
@@ -73,6 +73,7 @@
margin-top: 2px;
padding-bottom: 10px;
font-weight: bold;
+ color : #17265a;
}
div.output .message {
@@ -137,3 +138,59 @@
padding-right: 20px;
float: right;
}
+
+.navbar .brand {
+ width: 160px;
+ height: 40px;
+ overflow: visible;
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+/*.navbar .nav > li > a {
+ color: #17265a;
+}*/
+
+i {
+ margin-left: 4px;
+}
+
+.btn-custom-darken.active {
+ color: rgba(255, 255, 255, 0.75);
+}
+.btn-custom-darken {
+ color: #ffffff;
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+ background-color: #233887;
+ background-image: -moz-linear-gradient(top, #273f97, #1d2e6e);
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#273f97), to(#1d2e6e));
+ background-image: -webkit-linear-gradient(top, #273f97, #1d2e6e);
+ background-image: -o-linear-gradient(top, #273f97, #1d2e6e);
+ background-image: linear-gradient(to bottom, #273f97, #1d2e6e);
+ background-repeat: repeat-x;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff273f97', endColorstr='#ff1d2e6e', GradientType=0);
+ border-color: #1d2e6e #1d2e6e #0d1532;
+ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+ *background-color: #1d2e6e;
+ /* Darken IE7 buttons by default so they stand out more given they won't have borders */
+
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+}
+.btn-custom-darken:hover,
+.btn-custom-darken:focus,
+.btn-custom-darken:active,
+.btn-custom-darken.active,
+.btn-custom-darken.disabled,
+.btn-custom-darken[disabled] {
+ color: #ffffff;
+ background-color: #1d2e6e;
+ *background-color: #17265a;
+}
+.btn-custom-darken:active,
+.btn-custom-darken.active {
+ background-color: #121d46 ;
+}
+
+.span6 {
+ padding: 24px;
+}
diff --git a/asterix-app/src/main/resources/webui/static/img/finalasterixlogo.jpg b/asterix-app/src/main/resources/webui/static/img/finalasterixlogo.jpg
new file mode 100644
index 0000000..0ab3727
--- /dev/null
+++ b/asterix-app/src/main/resources/webui/static/img/finalasterixlogo.jpg
Binary files differ
diff --git a/asterix-app/src/main/resources/webui/static/img/finalasterixlogo.png b/asterix-app/src/main/resources/webui/static/img/finalasterixlogo.png
new file mode 100644
index 0000000..10ce431
--- /dev/null
+++ b/asterix-app/src/main/resources/webui/static/img/finalasterixlogo.png
Binary files differ
