(function ($) {
	var self = this;
	self.UrlType = 2;
	self.TypeId = 2;
	self.Keyword = "";
	self.CategoryId = 0;
	self.CategoryDetailId = 0;
	self.CityId = 1;
	self.DistrictId = 0;
	self.WardId = 0;
	self.StreetId = 0;
	self.ProjectId = 0;
	self.Sort = "";
	self.SortType = 0;
	self.MinPriceName = null;
	self.MinPrice = 0;
	self.MaxPriceName = null;
	self.MaxPrice = 0;
	self.AcreageMinValue = null;
	self.AcreageMaxValue = null;
	self.BedRoom = 0;
	self.BathRoom = 0;
	self.MainDirection = 0;
	self.Latitude = 0;
	self.Longitude = 0;
	self.Distance = .5;
	self.Place = "";
	self.PlaceId = "";
	self.SearchType = "Local";
	self.SEARCH_TYPE_LOCAL = "Local";
	self.SEARCH_TYPE_GOOGLE = "Google";
	self.Locations = [];
	self.Categories = [];
	self.CategoryDetails = [];
	self.Prices = [];
	self.Acreages = [];
	self.Cities = [];
	self.MainDirections = [{
		Name: "Đông",
		Id: 1
	}, {
		Name: "Tây",
		Id: 2
	}, {
		Name: "Nam",
		Id: 3
	}, {
		Name: "Bắc",
		Id: 4
	}, {
		Name: "Đông-Bắc",
		Id: 5
	}, {
		Name: "Tây-Băc",
		Id: 6
	}, {
		Name: "Đông-Nam",
		Id: 7
	}, {
		Name: "Tây-Nam",
		Id: 8
	}];
	self.PageIndex = 2;
	self.TotalRecords = 0;
	self.SearchTimeout = null;
	self.IsPriceShow = !1;
	self.IsAcrShow = !1;
	self.IsCityShow = !1;
	self.IsCategoryShow = !1;
	self.IsAdvShow = !1;
	$("#Keyword").keydown(function (event) {
		var text, type;
		switch (event.which) {
			case 40:
				event.preventDefault();
				$("#ul_suggest_keyword li:not(:last-child).active").removeClass("active").next().addClass("active");
				text = $("#ul_suggest_keyword li.active a").attr("data-text");
				type = $("#ul_suggest_keyword li.active a").attr("data-type");
				type === self.SEARCH_TYPE_GOOGLE && (self.Place = text, self.SearchType = type, self.PlaceId = $("#ul_suggest_keyword li.active a").attr("data-id"));
				$("#Keyword").val(text);
				break;
			case 38:
				event.preventDefault();
				$("#ul_suggest_keyword li:not(:first-child).active").removeClass("active").prev().addClass("active");
				text = $("#ul_suggest_keyword li.active a").attr("data-text");
				type = $("#ul_suggest_keyword li.active a").attr("data-type");
				type === self.SEARCH_TYPE_GOOGLE && (self.Place = text, self.SearchType = type, self.PlaceId = $("#ul_suggest_keyword li.active a").attr("data-id"));
				$("#Keyword").val(text)
		}
	});
	$("#Keyword").keyup(function (event) {
		$.inArray(event.keyCode, [37, 38, 39, 40, 13]) < 0 && setTimeout(function () {
			self.Keyword = event.target.value;
			self.Keyword !== null && self.Keyword !== undefined && self.Keyword !== "" ? (self.ShowSuggest(!0), self.Keyword.trim().length >= 2 ? self.SearchTimer() : $("#ul_suggest_keyword").html("")) : self.ShowSuggest(!1)
		}, 200)
	});
	$("#form_search").submit(function (e) {
		var keyword = $("#Keyword").val(),
			place_id;
		(keyword === null || keyword === undefined || keyword === "" || keyword.trim().length <= 2) && (e.preventDefault(), self.Snackbar());
		self.TypeId !== null && self.TypeId !== undefined && self.TypeId > 0 && $(".form-search").append($("<input>").attr("type", "hidden").attr("name", "typeId").val(self.TypeId));
		self.SearchType === self.SEARCH_TYPE_GOOGLE && (e.preventDefault(), $("#Keyword").val(""), place_id = self.PlaceId, self.GetPlaceDetails(place_id, function (data) {
			console.log(data);
			data.status === "OK" && (self.Latitude = data.result.geometry.location.lat, self.Longitude = data.result.geometry.location.lng, self.Place !== null && self.Place !== undefined && self.Place !== "" && $(".form-search").append($("<input>").attr("type", "hidden").attr("name", "place").val(self.Place)), self.Latitude !== null && self.Latitude !== undefined && self.Latitude > 0 && $(".form-search").append($("<input>").attr("type", "hidden").attr("name", "latitude").val(self.Latitude)), self.Longitude !== null && self.Longitude !== undefined && self.Longitude > 0 && $(".form-search").append($("<input>").attr("type", "hidden").attr("name", "longitude").val(self.Longitude)), self.Distance !== null && self.Distance !== undefined && self.Distance > 0 && $(".form-search").append($("<input>").attr("type", "hidden").attr("name", "distance").val(self.Distance)), e.currentTarget.submit())
		}))
	});
	
	self.Filter = function () {
		var _categoryId = self.CategoryId;
		return self.CategoryDetailId > 0 && (_categoryId = self.CategoryDetailId), {
			Keyword: self.Keyword,
			SellType: self.TypeId,
			UrlType: self.UrlType,
			//ProjectId: self.ProjectId,
			CategoryId: _categoryId,
			MinPriceName: self.MinPriceName,
			MaxPriceName: self.MaxPriceName,
			MinAcreage: self.AcreageMinValue,
			MaxAcreage: self.AcreageMaxValue,
			CityId: self.CityId,
			DistrictId: self.DistrictId,
			WardId: self.WardId,
			StreetId: self.StreetId,
		//	BedRoom: self.BedRoom > 0 ? self.BedRoom : "",
		//	BathRoom: self.BathRoom > 0 ? self.BathRoom : "",
		//	MainDirection: self.MainDirection
		}
	};
	self.GetUrl = function (handleData) {
		var settings = {
			traditional: !0,
			url: "tim-kiem/kq",
			type: "GET",
			data: self.Filter(),
			dataType: "json",
			contentType: "application/json; charset=utf-8",
			success: function (json) {
				handleData(json)
			}
		};
		//console.error('settings', $.param(settings.data));
		location.href =`${url_site}${settings.url}?${$.param(settings.data)}`;
		//jQuery.ajax(settings)
	};
	self.SubmitSearch = function (redirect) {
		self.CityId <= 0 && (self.DistrictId = 0, self.StreetId = 0, self.WardId = 0);
		self.DistrictId <= 0 && (self.StreetId = 0, self.WardId = 0);
		//var param = self.ParamQuery();
		self.GetUrl(function (json) {
			var query, newUrl;
			// redirect ? (query = decodeURIComponent($.param(self.ParamQuery())), query !== null && query !== undefined && query + "" != "" && (query = "?" + query), newUrl = json.Url + query, window.location = "/" + newUrl) : (query = decodeURIComponent($.param(self.ParamQuery())), query !== null && query !== undefined && query + "" != "" && (query = "?" + query), newUrl = json.Url + query, document.title = json.Title, self.ChangeUrl("search", "/" + newUrl), self.ShowProgressFilterMobile(!1), $("#TotalMobile").html(json.Total))
		})
	};
	self.Refresh = function () {
		var spinner = $(".spinner-refresh"),
			mainProgress = $("#MainProgress");
		spinner.fadeIn();
		mainProgress.show();
		self.UrlType == 2 ? $.ajax({
			type: "GET",
			url: "/Search/ProjectList",
			dataType: "text",
			contentType: "application/json",
			data: self.Filter(),
			success: function (data) {
				var main = $("#MainPage");
				data !== null && (spinner.fadeOut(), mainProgress.hide(), main.html(data), self.SubmitSearch(!1), self.InitHadFilter())
			},
			error: function (error) {
				console.log(error)
			}
		}) : $.ajax({
			type: "GET",
			url: "/Search/ProductList",
			dataType: "text",
			contentType: "application/json",
			data: self.Filter(),
			success: function (data) {
				var main = $("#MainPage");
				data !== null && (spinner.fadeOut(), mainProgress.hide(), main.html(data), self.TotalRecords = $("#txt_total_records").val(), self.InitButtonPadingMobile(), self.SubmitSearch(!1), self.InitHadFilter())
			},
			error: function (error) {
				console.log(error)
			}
		})
	};
	self.RefreshSuggestRight = function () {
		$.ajax({
			type: "GET",
			url: "/Search/SuggestRight",
			dataType: "text",
			contentType: "application/json",
			data: self.Filter(),
			success: function (data) {
				var main = $("#box_suggest_right");
				data !== null && main.html(data)
			},
			error: function (error) {
				console.log(error)
			}
		})
	};
	self.SearchTimer = function () {
		self.SearchTimeout !== null && clearTimeout(self.SearchTimeout);
		self.SearchTimeout = setTimeout(function () {
			self.SearchAutoComplete(self.Keyword)
		}, 100)
	};
	self.SearchAutoComplete = function (keyword) {
		$.ajax({
			contentType: "application/json; charset=utf-8",
			type: "GET",
			async: !0,
			dataType: "json",
			error: function () {},
			traditional: !0,
			url: "search/NLPSearchAutoComplete",
			data: {
				keyword: keyword,
				PageIndex: 1,
				PageSize: 5
			},
			beforeSend: function () {},
			complete: function () {},
			success: function (data) {
				var wordsToBold;
				if (data !== null && data !== undefined) {
					var _html = "",
						active = "active",
						_keywords = data.Data;
					_keywords.unshift(keyword);
					wordsToBold = keyword.split(" ");
					$.each(_keywords, function (key, item) {
						var str = self.MakeBold(item, wordsToBold);
						_html += '<li class="' + active + '"><a data-type="' + self.SEARCH_TYPE_LOCAL + '" data-text="' + item + '" href="/search?keyword=' + encodeURIComponent(item) + '">' + str + "<\/a><\/li>";
						active = ""
					});
					self.SearchTimeout !== null && (clearTimeout(self.SearchTimeout), self.SearchTimeout = null);
					self.SearchTimeout = setTimeout(function () {
						self.InitGooglePlace(function (gData) {
							if (gData.status === "OK") {
								var _html = '<li class="lable-fix"><span>Tìm kiếm BĐS quanh địa điểm trong bán kính +500m<\/span><\/li>';
								$.each(gData.predictions, function (key, item) {
									var str = self.MakeBold(item.description, wordsToBold);
									_html += '<li class="item-places"><a data-type="' + self.SEARCH_TYPE_GOOGLE + '" data-id="' + item.place_id + '" data-text="' + item.description + '" href="javascript:void(0)" onclick="SearchByPlace(this)">' + str + "<\/a><\/li>"
								})
							}
							console.log(gData);
							$("#ul_suggest_keyword").append(_html)
						})
					}, 300);
					$("#ul_suggest_keyword").html(_html)
				}
			}
		})
	};
	self.SearchByPlace = function (e) {
		var place_id = e.dataset.id;
		place_id !== "" && (self.SearchType = self.SEARCH_TYPE_GOOGLE, self.PlaceId = place_id, self.Place = e.innerText, $("#btn_search").trigger("click"))
	};
	self.LoadAdvWard = function (districtId) {
		districtId > 0 ? $.ajax({
			url: "/Common/WardAC",
			dataType: "json",
			type: "GET",
			beforeSend: function () {},
			data: {
				districtId: districtId
			},
			success: function (data) {
				data !== null && self.InitAdvWard(data.Data)
			},
			complete: function () {},
			error: function () {}
		}) : self.InitAdvWard([])
	};
	self.LoadAdvStreet = function (districtId) {
		districtId > 0 ? $.ajax({
			url: "/Common/StreetAC",
			dataType: "json",
			type: "GET",
			beforeSend: function () {},
			data: {
				districtId: districtId
			},
			success: function (data) {
				data !== null && self.InitAdvStreet(data.Data)
			},
			complete: function () {},
			error: function () {}
		}) : self.InitAdvStreet([])
	};
	self.InitType = function () {
		//self.InitTypeMobile();
		//self.InitCategoryMobile()
	};
	self.InitCategory = function () {
		var element = $("#Categories"), elementName =$("#CategoryName"), i, category;
		var html = '';
		if (self.Categories !== 'null') {
			self.Categories.unshift({
				cid: 0,
				cat_title: "Loại cho thuê"
			})
			console.error(self.Categories)
			for( i = 0; i < self.Categories.length; i++) {
				category = Categories[i]
				if(self.CategoryId == category.cid ) {
					elementName.html(category.cat_title)
				}
				html += '<li><a href="javascript:void(0)" onclick="CategoryFSelected(' + category.cid + ')">' + category.cat_title + "<\/a> <\/li>";
			};
			element.html(html)
		}
	};
	self.CategoryFSelected = function (id) {
		var elementName = $("#CategoryName"),
			i, category, flag = false;
		if (id >= 0)
			for (i = 0; i < self.Categories.length; i++) {
				category = self.Categories[i];
				if ( category.cid == id && category.sub.length > 0) { flag = true
					elementName.html(category.cat_title);
					element = $("#Categories");html = "";
					category.sub.unshift({
						cid: 0,
						cat_title: category.cat_title
					})
					for (category.sub, i = 0; i < category.sub.length; i++) district = category.sub[i], html += '<li><a href="javascript:void(0)" onclick="CategoryFSelected(' + district.cid + ')">' + district.cat_title + "<\/a> <\/li>";
					setTimeout(function () {
						element.html(html);
						self.CategoryId = category.cid, self.CategoryDetailId = 0
					}, 100);
				} 
			
			}
		
		else {
			self.CategoryId = id;
			self.SubmitSearch(!0)

		}

		if (flag == false) {
			self.CategoryId = id;
			self.SubmitSearch(!0)
		}
	};

	self.InitPrice = function () {
		var i, price, html;
		console.error('self.TypeId', self.TypeId)
		self.Prices = self.TypeId === 2 ? [
			{
			id: 0,
			name: "Tất cả",
			min: "Tất cả",
			max: "Tất cả"
		}, {
			id: 3,
			name: "1 - 3 triệu/tháng",
			min: "1 triệu/tháng",
			max: "3 triệu/tháng"
		}, {
			id: 4,
			name: "3 - 5 triệu/tháng",
			min: "3 triệu/tháng",
			max: "5 triệu/tháng"
		}, {
			id: 5,
			name: "5 - 10 triệu/tháng",
			min: "5 triệu/tháng",
			max: "10 triệu/tháng"
		}, {
			id: 6,
			name: "10 - 20 triệu/tháng",
			min: "10 triệu/tháng",
			max: "20 triệu/tháng"
		}, {
			id: 7,
			name: "20 - 40 triệu/tháng",
			min: "20 triệu/tháng",
			max: "40 triệu/tháng"
		}, {
			id: 8,
			name: "40 - 60 triệu/tháng",
			min: "40 triệu/tháng",
			max: "60 triệu/tháng"
		}, {
			id: 9,
			name: "60 - 100 triệu/tháng",
			min: "60 triệu/tháng",
			max: "100 triệu/tháng"
		}, {
			id: 10,
			name: "100 - 200 triệu/tháng",
			min: "100 triệu/tháng",
			max: "200 triệu/tháng"
		}, ] : [{
			id: 2,
			name: "Tất cả",
			min: "Tất cả",
			max: "Tất cả"
		}, {
			id: 3,
			name: "300 triệu - 500 triệu",
			min: "300 triệu",
			max: "500 triệu"
		}, {
			id: 4,
			name: "500 triệu - 800 triệu",
			min: "500 triệu",
			max: "800 triệu"
		}, {
			id: 5,
			name: "800 triệu - 1 tỷ",
			min: "800 triệu",
			max: "1 tỷ"
		}, {
			id: 6,
			name: "1 tỷ - 3 tỷ",
			min: "1 tỷ",
			max: "3 tỷ"
		}, {
			id: 7,
			name: "3 tỷ - 5 tỷ",
			min: "3 tỷ",
			max: "5 tỷ"
		}, {
			id: 8,
			name: "5 tỷ - 7 tỷ",
			min: "5 tỷ",
			max: "7 tỷ"
		}, {
			id: 9,
			name: "7 tỷ - 10 tỷ",
			min: "7 tỷ",
			max: "10 tỷ"
		}, {
			id: 10,
			name: "10 tỷ - 20 tỷ",
			min: "10 tỷ",
			max: "20 tỷ"
		}, {
			id: 11,
			name: "20 tỷ - 30 tỷ",
			min: "20 tỷ",
			max: "30 tỷ"
		}, {
			id: 12,
			name: "30 tỷ - 50 tỷ",
			min: "30 tỷ",
			max: "50 tỷ"
		}];
		var priceMinMobile = $(".f-price-min-mobile"),
			priceMaxMobile = $(".f-price-max-mobile"),
			htmlMinMobile = "",
			htmlMaxMobile = "";
		for (i = 0; i < self.Prices.length; i++) price = self.Prices[i], htmlMinMobile += '<option value="' + price.min + '">' + price.min + "<\/option>";
		for (i = 0; i < self.Prices.length; i++) price = self.Prices[i], htmlMaxMobile += '<option value="' + price.max + '">' + price.max + "<\/option>";
		// priceMinMobile.html(htmlMinMobile);
		// priceMaxMobile.html(htmlMaxMobile);
		html = '<li><a href="javascript:void(0)" >Giá thấp nhất<\/a><\/li>';

		$.each(self.Prices, function (key, item) {
			var css = "";
			console.error('sMinPriceName', self.MinPriceName, item.min);
			if(self.MinPriceName == item.min) {
				css = "active";

			}
			// ( self.MinPriceName === null || self.MinPriceName === "0" || self.MinPriceName === "" )? key == 0 && (css = "active") : css = item.min === self.MinPriceName ? "active" : "";
			html += '<li><a class="' + css + '" href="javascript:void(0)" onclick="PriceMinChanged(\'' + item.min + "', this)\">" + item.min + " "+self.MinPriceName+"<\/a><\/li>"
		});
		$("#dropdown_price_min").html(html);
		html = '<li><a href="javascript:void(0)" >Giá cao nhất<\/a><\/li>';
		$.each(self.Prices, function (key, item) {
			var css = "";
			self.MaxPriceName === null || self.MaxPriceName === "0" || self.MaxPriceName === "" ? key == 0 && (css = "active") : css = item.max === self.MaxPriceName ? "active" : "";
			html += '<li><a class="' + css + '" href="javascript:void(0)" onclick="PriceMaxChanged(\'' + item.max + "', this)\">" + item.max + "<\/a><\/li>"
		});
		$("#dropdown_price_max").html(html);
		// priceMinMobile.change(function () {
		// 	self.MinPriceName = priceMinMobile.val();
		// 	self.ShowProgressFilterMobile(!0);
		// 	self.Refresh()
		// });
		// priceMaxMobile.change(function () {
		// 	self.MaxPriceName = priceMaxMobile.val();
		// 	self.ShowProgressFilterMobile(!0);
		// 	self.Refresh()
		// });
		self.SetPriceName()
	};
	self.InitAcreage = function() {
		var i, arc, html;
		self.Acreages = [{
				id: 0,
				name: "Diện tích",
				min: 0,
				max: 0
		}, {
				id: 1,
				name: "Dưới 30 m2",
				min: 0,
				max: "30"
		}, {
				id: 2,
				name: "30 m2 - 50 m2",
				min: "30",
				max: "50"
		}, {
				id: 3,
				name: "50 m2 - 70 m2",
				min: "50",
				max: "70"
		}, {
				id: 4,
				name: "70 m2 - 100 m2",
				min: "70",
				max: "100"
		}, {
				id: 5,
				name: "100 m2 - 150 m2",
				min: "100",
				max: "150"
		}, {
				id: 6,
				name: "150 m2 - 300 m2",
				min: "150",
				max: "300"
		}, {
				id: 10,
				name: "300 m2 - 500 m2",
				min: "300",
				max: "500"
		}, {
				id: 11,
				name: "500 m2 trở lên",
				min: "500",
				max: 0
		}];
		var acreageMinMobile = $(".f-acreage-min-mobile"),
				acreageMaxMobile = $(".f-acreage-max-mobile"),
				htmlMobile = "";
		for (i = 0; i < self.Acreages.length; i++) arc = self.Acreages[i], htmlMobile += '<option value="' + arc.min + '">' + arc.min + "<\/option>";
		for (i = 0; i < self.Acreages.length; i++) arc = self.Acreages[i], htmlMobile += '<option value="' + arc.min + '">' + arc.min + "<\/option>";
		acreageMinMobile.html(htmlMobile);
		acreageMaxMobile.html(htmlMobile);
		acreageMinMobile.change(function() {
				self.ShowProgressFilterMobile(!0);
				self.AcreageMinValue = acreageMinMobile.val();
				self.Refresh()
		});
		acreageMaxMobile.change(function() {
				self.ShowProgressFilterMobile(!0);
				self.AcreageMaxValue = acreageMaxMobile.val();
				self.Refresh()
		});
		html = "";
		$.each(self.Acreages, function(key, item) {
				html += '<li><a href="javascript:void(0)" onclick="AcreageChanged(' + item.id + ')">' + item.name + "<\/a><\/li>"
		});
		$("#Acreages").html(html);
		self.SetAcreageName()
	};
	self.AcreageChanged = function (id) {
		$.each(self.Acreages, function (key, item) {
			item.id === Number(id) && ($("#AcreageRange").html(item.name), self.AcreageMinValue = item.min, self.AcreageMaxValue = item.max)
		});
		self.SubmitSearch(!0)
	};
	self.InitAdvancedSeach = function () {
		var cityMobile = $(".f-city-mobile"),
			html = "";
		$.each(self.Cities, function (key, _data) {
			html += '<option value="' + _data.Id + '">' + _data.Name + "<\/option>"
		});
		// cityMobile.html(html);
		// cityMobile.change(function () {
		// 	cityMobile.val() > 0 ? (self.CityId = cityMobile.val(), self.LoadAdvDistricts(cityMobile.val())) : (self.CityId = 0, self.LoadAdvDistricts(0), self.LoadAdvWard(0), self.LoadAdvStreet(0));
		// 	self.DistrictId = 0;
		// 	self.WardId = 0;
		// 	self.StreetId = 0;
		// 	self.ShowProgressFilterMobile(!0);
		// 	self.Refresh()
		// });
		
	  if(self.CityId > 0 ){
			self.ShowDropdownDistrict(true, self.CityId, '')
			//self.LoadDistricts(self.CityId)
			//self.LoadAdvDistricts(self.CityId);
		//	cityMobile.val(self.CityId);
		}
		// self.InitAdvCategoryDetail();
		// self.InitBedRoomAndBathRoom();
		// self.InitAdvMainDirections()
	};
	self.LoadAdvDistricts = function (cityId) {
		cityId > 0 ? $.ajax({
			url: "/load/DistrictAC",
			dataType: "json",
			type: "GET",
			beforeSend: function () {},
			data: {
				CityId: cityId
			},
			success: function (data) {
			 self.InitDistrict(data.Data)
			},
			complete: function () {},
			error: function () {}
		}) : self.InitDistrict([])
	};
	self.ShowDropdownDistrict = function (value, id, name) {
		value ? name === "Tất cả" ? (self.CityId = 0, self.DistrictId = 0, self.WardId = 0, self.StreetId = 0, self.SubmitSearch(!0)) : ($(".dropdown-cities").css({
			left: "-190px"
		}), $(".dropdowm-district").css({
			left: "0px"
		}), $(".btn-back").fadeIn(), $("#city_title").html(name), $(".dropdown-cities").fadeOut(), id > 0 && (self.CityId = id, self.LoadDistricts(id))) : ($(".dropdown-cities").css({
			left: "0px"
		}), $(".dropdowm-district").css({
			left: "190px"
		}), $(".dropdown-cities").fadeIn(), $(".btn-back").fadeOut(), $("#city_title").html("Toàn quốc"), self.CityId = 0)
	};
	self.InitDistrict = function (data) {
		var elementMobile = $(".f-district-mobile"),
			html = "";
		data.unshift({
			id: 0,
			name: "Quận/Huyện"
		});
	
		$.each(data, function (_key, _data) {
			//html += '<option value="' + _data.Id + '">' + _data.name + "<\/option>";
			if(_data.id > 0 && self.DistrictId == _data.id) {
				$("#CityName").html(_data.name), $("#btn_mb_city").append(", " + _data.name)
			}
			
			//_data.id > 0 && self.DistrictId == _data.id && ($("#CityName").html(_data.name), $("#btn_mb_city").append(", " + _data.name))
		});


		// elementMobile.html(html);
		// elementMobile.val(self.DistrictId);
		// elementMobile.change(function () {
		// 	elementMobile.val() > 0 ? (self.DistrictId = elementMobile.val(), self.LoadAdvWard(elementMobile.val()), self.LoadAdvStreet(elementMobile.val())) : (self.DistrictId = 0, self.LoadAdvWard(0), self.LoadAdvStreet(0));
		// 	self.ShowProgressFilterMobile(!0);
		// 	self.Refresh()
		// });
	  //self.DistrictId > 0 && (self.LoadAdvWard(self.DistrictId), self.LoadAdvStreet(self.DistrictId))
	};

	self.InitCity = function () {
		var _elemment = $("#dropdown_cities"),
			_html = "";
		self.Cities.unshift({
			id: 0,
			name: "Tất cả"
		});
		$.each(self.Cities, function (key, _data) {
			if(self.CityId == _data.id ) {
				$("#CityName").html(_data.name);
			}
			_html += '<li><a href="javascript:void(0)" onclick="ShowDropdownDistrict(true, ' + _data.id + " , '" + _data.name + "')\">" + _data.name + "<\/a><\/li>"
		});
		_elemment.html(_html)
	};

	self.LoadCities = function () {
		var spinner = $(".spinner-location"),
			elementId = $("#Cities");
		$.ajax({
			url: "/load/DistrictAC",
			dataType: "json",
			type: "GET",
			beforeSend: function () {
				elementId.html("");
				spinner.show()
			},
			data: {},
			success: function (data) {
				data !== null && setTimeout(function () {
					spinner.hide();
					self.InitCities(elementId, data.Data)
				}, 500)
			},
			complete: function () {
				console.log("- Get cities complete..")
			},
			error: function () {
				console.log("- Get cities failure..")
			}
		})
	};
	self.LoadDistricts = function (cityId) {
		if (cityId > 0) {
			var _element = $("#dropdown_district");
			$.ajax({
				url: "/load/DistrictAC",
				dataType: "json",
				type: "GET",
				beforeSend: function () {
					_element.html("")
				},
				data: {
					CityId: cityId,
					opt:'',
				},
				success: function (data) {
					data !== null && setTimeout(function () {
						var html = "",
							i, district;
							console.error(data.Data)
						if(data.Data.length> 0){
							for(i = 0; i < data.Data.length; i++) {
								district = data.Data[i];
								html += '<li><a href="javascript:void(0)" onclick="DrdDistrictSelected(' + district.id + ')">' + district.name + "<\/a> <\/li>";
							}			
						}
						// for (data.Data.unshift({
						// 		id: 0,
						// 		name: "Tất cả"
						// 	}), i = 0; i < data.Data.length; i++) district = data.Data[i], html += '<li><a href="javascript:void(0)" onclick="DrdDistrictSelected(' + district.id + ')">' + district.name + "<\/a> <\/li>";
						_element.html(html)
					}, 100)
				},
				complete: function () {},
				error: function () {
					console.log("không thấy thông tin quận huyện.")
				}
			})
		}
	};
	
	
	self.InitAdvWard = function (data) {
		var elementId = $("#AdvWard"),
			elementMobile = $(".f-ward-mobile"),
			html = "";
		data.unshift({
			Id: 0,
			Name: "Phường xã"
		});
		$.each(data, function (_key, _data) {
			html += '<option value="' + _data.Id + '">' + _data.Name + "<\/option>"
		});
		elementId.html(html);
		elementMobile.html(html);
		elementMobile.val(self.WardId);
		elementId.val(self.WardId);
		elementId.change(function () {
			self.WardId = elementId.val() > 0 ? elementId.val() : 0;
			self.HadFilter("#FWard", self.WardId, data);
			self.Refresh()
		});
		elementMobile.change(function () {
			self.WardId = elementMobile.val() > 0 ? elementMobile.val() : 0;
			self.ShowProgressFilterMobile(!0);
			self.Refresh();
			self.RefreshSuggestRight()
		});
		setTimeout(function () {
			self.HadFilter("#FWard", self.WardId, data)
		}, 300)
	};
	self.InitAdvStreet = function (data) {
		var elementId = $("#AdvStreet"),
			elementMobile = $(".f-street-mobile"),
			html = "";
		data.unshift({
			Id: 0,
			Name: "Đường"
		});
		$.each(data, function (_key, _data) {
			html += '<option value="' + _data.Id + '">' + _data.Name + "<\/option>"
		});
		elementId.html(html);
		elementMobile.html(html);
		elementMobile.val(self.StreetId);
		elementId.val(self.StreetId);
		elementId.change(function () {
			self.StreetId = elementId.val() > 0 ? elementId.val() : 0;
			self.HadFilter("#FStreet", self.StreetId, data);
			self.ShowProgressFilterMobile(!0);
			self.Refresh();
			self.RefreshSuggestRight()
		});
		elementMobile.change(function () {
			self.StreetId = elementMobile.val() > 0 ? elementMobile.val() : 0;
			self.Refresh()
		});
		setTimeout(function () {
			self.HadFilter("#FStreet", self.StreetId, data)
		}, 300)
	};
	self.InitAdvCategoryDetail = function () {
		var data = [];
		self.CategoryId > 0 && $.each(self.Categories, function (_key, _data) {
			_data.Id === self.CategoryId && (data = _data.Items)
		});
		data.length <= 0 && $.each(self.Categories, function (_key, _data) {
			_data.Items !== null && _data.Items !== undefined && $.each(_data.Items, function (j, _data_detail) {
				_data_detail.Id == self.CategoryId && (self.CategoryDetailId = _data_detail.Id, self.CategoryId = _data.Id, data = _data.Items)
			})
		});
		data.length <= 0 ? $(".row-category-detail-mobile").fadeOut() : $(".row-category-detail-mobile").fadeIn();
		var elementId = $("#AdvCategoryDetail"),
			elementMobile = $(".f-category-detail-mobile"),
			html = '<option value="0">Loại cho thuê chi tiết<\/option>';
		$.each(data, function (_key, _data) {
			html += '<option value="' + _data.Id + '">' + _data.Name + "<\/option>"
		});
		elementId.html(html);
		elementId.val(self.CategoryDetailId);
		elementMobile.html(html);
		elementMobile.val(self.CategoryDetailId);
		elementId.change(function () {
			self.CategoryDetailId = elementId.val() > 0 ? elementId.val() : 0;
			self.HadFilter("#FCategoryName", self.CategoryDetailId, data);
			self.Refresh()
		});
		elementMobile.change(function () {
			self.CategoryDetailId = elementMobile.val() > 0 ? elementMobile.val() : 0;
			self.ShowProgressFilterMobile(!0);
			self.Refresh()
		});
		self.CategoryDetailId > 0 && setTimeout(function () {
			self.HadFilter("#FCategoryName", self.CategoryDetailId, data)
		}, 200)
	};
	self.InitBedRoomAndBathRoom = function () {
		var items = $(".bedroom-select"); 
		$.each(items, function (_key, _data) {
			var id = Number(_data.innerHTML);
			_data.className = id == self.BedRoom ? "bedroom-select active" : "bedroom-select"
		});
		items = $(".bathroom-select");
		$.each(items, function (_key, _data) {
			var id = Number(_data.innerHTML);
			_data.className = id == self.BathRoom ? "bathroom-select active" : "bathroom-select"
		});
		$(".bedroom-select").click(function () {
			alert();
			var className = $(this).attr("class");
			className.indexOf("active") >= 0 ? ($(this).removeClass("active"), self.BedRoom = 0) : ($(".bedroom-select").removeClass("active"), $(this).addClass("active"), self.BedRoom = Number($(this).text()));
			self.ShowProgressFilterMobile(!0);
			self.Refresh()
		});
		$(".bathroom-select").click(function () {
			var className = $(this).attr("class");
			className.indexOf("active") >= 0 ? ($(this).removeClass("active"), self.BathRoom = 0) : ($(".bathroom-select").removeClass("active"), $(this).addClass("active"), self.BathRoom = Number($(this).text()));
			self.ShowProgressFilterMobile(!0);
			self.Refresh()
		})
	};
	self.InitAdvMainDirections = function () {
		var data = self.MainDirections,
			elementId = $("#AdvMainDirections"),
			html = "";
		data.unshift({
			Id: 0,
			Name: "Hướng nhà"
		});
		$.each(data, function (_key, _data) {
			html += '<option value="' + _data.Id + '">' + _data.Name + "<\/option>"
		});
		elementId.html(html);
		elementId.val(self.MainDirection);
		elementId.change(function () {
			self.MainDirection = elementId.val() > 0 ? elementId.val() : 0;
			self.Refresh()
		})
	};
	self.ShowDropdownSort = function (value) {
		value ? $(".dropdown-sort").show() : $(".dropdown-sort").hide()
	};
	self.InitSortSelect = function () {
		var data = [{
				id: 0,
				value: "",
				name: "Sắp xếp theo"
			}, {
				id: 1,
				value: "new",
				name: "Mới nhất"
			}, {
				id: 2,
				value: "old",
				name: "Cũ nhất"
			}, {
				id: 3,
				value: "price_des",
				name: "Giá cao nhất"
			}, {
				id: 4,
				value: "price_asc",
				name: "Giá thấp nhất"
			}],
			html = "",
			name;
		$.each(data, function (key, value) {
			html += '<li><a href="javascript:void(0)" onclick="SortSelected(\'' + value.value + "')\">" + value.name + "<\/a><\/li>"
		});
		$(".dropdown-sort").html(html);
		self.SortType > 0 && (name = data.find(c => c.id == self.SortType).name, console.log(name), $(".btn-sort").html(name))
	};
	self.SortSelected = function (id) {
		self.Sort = id;
		self.SubmitSearch(!0)
	};
	self.InitHadFilter = function () {
		var element;
		self.CategoryDetailId == 0 && (element = $("#FCategoryName"), self.CategoryId > 0 ? (element.show(), $("#FCategoryName text").html(self.Categories.find(c => c.cid == self.CategoryId).cat_title)) : element.hide());
	};
	self.HadFilter = function (elementId, id, data) {
		var element = $(elementId),
			item;
		id !== null && id > 0 ? (element.show(), item = data.find(c => c.Id == id), item !== null && item !== undefined && $(elementId + " text").html(item.Name)) : element.hide()
	};
	self.ShowPrice = function () {
		self.IsPriceShow ? (self.IsPriceShow = !1, $(".filter-popup-price").hide()) : (self.IsPriceShow = !0, $(".filter-popup-price").show())
	};
	self.ShowAcr = function () {
		self.IsAcrShow ? (self.IsAcrShow = !1, $(".filter-popup-acreage").hide()) : (self.IsAcrShow = !0, $(".filter-popup-acreage").show())
	};
	self.ShowCity = function () {
		self.IsCityShow ? (self.IsCityShow = !1, $(".filter-popup-city").hide()) : (self.IsCityShow = !0, $(".filter-popup-city").show())
	};
	self.ShowCategory = function () {
		self.IsCategoryShow ? (self.IsCategoryShow = !1, $(".filter-popup-category").hide()) : (self.IsCategoryShow = !0, $(".filter-popup-category").show())
	};
	self.ShowAdv = function () {
		self.IsAdvShow ? (self.IsAdvShow = !1, $(".search-advanced").hide()) : (self.IsAdvShow = !0, $(".search-advanced").show())
	};
	self.ShowSuggest = function (value) {
		var element = $("#Suggest");
		value ? element.fadeIn(200) : element.fadeOut(200)
	};
	self.ShowTextboxSelected = function (value, element) {
		if (element == null) $(".selected").hide();
		else {
			$(".selected").show();
			$(".selected .sel").hide();
			var element = $(element);
			value ? element.show() : element.hide()
		}
	};
	
	self.ShowPriceMinMax = function (value) {
		var elePriceMin = $("#PriceMin"),
			elePriceMax = $("#PriceMax"),
			eleDrdMin = $("#DrdPriceMin"),
			eleDrdMax = $("#DrdPriceMax");
		value == 1 ? (console.log("Please select price min."), eleDrdMin.show(), eleDrdMax.hide()) : value == 2 && (console.log("Please select price max."), eleDrdMin.hide(), eleDrdMax.show())
	};
	self.ShowAcreageMinMax = function (value) {
		var eleAcreageMin = $("#AcreageMin"),
			eleAcreageMax = $("#AcreageMax"),
			eleDrdMin = $("#DrdAcreageMin"),
			eleDrdMax = $("#DrdAcreageMax");
		value == 1 ? (console.log("Please select Acreage min."), eleDrdMin.show(), eleDrdMax.hide()) : value == 2 && (console.log("Please select Acreage max."), eleDrdMin.hide(), eleDrdMax.show())
	};
	self.ShowFilterMobile = function (value) {
	
	};

	self.LocationSelected = function (position) {
		for (var location, i = 0; i < self.Locations.length; i++) location = self.Locations[i], i == position && (self.Keyword = "", self.CityId = location.CityId, self.DistrictId = location.DistrictId, self.WardId = location.WardId, self.StreetId = location.StreetId, self.SubmitSearch(!0))
	};
	self.DrdCitySelected = function (cityId) {
		self.CityId = cityId;
		self.DistrictId = 0;
		self.SubmitSearch(!0)
	};
	self.DrdDistrictSelected = function (districtId) {
		districtId >= 0 && (self.DistrictId = districtId, self.WardId = 0, self.StreetId = 0, self.SubmitSearch(!0))
	};

	
	self.PriceMinChanged = function (min, e) {
		self.MinPriceName = min;
		e.className === "active" || ($("#dropdown_price_min li a").removeClass("active"), $("#mb_popup_price_min li a").removeClass("active"), e.className = "active");
		self.SetPriceName()
	};
	self.PriceMaxChanged = function (max, e) {
		self.MaxPriceName = max;
		e.className === "active" || ($("#dropdown_price_max li a").removeClass("active"), $("#mb_popup_price_max li a").removeClass("active"), e.className = "active");
		self.SetPriceName();
		self.SubmitSearch(!0)
	};

	self.SetPriceName = function () {
		var priceNameMin = self.MinPriceName !== null && self.MinPriceName !== "0" && self.MinPriceName !== "" && self.MinPriceName !== "Tất cả" ? self.MinPriceName : "Dưới",
			priceNameMax = self.MaxPriceName !== null && self.MaxPriceName !== "0" && self.MaxPriceName !== "" && self.MaxPriceName !== "Tất cả" ? self.MaxPriceName : "trở lên",
			ch;
			console.error('priceNameMin', priceNameMin);
			console.error('priceNameMax', priceNameMax);
		priceNameMin !== "Dưới" || priceNameMax !== "trở lên" ? (ch = " - ", (priceNameMin === "Dưới" || priceNameMax === "trở lên") && (ch = " "), $("#PriceRange").html(priceNameMin + ch + priceNameMax), $("#btn_mb_price").html(priceNameMin + ch + priceNameMax)) : ($("#PriceRange").html("Khoảng giá"), $("#btn_mb_price").html("Khoảng giá"))
	};
	self.SetAcreageName = function () {
		var element = $("#AcreageRange"),
			arcNameMin = self.AcreageMinValue !== null && self.AcreageMinValue > 0 ? self.AcreageMinValue + " m2" : "Dưới",
			arcNameMax = self.AcreageMaxValue !== null && self.AcreageMaxValue > 0 ? self.AcreageMaxValue + " m2" : "trở lên",
			ch;
		(arcNameMin !== "Dưới" || arcNameMax !== "trở lên") && (ch = " - ", (arcNameMin === "Dưới" || arcNameMax === "trở lên") && (ch = " "), element.html(arcNameMin + ch + arcNameMax), $("#btn_mb_acr").html(arcNameMin + ch + arcNameMax))
	};
	self.ChangeUrl = function (page, url) {
		if (typeof history.pushState != "undefined") {
			var obj = {
				Page: page,
				Url: url
			};
			history.pushState(obj, obj.Page, obj.Url)
		} else console.log("Browser does not support HTML5.")
	};
	self.AnimateDrdLocation = function (value) {
		var elementCity = $("#Cities"),
			elementDistrict = $("#Districts"),
			elementTitle = $("#DrdTitle");
		value == 0 ? (elementCity.animate({
			left: "0px"
		}), elementDistrict.animate({
			left: "250px"
		}), elementTitle.html("Tỉnh/Thành phố")) : (elementCity.animate({
			left: "-250px"
		}), elementDistrict.animate({
			left: "0px"
		}), elementTitle.html('<i onclick="BackToCities()" class="chevron-left"> <\/i> Chọn Quận/Huyện'))
	};
	self.BackToCities = function () {
		self.AnimateDrdLocation(0)
	};
	self.ClearSelected = function () {
		self.ShowTextboxSelected(!1, null);
		self.CityId = 0;
		self.DistrictId = 0;
		self.Latitude = 0;
		self.Longitude = 0;
		self.Place = "";
		self.SubmitSearch(!0)
	};

	var _min_price_value = null,
		_max_price_value = null,
		_min_acr_value = null,
		_max_acr_value = null;
	self.MbPriceMinChanged = function (e) {
		_min_price_value = e.value
	};
	self.MbPriceMaxChanged = function (e) {
		_max_price_value = e.value
	};
	self.MbAcrChanged = function (id) {
		$.each(self.Acreages, function (key, item) {
			item.id === Number(id) && (self.AcreageMinValue = item.min, self.AcreageMaxValue = item.max)
		});
		self.SubmitSearch(!0)
	};
	self.PriceMbSelected = function () {
		self.MinPriceName === _min_price_value && self.MaxPriceName === _max_price_value ? self.ShowMbPopupPrice(!1) : (self.MinPriceName = _min_price_value, self.MaxPriceName = _max_price_value, self.SubmitSearch(!0))
	};
	self.AcrMbSelected = function () {
		self.AcreageMinValue === _min_acr_value && self.AcreageMaxValue === _max_acr_value ? self.ShowMbPopupAcr(!1) : (self.AcreageMinValue = _min_acr_value, self.AcreageMaxValue = _max_acr_value, self.SubmitSearch(!0))
	};
	
	$.InitFilter = function (model) {
		var filter = model.Filter,
			categorRec;
		filter !== null && filter !== undefined && (self.Keyword = filter.Keyword, self.UrlType = filter.UrlType == null ? 0 : filter.UrlType,  self.CategoryId = filter.CategoryId == null ? 0 : filter.CategoryId, self.CityId = filter.CityId, self.DistrictId = filter.DistrictId, self.WardId = filter.WardId == null ? 0 : filter.WardId, self.StreetId = filter.StreetId == null ? 0 : filter.StreetId, self.ProjectId = filter.ProjectId == null ? 0 : filter.ProjectId, self.MinPriceName = filter.MinPriceName, self.MaxPriceName = filter.MaxPriceName, self.AcreageMinValue = filter.MinAcreage, self.AcreageMaxValue = filter.MaxAcreage, self.Latitude = filter.Latitude, self.Longitude = filter.Longitude, self.Place = filter.Place, self.BedRoom = filter.BedRoom == null ? 0 : filter.BedRoom, self.BathRoom = filter.BathRoom == null ? 0 : filter.BathRoom, self.MainDirection = filter.MainDirection == null ? 0 : filter.MainDirection, self.SortType = filter.SortType, self.TotalRecords = Number(filter.TotalRecords));
		categorRec = model.CategoryRec;
		categorRec !== null && categorRec !== undefined && (self.Categories = categorRec.Items);
		self.Cities = model.Cities;
		self.InitType();
		self.InitCity();
		self.InitCategory();
		self.InitPrice();
		self.InitAcreage();
		self.InitAdvancedSeach();
		
		self.InitSortSelect();
		//self.InitButtonPadingMobile();
		//self.InitFilterMobile();
		//self.InitHadFilter()
	};
	self.MakeBold = function (input, wordsToBold) {
		var words = [],
			arr, result;
		return $.each(wordsToBold, function (key, item) {
			words.push(self.RemoveUnicode(item))
		}), arr = input.split(" "), result = [], $.each(arr, function (key, item) {
			var item_bf = self.RemoveUnicode(item),
				text;
			words.indexOf(item_bf) >= 0 ? (text = "<b>" + item + "<\/b>", result.push(text)) : result.push(item)
		}), result.join(" ")
	};
	self.RemoveUnicode = function(str) {
		return str = str.replace(/à|á|ạ|ả|ã|â|ầ|ấ|ậ|ẩ|ẫ|ă|ằ|ắ|ặ|ẳ|ẵ/g, "a"), str = str.replace(/è|é|ẹ|ẻ|ẽ|ê|ề|ế|ệ|ể|ễ/g, "e"), str = str.replace(/ì|í|ị|ỉ|ĩ/g, "i"), str = str.replace(/ò|ó|ọ|ỏ|õ|ô|ồ|ố|ộ|ổ|ỗ|ơ|ờ|ớ|ợ|ở|ỡ/g, "o"), str = str.replace(/ù|ú|ụ|ủ|ũ|ư|ừ|ứ|ự|ử|ữ/g, "u"), str = str.replace(/ỳ|ý|ỵ|ỷ|ỹ/g, "y"), str = str.replace(/đ/g, "d"), str = str.replace(/À|Á|Ạ|Ả|Ã|Â|Ầ|Ấ|Ậ|Ẩ|Ẫ|Ă|Ằ|Ắ|Ặ|Ẳ|Ẵ/g, "A"), str = str.replace(/È|É|Ẹ|Ẻ|Ẽ|Ê|Ề|Ế|Ệ|Ể|Ễ/g, "E"), str = str.replace(/Ì|Í|Ị|Ỉ|Ĩ/g, "I"), str = str.replace(/Ò|Ó|Ọ|Ỏ|Õ|Ô|Ồ|Ố|Ộ|Ổ|Ỗ|Ơ|Ờ|Ớ|Ợ|Ở|Ỡ/g, "O"), str = str.replace(/Ù|Ú|Ụ|Ủ|Ũ|Ư|Ừ|Ứ|Ự|Ử|Ữ/g, "U"), str = str.replace(/Ỳ|Ý|Ỵ|Ỷ|Ỹ/g, "Y"), str.replace(/Đ/g, "D")
	};
	self.RemoveSpec = function(str) {
			return str.replace(/[^0-9a-zàáạảãâầấậẩẫăằắặẳẵèéẹẻẽêềếệểễìíịỉĩòóọỏõôồốộổỗơờớợởỡùúụủũưừứựửữỳýỵỷỹđ\s]/gi, "")
	};
	self.Snackbar = function () {
		var x = document.getElementById("snackbar");
		x.className = "show";
		setTimeout(function () {
			x.className = x.className.replace("show", "")
		}, 3e3)
	};
	$(document).ready(function () {
		$(document).click(function (event) {
			 $(event.target).closest(".text-search").length || $(event.target).closest(".box-suggest").length || self.ShowSuggest(!1);
			$(event.target).closest(".btn-sort").length || $(event.target).closest(".dropdown-sort").length || self.ShowDropdownSort(!1);
			$(event.target).closest(".filter-popup-price").length || $(event.target).closest(".btn-price").length || (self.IsPriceShow = !0, self.ShowPrice());
			$(event.target).closest(".filter-popup-acreage").length || $(event.target).closest(".btn-acreage").length || (self.IsAcrShow = !0, self.ShowAcr());
			$(event.target).closest(".filter-popup-city").length || $(event.target).closest(".btn-city").length || (self.IsCityShow = !0, self.ShowCity());
			$(event.target).closest(".filter-popup-category").length || $(event.target).closest(".btn-category").length || (self.IsCategoryShow = !0, self.ShowCategory());
			$(event.target).closest(".search-advanced").length || $(event.target).closest(".btn-advanced").length || (self.IsAdvShow = !0, self.ShowAdv())
		})
	})
})(jQuery);