Add modal prompt for empty PC query result #661

app/js/backbone-views.js

@@ -1768,6 +1768,10 @@ var NeighborhoodQueryView = Backbone.View.extend({
  chiseInstance.endSpinner('neighborhood-spinner');
  $(document).trigger('sbgnvizLoadFileEnd', [ filename, cy ]);
  }
+ else if (data.response.body === "") {
+ new PromptEmptyQueryResultView({el: '#prompt-emptyQueryResult-table'}).render();
+ chiseInstance.endSpinner('neighborhood-spinner');
+ }
  else {
  new PromptInvalidQueryView({el: '#prompt-invalidQuery-table'}).render();
  chiseInstance.endSpinner('neighborhood-spinner');
@@ -1805,6 +1809,10 @@ var NeighborhoodQueryView = Backbone.View.extend({
  chiseInstance.endSpinner('neighborhood-spinner');
  $(document).trigger('sbgnvizLoadFileEnd', [ filename, cy ]);
  }
+ else if (data.response.body === "") {
+ new PromptEmptyQueryResultView({el: '#prompt-emptyQueryResult-table'}).render();
+ chiseInstance.endSpinner('neighborhood-spinner');
+ }
  else {
  new PromptInvalidQueryView({el: '#prompt-invalidQuery-table'}).render();
  chiseInstance.endSpinner('neighborhood-spinner');
@@ -3182,6 +3190,26 @@ var PromptInvalidQueryView = Backbone.View.extend({
  }
 });
 
+var PromptEmptyQueryResultView = Backbone.View.extend({
+ initialize: function () {
+ var self = this;
+ self.template = _.template($("#prompt-emptyQueryResult-template").html());
+ },
+ render: function () {
+ var self = this;
+ self.template = _.template($("#prompt-emptyQueryResult-template").html());
+
+ $(self.el).html(self.template);
+ $(self.el).modal('show');
+
+ $(document).off("click", "#prompt-emptyQueryResult-confirm").on("click", "#prompt-emptyQueryResult-confirm", function (evt) {
+ $(self.el).modal('toggle');
+ });
+
+ return this;
+ }
+});
+
 var PromptInvalidLengthLimitView = Backbone.View.extend({
  initialize: function () {
  var self = this;

index.html

@@ -825,6 +825,10 @@
  <!-- map type change confirmation dialog will be shown here-->
  </div>
 
+ <div id="prompt-emptyQueryResult-table" tabindex="-1" class="modal fade" role="dialog">
+ <!-- map type change confirmation dialog will be shown here-->
+ </div>
+
  <div id="prompt-invalidLengthLimit-table" tabindex="-1" class="modal fade" role="dialog">
  <!-- map type change confirmation dialog will be shown here-->
  </div>
@@ -2121,6 +2125,37 @@ <h4 class="modal-title">Error</h4>
  </div>
  </script>
 
+ <!-- Empty query result -->
+ <script type="text/template" id="prompt-emptyQueryResult-template">
+ <div class="modal-dialog sbgn-modal-dialog" style="width: 300px;">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal">&times;</button>
+ <h4 class="modal-title">Info</h4>
+ </div>
+ <div class="modal-body">
+ <table class="table-condensed layout-table dialog-table" style="margin: auto;">
+ <tbody>
+ <tr>
+ <th style="padding-left: 0px;" align="left">
+ <span class="add-on layout-text">No results found for query.</span>
+ </th>
+ </tr>
+
+ <tr id="prompt-emptyQueryResult-buttons" style="padding-bottom: 0px; margin-bottom: 0px;">
+ <td>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ <div class="modal-footer" style="text-align: center">
+ <button id="prompt-emptyQueryResult-confirm" class="btn btn-default">OK</button>
+ </div>
+ </div>
+ </div>
+ </script>
+
  <!-- Invalid length limit warning -->
  <script type="text/template" id="prompt-invalidLengthLimit-template">
  <div class="modal-dialog sbgn-modal-dialog" style="width: 300px;">