[REVIEW ONLY] Add Find Whole Word functionality

src/htmlContent/findreplace-bar.html

@@ -2,6 +2,7 @@
     <div id="find-group"><!--
         --><div class="search-input-container"><input type="text" id="find-what" placeholder="{{queryPlaceholder}}" value="{{initialQuery}}" /><div class="error"></div><span id="find-counter"></span></div><!--
         --><button id="find-case-sensitive" class="btn no-focus" tabindex="-1" title="{{Strings.BUTTON_CASESENSITIVE_HINT}}"><div class="button-icon"></div></button><!--
+        --><button id="find-whole-word" class="btn no-focus" tabindex="-1" title="{{Strings.BUTTON_WHOLE_WORD_HINT}}"><div class="button-icon"></div></button><!--
         --><button id="find-regexp" class="btn no-focus" tabindex="-1" title="{{Strings.BUTTON_REGEXP_HINT}}"><div class="button-icon"></div></button><!--
         {{^multifile}}
         --><div class="navigator"><!--

src/nls/root/strings.js

@@ -148,6 +148,7 @@ define({
     "BUTTON_NEXT_HINT"                  : "Next Match",
     "BUTTON_PREV_HINT"                  : "Previous Match",
     "BUTTON_CASESENSITIVE_HINT"         : "Match Case",
+    "BUTTON_WHOLE_WORD_HINT"            : "Whole Word",
     "BUTTON_REGEXP_HINT"                : "Regular Expression",
     "REPLACE_WITHOUT_UNDO_WARNING_TITLE": "Replace Without Undo",
     "REPLACE_WITHOUT_UNDO_WARNING"      : "Because more than {0} files need to be changed, {APP_NAME} will modify unopened files on disk.<br />You won't be able to undo replacements in those files.",

src/search/FindBar.js

@@ -187,6 +187,7 @@ define(function (require, exports, module) {
         // Have to make sure we explicitly cast the second parameter to a boolean, because
         // toggleClass expects literal true/false.
         this.$("#find-case-sensitive").toggleClass("active", !!PreferencesManager.getViewState("caseSensitive"));
+        this.$("#find-whole-word").toggleClass("active", !!PreferencesManager.getViewState("wholeWord"));
         this.$("#find-regexp").toggleClass("active", !!PreferencesManager.getViewState("regexp"));
     };
 
@@ -196,6 +197,7 @@ define(function (require, exports, module) {
      */
     FindBar.prototype._updatePrefsFromSearchBar = function () {
         PreferencesManager.setViewState("caseSensitive", this.$("#find-case-sensitive").is(".active"));
+        PreferencesManager.setViewState("wholeWord",     this.$("#find-whole-word").is(".active"));
         PreferencesManager.setViewState("regexp",        this.$("#find-regexp").is(".active"));
     };
 
@@ -251,8 +253,13 @@ define(function (require, exports, module) {
             .on("input", "#find-what", function () {
                 $(self).triggerHandler("queryChange");
             })
-            .on("click", "#find-case-sensitive, #find-regexp", function (e) {
-                $(e.currentTarget).toggleClass("active");
+            .on("click", "#find-case-sensitive, #find-whole-word, #find-regexp", function (e) {
+                var $target = $(e.currentTarget);
+                $target.toggleClass("active");
+
+                // make sure find-whole-word and find-regexp aren't active at the same time
+                $("#find-whole-word, #find-regexp").not($target).removeClass("active");
+
                 self._updatePrefsFromSearchBar();
                 $(self).triggerHandler("queryChange");
             })
@@ -348,12 +355,13 @@ define(function (require, exports, module) {
 
     /**
      * Returns the current query and parameters.
-     * @return {{query: string, caseSensitive: boolean, isRegexp: boolean}}
+     * @return {{query: string, caseSensitive: boolean, isWholeWord: boolean, isRegexp: boolean}}
      */
     FindBar.prototype.getQueryInfo = function () {
         return {
             query:           this.$("#find-what").val() || "",
             isCaseSensitive: this.$("#find-case-sensitive").is(".active"),
+            isWholeWord:     this.$("#find-whole-word").is(".active"),
             isRegexp:        this.$("#find-regexp").is(".active")
         };
     };
@@ -418,7 +426,7 @@ define(function (require, exports, module) {
      */
     FindBar.prototype.enable = function (enable) {
         var self = this;
-        this.$("#find-what, #replace-with, #find-prev, #find-next, #find-case-sensitive, #find-regexp").prop("disabled", !enable);
+        this.$("#find-what, #replace-with, #find-prev, #find-next, #find-case-sensitive, #find-regexp, #find-whole-word").prop("disabled", !enable);
         this._enabled = enable;
     };
 

src/search/FindReplace.js

@@ -118,6 +118,8 @@ define(function (require, exports, module) {
                 return "";
             }
 
+        } else if (queryInfo.isWholeWord) {
+            return new RegExp("\\b" + StringUtils.regexEscape(queryInfo.query) + "\\b", queryInfo.isCaseSensitive ? "" : "i");
         } else {
             return queryInfo.query;
         }

src/search/SearchModel.js

@@ -149,6 +149,8 @@ define(function (require, exports, module) {
             } catch (e) {
                 return {valid: false, error: e.message};
             }
+        } else if (queryInfo.isWholeWord) {
+            this.queryExpr = new RegExp("\\b" + StringUtils.regexEscape(queryInfo.query) + "\\b", flags);
         } else {
             // Query is a plain string. Turn it into a regexp
             this.queryExpr = new RegExp(StringUtils.regexEscape(queryInfo.query), flags);

src/styles/brackets.less

@@ -1155,7 +1155,7 @@ a, img {
         display: inline-block;
     }
 
-    #find-case-sensitive, #find-regexp {
+    #find-case-sensitive, #find-whole-word, #find-regexp {
         padding: 1px 5px;
     }
     .button-icon {  // icons must be nested inside button so we can apply padding w/o tiling icon
@@ -1171,7 +1171,13 @@ a, img {
     #find-case-sensitive.active .button-icon {
         .sprite-swap(0, 72px);
     }
-    #find-regexp.active, #find-case-sensitive.active {
+    #find-whole-word .button-icon {
+        .sprite-swap(0, 96px);
+    }
+    #find-whole-word.active .button-icon {
+        .sprite-swap(0, 120px);
+    }
+    #find-case-sensitive.active, #find-whole-word.active, #find-regexp.active {
         background-color: @tc-highlight;
     }
 
@@ -1188,7 +1194,7 @@ a, img {
     }
 
     // Make button pairs snug
-    #find-prev, #replace-yes, #find-case-sensitive {
+    #find-prev, #replace-yes, #find-case-sensitive, #find-whole-word {
         border-right: none;
         margin-right: 0;
     }
@@ -1205,13 +1211,17 @@ a, img {
     // Make find field snug with options buttons
     //    & replace snug with replace commands
     #find-what, #replace-with {
-        margin-right: 0px;
+        margin-right: 0;
         border-top-right-radius: 0;
         border-bottom-right-radius: 0;
     }
     #find-case-sensitive, #replace-yes {
         border-left: none;
-        margin-left: 0px;
+        margin-left: 0;
+        border-radius: 0;
+    }
+    #find-whole-word {
+        margin-left: 0;
         border-radius: 0;
     }
 }