Single-button checkbox handling for query options selection
diff --git a/asterix-app/src/main/resources/webui/querytemplate.html b/asterix-app/src/main/resources/webui/querytemplate.html
index 2abc24b..f8f1125 100644
--- a/asterix-app/src/main/resources/webui/querytemplate.html
+++ b/asterix-app/src/main/resources/webui/querytemplate.html
@@ -17,12 +17,14 @@
$(document).ready(function() {
$('#checkboxes-on').click(function() {
- $('#queryform :input').prop('checked', true);
- return false;
- });
-
- $('#checkboxes-off').click(function() {
- $('form#queryform :input').removeAttr('checked');
+ /* Displays a checkmark to indicate selection/clearing */
+ if ($('#opts').is(":visible")) {
+ $('#opts').hide();
+ $('#queryform :input').prop('checked', false);
+ } else {
+ $('#opts').show();
+ $('#queryform :input').prop('checked', true);
+ }
return false;
});
@@ -31,6 +33,17 @@
return false;
});
+ $('form#queryform :input').click( function () {
+ /* Hides selection check on uncheck, shows when all 5 selected */
+ if ($(this).val()) {
+ if ($(this).is(':checked') && $('input[type=checkbox]').filter(':checked').length == 5) {
+ $('#opts').show();
+ } else {
+ $('#opts').hide();
+ }
+ }
+ });
+
$("form#queryform").submit(function() {
$('#output-message').html("");
$.post("/", $("form#queryform").serialize(), function(data) {
@@ -147,19 +160,18 @@
</div>
<div class="btn-group">
+ <button id="checkboxes-on" class="btn"><i id="opts" class="icon-ok" ></i>Select Options</button>
<button id="clear-query-button" class="btn">Clear Query</button>
- <button id="checkboxes-on" class="btn">Select All Options</button>
- <button id="checkboxes-off" class="btn">Clear All Options</button>
+ <!-- <button id="checkboxes-off" class="btn">Clear All Options</button> -->
<button type="submit" id="run-btn" class="btn btn-custom-darken">Run</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>
+ <label class="checkbox optlabel"><input type="checkbox" checked="checked" name="print-expr-tree" value="true" /> Print parsed expressions</label>
+ <label class="checkbox optlabel"><input type="checkbox" checked="checked" name="print-rewritten-expr-tree" value="true" /> Print rewritten expressions</label>
+ <label class="checkbox optlabel"><input type="checkbox" checked="checked" name="print-logical-plan" value="true" /> Print logical plan</label>
+ <label class="checkbox optlabel"><input type="checkbox" checked="checked" name="print-optimized-logical-plan" value="true" /> Print optimized logical plan</label>
+ <label class="checkbox optlabel"><input type="checkbox" checked="checked" name="print-job" value="true" /> Print Hyracks job</label>
</div>
</form>
</div>
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 df12b4d..041d9c0 100644
--- a/asterix-app/src/main/resources/webui/static/css/style.css
+++ b/asterix-app/src/main/resources/webui/static/css/style.css
@@ -38,6 +38,13 @@
#run-btn {
}
+#select-toggle-holder {
+ border: 1px black;
+ -webkit-border-radius: 5px;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+}
+
textarea.query {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
@@ -57,6 +64,10 @@
padding-top: 10px;
}
+#opts {
+ margin-right: 4px;
+}
+
input[type=text] {
height: 20px;
}