Browse Source

Fixes issue where search wont close when clicked on message #3039

pull/3463/head
jlukic 9 years ago
parent
commit
6d34ae21e5
1 changed files with 62 additions and 88 deletions
  1. 150
      src/definitions/modules/search.js

150
src/definitions/modules/search.js

@ -46,8 +46,6 @@ $.fn.search = function(parameters) {
$module = $(this), $module = $(this),
$prompt = $module.find(selector.prompt), $prompt = $module.find(selector.prompt),
$input = $module.find(selector.input),
$remove = $module.find(selector.remove),
$searchButton = $module.find(selector.searchButton), $searchButton = $module.find(selector.searchButton),
$results = $module.find(selector.results), $results = $module.find(selector.results),
$result = $module.find(selector.result), $result = $module.find(selector.result),
@ -107,11 +105,6 @@ $.fn.search = function(parameters) {
.on('mouseup' + eventNamespace, selector.results, module.event.result.mouseup) .on('mouseup' + eventNamespace, selector.results, module.event.result.mouseup)
.on('click' + eventNamespace, selector.result, module.event.result.click) .on('click' + eventNamespace, selector.result, module.event.result.click)
; ;
if(module.is.searchSelection()) {
$module
.on('click' + eventNamespace, selector.remove, module.event.remove.click)
;
}
} }
}, },
@ -141,20 +134,29 @@ $.fn.search = function(parameters) {
}, },
blur: function(event) { blur: function(event) {
var var
pageLostFocus = (document.activeElement === this)
;
if(!pageLostFocus && !module.resultsClicked) {
if( settings.forceSelection && module.is.searchSelection() ) {
module.set.value( module.get.selectedValue() );
pageLostFocus = (document.activeElement === this),
callback = function() {
module.cancel.query();
module.remove.focus();
module.timer = setTimeout(module.hideResults, settings.hideDelay);
} }
module.cancel.query();
module.remove.focus();
module.timer = setTimeout(module.hideResults, settings.hideDelay);
;
if(pageLostFocus) {
return;
} }
},
remove: {
click: function() {
module.clear.selectedValue();
if(module.resultsClicked) {
module.debug('Determining if user action caused search to close');
$module
.one('click', selector.results, function(event) {
if( !module.is.animating() && !module.is.hidden() ) {
callback();
}
})
;
}
else {
module.debug('Input blurred without user action, closing results');
callback();
} }
}, },
result: { result: {
@ -189,7 +191,7 @@ $.fn.search = function(parameters) {
} }
module.hideResults(); module.hideResults();
if(value) { if(value) {
module.set.selectedValue(value);
module.set.value(value);
} }
if(href) { if(href) {
module.verbose('Opening search link found in result', $link); module.verbose('Opening search link found in result', $link);
@ -224,9 +226,7 @@ $.fn.search = function(parameters) {
// search shortcuts // search shortcuts
if(keyCode == keys.escape) { if(keyCode == keys.escape) {
module.verbose('Escape key pressed, blurring search field'); module.verbose('Escape key pressed, blurring search field');
$prompt
.trigger('blur')
;
module.trigger.blur();
} }
if( module.is.visible() ) { if( module.is.visible() ) {
if(keyCode == keys.enter) { if(keyCode == keys.enter) {
@ -315,15 +315,15 @@ $.fn.search = function(parameters) {
}, },
is: { is: {
input : function() {
$module.is('input');
animating: function() {
return $results.hasClass(className.animating);
},
hidden: function() {
return $results.hasClass(className.hidden);
}, },
empty: function() { empty: function() {
return ($results.html() === ''); return ($results.html() === '');
}, },
searchSelection: function() {
return $module.hasClass(className.selection);
},
visible: function() { visible: function() {
return ($results.filter(':visible').length > 0); return ($results.filter(':visible').length > 0);
}, },
@ -332,6 +332,20 @@ $.fn.search = function(parameters) {
} }
}, },
trigger: {
blur: function() {
var
events = document.createEvent('HTMLEvents'),
promptElement = $prompt[0]
;
if(promptElement) {
module.verbose('Triggering native blur event');
events.initEvent('blur', false, false);
promptElement.dispatchEvent(events);
}
}
},
get: { get: {
inputEvent: function() { inputEvent: function() {
var var
@ -344,12 +358,6 @@ $.fn.search = function(parameters) {
; ;
return inputEvent; return inputEvent;
}, },
selectedValue: function() {
return ($input.length > 0)
? $input.val() || ''
: $module.data(metadata.value) || ''
;
},
value: function() { value: function() {
return $prompt.val(); return $prompt.val();
}, },
@ -377,7 +385,7 @@ $.fn.search = function(parameters) {
$.each(results, function(index, category) { $.each(results, function(index, category) {
if($.isArray(category.results)) { if($.isArray(category.results)) {
result = module.search.object(value, category.results, lookupFields)[0]; result = module.search.object(value, category.results, lookupFields)[0];
// dont continue searching if a result is found
// don't continue searching if a result is found
if(result) { if(result) {
return false; return false;
} }
@ -393,9 +401,6 @@ $.fn.search = function(parameters) {
}, },
set: { set: {
clearable: function() {
$remove.addClass(className.active);
},
focus: function() { focus: function() {
$module.addClass(className.focus); $module.addClass(className.focus);
}, },
@ -408,21 +413,6 @@ $.fn.search = function(parameters) {
.val(value) .val(value)
; ;
}, },
selectedValue: function(value) {
if($input.length > 0) {
$input.val(value);
}
else {
$module.data(metadata.value, value);
}
if(value === '') {
module.remove.clearable();
}
else {
module.set.clearable();
}
module.set.value(value);
},
type: function(type) { type: function(type) {
type = type || settings.type; type = type || settings.type;
if(settings.type == 'category') { if(settings.type == 'category') {
@ -435,9 +425,6 @@ $.fn.search = function(parameters) {
}, },
remove: { remove: {
clearable: function() {
$remove.removeClass(className.active);
},
loading: function() { loading: function() {
$module.removeClass(className.loading); $module.removeClass(className.loading);
}, },
@ -472,8 +459,8 @@ $.fn.search = function(parameters) {
else { else {
module.error(error.source); module.error(error.source);
} }
settings.onSearchQuery.call(element, searchTerm);
} }
settings.onSearchQuery.call(element, searchTerm);
} }
else { else {
module.hideResults(); module.hideResults();
@ -648,19 +635,10 @@ $.fn.search = function(parameters) {
numCharacters = searchTerm.length numCharacters = searchTerm.length
; ;
return (numCharacters >= settings.minCharacters); return (numCharacters >= settings.minCharacters);
},
selectedValue: function() {
return module.get.selectedValue()
? true
: false
;
} }
}, },
clear: { clear: {
selectedValue: function() {
module.set.selectedValue('');
},
cache: function(value) { cache: function(value) {
var var
cache = $module.data(metadata.cache) cache = $module.data(metadata.cache)
@ -1120,9 +1098,6 @@ $.fn.search.settings = {
searchFullText : true, searchFullText : true,
// whether to include fuzzy results in local search // whether to include fuzzy results in local search
forceSelection : true,
// whether to remove unmatched input values from a selection search
automatic : true, automatic : true,
// whether to add events to prompt automatically // whether to add events to prompt automatically
@ -1154,13 +1129,14 @@ $.fn.search.settings = {
onResultsClose : function(){}, onResultsClose : function(){},
className: { className: {
active : 'active',
empty : 'empty',
focus : 'focus',
loading : 'loading',
results : 'results',
selection: 'selection',
pressed : 'down'
animating : 'animating',
active : 'active',
empty : 'empty',
focus : 'focus',
hidden : 'hidden',
loading : 'loading',
results : 'results',
pressed : 'down'
}, },
error : { error : {
@ -1177,8 +1153,7 @@ $.fn.search.settings = {
metadata: { metadata: {
cache : 'cache', cache : 'cache',
results : 'results', results : 'results',
result : 'result',
value : 'value'
result : 'result'
}, },
regExp: { regExp: {
@ -1196,19 +1171,18 @@ $.fn.search.settings = {
price : 'price', // result price price : 'price', // result price
results : 'results', // array of results (standard) results : 'results', // array of results (standard)
title : 'title', // result title title : 'title', // result title
url : 'url', // result url
action : 'action', // "view more" object name action : 'action', // "view more" object name
actionText : 'text', // "view more" text actionText : 'text', // "view more" text
actionURL : 'url' // "view more" url actionURL : 'url' // "view more" url
}, },
selector : { selector : {
category : '.category',
input : '> input[type="hidden"]',
prompt : '.prompt', prompt : '.prompt',
remove : '> .icon.input > .remove.icon',
result : '.result',
results : '.results',
searchButton : '.search.button', searchButton : '.search.button',
results : '.results',
category : '.category',
result : '.result',
title : '.title, .name' title : '.title, .name'
}, },
@ -1275,8 +1249,8 @@ $.fn.search.settings = {
// each item inside category // each item inside category
$.each(category.results, function(index, result) { $.each(category.results, function(index, result) {
if(response[fields.url]) {
html += '<a class="result" href="' + response[fields.url] + '">';
if(result[fields.url]) {
html += '<a class="result" href="' + result[fields.url] + '">';
} }
else { else {
html += '<a class="result">'; html += '<a class="result">';
@ -1326,8 +1300,8 @@ $.fn.search.settings = {
// each result // each result
$.each(response[fields.results], function(index, result) { $.each(response[fields.results], function(index, result) {
if(response[fields.url]) {
html += '<a class="result" href="' + response[fields.url] + '">';
if(result[fields.url]) {
html += '<a class="result" href="' + result[fields.url] + '">';
} }
else { else {
html += '<a class="result">'; html += '<a class="result">';
@ -1368,4 +1342,4 @@ $.fn.search.settings = {
} }
}; };
})( jQuery, window , document );
})( jQuery, window, document );
Loading…
Cancel
Save