commit/galaxy-central: carlfeberhard: btn/esc to clear tool search (bb issue #774)

2 Aug 2012

1 new commit in galaxy-central:


https://bitbucket.org/galaxy/galaxy-central/changeset/c2ff2d01a23a/
changeset:   c2ff2d01a23a
user:        carlfeberhard
date:        2012-08-02 18:21:49
summary:     btn/esc to clear tool search (bb issue #774)
affected #:  8 files

diff -r 8402d189f38ba88a0f83c9f76ad56cc05c82f363 -r c2ff2d01a23a778c4778e6a466eaf3592486cbee static/june_2007_style/blue/base.css

--- a/static/june_2007_style/blue/base.css
+++ b/static/june_2007_style/blue/base.css
@@ -714,7 +714,8 @@
 textarea,input[type="text"],input[type="password"]{font-size:12px;line-height:16px;border:1px solid #999999;padding:3px;}
 .search-query{display:inline-block;padding:4px;font-size:12px;line-height:16px;color:#555555;border:1px solid #999999;padding-left:14px !important;padding-right:14px !important;margin-bottom:0;-webkit-border-radius:14px;-moz-border-radius:14px;border-radius:14px;max-width:auto;}
 .search-query:focus{border-color:rgba(24, 132, 218, 0.8);-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6);-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6);box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6);outline:0;outline:thin dotted \9;}
-.search-spinner{position:absolute;display:none;right:8px;top:10px;}
+.search-spinner{position:absolute;display:none;right:5px;top:9px;}
+.search-clear-btn{position:absolute;right:4px;top:8px;}
 .errormessagelarge,.warningmessagelarge,.donemessagelarge,.infomessagelarge{padding:8px 35px 8px 14px;margin-bottom:16px;text-shadow:0 1px 0 rgba(255, 255, 255, 0.5);background-color:#ffffcc;border:1px solid #ffdd33;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;color:#666600;min-height:36px;padding-left:52px;background-image:url(error_large.png);background-repeat:no-repeat;background-position:10px 10px;}
 .errormessagelarge{background-color:#ffcccc;border-color:#ff3355;color:#660000;padding-left:52px;}
 .warningmessagelarge{background-image:url(warn_large.png);border-color:#aaaa66;background-color:#ffffcc;}


diff -r 8402d189f38ba88a0f83c9f76ad56cc05c82f363 -r c2ff2d01a23a778c4778e6a466eaf3592486cbee static/scripts/mvc/tools.js
--- a/static/scripts/mvc/tools.js
+++ b/static/scripts/mvc/tools.js
@@ -270,11 +270,16 @@
  */
 var ToolSearch = BaseModel.extend({
     defaults: {
+        search_hint_string: "search tools",
+        min_chars_for_search: 3,
         spinner_url: "",
+        clear_btn_url: "",
         search_url: "",
         visible: true,
         query: "",
-        results: null
+        results: null,
+        // ESC (27) will clear the input field and tool search filters
+        clear_key: 27
     },
     
     initialize: function() {
@@ -288,7 +293,7 @@
         var query = this.attributes.query;
         
         // If query is too short, do not search.
-        if (query.length < 3) {
+        if (query.length < this.attributes.min_chars_for_search) {
             this.set("results", null);
             return;
         }
@@ -300,15 +305,23 @@
             clearTimeout(this.timer);
         }
         // Start a new ajax-request in X ms
+        $("#search-clear-btn").hide();
         $("#search-spinner").show();
         var self = this;
         this.timer = setTimeout(function () {
             $.get(self.attributes.search_url, { query: q }, function (data) {
                 self.set("results", data);
                 $("#search-spinner").hide();
+                $("#search-clear-btn").show();
             }, "json" );
         }, 200 );
+    },
+    
+    clear_search: function() {
+        this.set("query", "");
+        this.set("results", null);
     }
+    
 });
 
 /**
@@ -520,7 +533,8 @@
     
     events: {
         'click': 'focus_and_select',
-        'keyup :input': 'query_changed'
+        'keyup :input': 'query_changed',
+        'click #search-clear-btn': 'clear'
     },
     
     render: function() {
@@ -535,7 +549,20 @@
         this.$el.find(":input").focus().select();
     },
     
-    query_changed: function() {
+    clear: function() {
+        this.model.clear_search();
+        this.$el.find(":input").val(this.model.attributes.search_hint_string);
+        this.focus_and_select();
+        return false;
+    },
+    
+    query_changed: function( evData ) {
+        // check for the 'clear key' (ESC) first
+        if( ( this.model.attributes.clear_key )
+        &&  ( this.model.attributes.clear_key == evData.which ) ){
+            this.clear();
+            return false;
+        }
         this.model.set("query", this.$el.find(":input").val());
     }
 });


diff -r 8402d189f38ba88a0f83c9f76ad56cc05c82f363 -r c2ff2d01a23a778c4778e6a466eaf3592486cbee static/scripts/templates/compiled/panel_section.js
--- a/static/scripts/templates/compiled/panel_section.js
+++ b/static/scripts/templates/compiled/panel_section.js
@@ -2,24 +2,21 @@
   var template = Handlebars.template, templates = Handlebars.templates = Handlebars.templates || {};
 templates['panel_section'] = template(function (Handlebars,depth0,helpers,partials,data) {
   helpers = helpers || Handlebars.helpers;
-  var buffer = "", stack1, foundHelper, self=this, functionType="function", helperMissing=helpers.helperMissing, undef=void 0, escapeExpression=this.escapeExpression;
+  var buffer = "", stack1, foundHelper, functionType="function", escapeExpression=this.escapeExpression;
 
 
   buffer += "<div class=\"toolSectionTitle\" id=\"title_";
   foundHelper = helpers.id;
-  stack1 = foundHelper || depth0.id;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "id", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.id; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + "\">\n    <a href=\"javascript:void(0)\"><span>";
   foundHelper = helpers.name;
-  stack1 = foundHelper || depth0.name;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "name", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.name; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + "</span></a>\n</div>\n<div id=\"";
   foundHelper = helpers.id;
-  stack1 = foundHelper || depth0.id;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "id", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.id; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + "\" class=\"toolSectionBody\" style=\"display: none; \">\n    <div class=\"toolSectionBg\"></div>\n<div>";
   return buffer;});
 })();
\ No newline at end of file


diff -r 8402d189f38ba88a0f83c9f76ad56cc05c82f363 -r c2ff2d01a23a778c4778e6a466eaf3592486cbee static/scripts/templates/compiled/tool_form.js
--- a/static/scripts/templates/compiled/tool_form.js
+++ b/static/scripts/templates/compiled/tool_form.js
@@ -2,60 +2,47 @@
   var template = Handlebars.template, templates = Handlebars.templates = Handlebars.templates || {};
 templates['tool_form'] = template(function (Handlebars,depth0,helpers,partials,data) {
   helpers = helpers || Handlebars.helpers;
-  var buffer = "", stack1, stack2, foundHelper, tmp1, self=this, functionType="function", helperMissing=helpers.helperMissing, undef=void 0, escapeExpression=this.escapeExpression;
+  var buffer = "", stack1, foundHelper, functionType="function", escapeExpression=this.escapeExpression, self=this;
 
 function program1(depth0,data) {
   
-  var buffer = "", stack1;
+  var buffer = "", stack1, foundHelper;
   buffer += "\n        <div class=\"form-row\">\n            <label for=\"";
   foundHelper = helpers.name;
-  stack1 = foundHelper || depth0.name;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "name", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.name; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + "\">";
   foundHelper = helpers.label;
-  stack1 = foundHelper || depth0.label;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "label", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.label; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + ":</label>\n            <div class=\"form-row-input\">\n                ";
   foundHelper = helpers.html;
-  stack1 = foundHelper || depth0.html;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "html", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.html; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   if(stack1 || stack1 === 0) { buffer += stack1; }
   buffer += "\n            </div>\n            <div class=\"toolParamHelp\" style=\"clear: both;\">\n                ";
   foundHelper = helpers.help;
-  stack1 = foundHelper || depth0.help;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "help", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.help; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + "\n            </div>\n            <div style=\"clear: both;\"></div>\n        </div>\n        ";
   return buffer;}
 
   buffer += "<div class=\"toolFormTitle\">";
   foundHelper = helpers.name;
-  stack1 = foundHelper || depth0.name;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "name", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.name; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + " (version ";
   foundHelper = helpers.version;
-  stack1 = foundHelper || depth0.version;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "version", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.version; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + ")</div>\n    <div class=\"toolFormBody\">\n        ";
-  foundHelper = helpers.inputs;
-  stack1 = foundHelper || depth0.inputs;
-  stack2 = helpers.each;
-  tmp1 = self.program(1, program1, data);
-  tmp1.hash = {};
-  tmp1.fn = tmp1;
-  tmp1.inverse = self.noop;
-  stack1 = stack2.call(depth0, stack1, tmp1);
+  stack1 = depth0.inputs;
+  stack1 = helpers.each.call(depth0, stack1, {hash:{},inverse:self.noop,fn:self.program(1, program1, data)});
   if(stack1 || stack1 === 0) { buffer += stack1; }
   buffer += "\n    </div>\n    <div class=\"form-row form-actions\">\n    <input type=\"submit\" class=\"btn btn-primary\" name=\"runtool_btn\" value=\"Execute\">\n</div>\n<div class=\"toolHelp\">\n    <div class=\"toolHelpBody\">";
   foundHelper = helpers.help;
-  stack1 = foundHelper || depth0.help;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "help", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.help; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + "</div>\n</div>";
   return buffer;});
 })();
\ No newline at end of file


diff -r 8402d189f38ba88a0f83c9f76ad56cc05c82f363 -r c2ff2d01a23a778c4778e6a466eaf3592486cbee static/scripts/templates/compiled/tool_link.js
--- a/static/scripts/templates/compiled/tool_link.js
+++ b/static/scripts/templates/compiled/tool_link.js
@@ -2,39 +2,33 @@
   var template = Handlebars.template, templates = Handlebars.templates = Handlebars.templates || {};
 templates['tool_link'] = template(function (Handlebars,depth0,helpers,partials,data) {
   helpers = helpers || Handlebars.helpers;
-  var buffer = "", stack1, foundHelper, self=this, functionType="function", helperMissing=helpers.helperMissing, undef=void 0, escapeExpression=this.escapeExpression;
+  var buffer = "", stack1, foundHelper, functionType="function", escapeExpression=this.escapeExpression;
 
 
   buffer += "<a class=\"";
   foundHelper = helpers.id;
-  stack1 = foundHelper || depth0.id;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "id", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.id; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + " tool-link\" href=\"";
   foundHelper = helpers.link;
-  stack1 = foundHelper || depth0.link;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "link", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.link; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + "\" target=\"";
   foundHelper = helpers.target;
-  stack1 = foundHelper || depth0.target;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "target", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.target; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + "\" minsizehint=\"";
   foundHelper = helpers.min_width;
-  stack1 = foundHelper || depth0.min_width;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "min_width", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.min_width; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + "\">";
   foundHelper = helpers.name;
-  stack1 = foundHelper || depth0.name;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "name", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.name; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + "</a> ";
   foundHelper = helpers.description;
-  stack1 = foundHelper || depth0.description;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "description", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.description; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1);
   return buffer;});
 })();
\ No newline at end of file


diff -r 8402d189f38ba88a0f83c9f76ad56cc05c82f363 -r c2ff2d01a23a778c4778e6a466eaf3592486cbee static/scripts/templates/compiled/tool_search.js
--- a/static/scripts/templates/compiled/tool_search.js
+++ b/static/scripts/templates/compiled/tool_search.js
@@ -2,14 +2,21 @@
   var template = Handlebars.template, templates = Handlebars.templates = Handlebars.templates || {};
 templates['tool_search'] = template(function (Handlebars,depth0,helpers,partials,data) {
   helpers = helpers || Handlebars.helpers;
-  var buffer = "", stack1, foundHelper, self=this, functionType="function", helperMissing=helpers.helperMissing, undef=void 0, escapeExpression=this.escapeExpression;
+  var buffer = "", stack1, foundHelper, functionType="function", escapeExpression=this.escapeExpression;
 
 
-  buffer += "<input type=\"text\" name=\"query\" value=\"search tools\" id=\"tool-search-query\" autocomplete=\"off\" class=\"search-query parent-width\" />\n<img src=\"";
+  buffer += "<input type=\"text\" name=\"query\" value=\"";
+  foundHelper = helpers.search_hint_string;
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.search_hint_string; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
+  buffer += escapeExpression(stack1) + "\" id=\"tool-search-query\" autocomplete=\"off\" class=\"search-query parent-width\" />\n<img src=\"";
+  foundHelper = helpers.clear_btn_url;
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.clear_btn_url; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
+  buffer += escapeExpression(stack1) + "\" id=\"search-clear-btn\" class=\"search-clear-btn\"/>\n<img src=\"";
   foundHelper = helpers.spinner_url;
-  stack1 = foundHelper || depth0.spinner_url;
-  if(typeof stack1 === functionType) { stack1 = stack1.call(depth0, { hash: {} }); }
-  else if(stack1=== undef) { stack1 = helperMissing.call(depth0, "spinner_url", { hash: {} }); }
+  if (foundHelper) { stack1 = foundHelper.call(depth0, {hash:{}}); }
+  else { stack1 = depth0.spinner_url; stack1 = typeof stack1 === functionType ? stack1() : stack1; }
   buffer += escapeExpression(stack1) + "\" id=\"search-spinner\" class=\"search-spinner\"/>\n";
   return buffer;});
 })();
\ No newline at end of file


diff -r 8402d189f38ba88a0f83c9f76ad56cc05c82f363 -r c2ff2d01a23a778c4778e6a466eaf3592486cbee static/scripts/templates/tool_search.handlebars
--- a/static/scripts/templates/tool_search.handlebars
+++ b/static/scripts/templates/tool_search.handlebars
@@ -1,2 +1,3 @@
-<input type="text" name="query" value="search tools" id="tool-search-query" autocomplete="off" class="search-query parent-width" />
+<input type="text" name="query" value="{{search_hint_string}}" id="tool-search-query" autocomplete="off" class="search-query parent-width" />
+<img src="{{clear_btn_url}}" id="search-clear-btn" class="search-clear-btn"/><img src="{{spinner_url}}" id="search-spinner" class="search-spinner"/>


diff -r 8402d189f38ba88a0f83c9f76ad56cc05c82f363 -r c2ff2d01a23a778c4778e6a466eaf3592486cbee templates/root/tool_menu.mako
--- a/templates/root/tool_menu.mako
+++ b/templates/root/tool_menu.mako
@@ -34,9 +34,10 @@
         $(function() {
             // Set up search.
             tool_search = new ToolSearch( {spinner_url: "${h.url_for('/static/images/loading_small_white_bg.gif')}",
-                                           search_url: "${h.url_for( controller='root', action='tool_search' )}",
+                                           clear_btn_url: "${h.url_for('/static/images/fugue/cross-circle-bw.png')}",
+										   search_url: "${h.url_for( controller='root', action='tool_search' )}",
                                            hidden: ${tool_search_hidden} } );
-            
+										   
             // Set up tool panel.
             tool_panel = new ToolPanel( { tool_search: tool_search } );
             tool_panel.reset( tool_panel.parse( ${h.to_json_string( dictified_panel )} ) );

Repository URL: https://bitbucket.org/galaxy/galaxy-central/

--

This is a commit notification from bitbucket.org. You are receiving
this because you have the service enabled, addressing the recipient of
this email.

    

Bitbucket

tags

participants (1)