https://pnevmo.ru/bitrix/components/altop/search.title/script.js?16357343218506

1function JCTitleSearch(arParams)
2{
3	var _this = this;
4
5	this.arParams = {
6		'AJAX_PAGE': arParams.AJAX_PAGE,
7		'CONTAINER_ID': arParams.CONTAINER_ID,
8		'INPUT_ID': arParams.INPUT_ID,
9		'MIN_QUERY_LEN': parseInt(arParams.MIN_QUERY_LEN)
10	};
11	if(arParams.WAIT_IMAGE)
12		this.arParams.WAIT_IMAGE = arParams.WAIT_IMAGE;
13	if(arParams.MIN_QUERY_LEN <= 0)
14		arParams.MIN_QUERY_LEN = 1;
15
16	this.cache = [];
17	this.cache_key = null;
18
19	this.startText = '';
20	this.currentRow = -1;
21	this.RESULT = null;
22	this.CONTAINER = null;
23	this.INPUT = null;
24	this.WAIT = null;
25
26	this.ShowResult = function(result)
27	{
28		var pos = BX.pos(_this.CONTAINER);
29		pos.width = (pos.right - pos.left) + 28;		
30		_this.RESULT.style.position = 'absolute';
31		_this.RESULT.style.top = (pos.bottom + 16) + 'px';
32		_this.RESULT.style.left = pos.left + 'px';
33		_this.RESULT.style.width = pos.width + 'px';
34		if(result != null)
35			_this.RESULT.innerHTML = result;
36
37		if(_this.RESULT.innerHTML.length > 0)
38			_this.RESULT.style.display = 'block';
39		else
40			_this.RESULT.style.display = 'none';
41
42		//ajust left column to be an outline
43		var th;
44		var tbl = BX.findChild(_this.RESULT, {'tag':'table','class':'title-search-result'}, true);
45		if(tbl) th = BX.findChild(tbl, {'tag':'th'}, true);
46		if(th)
47		{
48			var tbl_pos = BX.pos(tbl);
49			tbl_pos.width = tbl_pos.right - tbl_pos.left;
50
51			var th_pos = BX.pos(th);
52			th_pos.width = th_pos.right - th_pos.left;
53			th.style.width = th_pos.width + 'px';
54
55			_this.RESULT.style.width = (pos.width + th_pos.width) + 'px';
56
57			//Move table to left by width of the first column
58			_this.RESULT.style.left = (pos.left - th_pos.width - 1)+ 'px';
59
60			//Shrink table when it's too wide
61			if((tbl_pos.width - th_pos.width) > pos.width)
62				_this.RESULT.style.width = (pos.width + th_pos.width -1) + 'px';
63
64			//Check if table is too wide and shrink result div to it's width
65			tbl_pos = BX.pos(tbl);
66			var res_pos = BX.pos(_this.RESULT);
67			if(res_pos.right > tbl_pos.right)
68			{
69				_this.RESULT.style.width = (tbl_pos.right - tbl_pos.left) + 'px';
70			}
71		}
72
73		var fade;
74		if(tbl) fade = BX.findChild(_this.RESULT, {'class':'title-search-fader'}, true);
75		if(fade && th)
76		{
77			res_pos = BX.pos(_this.RESULT);
78			fade.style.left = (res_pos.right - res_pos.left - 18) + 'px';
79			fade.style.width = 18 + 'px';
80			fade.style.top = 0 + 'px';
81			fade.style.height = (res_pos.bottom - res_pos.top) + 'px';
82			fade.style.display = 'block';
83		}
84	}
85
86	this.onKeyPress = function(keyCode)
87	{
88		var tbl = BX.findChild(_this.RESULT, {'tag':'table','class':'title-search-result'}, true);
89		if(!tbl)
90			return false;
91
92		var cnt = tbl.rows.length;
93
94		switch (keyCode)
95		{
96		case 27: // escape key - close search div
97			_this.RESULT.style.display = 'none';
98			_this.currentRow = -1;
99			_this.UnSelectAll();
100		return true;
101
102		case 40: // down key - navigate down on search results
103			if(_this.RESULT.style.display == 'none')
104				_this.RESULT.style.display = 'block';
105				
106			var first = -1;
107			for(var i = 0; i < cnt; i++)
108			{
109				if(!BX.findChild(tbl.rows[i], {'class':'title-search-separator'}, true))
110				{
111					if(first == -1)
112						first = i;
113
114					if(_this.currentRow < i)
115					{
116						_this.currentRow = i;
117						break;
118					}
119					else if(tbl.rows[i].className == 'title-search-selected')
120					{
121						tbl.rows[i].className = '';
122					}
123				}
124			}
125
126			if(i == cnt && _this.currentRow != i)
127				_this.currentRow = first;
128
129			tbl.rows[_this.currentRow].className = 'title-search-selected';
130		return true;
131
132		case 38: // up key - navigate up on search results
133			if(_this.RESULT.style.display == 'none')
134				_this.RESULT.style.display = 'block';
135				
136			var last = -1;
137			for(var i = cnt-1; i >= 0; i--)
138			{
139				if(!BX.findChild(tbl.rows[i], {'class':'title-search-separator'}, true))
140				{
141					if(last == -1)
142						last = i;
143
144					if(_this.currentRow > i)
145					{
146						_this.currentRow = i;
147						break;
148					}
149					else if(tbl.rows[i].className == 'title-search-selected')
150					{
151						tbl.rows[i].className = '';
152					}
153				}
154			}
155
156			if(i < 0 && _this.currentRow != i)
157				_this.currentRow = last;
158
159			tbl.rows[_this.currentRow].className = 'title-search-selected';
160		return true;
161
162		case 13: // enter key - choose current search result
163			if(_this.RESULT.style.display == 'block')
164			{
165				for(var i = 0; i < cnt; i++)
166				{
167					if(_this.currentRow == i)
168					{
169						if(!BX.findChild(tbl.rows[i], {'class':'title-search-separator'}, true))
170						{
171							var a = BX.findChild(tbl.rows[i], {'tag':'a'}, true);
172							if(a)
173							{
174								window.location = a.href;
175								return true;
176							}
177						}
178					}
179				}
180			}
181		return false;

182		}
183
184		return false;
185	}
186
187	this.onTimeout = function()
188	{
189		if(_this.INPUT.value != _this.oldValue && _this.INPUT.value != _this.startText)
190		{
191			if(_this.INPUT.value.length >= _this.arParams.MIN_QUERY_LEN)
192			{
193				_this.oldValue = _this.INPUT.value;
194				_this.cache_key = _this.arParams.INPUT_ID + '|' + _this.INPUT.value;
195				if(_this.cache[_this.cache_key] == null)
196				{
197					if(_this.WAIT)
198					{
199						var pos = BX.pos(_this.INPUT);						
200						_this.WAIT.style.top = (pos.top+12) + 'px';						
201						_this.WAIT.style.left = (pos.left+10) + 'px';
202						_this.WAIT.style.display = 'block';
203					}
204
205					BX.ajax.post(
206						_this.arParams.AJAX_PAGE,
207						{
208							'ajax_call':'y',
209							'INPUT_ID':_this.arParams.INPUT_ID,
210							'q':_this.INPUT.value
211						},
212						function(result)
213						{
214							_this.cache[_this.cache_key] = result;
215							_this.ShowResult(result);
216							_this.currentRow = -1;
217							_this.EnableMouseEvents();
218							if(_this.WAIT)
219								_this.WAIT.style.display = 'none';
220							setTimeout(_this.onTimeout, 500);
221						}
222					);
223				}
224				else
225				{
226					_this.ShowResult(_this.cache[_this.cache_key]);
227					_this.currentRow = -1;
228					_this.EnableMouseEvents();
229					setTimeout(_this.onTimeout, 500);
230				}
231			}
232			else
233			{
234				_this.RESULT.style.display = 'none';
235				_this.currentRow = -1;
236				_this.UnSelectAll();
237				setTimeout(_this.onTimeout, 500);
238			}
239		}
240		else
241		{
242			setTimeout(_this.onTimeout, 500);
243		}
244	}
245
246	this.UnSelectAll = function()
247	{
248		var tbl = BX.findChild(_this.RESULT, {'tag':'table','class':'title-search-result'}, true);
249		if(tbl)
250		{
251			var cnt = tbl.rows.length;
252			for(var i = 0; i < cnt; i++)
253				tbl.rows[i].className = '';
254		}
255	}
256
257	this.EnableMouseEvents = function()
258	{
259		var tbl = BX.findChild(_this.RESULT, {'tag':'table','class':'title-search-result'}, true);
260		if(tbl)
261		{
262			var cnt = tbl.rows.length;
263			for(var i = 0; i < cnt; i++)
264				if(!BX.findChild(tbl.rows[i], {'class':'title-search-separator'}, true))
265				{
266					tbl.rows[i].id = 'row_' + i;
267					tbl.rows[i].onmouseover = function (e) {
268						if(_this.currentRow != this.id.substr(4))
269						{
270							_this.UnSelectAll();
271							this.className = 'title-search-selected';
272							_this.currentRow = this.id.substr(4);
273						}
274					};
275					tbl.rows[i].onmouseout = function (e) {
276						this.className = '';
277						_this.currentRow = -1;
278					};
279				}
280		}
281	}
282
283	this.onFocusLost = function(hide)
284	{
285		setTimeout(function(){_this.RESULT.style.display = 'none';}, 250);
286	}
287
288	this.onFocusGain = function()
289	{
290		if(_this.RESULT.innerHTML.length) {
291			_this.ShowResult();
292		}
293	}
294
295	this.onKeyDown = function(e)
296	{
297		if(!e)
298			e = window.event;
299
300		if (_this.RESULT.style.display == 'block')
301		{
302			if(_this.onKeyPress(e.keyCode))
303				return BX.PreventDefault(e);
304		}
305	}
306
307	this.Init = function()
308	{
309		this.CONTAINER = document.getElementById(this.arParams.CONTAINER_ID);
310		this.RESULT = document.body.appendChild(document.createElement("DIV"));
311		this.RESULT.className = 'title-search-result';
312		this.INPUT = document.getElementById(this.arParams.INPUT_ID);
313		this.startText = this.oldValue = this.INPUT.value;
314		BX.bind(this.INPUT, 'focus', function() {_this.onFocusGain()});
315		//BX.bind(this.INPUT, 'blur', function() {_this.onFocusLost()});
316		
317		if(BX.browser.IsSafari() || BX.browser.IsIE())
318			this.INPUT.onkeydown = this.onKeyDown;
319		else
320			this.INPUT.onkeypress = this.onKeyDown;
321
322		if(this.arParams.WAIT_IMAGE)
323		{
324			this.WAIT = document.body.appendChild(document.createElement("DIV"));
325			this.WAIT.innerHTML = "<i class='fa fa-spinner fa-pulse'></i>";
326			this.WAIT.className = 'title-search-wait';			
327			this.WAIT.style.background = "#fff";
328			this.WAIT.style.display = 'none';
329			this.WAIT.style.position = 'absolute';
330			this.WAIT.style.zIndex = '1100';
331		}
332
333		setTimeout(this.onTimeout, 500);
334	}
335
336	BX.ready(function (){_this.Init(arParams)});
337}