https://nojinsk.ru/bitrix/components/nojinsk/location.selector/templates/.default/script.js

1(function (window) {
2	
3	if (!!window.NojinskLocationSelector) {
4		return;
5	}
6	
7	window.NojinskLocationSelector = function (params)
8	{
9		this.btn = null;
10		this.overlay = null;
11		this.search_result = null;
12		this.defaultName = null;
13		this.params = null;
14		this.isPopupOpen = false;
15		this.searchResultSelector = 'location_search_result';
16		this.iconShow = null;
17		
18		if (!!params)
19		{
20			this.btn = BX(params.selectors.btn);
21			this.overlay = BX(params.selectors.overlay);
22			this.search_result = BX(params.selectors.search_result);
23			this.defaultName = params.name;
24			this.iconShow = params.show_icon;
25		}
26		
27		BX.ready(BX.delegate(this.init, this));
28	}
29	
30	window.NojinskLocationSelector.prototype = {
31		init: function ()
32		{
33			if (!!this.btn)
34			{
35				BX.bind(this.btn, 'click', BX.proxy(this.switchPopup, this));
36				BX.bind(document, 'click', BX.proxy(function (e) {
37					
38					let target = BX.getEventTarget(e);
39					if (
40						target.tagName !== 'BUTTON'
41						&& target.tagName !== 'A'
42						&& target.tagName !== 'INPUT'
43						&& target.tagName !== 'DIV'
44						&& $(target).closest('#location_overlay').length === 0
45						&& $(target).closest('svg').length === 0
46						&& $(target).parents('.location-overlay').length === 0
47					)
48					{
49						this.closePopup();
50					}
51				}, this));
52			}
53		},
54		switchPopup:function ()
55		{
56			if (this.isPopupOpen)
57				this.closePopup();
58			else
59			{
60				this.overlay.appendChild(this.createConfirmPopup());
61				this.openPopup();
62			}
63		},
64		closePopup: function ()
65		{
66			this.isPopupOpen = false;
67			$(this.overlay).stop().fadeOut(100);
68			BX.cleanNode(this.overlay);
69			
70			let bLoc = $(this.overlay).parent('.b-location');
71			if (bLoc.length > 0) {
72				$('a.header__location').removeClass('_open');
73				$('section.b-location').hide();
74			}
75		},
76		openPopup: function ()
77		{
78			this.isPopupOpen = true;
79			$(this.overlay).stop().fadeIn(300);
80		},
81		changeCity: function ()
82		{
83			BX.cleanNode(this.overlay);
84			this.overlay.appendChild(this.createCityChangePopup());
85			this.openPopup();
86		},
87		createConfirmPopup: function ()
88		{
89			return BX.create('div',{
90				children: [
91					BX.create('div', {
92						props: {className: 'location-title'},
93						html: 'Ваш город ' + this.defaultName + '?'
94					}),
95					BX.create('div', {
96						props: {className: 'location-input'},
97						children: [
98							BX.create('button', {
99								props: {className: 'btn'},
100								html: 'Да, верно',
101								events: {
102									click: BX.delegate(this.closePopup, this)
103								}
104							}),
105							BX.create('button', {
106								props: {className: 'btn-bordered'},
107								html: 'Нет, изменить',
108								events: {
109									click: BX.delegate(this.changeCity, this)
110								}
111							})
112						]
113					})
114				]
115			});
116		},
117		createCityChangePopup: function ()
118		{
119			return BX.create('div', {
120				children: [
121					BX.create('div', {
122						props: {className: 'location-title'},
123						html: 'Выберите город'
124					}),
125					BX.create('div', {
126						props: {className: 'location-input'},
127						children: [
128							BX.create('input', {
129								props: {type:'text', placeholder: 'Например, введите Москва'},
130								events: {
131									input: BX.delegate(this.changeInput, this)
132								}
133							})
134						]
135					}),
136					BX.create('div', {
137						props: {className: 'location-search-result', id: this.searchResultSelector}
138					})
139				]
140			});
141		},
142		changeInput: function (e)
143		{
144			let target = BX.getEventTarget(e);
145			if (!!target && target.value.length >= 3)
146			{
147				BX.ajax.loadJSON(
148					'/bitrix/components/nojinsk/location.selector/ajax.php',
149					{
150						action: 'search',
151						name: target.value,
152						sessid: BX.bitrix_sessid(),
153						siteId: BX.message('SITE_ID')
154					},
155					BX.delegate(this.changeInputResult, this)
156				);
157			}
158		},
159		changeInputResult: function (result)
160		{
161			BX.cleanNode(BX(this.searchResultSelector));
162			
163			if (BX.type.isObject(result) && result.length > 0)
164			{
165				let item;
166				
167				for (let i = 0; i < result.length; i++)
168				{
169					item = result[i];
170					if (!!item)
171					{
172						BX(this.searchResultSelector).appendChild(BX.create('div', {
173							props: {className: 'search-item'},
174							dataset: {
175								id: item.ID
176							},
177							text: item.CITY_NAME_LANG,
178							events: {
179								click: BX.delegate(this.selectCity, this)
180							}
181						}));
182					}
183				}
184			}
185		},
186		selectCity: function (e)
187		{
188			let target = BX.getEventTarget(e);
189			if (!!target)
190			{
191				BX.ajax.loadJSON(
192					'/bitrix/components/nojinsk/location.selector/ajax.php',
193					{
194						action: 'change',
195						id: BX.data(target, 'id'),
196						sessid: BX.bitrix_sessid(),
197						siteId: BX.message('SITE_ID')
198					},
199					BX.delegate(function (result) {
200						if (BX.type.isObject(result) && result.success === 'y')
201						{
202							window.location.reload();
203						}
204					}, this)
205				);
206			}
207		}
208	};
209	
210})(window);