Fixed bug #16681: Live-Search: Taking focus from search field should show tooltip...
authorIngo Renner <ingo.renner@typo3.org>
Sat, 22 Jan 2011 18:15:37 +0000 (18:15 +0000)
committerIngo Renner <ingo.renner@typo3.org>
Sat, 22 Jan 2011 18:15:37 +0000 (18:15 +0000)
git-svn-id: https://svn.typo3.org/TYPO3v4/Core/trunk@10262 709f56b5-9817-0410-a4d7-c38de5d9e867

ChangeLog
typo3/js/livesearch.js

index 81d4f10..901e963 100755 (executable)
--- a/ChangeLog
+++ b/ChangeLog
@@ -11,6 +11,7 @@
        * Fixed incorrect english label for table tt_content from "Pagecontent" to "Page Content"
        * Fixed bug #17213: Names of backend layout columns not displayed properly
        * Follow-up to #17213: icons to add content were shifted down a bit, credits Steffen Gebert
+       * Fixed bug #16681: Live-Search: Taking focus from search field should show tooltip "Enter search term" again, credits Jeff Segars
 
 2011-01-22  Jeff Segars  <jeff@webempoweredchurch.org>
 
index cead0e1..88771d5 100644 (file)
@@ -42,13 +42,12 @@ TYPO3.BackendLiveSearch = Ext.extend(Ext.form.ComboBox, {
        listClass: 'live-search-list',
        listEmptyText: null,
        listWidth: 315,
+       listHovered: false,
        loadingText: null,
        minChars: 2,
        resizable: false,
        title: null,
        width: 205,
-       hasIframeListeners: false,
-
        triggerClass : 'x-form-clear-trigger',
        triggerConfig: '<span tag="a" class="t3-icon t3-icon-actions t3-icon-actions-input t3-icon-input-clear t3-tceforms-input-clearer">&nbsp;</span>',
        onTriggerClick: function() {
@@ -152,9 +151,12 @@ TYPO3.BackendLiveSearch = Ext.extend(Ext.form.ComboBox, {
 
        initList : function () {
                TYPO3.BackendLiveSearch.superclass.initList.apply(this, arguments);
-
                var cls = 'x-combo-list';
 
+                       // Track whether the hovering over the results list or not, to aid in detecting iframe clicks.
+               this.mon(this.list, 'mouseover', function() {this.listHovered = true;}, this);
+               this.mon(this.list, 'mouseout', function() {this.listHovered = false; }, this);
+
                /**
                 * Create bottom Toolbar to the result layer
                 */
@@ -202,6 +204,10 @@ TYPO3.BackendLiveSearch = Ext.extend(Ext.form.ComboBox, {
                                constrain:false
                        });
 
+                               // Track whether the hovering over the help list or not, to aid in detecting iframe clicks.
+                       this.mon(this.helpList, 'mouseover', function() {this.listHovered = true;}, this);
+                       this.mon(this.helpList, 'mouseout', function() {this.listHovered = false; }, this);
+
                        var lw = this.listWidth || Math.max(this.wrap.getWidth(), this.minListWidth);
                        this.helpList.setSize(lw);
                        this.helpList.swallowEvent('mousewheel');
@@ -245,16 +251,13 @@ TYPO3.BackendLiveSearch = Ext.extend(Ext.form.ComboBox, {
        removeHelp : function() {
                if (this.helpList) {
                        this.helpList.destroy();
+                       delete this.helpList;
                }
        },
 
        onFocus : function() {
                TYPO3.BackendLiveSearch.superclass.onFocus.apply(this, arguments);
 
-               if (!this.hasIframeListeners) {
-                       this.addIframeListeners();
-               }
-
                // If search is blank, show the help on focus. Otherwise, show last results
                if (this.getValue() == '') {
                        this.initHelp();
@@ -263,6 +266,15 @@ TYPO3.BackendLiveSearch = Ext.extend(Ext.form.ComboBox, {
                }
        },
 
+       /**
+        * Fired when search results are clicked. We do not want the search result
+        * appear so we always set doFocus = false
+        */
+       onViewClick : function(doFocus){
+               doFocus = false;
+               TYPO3.BackendLiveSearch.superclass.onViewClick.apply(this, arguments);
+       },
+
        postBlur : function() {
                TYPO3.BackendLiveSearch.superclass.postBlur.apply(this, arguments);
                this.removeHelp();
@@ -283,29 +295,15 @@ TYPO3.BackendLiveSearch = Ext.extend(Ext.form.ComboBox, {
                return 'id=' + this.searchResultsPid + '&search_levels=4&search_field=' + searchTerm;
        },
 
-       addIframeListeners : function () {
-               // Add an event handler to each iframe, closing the search window when there's a click inside the iframe
-               // @todo Is there a cleaner way to handle this?
-               var iframes = Ext.query('iframe');
-               Ext.each(iframes, function(item, index, allItems) {
-                       item.contentWindow.document.body.onclick = function() {
-                               if (parent.TYPO3LiveSearch && parent.TYPO3LiveSearch.hasFocus) {
-                                       if (parent.TYPO3LiveSearch.isExpanded()) {
-                                               parent.TYPO3LiveSearch.collapse();
-                                       }
+       handleBlur : function(e) {
 
-                                       if (parent.TYPO3LiveSearch.getRawValue() == '') {
-                                               parent.TYPO3LiveSearch.originalValue = parent.TYPO3LiveSearch.emptyText;
-                                               parent.TYPO3LiveSearch.reset(this);
-                                       }
-
-                                       if (parent.TYPO3LiveSearch.helpList.isVisible()) {
-                                               parent.TYPO3LiveSearch.helpList.remove();
-                                       }
-                               }
-                       };
-                       this.hasIframeListeners = true;
-               }, this);
+               if (!this.listHovered) {
+                       this.hasFocus = false;
+                       if (this.getValue() == '') {
+                               this.reset();
+                       }
+                       this.postBlur();
+               }
 
        }
 });
@@ -324,4 +322,7 @@ Ext.onReady(function() {
        });
 
        TYPO3LiveSearch.applyToMarkup(Ext.get('live-search-box'));
+
+               // Add a blur event listener outside the ExtJS widget to handle clicks in iframes also.
+       Ext.get('live-search-box').on('blur', TYPO3LiveSearch.handleBlur, TYPO3LiveSearch);
 });