Commit 9a45fa0e authored by Pedro Eduardo Trujillo's avatar Pedro Eduardo Trujillo
Browse files

Refactoriza e independiza búsqueda por texto 

Revisa la lógica del componente basado en widget de búsqueda por texto,
para mejorar su mantenibilidad y para dar pie a una bifurcación moderna,
independiente del componente Search.

Reimplementa la búsqueda de texto, sugerencias, peticiones directas y
expansión avanzada en un nuevo componente TextSearch. Aplica su uso al
nuevo diseño de mapa con listado añadido. Se mantiene la implementación
antigua TextImpl del componente Search para funcionar con servicios
antiguos, pero se irán migrando en el futuro hacia el nuevo componente.
parent ee3e807e

client-app/src/component/search/Search.js

+4 −8
Original line number Diff line number Diff line
@@ -11,14 +11,10 @@ define([ 
	, _Show

	, _SearchItfc

) {



	return declare([_Module, _Show, _SearchItfc], {

		// summary:

		//

		//	description:

		//



		//	config: Object

		//		Opciones por defecto.

		//   Componente para realizar búsquedas en los diferentes servicios.



		constructor: function(args) {

client-app/src/component/textSearch/TextSearch.js

0 → 100644
+65 −0
Original line number Diff line number Diff line 
define([

	'dojo/_base/declare'

	, 'src/component/base/_Module'

	, 'src/component/base/_Show'

	, 'src/component/textSearch/_TextSearchItfc'

], function(

	declare

	, _Module

	, _Show

	, _TextSearchItfc

) {



	return declare([_Module, _Show, _TextSearchItfc], {

		// summary:

		//   Componente para realizar búsquedas por texto en los diferentes servicios.



		postMixInProperties: function() {



			const defaultConfig = {

				ownChannel: 'textSearch',

				events: {

					SEARCH: 'search'

				},

				actions: {

					SEARCH: 'search',

					RESET: 'reset',

					REFRESH: 'refresh'

				}

			};



			this._mergeOwnAttributes(defaultConfig);



			this.inherited(arguments);

		},



		_defineSubscriptions: function () {



			this.subscriptionsConfig.push({

				channel: this.getChannel('RESET'),

				callback: '_subReset'

			},{

				channel: this.getChannel('REFRESH'),

				callback: '_subRefresh'

			});

		},



		_definePublications: function() {



			this.publicationsConfig.push({

				event: 'SEARCH',

				channel: this.getChannel('SEARCH')

			});

		},



		_subReset: function() {



			this._reset();

		},



		_subRefresh: function() {



			this._refresh();

		}

	});

});

client-app/src/component/textSearch/TextSearchImpl.js

0 → 100644
+167 −0
Original line number Diff line number Diff line 
define([

	'dojo/_base/declare'

	, 'dojo/dom-class'

	, 'put-selector'

	, 'src/component/textSearch/_Request'

	, 'src/component/textSearch/_Suggestions'

	, 'src/component/textSearch/TextSearch'

], function(

	declare

	, domClass

	, put

	, _Request

	, _Suggestions

	, TextSearch

) {



	return declare(TextSearch, {

		// summary:

		//   Implementación de buscador por texto.



		postMixInProperties: function() {



			const defaultConfig = {

				class: 'containerTextSearch',

				textSearchClass: 'textSearch',

				innerButtonsContainerClass: 'innerButtons',

				outerButtonsContainerClass: 'outerButtons',

				removeTextButtonClass: 'clearTextButton',

				searchButtonClass: 'searchButton',

				hiddenClass: 'invisible'

			};



			this._mergeOwnAttributes(defaultConfig);



			this.inherited(arguments);

		},



		_initialize: function() {



			this.inherited(arguments);



			const textSearchDefinition = `div.${this.textSearchClass}`;

			this._textSearchNode = put(this.domNode, textSearchDefinition);



			this._createTextSearchInput();

			this._createInnerButtons();

			this._createOuterButtons();

		},



		_createTextSearchInput: function() {



			const textSearchInputDefinition = `input[type=search][id=${this.getOwnChannel()}]`;

			this._textSearchInput = put(this._textSearchNode, textSearchInputDefinition);

			this._textSearchInput.onkeyup = evt => this._onTextSearchKeyUp(evt);

		},



		_createInnerButtons: function() {



			const innerButtonsContainer = put(this._textSearchNode, `div.${this.innerButtonsContainerClass}`);

			this._populateInnerButtons(innerButtonsContainer);

		},



		_populateInnerButtons: function(innerButtonsContainer) {



			const removeTextDefinition = `i.${this.removeTextButtonClass}.${this.hiddenClass}

				[title=${this.i18n.remove}]`;



			this._removeTextNode = put(innerButtonsContainer, removeTextDefinition);

			this._removeTextNode.onclick = () => this._onRemoveTextClick();

		},



		_createOuterButtons: function() {



			const outerButtonsContainer = put(this.domNode, `div.${this.outerButtonsContainerClass}`);

			this._populateOuterButtons(outerButtonsContainer);

		},



		_populateOuterButtons: function(outerButtonsContainer) {



			this.inherited(arguments);



			const searchDefinition = `i.${this.searchButtonClass}[title=${this.i18n.search}]`;

			this._searchNode = put(outerButtonsContainer, searchDefinition);

			this._searchNode.onclick = evt => this._onSearchClick(evt);

		},



		_onSearchClick: function(evt) {



			this.inherited(arguments);



			this._emitSearchEvent(this._getTextSearchInputValue());

		},



		_onTextSearchKeyUp: function(evt) {



			this.inherited(arguments);



			const evtCode = evt.code,

				inputValue = this._getTextSearchInputValue(evt);



			if (evtCode === 'Enter') {

				this._emitSearchEvent(inputValue);

				return;

			}



			if (inputValue.length) {

				this._showRemoveTextNode();

			} else {

				this._hideRemoveTextNode();

			}

		},



		_onRemoveTextClick: function() {



			this._reset();

		},



		_getTextSearchInputValue: function(/*Event?*/ evt) {



			const input = evt ? evt.target : this._textSearchInput;

			return input?.value?.trim() ?? '';

		},



		_setTextSearchInputValue: function(value) {



			this._textSearchInput.value = value;

		},



		_showRemoveTextNode: function() {



			domClass.remove(this._removeTextNode, this.hiddenClass);

		},



		_hideRemoveTextNode: function() {



			domClass.add(this._removeTextNode, this.hiddenClass);

		},



		_emitSearchEvent: function(value) {



			if (this._lastSearchInputValue === value || (!value?.length && !this._lastSearchInputValue)) {

				return;

			}



			this._lastSearchInputValue = value;



			this._emitEvt('SEARCH', {value});

		},



		_refresh: function() {



			this.inherited(arguments);



			this._emitSearchEvent(this._getTextSearchInputValue());

		},



		_reset: function() {



			this.inherited(arguments);



			this._setTextSearchInputValue('');



			this._hideRemoveTextNode();

			this._emitSearchEvent('');

		}

	});

});

client-app/src/component/textSearch/TextSearchSuggestionsExpansionRequestImpl.js

0 → 100644
+19 −0
Original line number Diff line number Diff line 
define([

	'dojo/_base/declare'

	, 'src/component/textSearch/_Expansion'

	, 'src/component/textSearch/_Request'

	, 'src/component/textSearch/_Suggestions'

	, 'src/component/textSearch/TextSearchImpl'

], function(

	declare

	, _Expansion

	, _Request

	, _Suggestions

	, TextSearchImpl

) {



	return declare([TextSearchImpl, _Suggestions, _Expansion, _Request], {

		// summary:

		//   Implementación de buscador por texto con sugerencias, expansión de búsqueda y petición directa de datos.

	});

});

client-app/src/component/textSearch/TextSearchSuggestionsImpl.js

0 → 100644
+15 −0
Original line number Diff line number Diff line 
define([

	'dojo/_base/declare'

	, 'src/component/textSearch/_Suggestions'

	, 'src/component/textSearch/TextSearchImpl'

], function(

	declare

	, _Suggestions

	, TextSearchImpl

) {



	return declare([TextSearchImpl, _Suggestions], {

		// summary:

		//   Implementación de buscador por texto con sugerencias.

	});

});