From d1a812f04c5b1fbd4aa2f187a003abeac129f15b Mon Sep 17 00:00:00 2001 From: Guillaume Lajarige Date: Thu, 15 Mar 2018 14:38:10 +0000 Subject: [PATCH] Advanced search: WIP POC, UI/UX. SVN:b1162[5436] --- js/search/search_form_criteria.js | 6 +++++- js/search/search_form_criteria_string.js | 21 +++++++++++++++++++++ js/search/search_form_handler.js | 20 +++++++++++++++++++- 3 files changed, 45 insertions(+), 2 deletions(-) diff --git a/js/search/search_form_criteria.js b/js/search/search_form_criteria.js index 84b9d91738..36125ce2cf 100644 --- a/js/search/search_form_criteria.js +++ b/js/search/search_form_criteria.js @@ -164,6 +164,10 @@ $(function() // - Open / Close criteria _open: function() { + // Inform handler that a criteria is opening + this.handler.triggerHandler('itop.search.criteria.opening'); + + // Open criteria this._resetOperators(); this.element.addClass('opened'); @@ -476,7 +480,7 @@ $(function() }); // - Apply on "enter" key hit oOpContentElem.on('keyup', function(oEvent){ - // Check operator's radio if not already + // Check operator's radio if not already (typically when focusing in input via "tab" key) if(oOpElem.find('.sfc_op_radio').prop('checked') === false) { oOpElem.find('.sfc_op_radio').prop('checked', true) diff --git a/js/search/search_form_criteria_string.js b/js/search/search_form_criteria_string.js index 2a937effbd..80fa292eb1 100644 --- a/js/search/search_form_criteria_string.js +++ b/js/search/search_form_criteria_string.js @@ -70,5 +70,26 @@ $(function() //------------------ // DOM element helpers + // TODO: Remove this function after UX tests + _prepareOperators: function() + { + this._super(); + + if(this.options.ref === 'UserRequest.ref') + { + // Remove starts/ends_with + this.element.find('.sfc_fg_operator[data-operator-code*="with"]').remove(); + // Modify contains with a dropdown + this.element.find('.sfc_fg_operator[data-operator-code="contains"] .sfc_op_name').html(''); + // Remove click event on dropdown + this.element.find('.sfc_fg_operator[data-operator-code="contains"] .sfc_op_name').on('click', function(oEvent){ + oEvent.preventDefault(); + oEvent.stopPropagation(); + }); + this.element.find('.sfc_fg_operator[data-operator-code="contains"] .sfc_op_name select').on('change', function(){ + $(this).closest('.sfc_fg_operator').find('.sfc_op_content input:first').trigger('focus'); + }); + } + }, }); }); diff --git a/js/search/search_form_handler.js b/js/search/search_form_handler.js index f45b4cb63d..e95f52ee6b 100644 --- a/js/search/search_form_handler.js +++ b/js/search/search_form_handler.js @@ -134,6 +134,9 @@ $(function() }); // Criteria events + this.element.on('itop.search.criteria.opening', function(oEvent, oData){ + me._onCriteriaOpening(oData); + }); this.element.on('itop.search.criteria.value_changed', function(oEvent, oData){ me._onCriteriaValueChanged(oData); }); @@ -168,6 +171,9 @@ $(function() _openMoreCriterion: function() { this.elements.more_criterion.addClass('opened'); + this.elements.active_criterion.find('.search_form_criteria').each(function(){ + $(this).triggerHandler('itop.search.criteria.close'); + }); }, _closeMoreCriterion: function() { @@ -175,7 +181,15 @@ $(function() }, _toggleMoreCriterion: function() { - this.elements.more_criterion.toggleClass('opened'); + // Calling methods instead of toggling the class so additional processing are done. + if(this.elements.more_criterion.hasClass('opened')) + { + this._closeMoreCriterion(); + } + else + { + this._openMoreCriterion(); + } }, // DOM helpers @@ -381,6 +395,10 @@ $(function() return 'search_form_criteria' + '_' + (($.itop['search_form_criteria_'+sType] !== undefined) ? sType : 'raw'); }, // Criteria handlers + _onCriteriaOpening: function(oData) + { + this._closeMoreCriterion(); + }, _onCriteriaValueChanged: function(oData) { this._updateSearch();