function HotelSelector(opts) {
	var me = this;
	var defaults = {ctr:null, showSB:true, shwAIRcm:false, isRecommendationMode: false, inPopup:false, isPgChgInSrch:false, prHtlSrch:false, isPkgCfgMode:false, srchPrms:'', hltSrchTout:30000,
			sbOpt:{ctr:null, hasHtlAC:false}, dtlOpt:{ctr:null, isLivRt:false}, blkFltrSelect:true, isDsbPrcSort:false, isAllowNoStay:false, isAllowHotelLookup:true, allowHistPushState:false, rmSlctClbk:null, isByAreaMode:true, isCdrGroupMode:true, shwUpdRmCfg: false};
	this.opts = $jQ.extend(true, {}, defaults, opts || {});
	this.htlMap = null;
	this.curSort = {nm:'Recommended', fld:'rscr', asc:true};

	this.init = function() {
		me.ctrJ = $jQ(me.opts.ctr);
		me.choiceCtr = $jQ(".htlsChcVwCtr", me.ctrJ);
		me.srchCtr = $jQ(".htlsSrchVwCtr", me.ctrJ);
		me.rsltCtr = $jQ(".hSrchRsltCtr", me.srchCtr);
		me.rsltMsgCtr = $jQ(".hSrchRsltMsgCtr", me.srchCtr);

		me.dtlCtr = $jQ(".htlDtlVwCtr", me.ctrJ);

		if (!me.opts.sbOpt.ctr) {
			me.opts.sbOpt.ctr = $jQ('.hSrchBxCtr', me.srchCtr);
		}
		if (!me.opts.sbOpt.srchCallback) {
			me.opts.sbOpt.srchCallback = function(el, opts) {
				if((me.opts.dPgHtlSrch || !me.opts.prHtlSrch) && me.hDtlO) {
					let optDtl = $jQ.extend({}, {htlUrl:me.hDtlO.htlUrl, isOpenTab:false, isDtlSrch:true, selectedPrIds : me.opts.selectedPrIds, prIdPrc : me.opts.prIdPrc, prcEncKey : me.opts.prcEncKey, srhotels : me.opts.srhotels, sltdRmIds : me.hSrchBx.roomIds}, opts || {});
					me.loadHotelDetails(me.hDtlO.hId, optDtl);
					return false;
				}else{
					me.fetchResults.call(me, me.hSrchBx.getQueryJSON(), {isUpdHist:true, isReplaceHist:false});					
				}
			}
		}
		me.opts.sbOpt.srhotels = me.opts.srhotels;
		me.hSrchBx = new HotelSearchBox(me, me.opts.sbOpt);

		me.hRsltO = new HotelResults(me, me.rsltCtr);
		if (me.opts.dtlOpt.ctr) {
			me.dtlCtr = $jQ(me.opts.dtlOpt.ctr);
		}
		me.hDtlO = new HotelDetail(me, me.dtlCtr, me.opts.dtlOpt);

		me.rsltCtr.on('click', '.htlRsltItm', function() {
			var htlItm = me.hRsltO.htlKeys[$jQ(this).data('htl')];
			me.opts = me.opts || {}; me.opts.prcEncKey = me.opts.prcEncKey || 0;
			me.loadHotelDetails(htlItm.hO.id, {htlUrl:htlItm.hO.url, isOpenTab:me.opts.prHtlSrch, prcEncKey:me.opts.prcEncKey, prIdPrc : me.opts.prIdPrc, selectedPrIds : me.opts.selectedPrIds, srhotels : me.opts.srhotels});
			return false;
		});

		if (me.opts.allowHistPushState) {
			HISTUTIL.bind(function(state) {
				if (!state || !state.srchO) return;
				me.hSrchBx.populateFields(state.srchO);
				if (me.opts.sbOpt.srchCallback){
					if(me.opts.dPgHtlSrch && me.hDtlO){
						me.loadHotelDetails(me.hDtlO.hId, {htlUrl:me.hDtlO.htlUrl, isOpenTab:false, isDtlSrch:true});
					}else{
						me.fetchResults.call(me, me.hSrchBx.getQueryJSON(), {isUpdHist:false, fltPrms:state.fltPrms});
					}
				}
			});
		}
	}
	this.setupScrollEvent = function() {
		if (!me.opts.blkFltrSelect || me.hasScrollEvent) {
			return;
		}

		var scrllOn = $jQ(window);
		if (me.hRsltO.rsltSdSctCtr.css('position') == 'fixed') {
			scrllOn = me.hRsltO.rsltSdSctCtr;
		} else if (MODAL_PANEL.isInPanel(me.ctrJ)) {
			scrllOn = me.ctrJ.closest('.blockUIDialogCtr');
		}

		scrllOn.on('scroll.htlSlctr', function() {
			if (!me.opts.blkFltrSelect || !me.hRsltO || !me.ctrJ.hasClass('htlSrchWRslt')) {
				return;
			}
			me.hRsltO.onWindowScroll();
		});
		me.hasScrollEvent = true;
	}
	this.setOptions = function(opts) {
		if (opts) {
			if (opts.dtlOpt) {
				if (opts.dtlOpt.ctr) {me.dtlCtr = me.hDtlO.dtlCtr = $jQ(opts.dtlOpt.ctr);} 
			}
		}
		me.opts = $jQ.extend(true, {}, me.opts, opts || {});
	}
	this.showSearchView = function(srchO) {
		me.hSrchBx.show(me.opts.showSB);
		me.srchCtr.removeClass('hide');
		me.dtlCtr.addClass('hide');
		me.choiceCtr.addClass('hide');
		if (srchO) {
			me.hSrchBx.populateFields(srchO);
			me.hRsltO.srchO = srchO;
		}
	}
	
	this.showChoiceView = function(srchO, opts) {
		me.opts.isByAreaMode = true;
		me.opts.isCdrGroupMode = true;
		me.srchCtr.addClass('hide');
		me.dtlCtr.addClass('hide');
		me.choiceCtr.html(`${me.opts.shwAIRcm ? `<div class="htlChcItm htlChcClk htlRcmdCty">
				<div class="htlChcCnt">
					<div class="chcIcCtr"><div class="chcIc"><i class="icon-iconP-lst1"></i></div></div>
					<div class="chcTxt">${"Recommendation in"} ${srchO.cnm}</div>
				</div>
			</div>` : ``}<div class="htlChcItm htlChcClk htlChcCty">
				<div class="htlChcCnt">
					<div class="chcIcCtr"><div class="chcIc"><i class="icon-iconP-lst1"></i></div></div>
					<div class="chcTxt">${JS_UTIL.getTranslated("View_all_stay_in", {city:srchO.cnm})}</div>
				</div>
			</div>${me.opts.isAllowNoStay ? `<div class="htlChcItm htlChcClk htlChcNoSty">
				<div class="htlChcCnt">
					<div class="chcIcCtr"><div class="chcIc"><i class="icon-iconP-clsd"></i></div></div>
					<div class="chcTxt">${JS_UTIL.getTranslated("No_stay_required_in", {city:srchO.cnm})}</div>
				</div>
			</div>`: ``}${me.opts.isAllowHotelLookup ? `<div class="htlChcItm htlChcLkup">
				<div class="htlChcCnt">
					<div class="chcIcCtr"><div class="chcIc"><i class="icon-iconP-filter"></i></div></div>
					<div class="chcTxt">${JS_UTIL.getTranslated("Looking_for_parti_hotel")}</div>
					<div class="chcInpCtr"><i class="icon-Search"></i><input type="text" placeholder="${JS_UTIL.getTranslated("Search_by_property_name")}"></div>
				</div>`: ``}
			</div>`).removeClass('hide');
			
		$jQ('.htlRcmdCty .htlChcCnt', me.choiceCtr).click(function(){
			me.opts.isRecommendationMode = true;
	    	me.showSearchView(srchO);
			me.fetchResults(srchO, opts);
			return false;
		});	

		$jQ('.htlChcCty .htlChcCnt', me.choiceCtr).click(function() {
			me.showSearchView(srchO);
			me.fetchResults(srchO, opts);
			return false;
		});
		$jQ('.htlChcNoSty .htlChcCnt', me.choiceCtr).click(function() {
			if (me.opts.rmSlctClbk) me.opts.rmSlctClbk(-1);
			return false;
		});
		var htlAC = new TFAutocomplete({inpF:$jQ('.htlChcLkup input', me.choiceCtr), wclass:'tt-fwidth tt-minwidth', acOpts: {highlight:true},
			datasets:new TFACDataset({remote:{url:'/gen/msc/hotel-suggest'}, extraParams:{city:srchO.cid, iSltrMd:true, iSlFw:true}}),
			events: {'select': function(e, item) {
				me.loadHotelDetails(item.data.id, {htlUrl:item.data.url, srchO:srchO, selectedPrIds: opts.selectedPrIds, prIdPrc: opts.prIdPrc, prcEncKey : opts.prcEncKey});
			}}});
	}
	this.clearResults = function() {
		me.hRsltO.clear();
	}
	
	this.fetchResults = function(srchO, opts) {
		opts = $jQ.extend({}, {waitHndlr:null, loadClbk:null, isFltr:false, fltPrms:'', isUpdHist:false, isReplaceHist:false}, opts || {});

		if (!srchO) {srchO = me.hRsltO.srchO};
		if (!srchO) srchO = me.hSrchBx.getQueryJSON();
		if (!me.hSrchBx.isValid(srchO)) return false;

		var successFetch = function(a, m) {
			var rsltO = JS_UTIL.parseJSON(m);
			me.parseResults(rsltO, opts);
			me.showResults(opts);
			if (!me.opts.inPopup) {MODAL_PANEL.hide();}
		}
		AJAX_UTIL.abortAjaxRequest(this.htlRequest);

		if (opts.isFltr) {
			opts.waitHndlr = function(isShw, isSuccess) {
				if (isShw) {
					me.hRsltO.rsltTlbrScCtr.addClass('hide');
					me.hRsltO.rsltTlbrCtr.addClass('hide');
					me.hRsltO.rsltSdSctCtr.addClass('hide');
					me.hRsltO.rsltLstCtr.html($jQ('#htlRsltSklTpl').clone().attr('id', '')).removeClass('hide');
					me.hRsltO.rsltMapCtr.addClass('hide');
				}
			}
		}

		if (me.htlMap) {
			me.htlMap.clearMarkersWithType('CUSTOM');
			me.htlMap.closeInfoBox();
		}

		var prmO = me.hSrchBx.getQueryParams(srchO), fltPrms = opts.fltPrms;
		if (opts.isFltr && me.hRsltO.hFltrs) fltPrms = me.hRsltO.hFltrs.getAppliedFiltersQueryParams().join('&');
		if (me.opts.isPkgCfgMode) prmO.isPkgCfgMode = true;
		if (!me.opts.isByAreaMode) prmO.isByAreaMode = false;
		if (!me.opts.isCdrGroupMode) prmO.isCdrGroupMode = false;
		if (opts.ovFltPrms) fltPrms = opts.ovFltPrms;
		me.ctrJ.addClass('htlSrchWRslt');
		
		if(me.opts.usIPrf) {
			prmO.usIPrf = me.opts.usIPrf;
		}
		if(me.opts.isRecommendationMode) {prmO.isRecommendationMode = me.opts.isRecommendationMode;}

		opts.fltPrms = ''; opts.ovFltPrms = '';
		this.htlRequest = AJAX_UTIL.asyncCall('/hotels/search-x', 
			{params: $jQ.param(prmO)+(fltPrms?'&'+fltPrms:'')+(me.opts.prHtlSrch?'&prHtl=true':'')+'&'+me.opts.srchPrms, timeout: 120000, scope: me,
				wait: {inDialog:false, msg:JS_UTIL.getTranslated('Searching')+(srchO.liv?' Live':'')+'...', handler:opts.waitHndlr},
				success: {handler:successFetch, parseMsg:true}, error:{inDialog:false, handler:function(a, m) {me.showSearchMessage(m, false, true);}}
			});

		if (opts.isUpdHist) {
			me.updateInHistory(srchO, {isReplace:opts.isReplaceHist, fltPrms:fltPrms, srchPrms:me.opts.srchPrms});
			opts.isReplaceHist = false;
			// opts.isUpdHist = false;
		}
		if (!opts.isFltr) me.showSearchMessage($jQ(`<h3>${JS_UTIL.getTranslated("searching_hotels")}${srchO.cnm ? ' - ' + srchO.cnm: ''}</h3>`), true, false);
	}
	this.parseResults = function(rsltO, opts) {
		opts = $jQ.extend({}, {loadClbk:null}, opts || {});
		me.hRsltO.setResults(rsltO, opts);
		if (opts.loadClbk) opts.loadClbk(rsltO);
	}
	
	this.showRecommendationResults = function(rsltO, opts){
		me.hSrchBx.populateRecommendationsFields(rsltO, opts);
	}
	
	this.showResults = function(opts) {
		opts = $jQ.extend({}, {resetFltr:false}, opts || {});
		if (me.hRsltO.srchO) {
			me.hSrchBx.populateFields(me.hRsltO.srchO, me.hRsltO.rsltO.appFltrs ? me.hRsltO.rsltO.appFltrs.map((afltrO) => ({name:afltrO.fd+'Fltr', value:afltrO.v})): null);
		}
		if (!opts.isFltr && (!me.hRsltO.rsltO || !me.hRsltO.rsltO.rsltA)) {
			me.showSearchMessage(JS_UTIL.getTranslated('No_result_found'), false, true);
		} else {
			me.rsltCtr.show();
			me.hRsltO.rsltTlbrScCtr.removeClass('hide');
			me.hRsltO.rsltTlbrCtr.removeClass('hide');
			me.hRsltO.rsltSdSctCtr.removeClass('hide');
			me.rsltMsgCtr.hide();
			me.hRsltO.showResults(opts);
		}
	}
	this.showSearchMessage = function(msgJ, showWait, isErr) {
		me.rsltCtr.hide();
		me.rsltMsgCtr.html(msgJ).show().toggleClass('hSrchRsltErrMsg', isErr);
		if (showWait) me.rsltMsgCtr.append('<div class="padTB"><span class="waiting2">&nbsp;</span></div>');
	}

	this.loadHotelDetails = function(hId, opts) {
		opts = $jQ.extend({}, {htlUrl:null, isOpenTab:false, srchO:null, loadClbk:null, wait:null, error:null, isDtlSrch:false, skipRoomDetails: false}, opts || {});
		if (!opts.htlUrl) return;

		var srch1 = opts.srchO;
		if (!srch1) srch1 = me.hSrchBx.getQueryJSON();
		if (!srch1) srch1 = me.hRsltO.srchO;
		if(me.hDtlO) me.hDtlO.htlUrl = opts.htlUrl;
		if(me.opts.dPgHtlSrch && !(srch1.cid || srch1.hid)){
			 srch1.hid = hId;
		}
		var srchO = $jQ.extend(true, {}, srch1);
		if (!srchO.srhotels) srchO.srhotels = opts.srhotels;
		if (me.hSrchBx.roomSrch && (!opts.frstcl || me.hDtlO.advSrchRM)) srchO.paxes.rooms = [srchO.paxes.rooms[me.hSrchBx.srchRmIdx]];
		if (opts.frstcl && !me.hDtlO.advSrch && !me.hDtlO.advSrchRM) { delete me.hSrchBx.roomSrch; delete me.hSrchBx.srchRmIdx; }
		if (opts.skipRoomDetails) {
			if (opts.cyid) {
				srchO.cid = opts.cyid;
			}
			me.hDtlO.showDetail(hId, {srchO: srchO});
			return;
		}
		opts.cid = srchO.cid;
		var loadWaitHandler = function(isShw, isSuccess) {
			if(opts.isDtlSrch && isShw){
				if (!me.hSrchBx.srchRmIdx) {
					me.hDtlO.clearRoomDetail();
					me.hDtlO.showSklRoomDetail();
					me.hDtlO.showAvailableOpts();
				}
			}
			if (!me.opts.inPopup || (!me.opts.isPkgCfgModel && opts.isDtlSrch)) {
				if (!isShw && isSuccess && (!me.opts.isPkgCfgModel && !me.hSrchBx.srchRmIdx) && !me.opts.inPopup) MODAL_PANEL.hide();
				return;
			}
			if (isShw) {
				me.srchCtr.addClass('hide');
				me.choiceCtr.addClass('hide');
				if(!me.opts.isDtlPgReload) {
					me.dtlCtr.html($jQ('#htlDtlVwSklTpl').clone().attr('id', '')).removeClass('hide');
				}
			}
		}
		var successLoad = function (a, m) {
			var rspO = JS_UTIL.parseJSON(m);
			if (opts.isDtlSrch) {
				me.hDtlO.updateSrchInfo(rspO);
				me.hDtlO.showRoomDetail(hId, rspO, {shwPrcDiff: rspO.shwPrcDiff, selectedPrIds: opts.selectedPrIds, prcEncKey : opts.prcEncKey, prIdPrc : opts.prIdPrc, roomSrch : me.hSrchBx.roomSrch, autoSelect : opts.autoSelect});
			} else {
				me.hDtlO.showDetail(hId, rspO, {shwPrcDiff: rspO.shwPrcDiff, selectedPrIds: opts.selectedPrIds, prcEncKey : opts.prcEncKey, prIdPrc : opts.prIdPrc, roomSrch : me.hSrchBx.roomSrch, autoSelect : opts.autoSelect});
			}
			if (opts.loadClbk && opts.frstcl) opts.loadClbk(rspO);
			if (opts.frstcl) {
				delete opts.frstcl;
				me.origSrchO = srch1; 
				me.hSrchBx.populateFields(srch1); 
				if (me.hDtlO.advSrchRM) {
					me.hSrchBx.roomSrch = true;
					opts.isDtlSrch = true;
					me.hDtlO.advSrch = true;
					me.hSrchBx.searchRoom(1, opts);
				}
			}
		}
		var errorLoad = function(a, m) {
			if(opts.isDtlSrch){
				me.hSrchBx.clearPrevSrchO();
				me.hDtlO.showRoomDetail(hId, null);
				return;
			}
			if (!me.opts.inPopup) return;
		}
		if (!opts.wait || (me.hDtlO.advSrch && !opts.frstcl)) opts.wait = {inDialog:!me.opts.inPopup && !opts.isDtlSrch, msg: JS_UTIL.getTranslated("Loading_wait") + '...'};
		if (!me.hSrchBx.srchRmIdx) opts.wait.handler = loadWaitHandler
		if (!opts.error) opts.error = {inDialog:!me.opts.inPopup, handler:errorLoad};

		var prmO = {}, fltPrms = '';
		if (me.opts.isPkgCfgMode) prmO.isPkgCfgMode = true;
		if (srchO) prmO = {...prmO, ...me.hSrchBx.getQueryParams(srchO)};
		if (me.hRsltO.hFltrs) fltPrms = me.hRsltO.hFltrs.getAppliedFiltersQueryParams().join('&');
		if (me.opts.dtlOpt.isLivRt) prmO.livRts = true;
		if (opts.isOpenTab) {
			Object.assign(document.createElement('a'), {target:'_blank', href:JS_UTIL.insAllParams(opts.htlUrl, prmO)+(fltPrms?'&'+fltPrms:'')}).click();
			return;
		}
		if (opts.sltdRmIds && me.hSrchBx.srchRmIdx) prmO.sltdRmIds = opts.sltdRmIds.toString();
		if (me.hDtlO.advSrch) prmO.roomSrch = true;
		AJAX_UTIL.asyncCall(opts.htlUrl, 
			{params: $jQ.param(prmO)+(fltPrms?'&'+fltPrms:'')+(me.opts.prHtlSrch?'&prHtl=true':'')+'&'+me.opts.srchPrms, timeout: 120000, scope: me,
				wait: opts.wait, success: {handler:successLoad, parseMsg:true}, error:opts.error
			});
	}

	this.backToResults = function(srchO, hId) {
		if (me.hRsltO.hasResults()) {
			me.dtlCtr.addClass('hide');
			me.srchCtr.removeClass('hide');

			me.scrollToHotelResult(hId);
			return;
		}

		if (srchO.hid > 0 && srchO.cid > 0) srchO.hid = 0;
		var prmO = me.hSrchBx.getQueryParams(srchO);
		window.location.href = '/hotels/search?' + $jQ.param(prmO);
	}
	this.scrollToHotelResult = function(hId) {
		var htlItm = me.hRsltO.htlKeys[hId];
		if (htlItm) {
			JS_UTIL.scrollTo($jQ(`.htlRsltItm[data-hotelid="${htlItm.hO.id}"]`, me.rsltCtr), 200, {offset:-20});
		} else {
			JS_UTIL.scrollTo(me.hRsltO.rsltCtr, 200, {offset:-50});
		}
	}
	this.updateInHistory = function(srchO, opts) {
		if (!me.opts.allowHistPushState) return;

		opts = $jQ.extend({}, {isReplace:false}, opts || {});
		if (srchO) {
			var sUrl = '/hotels/search';
			if(me.opts.dPgHtlSrch && me.hDtlO){
				sUrl = me.hDtlO.htlUrl;
			}
			var urlPrms = me.hSrchBx.getQueryParams(srchO), url = JS_UTIL.insAllParams(sUrl, urlPrms) + (opts.fltPrms ? '&'+opts.fltPrms:'') + (opts.srchPrms ? '&' + opts.srchPrms: '');
			var state = {noOvr:false, srchO:srchO, fltPrms:opts.fltPrms, srchPrms:opts.srchPrms};
			if (opts.isReplace) {
				window.history.replaceState(state, '', url);
			} else {
				HISTUTIL.push({url:url, state:state}, true);
			}
		}
	}

	this.init();
}

function HotelDetail(hSel, dtlCtr, opts) {
	var me = this; me.hSel = hSel; me.dtlCtr = dtlCtr; me.prIds = [], me.prcArr = [], me.selectedPrcArr = [], me.lwtPrcArr = {};
	me.fltrOpts = {"search-rm": {typ:"search-rm", nm:JS_UTIL.getTranslated("Search_room")+'...'}, "meal": {typ:"meal", nm:JS_UTIL.getTranslated("Boarding"), applA:[], optA:[], opts:{}}, "rm-combo": {typ:"rm-combo", nm:'Show Only Combos'}, "refundable": {typ:"refundable","isAvl":false, nm:"Refundable"}, "adv-srch": {typ:"adv-srch", "isAvl":false, nm:"Advance Search"}};
	
	this.init = function() {
	}
	this.showDetail = function(hId, dtlO, opts) {
		var opts = opts || {};
		me.hId = hId; me.dtlO = dtlO;

		me.hSel.srchCtr.addClass('hide');
		me.hSel.choiceCtr.addClass('hide');
		me.dtlCtr.removeClass('hide');
		if (dtlO && dtlO.hdtlH) {
			me.dtlCtr.html(dtlO.hdtlH);
		}

		if (me.dtlO && me.dtlO.srchO) {
			if (dtlO.rmFltrsSlctd) {
				$jQ.each(dtlO.rmFltrsSlctd, function(fK, fScltO) {
					var fO = me.fltrOpts[fK];
					if (fO && fK == 'meal' && fScltO && (!fO.applA || fO.applA.length == 0)) {
						fO.applA = [fScltO];
						opts.isFilter = true;
					}
				});
			}
			if (!$jQ('#htlAvailOptsCtr', me.dtlCtr).html().length){
				var optsCtrJ = $jQ('#htlAvailOptsCtr', me.dtlCtr).append(`<div class="srchSmry"><div class="htlRmSrchSmry">
					<div class="srchSmryItm"><div class="lbl">${JS_UTIL.getTranslated("Check-in")}</div><div class="val">${moment(me.dtlO.srchO.chkIn, 'DD/MM/YYYY').format('DD MMM YYYY')} - ${moment(me.dtlO.srchO.chkOut, 'DD/MM/YYYY').format('DD MMM YYYY')}</div></div>
					<div class="srchSmryItm"><div class="lbl">${JS_UTIL.getTranslated("Guest_Details")}</div><div class="val paxD">${me.dtlO.srchO.paxD}</div></div>
					${me.hSel.opts.shwUpdRmCfg ? `<div class="rmCfgChange"><a href="#" class="shwRmCfg u_smallF qttipB" title="Change the number of rooms required for the same number of adults/children">${JS_UTIL.getTranslated("Change_Rooms")}<i class="icon-iconP-hlp mrgnL10"></i></a></div></div>` : ``}
				</div></div>
				<div class="htlRmTlbr">
					<div class="htlRmFltsCtr"></div>
					${(me.dtlO.isShwCms || me.dtlO.isShwNet) ? `<div class="htlRmPrcActCtr"><a href="#" class="ui-button ui-button-smpl ui-button--sm shwInctvAct">${me.dtlO.isShwCms ? JS_UTIL.getTranslated("Show_Commission", {"Commission": me.dtlO.cmsTxt}): JS_UTIL.getTranslated('Show_Net')}</a></div>`: ``}
				</div>
				<div class="htlRmOptsCtr"></div> 
				<div class="htlRmBk"></div>`);
				me.dtlOptsCtrJ = optsCtrJ;
				if(hSel.opts.prHtlSrch){
					me.dtlCtr.find('.htl-dts-srchbox-ctr').html(hSel.hSrchBx.sbJ);
					try{
						hSel.hSrchBx.populateFields(me.dtlO.srchO);
					}catch(e){console.log(e)}
					optsCtrJ.find('.srchSmry').hide();
					me.dtlCtr.find('.htl-dts-srchbox-ctr').find('.srchAct').text(JS_UTIL.getTranslated('Search'));
				}
			}
			

			me.renderRoomOptions(opts.isFilter, opts);
			$jQ('.htlRmFltsCtr', me.dtlOptsCtrJ).html(me.getRoomFiltersHTM({fltrClbk:function(sltdO) {
				opts.isFilter = true;
				me.renderRoomOptions(true, opts);
			}}));

			$jQ('.shwInctvAct', optsCtrJ).click(function() {
				optsCtrJ.toggleClass('showHtlInctv'); return false;
			});

			$jQ('.shwRmCfg', optsCtrJ).click(function () {
				me.dtlCtr.find('.rmCfgChange').html(me.hSel.hSrchBx.sbJ);
				me.hSel.opts.dPgHtlSrch = true;
				me.hSel.opts.isDtlPgReload = true;
				hSel.hSrchBx.populateFields(me.dtlO.srchO);
				return false;
			});
		}
		JS_UTIL.scrollTo(me.dtlCtr, 200, {offset:-20});
		if (me.hSel.opts.isPkgCfgMode && !me.hSel.hRsltO.hasResults()) {
			$jQ('.htlSrchBkActCtr', me.dtlCtr).remove();
		} else {
			$jQ('.htlSrchBkActCtr a', me.dtlCtr).click(function() {
				me.hSel.backToResults(me.dtlO.srchO);
				return false;
			});
		}
	}
	this.showAvailableOpts = function(){
		me.dtlCtr.find('.htlAvailOptsTab').show();
		me.dtlCtr.find('#htlAvailOptsCtr').show();
		me.dtlCtr.find('.htlAvailOptsTab').find('a').trigger('click');
	}

	//To update the paxData text when only the rooms are refreshed after every search in the hotel details page
	this.updateSrchInfo = function (rspO) {
		if (me.hSel.opts.isPkgCfgMode && rspO.srchO && rspO.srchO.paxD) {
			$jQ('#htlAvailOptsCtr .paxD', me.dtlCtr).text(rspO.srchO.paxD);
		}
	}

	this.cntToBook = function(e) {
		let hsq = me.hSel.hSrchBx.origSrchO ? me.hSel.hSrchBx.origSrchO : me.hSel.origSrchO;
		if (me.hSel.hSrchBx.roomSrch) hsq.roomSrch = me.hSel.hSrchBx.roomSrch;
		if (me.hSel.opts.rmSlctClbk) {
			me.hSel.opts.rmSlctClbk(me.dtlO.hId, hsq && hsq.roomSrch ? hsq : me.dtlO.srchO, {prIds: me.prIds});
		} else if (me.hSel.opts.prHtlSrch) {
			var prmO = {hid: me.dtlO.hId, hsq: JS_UTIL.stringifyJSON(hsq), prId: me.prIds};
			MODAL_PANEL.showWait(JS_UTIL.getTranslated("Reconfirming_availability") + '...');
			location.href = JS_UTIL.insAllParams('/hotels/book', prmO);
		}
		return false;
	}

	this.showRoomDetail = function(hId, dtlO, opts) {
		me.hId = hId; me.dtlO = dtlO;
		me.renderRoomOptions(true, true, opts);
		$jQ('.htlRmFltsCtr', me.dtlOptsCtrJ).html(me.getRoomFiltersHTM({fltrClbk:function(sltdO) {
			me.renderRoomOptions(true, false, opts);
		}}));
		JS_UTIL.scrollTo(me.dtlCtr.find('#htlAvailOptsCtr'), 200, {offset:-20});
	}
	this.clearRoomDetail = function(){
		$jQ('.htlRmOptsCtr', me.dtlOptsCtrJ).empty();
	}
	this.showSklRoomDetail = function(){
		$jQ('.htlRmOptsCtr', me.dtlOptsCtrJ).html(`
			<div class="htlRmDtl-skl-container">
				<div class="htlRmDtl-skl-container__item c-card--mn">
					<div class="htlRmDtl-skl-container__loading line"></div>
					<div class="line htlRmDtl-skl-container__loading"></div>
					
					<div class="sec-line htlRmDtl-skl-container__loading"></div>
					<div class="sec-line htlRmDtl-skl-container__loading"></div>
					<div class="sec-line htlRmDtl-skl-container__loading"></div>
				</div>
			</div>
		`);
	}
	this.getRoomFiltersHTM = function(opts) {
		var fltrsJ = $jQ(), fltrOptsCtrJ = null;
		opts = $jQ.extend({}, {mergeFltrs:false}, opts || {});
		if (!me.dtlO || ((!me.dtlO.roptA || me.dtlO.roptA.length == 0) && (!me.dtlO.rmA || me.dtlO.rmA.length == 0))) return fltrsJ;

		if (me.dtlO.rmA) {
			$jQ.each(me.dtlO.rmA, function(i, rmO) {
				$jQ.each(rmO.roptA, function(i, rO) {
					if (rO.mp) addFilterOpt('meal', {id:rO.mp, nm:rO.mpN});
					if(!rO.isNR && rO.xpSmry) me.fltrOpts["refundable"].isAvl = true;
				});
			});
		} else {
			$jQ.each(me.dtlO.roptA, function(i, rO) {
				if (rO.mp) addFilterOpt('meal', {id:rO.mp, nm:rO.mpN});
				if(!rO.isNR && rO.xpSmry) me.fltrOpts["refundable"].isAvl = true;
			});
		}

		if (opts.mergeFltrs) {
			var fltrItmJ = $jQ(`<div class="ddItm">
					<div class="ddBtn"><div class="btnTxt">Filters</div><i class="icArrDn"></i></div>
					<div class="ddMenuCtr"><div class="ddMenuArr"></div></div>
				</div>`);
			fltrsJ = fltrsJ.add(fltrItmJ);
			fltrOptsCtrJ = $jQ('.ddMenuCtr', fltrItmJ);
		} else {
			fltrsJ = $jQ();
		}

		var numFltrSltd = 0, fltrTypA = me.dtlO.hsRmCmb ? ['search-rm', 'meal', 'rm-combo', 'refundable', 'adv-srch']: ['search-rm', 'meal', 'refundable', 'adv-srch'];
		$jQ.each(fltrTypA, function(i, typ) {
			var fltrItm = me.fltrOpts[typ];
			if (!fltrItm) return true;

			var fOptsJ = getFilterItemOptionsHTM(fltrItm, opts);
			if (typ == 'search-rm' || typ == 'rm-combo' || typ == 'refundable' || typ == 'adv-srch') {
				fltrsJ = fltrsJ.add(fOptsJ);
				return true;
			} else if (!opts.mergeFltrs) {
				var fltrItmJ = $jQ(`<div class="ddItm">
						<div class="ddBtn"><div class="btnTxt">${fltrItm.nm}</div><i class="icArrDn"></i></div>
						<div class="ddMenuCtr"><div class="ddMenuArr"></div></div>
					</div>`);
				fltrsJ = fltrsJ.add(fltrItmJ);
				fltrOptsCtrJ = $jQ('.ddMenuCtr', fltrItmJ);
				if (fltrItm.applA && fltrItm.applA.length > 0) $jQ('.btnTxt', fltrItmJ).text(`${fltrItm.nm} (${fltrItm.applA.length})`);
			} else if (fltrItm.applA && fltrItm.applA.length > 0) {
				numFltrSltd += fltrItm.applA.length;
			}
			fltrOptsCtrJ.append(fOptsJ);
		});

		return fltrsJ;
	}
	var addFilterOpt = function(typ, optO) {
		var fltrItmOpts = me.fltrOpts[typ];
		if (!fltrItmOpts) return;

		if (!fltrItmOpts.opts[optO.id]) {
			fltrItmOpts.optA.push(optO);
			fltrItmOpts.opts[optO.id] = true;
		}
	}
	var getFilterItemOptionsHTM = function(fO, opts) {
		if (!fO) return null;
		if (fO.typ == 'search-rm') {
			var fJ = $jQ(`<div class="htlRmSrchCtr"><i class="icon-Search"></i><input type="text" placeholder="${fO.nm}" value="${fO.txt ? fO.txt: ''}"></div>`);
			$jQ('input', fJ).keyup(function() {
				var txt = $jQ.trim($jQ(this).val());
				fO.txt = txt?txt.toLowerCase(): txt;
				if (opts && opts.fltrClbk) opts.fltrClbk({isFltr:true, fltr:fO, txt:(txt?txt.toLowerCase(): txt)});
			});
			return fJ;
		} else if (fO.typ == 'rm-combo') {
			var fJ = $jQ(`<div class="htlRmFltrItm"><label><input type="checkbox" class="checkbox">${fO.nm}</label></div>`);
			$jQ('input', fJ).change(function() {
				fO.sltd = $jQ(this).is(':checked');
				if (opts && opts.fltrClbk) opts.fltrClbk({isFltr:true, fltr:fO, sltd:fO.sltd});
			});
			return fJ;
		}
		else if (fO.typ == 'refundable' && fO.isAvl) {
			var fJ = $jQ(`<div class="htlRmFltrItm"><label><input type="checkbox" class="checkbox">${fO.nm}</label></div>`);
			$jQ('input', fJ).change(function() {
				fO.rfsltd = $jQ(this).is(':checked');
				if (opts && opts.fltrClbk) opts.fltrClbk({isFltr:true, fltr:fO, rfsltd:fO.rfsltd});
			});
			return fJ;
		}
		else if (fO.typ == 'adv-srch' && fO.isAvl) {
			var fJ = $jQ(`<div class="htlRmFltrItm htlAdvSrch"><a href="#" class="ui-button ui-button-sec">${fO.nm}</a></div>`);
			$jQ('a', fJ).click(function() {
				me.advSrch = true;
				me.hSel.hSrchBx.roomIds = [];
				me.hSel.hSrchBx.roomSrch = true;
				me.hSel.hSrchBx.searchRoom(0);
			});
			return fJ;
		}

		var fJ = $jQ(`<div class="ddMBtnGrp fltrItm-${fO.typ}"><div class="ddLbl">${fO.nm}</div></div>`), fCtrJ = fJ;

		if (!fO.optA) return null;
		if (fO.optA.length>8) {fJ = $jQ('<div class="scrlNv fnScrll">').appendTo(fJ);}

		var anySel = false, selTxtA = [];
		$jQ.each(fO.optA, function(i, fOpt) {
			fOpt.appl = !!(fO.applA.indexOf(fOpt.id) >= 0);
			var oJ = $jQ(`<div class="ddMenuBtn ${fOpt.appl?'btnSltd':''}" data-id="${fOpt.id}">
					<div class="chkbx"><div class="chkIIc"></div></div>${fOpt.nm}</div>
				</div>`);
			anySel = fOpt.appl || anySel;
			if (fOpt.appl) selTxtA.push(fOpt.nm);

			oJ.click(function() {
				fOpt.appl = !!(fO.applA.indexOf(fOpt.id) >= 0);
				if (fOpt.appl) fO.applA.splice(fO.applA.indexOf(fOpt.id), 1);
				else fO.applA.push(fOpt.id);
				if (opts && opts.fltrClbk) opts.fltrClbk({isFltr:true, fltr:fO, opt:fOpt});

				oJ.toggleClass('btnSltd');
				var fltrItmJ = $jQ(this).closest('.ddItm');
				if (fltrItmJ.length > 0) {
					$jQ('.btnTxt', fltrItmJ).text(`${fO.nm}${fO.applA && fO.applA.length > 0 ? ` (${fO.applA.length})`: ``}`);
					fltrItmJ.click();
				}

				return false;
			});
			fJ.append(oJ);
		});
		if (anySel) {fCtrJ.data('sltd-fltr-txt', selTxtA.join(', '));}
		return fCtrJ;
	}

	this.renderRoomOptions = function(isSrt, opts, mltRmData) {
		var rmCtrJ = $jQ('<div>');
		if (!me.dtlO || (( !me.dtlO.roptA || me.dtlO.roptA.length == 0) && (!me.dtlO.rmA || me.dtlO.rmA.length == 0))) {
			rmCtrJ.append(`<div class="htlRmOptsMsgCtr">Rooms are unavailable for your trip dates</div>`);
			$jQ('.htlRmOptsCtr', me.dtlOptsCtrJ).html(rmCtrJ);
			$jQ('.htlRmBk', me.dtlOptsCtrJ).html('');
			return;
		}
		var opts = $jQ.extend({}, {hId: me.dtlO.hId, cid: me.dtlO.srchO.cid }, mltRmData ,opts || {});
		if (me.dtlO.rmA) {
			if (me.dtlO.rmCfg && me.dtlO.rmCfg.isMultiRmType) {
				me.mltrmdtlO = me.dtlO;
				var htlRmBk = $jQ('.htlRmBk', me.dtlOptsCtrJ);
				htlRmBk.html(`<span class="ttlPrc"><span class="txt"></span><span class="prc"></span></span>
					<a href="#" class="ui-button ui-button-sec cntToBk">${JS_UTIL.getTranslated("Continue_Booking")}</a></div>`);
				htlRmBk.hide();
				populateMultiRooms(me.dtlO.rmA, rmCtrJ, isSrt, opts);
			} else {
//				$jQ('.htlRmBk', me.dtlOptsCtrJ).html('');
				opts = $jQ.extend({}, {isMultiRmType : false}, opts || {});
				if (opts.roomSrch) {
					var htlRmBk = $jQ('.htlRmBk', me.dtlOptsCtrJ);
					htlRmBk.html(`<span class="ttlPrc"><span class="txt"></span><span class="prc"></span></span>
						<a href="#" class="ui-button ui-button-sec cntToBk">${JS_UTIL.getTranslated("Continue_Booking")}</a></div>`);
					htlRmBk.hide();
					opts.rmNo = parseInt(me.hSel.hSrchBx.srchRmIdx);
					if (me.dtlOptsCtrJ.find(`.rm-${opts.rmNo}`).length) {
						let i = opts.rmNo;
						while(me.dtlOptsCtrJ.find('.rm-' + i).length){
							me.dtlOptsCtrJ.find('.rm-' + i).remove();
							i++;
						}
					}
						var headerDiv = $jQ(`<div class="rm-grp rm-${opts.rmNo}" rm-no="${opts.rmNo}"><div class="rm-header"><div class="rm-no">Room ${opts.rmNo + 1} (${me.dtlO.rmPaxTxt[0]})</div>
	 								<span class="mOptn" rm-no="${opts.rmNo}" style="display:none;">More Option</span><a href="#" class="hide"></a></div><div class="slctd-rm"></div></div>`);
						headerDiv.appendTo(rmCtrJ);
				}
				populateRooms(me.dtlO.rmA, rmCtrJ, isSrt, opts);
			}
			
			$jQ('.rm-header a', rmCtrJ).click(function () {
				$jQ(this).closest('.rm-grp').find('.slctd-rm').toggle();
				$jQ(this).closest('.rm-grp').find('.rms-lst').toggleClass('hide');
				var hasClass = $jQ(this).closest('.rm-grp').find('.rms-lst').hasClass('hide');
				var txt = hasClass ? JS_UTIL.getTranslated("Change_Rooms") : JS_UTIL.getTranslated("Hide_Rooms");
				$jQ(this).text(txt);
				if (me.isRmWSrch) {
					var moreOptn = $jQ(this).parent().find('.mOptn');
					if (moreOptn.attr('rm-no') && moreOptn.attr('rm-no') != 0) moreOptn.toggle();
				}
				return false;
			});
			
			$jQ('.rm-header span', rmCtrJ).click(function () {
				me.hSel.hSrchBx.roomSrch = true;
				me.advSrch = true
				me.hSel.hSrchBx.searchRoom(parseInt($jQ(this).attr('rm-no')));
				var txt = JS_UTIL.getTranslated("All Rooms");
				$jQ(this).text(txt);
				if (me.isRmWSrch) {
					$jQ(this).parent().find('.mOptn').toggle();
				}
				return false;
			});
		
			$jQ('.cntToBk', me.dtlOptsCtrJ).click(function (e) {
				return me.cntToBook(e);
			});
		} else {
			populateRoomOpts(null, me.dtlO.roptA, rmCtrJ, {});
		}
		if (me.hSel.hSrchBx.srchRmIdx) {
			$jQ('.htlRmOptsCtr', me.dtlOptsCtrJ).append(rmCtrJ);
		} else $jQ('.htlRmOptsCtr', me.dtlOptsCtrJ).html(rmCtrJ);
	}

	var populateRooms = function(rmA, ctrJ, isSrt, opts) {
		opts = opts || {};
		var rmNo = opts.rmNo || 0;
		var rmUIds = opts.rmUIds;
		var rmsJ = $jQ('<div class="rms-lst">');
		let lwtprcset = false;
		let totalRoom = 0;
		$jQ.each(rmA, function(i, rmO) {
			var rmJ = $jQ(`<div class="rm-itm">
					<div class="rm--nm">${rmO.nm}</div>
					<div class="rm-dtl-opts-ctr">
						${rmO.id ? `<div class="rm-dtl">
							<div class="rm-img-ctr"><img src="${rmO.imgA ? rmO.imgA[0]: '//cdn.yourholiday.me/static/img/noimage.jpg'}"></div>
							<div class="rm-dt-ctr">
								${rmO.dsc ? `<div class="rm--dsc">${rmO.dsc}</div>`: ``}
								${rmO.bedD ? `<div class="rm--bed">${rmO.bedD}</div>`: ``}
								${rmO.vwN ? `<div class="rm--vw">${rmO.vwN}</div>`: ``}
								${rmO.szD ? `<div class="rm--sz">Room size: ${rmO.szD}</div>`: ``}
								${rmO.amA ? `<div class="rm--amn">${rmO.amA.map((amO) => `<span>${amO}</span>`).join('')}</div>`: ``}
							</div>
						</div>`: ``}
						<div class="rm-prc-opts"></div>
					</div>
				</div>`);

			var rmOptsCtrJ = $jQ('.rm-prc-opts', rmJ);
			opts = $jQ.extend({}, {grpByRtCd:true, maxCnt:2, validRooms: rmUIds, rmNo: rmNo}, opts || {});
			
			if (!me.hSel.opts.prHtlSrch && opts.isMultiRmType && opts.selectedPrIds && !lwtprcset) {
				me.lwtPrcArr = me.lwtPrcArr || {};
				me.lwtPrcArr[opts.hId] = me.lwtPrcArr[opts.hId] || {};
				let rmQty = opts.selectedPrIds.length;
				let prc = opts.prIdPrc[rmNo < rmQty ? rmNo : rmQty -1] - opts.prcEncKey;
				me.lwtPrcArr[opts.hId][rmNo] = prc;
				lwtprcset = true;
			}

			let rmCnt = populateRoomOpts(rmO, rmO.roptA, rmOptsCtrJ, opts);
			
			totalRoom += rmCnt;
			
			if ($jQ('.rmOptItm', rmOptsCtrJ).length <= 0) return true;

			rmsJ.append(rmJ);
		});

		if (totalRoom == 1 && me.isRmWSrch){
			let mrJ = $jQ(`<div class="rmOptsMrActCtr"><a href="#" class="ui-button ui-button-smpl ui-button--sm" rm-no="${opts.rmNo}">Load More Room Options</a></div>`).appendTo(rmsJ);
			$jQ('a', mrJ).click(function() {
				me.hSel.hSrchBx.roomSrch = true;
				me.advSrch = true
				me.hSel.hSrchBx.searchRoom(parseInt($jQ(this).attr('rm-no')));
				if (me.isRmWSrch) {
					$jQ(this).parent().addClass('hide')
				}
				return false;
			});
		}
		if (isSrt) {
			$jQ('.rm-itm', rmsJ).sort(function(a, b) {
				var aJ = $jQ(a), aOpt = $jQ('.rmOptItm:first', aJ).data('room-opt'), aprc = aOpt ? (aOpt.opr ? aOpt.opr: aOpt.pr): 0;
				var bJ = $jQ(b), bOpt = $jQ('.rmOptItm:first', bJ).data('room-opt'), bprc = bOpt ? (bOpt.opr ? bOpt.opr: bOpt.pr): 0;
				if (aprc && bprc) return aprc - bprc;
				return (aprc == bprc) ? 0: bprc - aprc;
			}).each(function(_, pJ) {
				$jQ(pJ).parent().append(pJ);
			});
		}

		$jQ('.rm-itm .rm--dsc', rmsJ).truncate({max_length:150});
		var rmCtrJ = opts.isMultiRmType || opts.roomSrch ? $jQ(`.rm-${rmNo}`, ctrJ) : ctrJ;
		var ermsJ = $jQ('.rms-lst', rmCtrJ);
		if (ermsJ.length > 0) {
			ermsJ.replaceWith(rmsJ);
		} else {
			rmCtrJ.append(rmsJ);
		}
		let rmIdx = parseInt(opts.defaultRm || 0);
		if (opts.isMultiRmType || opts.autoSelect) {
			//Auto select lowest price Rooms or the selected rooms
			var roomToSelect = $jQ(`.rmOptItm:eq(`+rmIdx+`)`, rmsJ);
//			var selectedPrIdList = opts.selectedPrIds;
			if (opts.selectedPrIds) {
				let prIdsLen =  opts.selectedPrIds.length;
				var selectedPrId = opts.selectedPrIds[prIdsLen > rmNo ? rmNo : prIdsLen - 1];
				// Find the room with matching prId in the data
				roomToSelect = $jQ(`.rmOptItm`, rmsJ).filter(function() {
					var roomOptData = $jQ(this).data('roomOpt');
					return roomOptData && roomOptData.prId === selectedPrId;
				});
				if (!opts.isFilter) {
					if (!roomToSelect || roomToSelect.length == 0) {
						roomToSelect = $jQ(`.rmOptItm:eq(`+rmIdx+`)`, rmsJ)
						if (roomToSelect && roomToSelect.length > 0) {
							me.selectedPrcArr.splice(rmNo, me.prcArr.length, roomToSelect.data('roomOpt').absPrc);
						}
						if (opts.prIdPrc && opts.prIdPrc.length > 0) { 
							let prc = opts.prIdPrc[prIdsLen > rmNo ? rmNo : prIdsLen - 1] - opts.prcEncKey;
							me.selectedPrcArr.splice(rmNo, me.prcArr.length, parseInt(prc));
						}
					} else {
						me.selectedPrcArr.splice(rmNo, me.prcArr.length, roomToSelect.data('roomOpt').absPrc);
					}
				}
			}
			selectRoom(roomToSelect, rmNo, ctrJ, opts);
		}
		
	}

	var populateMultiRooms = function (rmA, ctrJ, isSrt, opts) {
		var nRMap = me.dtlO.rmCfg.nRMap || {};
		var rmPaxTxt = me.dtlO.rmCfg.rmPaxTxt || [];
		$jQ.each(nRMap, function (i, cmb) {
			var headerDiv = $jQ(`<div class="rm-grp rm-${i}"><div class="rm-header"><div class="rm-no">Room ${i + 1} (${rmPaxTxt[i]})</div>
 								<a href="#" class="hide"></a></div><div class="slctd-rm"></div></div>`);
			headerDiv.appendTo(ctrJ);
		});
		var rmUIds = Object.keys(nRMap[0]);
		//check default room available for all the occupancy
		let defaultRm = 0;
		for (let rmUId in rmUIds) {
			defaultRm = rmUId;
			let  rmValid = true;
			for(var i = 1; i < Object.keys(nRMap).length - 1; i++) {
				if(!nRMap[i][defaultRm] || nRMap[i][defaultRm].length == 0){
					rmValid = false;
					break;
				}
			}
			if(rmValid) break;
		}
		opts = $jQ.extend({}, {rmNo: 0, rmUIds: rmUIds, isMultiRmType: true, defaultRm : defaultRm}, opts || {});
		populateRooms(rmA, ctrJ, isSrt, opts);

//		$jQ('.cntToBk', me.dtlOptsCtrJ).click(function (e) {
//			return me.cntToBook(e);
//		});
	}
	
	var showNextRooms = function (selectedRoomType, rmNo, ctrJ, opts) {
		opts = opts || {};
		var rmUIds = getNextRooms(selectedRoomType, rmNo);
		if (rmUIds.length === 0 && (!me.mltrmdtlO.rmCfg.nRMap || rmNo == me.mltrmdtlO.rmCfg.nRMap.length -1)) {
			var selectedTotalPrice = me.selectedPrcArr.reduce((currentSum, currentValue) => currentSum + currentValue, 0);
			var totalPrice = me.prcArr.reduce((currentSum, currentValue) => currentSum + currentValue, 0);
			var priceDiff = totalPrice
			var sign = "";
			if (!me.hSel.opts.prHtlSrch && opts.shwPrcDiff) {
				if (!isNaN(selectedTotalPrice) && !isNaN(totalPrice)) {					
					priceDiff = totalPrice - selectedTotalPrice;
					sign = (priceDiff >= 0) ? "+ " : "- "
					priceDiff = Math.abs(priceDiff);
				} else {
					priceDiff = 0;
					$jQ(".slctd-rm .rmOptPrcCtr .prcD", ctrJ).each(function(i, obj){
						let prc = obj.innerText.replace(/^\D+/g, '');
						if (prc.length > 0){
							sign = obj.innerText.charAt(0);
							if (sign == "+") priceDiff += parseInt(prc.replace(",", ""));
							else if(sign == "-") priceDiff -= parseInt(prc.replace(",", ""))
						}
    
					});
					priceDiff = Math.abs(priceDiff);	
				}
			}
			$jQ('.ttlPrc .prc', me.dtlOptsCtrJ).html(`${!me.hSel.opts.prHtlSrch && opts.shwPrcDiff ? sign : ''} ${me.dtlO.roptA ? me.dtlO.roptA[0].cur : me.dtlO.rmA[0].roptA[0].cur} ${priceDiff.toLocaleString()}`);
			$jQ('.ttlPrc .txt', me.dtlOptsCtrJ).html('Total Price');
			$jQ('.htlRmBk', me.dtlOptsCtrJ).show();
			return;
		}
		populateRooms(me.dtlO.rmA, ctrJ, false, {rmNo: rmNo + 1, hId: opts.hId, rmUIds: rmUIds, isMultiRmType: true, isFilter: opts.isFilter, selectedPrIds : opts.selectedPrIds, shwPrcDiff: opts.shwPrcDiff, prcEncKey : opts.prcEncKey, prIdPrc : opts.prIdPrc});
	}

	var getNextRooms = function (selectedRoomType, rmNo) {
		if (me.mltrmdtlO) me.dtlO = me.mltrmdtlO;
		var nRMap =  me.dtlO.rmCfg.nRMap || {};
		var uId = selectedRoomType.uId;
		return nRMap[rmNo][uId];
	}

	var populateRoomOpts = function(rmO, rmA, ctrJ, opts) {
		opts = $jQ.extend({}, {maxCnt:-1, grpByRtCd:false}, opts || {});
		var topRmA = [], rtCdGrpO = {};
		rmA = rmA.filter((rO) => {
			var isValid = true;
			$jQ.each(me.fltrOpts, function(typ, fItm) {
				if (opts.validRooms && !opts.validRooms.includes(rO.uId)) {
					isValid = false; return false;
				}
				if (!fItm.txt && !fItm.sltd && !fItm.rfsltd && (!fItm.applA || fItm.applA.length == 0)) return true;
				if (typ == 'search-rm') {
					if (fItm.txt && (rO.name.toLowerCase().indexOf(fItm.txt) < 0 && (rO.key && rO.key.join(' ').toLowerCase().indexOf(fItm.txt) < 0))) {
						isValid = false; return false;
					}
				} else if (typ == 'rm-combo') {
					if (fItm.sltd && (!rmO || !rmO.iCmb)) {
						isValid = false; return false;
					}
				} else if (typ == 'meal') {
					if (fItm.applA.indexOf(rO.mp) < 0) {
						isValid = false; return false;
					}
				} else if (typ == 'refundable') {
					if (fItm.rfsltd && (rO.isNR || (!rO.isNR && !rO.xpSmry))) {
						isValid = false; return false;
					}
				}
			});
			if (isValid && opts.grpByRtCd && rO.rtcd && !rtCdGrpO[rO.rtcd]) {
				rtCdGrpO[rO.rtcd] = true; topRmA.push(rO);
				return false;
			}
			return isValid;
		});

		if (topRmA.length > 0) {
			rmA = topRmA.concat(rmA);
			if (opts.maxCnt <= 0 || opts.maxCnt < topRmA.length) {
				opts.maxCnt = topRmA.length;
			}
		}

		var rCnt = 0, isAddMore = false, rCntInMr = 0, rCtrJ = ctrJ;
		$jQ.each(rmA, function(i, rO) {
			rCnt++;
			if (opts.maxCnt > 0 && rCnt == opts.maxCnt + 1) {
				isAddMore = true;
				rCtrJ = $jQ('<div class="rmOptsMore hide">').appendTo(ctrJ);
			}
			if (isAddMore) rCntInMr++;
			var priceDiff = rO.prD, opriceDiff = rO.oprD;

			// In the package flow, the price for each room type is displayed as the price difference for each room type (room 1 to n)
			// by comparing it with the lowest priced room type within its respective room

			// The price difference is computed as the difference between the current room type's price (rO.pr) and the lowest
			// price of its room.
			if (!me.hSel.opts.prHtlSrch && opts.isMultiRmType && opts.shwPrcDiff && me.lwtPrcArr[opts.hId] && me.lwtPrcArr[opts.hId][opts.rmNo]) {
				priceDiff = rO.absPrc - me.lwtPrcArr[opts.hId][opts.rmNo];
				var sign = (priceDiff >= 0) ? "+ " : "- "
				priceDiff = sign + ' ' + rO.cur + ' ' + Math.abs(priceDiff).toLocaleString();
				opriceDiff = null;
			}
			if (me.hSel.opts.prHtlSrch && rO.isRmWSrch && me.fltrOpts['adv-srch']) me.fltrOpts['adv-srch']['isAvl'] = true;

			var optJ = $jQ(`<div class="rmOptItm">
					<div class="rmOptDtl">
						<div class="name">${rO.name}${rO.splTxtA ? `<span class="qttipB iconP iconP-inf mrgnL10" title="${rO.splTxtA.join('<br>')}"></span>`: ``}${rO.isTxfrInc ? `<span class="alabel alabel-info alabel--sm mrgnL10">${JS_UTIL.getTranslated("Transfers_Included")}</span>`: ``}${rO.selected ? `<span class="alabel alabel-success alabel--sm mrgnL10">${JS_UTIL.getTranslated("selected")}</span>`: ``}</div>
						${rO.mlD ? `<div class="meals">${rO.mlD}</div>`: ``}
						${rO.key && rO.key.length > 0 ? `<div class="desc">${rO.key.length <= 3 ? `${rO.key.join(', ')}`: `<ul>${rO.key.map((k) => `<li>${k}</li>`).join('')}</ul>`}</div>`: ``}
						${rO.iOnRq ? `<div class="padSmT"><span class="alabel alabel-important alabel--sm qttipB" title="Availability and price will be confirmed within 48 hours of the booking. If not available or available at a higher price, option will be provided to choose an alternate or cancel the on request stay.">On Request<i class="icon-iconP-inf mrgnL10"></i></span></div>`: ``}
						${rO.offrA ? `${rO.offrA.map((offrO) => `<div class="offr">
								<span class="offrTxt"><i class="icon-Star-Cirlcle"></i>${offrO.tn}</span> ${offrO.ttl}${offrO.tmA ? `<span class="offrTms qttipB" title="<ul class='blt'><li>${offrO.tmA.join('</li><li>')}</li></ul>">Terms</span>`: ``}
							</div>`).join('')}`: ``}
						${rO.xpSmry ? `<div class="rmXclP ${rO.isNR ? 'rmXclPNR': ''}"><span class="qttipB" title="${rO.xpDtlA.join('<br>')}">${rO.xpSmry}</span></div>`: ``}
						${rO.rtInf ? `<div class="rtInf"><span class="alabel alabel-info alabel--xs">${rO.rtInf}</span></div>`: ``}
					</div>
					<div class="rmOptPrcCtr">
						${opriceDiff ? `<div class="oprD">${opriceDiff}</div>`: ``}
						<div class="prcD">${priceDiff}</div>
						<div class="prcQ">${JS_UTIL.getTranslated(rO.prQ)}</div>
						${rO.nprD ? `<div class="cmsD" title="Net price"><span>${rO.nprD}</span></div>`: (rO.cmsD ? `<div class="cmsD" title="Total ${me.dtlO.cmsTxt}"><span>${rO.cmsD}</span></div>`: ``)}
						<div class="rmOptActCtr"><a href="#" id="rmOptActCtr" class="ui-button ui-button-smpl ui-button--sm">${JS_UTIL.getTranslated("select")}</a><div class ="selected"><span>${JS_UTIL.getTranslated("selected")}</span></div></div>
						${rO.cbeD || rO.cbrD ? `<div class="cbkInfCtr">${rO.cbeD ? `<div class="cbkTxt">${me.dtlO.cbeTxt} ${rO.cbeD}</div>`: ``}${rO.cbrD ? `<div class="cbkTxt">${me.dtlO.cbrTxt} ${rO.cbrD}</div>`: ``}</div>`: ``}
						${rO.vchCd ? `<div class="blkTxt">${rO.vchCd} coupon applied</div>`: ``}
						${rO.iBlkAvl ? `<div class="blkTxt">${me.dtlO.blkTxt ? me.dtlO.blkTxt: JS_UTIL.getTranslated('Block_pay_later')}</div>`: ``}
					</div>
				</div>`).data('hotel-id', opts.hId).data('room-opt', rO).data('room-no', opts.rmNo).data('room-idx', rCnt).data('rmWise-srch', rO.isRmWSrch).appendTo(rCtrJ);
			optJ.find('#rmOptActCtr').click(function (){
				var rmOptItem = $jQ(this).closest('.rmOptItm');
				var hId = rmOptItem.data('hotel-id');
				var rmNo = rmOptItem.data('room-no');
				var rO = rmOptItem.data('room-opt');
				var isRmWSrch = rmOptItem.data('rmWise-srch');
				if (me.hSel.origSrchO && me.hSel.origSrchO.paxes.rooms.length == 1) {
					me.prIds.splice(rmNo, me.prIds.length, rO.prId);
					me.cntToBook(this);
					return false;
				}
				if (rmNo == 0) {
					me.isRmWSrch = isRmWSrch;
					if(!isRmWSrch) me.advSrch = isRmWSrch;
				}
				if (me.dtlO.rmCfg && me.dtlO.rmCfg.isMultiRmType || me.hSel.hSrchBx.roomSrch) {
					me.lwtPrcArr[hId] = me.lwtPrcArr[hId] || {}
					me.lwtPrcArr[hId][rmNo] = rO.absPrc;
					selectRoom(rmOptItem, rmNo, undefined, {hId: hId, shwPrcDiff: opts.shwPrcDiff, prIdPrc: opts.prIdPrc, selectedPrIds : opts.selectedPrIds, prcEncKey : opts.prcEncKey, roomSrch : isRmWSrch});
					
				} else {
					me.prIds.splice(rmNo, me.prIds.length, rO.prId);
					me.cntToBook(this);
				}
				JS_UTIL.scrollTo($jQ(`.rm-${rmNo}`), 200, {offset:-200});
				return false;
			})
			if (rCnt >= 200) return false;

		});
		if (isAddMore) {
			var mrJ = $jQ(`<div class="rmOptsMrActCtr"><a href="#" class="ui-button ui-button-smpl ui-button--sm">Show ${rCntInMr} more</a></div>`).appendTo(ctrJ);
			$jQ('a', mrJ).click(function() {
				var mrCtrJ = $jQ('.rmOptsMore', ctrJ);
				mrCtrJ.toggleClass('hide');
				$jQ(this).text(mrCtrJ.hasClass('hide') ? `Show ${rCntInMr} more`: `Show less`)
				return false;
			});
		}
		return rCnt;
	}
	
	var displayPrice = function(ctrJ) {
		let priceDiff = 0;
		if ($jQ(".slctd-rm .rmOptPrcCtr .prcD", ctrJ).length >= me.prIds.length) {
			$jQ(".slctd-rm .rmOptPrcCtr .prcD", ctrJ).each(function(i, obj){
				let prc = obj.innerText.replace(/^\D+/g, '');
				if (prc.length > 0) {
					sign = obj.innerText.charAt(0);
					if (sign != "-") priceDiff += parseInt(prc.replace(",", ""));
					else priceDiff -= parseInt(prc.replace(",", ""));
				}
			});
		} else {
			priceDiff = me.prcArr.reduce((currentSum, currentValue) => currentSum + currentValue, 0);
		}
		
		priceDiff = Math.abs(priceDiff);
		$jQ('.ttlPrc .prc', me.dtlOptsCtrJ).html(`${!me.hSel.opts.prHtlSrch && opts.shwPrcDiff ? sign : ''} ${me.dtlO.roptA ? me.dtlO.roptA[0].cur : me.dtlO.rmA[0].roptA[0].cur} ${priceDiff.toLocaleString()}`);
		$jQ('.ttlPrc .txt', me.dtlOptsCtrJ).html('Total Price');
		$jQ('.htlRmBk', me.dtlOptsCtrJ).show();	
	}

	var selectRoom = function (rmOptItem, rmNo, ctrJ, opts) {
		opts = opts || {}
		if (!rmOptItem || rmOptItem.length <= 0) {
			return;
		}
		var rO = rmOptItem.data('room-opt');
		// Remove all the selections of the rooms after this and add the selection of this room
		me.prIds.splice(rmNo, me.prIds.length, rO.prId);
		me.prcArr.splice(rmNo, me.prcArr.length, rO.absPrc);
		
		ctrJ = ctrJ || me.dtlOptsCtrJ;
		// changing the select option to selected
		$jQ(`.rm-${rmNo} .rmOptActCtr .selected`, ctrJ).hide();
		$jQ(`.rm-${rmNo} .rmOptActCtr a`, ctrJ).show();
		rmOptItem.find('.rmOptActCtr a').hide();
		rmOptItem.find('.selected').show();
		showSelectedRoom(rmNo, rmOptItem, ctrJ);
		if (opts.roomSrch) {
			me.hSel.hSrchBx.roomSrch = true;
			let totalRmCount = parseInt(me.hSel.hSrchBx.getQueryJSON().paxes.rooms.length);
			if (parseInt(rmNo) < totalRmCount -1) {
				me.hSel.hSrchBx.srchRmIdx = parseInt(rmNo);
				me.hSel.hSrchBx.roomIds = rmNo ?  me.hSel.hSrchBx.roomIds : [];
				me.hSel.hSrchBx.roomIds[rmNo] = rO.prId;
				if (me.advSrch) {
					me.hSel.hSrchBx.searchRoom(rmNo + 1);
				} else {
					showNextRooms(rO, rmNo, ctrJ, opts);
				}
				return false;
			} else {
				displayPrice(ctrJ);
			}
		} else {
			me.hSel.hSrchBx.roomSrch = false;
			showNextRooms(rO, rmNo, ctrJ, opts);
		}
	}
	var showSelectedRoom = function (rmNo, rmOptItem, ctrJ) {
		$jQ(`.rm-${rmNo} .rms-lst`, ctrJ).addClass('hide');
		var selectedRoom = $jQ(`.rm-${rmNo} .slctd-rm`, ctrJ).empty();
		var rmItm = $jQ(rmOptItem).closest('.rm-itm').clone();
		rmItm.find('.rm--nm').remove();
		rmItm.find('.rm-prc-opts').empty().append(rmOptItem.clone());
		$jQ(selectedRoom).append(rmItm).show();
		$jQ(`.rm-${rmNo} .rm-header a`, ctrJ).removeClass('hide').text(JS_UTIL.getTranslated("Change_Rooms"));
	}

	this.init();
}

function HotelResults(hSel, rsltCtr) {
	var me = this; me.hSel = hSel; me.rsltCtr = rsltCtr; me.srchO = null;
	me.htls = []; me.htlKeys = {}; me.fltdHtls = []; me.isMapMode = false;

	this.init = function() {
		me.rsltLstCtr = $jQ(".hRsltLst", me.rsltCtr);
		me.rsltMapCtr = $jQ(".hRsltMap", me.rsltCtr);
		me.rsltFltrCtr = $jQ(".htlFltrsCtr", me.rsltCtr);
		me.rsltSortCtr = $jQ(".htlSortCtr", me.rsltCtr);
		me.rsltFltrApplCtr = $jQ(".hFltrApplCtr", me.rsltCtr);
		me.rsltTlbrCtr = $jQ(".hRsltTlbr", me.rsltCtr);
		me.rsltFltrOpnActCtr = $jQ(".hFltrOpnActCtr", me.rsltTlbrCtr);
		me.rsltSdSctCtr = $jQ(".hRsltSdSct", me.rsltCtr);
		me.rsltOvlyCtr = $jQ(".hRsltSdSctOvly", me.rsltCtr);
		me.rsltTlbrScCtr = $jQ(".hRsltTlbrSec", me.rsltCtr);

		me.rsltFltrOpnActCtr.click(function() {
			me.rsltCtr.addClass('hSrchRslt-fopen');
			return false;
		});
		me.rsltOvlyCtr.click(function() {
			me.rsltCtr.removeClass('hSrchRslt-fopen');
			return false;
		});
	}
	this.onWindowScroll = function() {
		if (!me.hFltrs || !me.hFltrs.fltrApplyJ) {return;}
		var wH = $jQ(window).height(), wST = $jQ(window).scrollTop();
		var fH = me.rsltFltrCtr.outerHeight(), fST = me.rsltFltrCtr.offset().top;
		var loc = wH - (fST - wST);
		if (me.rsltSdSctCtr.css('position') == 'fixed') {
			me.hFltrs.fltrApplyJ.css('top', (loc - me.hFltrs.fltrApplyJ.outerHeight()) + 'px');
			return;
		}
		if (loc < 350 || loc > fH) {
			return;
		}
		me.hFltrs.fltrApplyJ.css('top', (loc - me.hFltrs.fltrApplyJ.outerHeight()) + 'px');
	}
	this.clear = function() {
		me.htls = []; me.htlKeys = {}; me.fltdHtls = [];
		me.rsltO = null; me.hFltrs = null; me.isMapMode = false;
	}
	this.hasResults = function() {
		return !!me.rsltO;
	}
	this.setResults = function(rsltO, opts) {
		me.htls = []; me.htlKeys = {}; me.fltdHtls = [];
		me.rsltO = rsltO;
		if (!me.hFltrs || !opts || !opts.isFltr) {
			me.hFltrs = new HotelFilters(me.hSel, me);
		}

		if (!rsltO || !rsltO.rsltA) return;

		me.srchO = rsltO.srchO;
		if(!opts.prcEncKey) opts.prcEncKey = 0;
		$jQ.extend(me.hSel.opts || {}, {prcEncKey : opts.prcEncKey, selectedPrIds : opts.selectedPrIds, prIdPrc : opts.prIdPrc});
		me.hSel.opts.srhotels = me.srchO.srhotels;
		$jQ.each(rsltO.rsltA, function(i, hO) {
			var hItm = new HotelResultItem(me.hSel, me, i, hO);
			me.htls.push(hItm); me.htlKeys[hO.id] = hItm;
		});
	}
	this.showResults = function(opts) {
		opts = $jQ.extend({}, {resetFltr:false}, opts || {});
		me.hSel.setupScrollEvent();
		if (opts.resetFltr) {
			// me.hFltrs.resetApplied();
		}

		if (!opts.fltrClbk) {
			opts.fltrClbk = function(sltdO, _opts) {
				if (sltdO && sltdO.isSort) {
					me.showResults(opts);
					return;
				}
				opts.isFltr = true;
				if (_opts && _opts.ovFltPrms) opts.ovFltPrms = _opts.ovFltPrms;
				me.hSel.fetchResults(null, opts);
			}
		}

		me.rsltOvlyCtr.click();
		me.filter();
		me.sort(me.hSel.curSort.fld, me.hSel.curSort.asc);

		me.renderResultsFilters(opts);
		// me.renderResultsToolbar(opts);

		me.hSel.ctrJ.toggleClass('htlSrchOnMap', me.isMapMode);
		me.rsltLstCtr.html('').toggleClass('hide', me.isMapMode && me.fltdHtls.length > 0);
		if (me.rsltO.cdrGpsO) {
			me.rsltCtr.addClass('hSrchRsltCrtMd');

			var cdrLstJ = $jQ('<div class="hRsltCdrGrpTags"></div>');
			$jQ.each(me.rsltO.cdrGpsO.idA, function(i, cdrId) {
				var cdrO = me.rsltO.cdrGpsO[cdrId];
				var cdrJ = $jQ(`<div class="hRsltCdLst hRsltCdrGrp htlCdrGrp${cdrO.id}">
						<h3 class="grp--ttl">${cdrO.nm}</h3>
					</div>`);

				var hCnt = 0;	
				$jQ.each(cdrO.hIdA, function(j, hId) {
					var hItm = me.htlKeys[hId];
					if (!hItm) return true;
					cdrJ.append(hItm.getNode().clone(true).attr('data-hotel-id', hItm.hO.id));
					hCnt++;
				});
				if (hCnt == 0) {
					return true;
				}

				me.rsltLstCtr.append(cdrJ);
				cdrLstJ.append(`<div class="hRsltCdrGrpTagItm"><a href="#" data-cdr-id="${cdrO.id}">${cdrO.nm}</a></div>`);
			});

			if (me.hSel.opts.isAllowHotelLookup) cdrLstJ.append(`<div class="hRsltCdrGrpTagItm"><a href="#" data-cdr-id="">View all hotels</a></div>`);

			me.rsltLstCtr.prepend(cdrLstJ);
			$jQ('a', cdrLstJ).click(function() {
				var cdrId = $jQ(this).attr('data-cdr-id');
				if (!cdrId) {
					if (opts && opts.fltrClbk) {
						me.rsltCtr.removeClass('hSrchRsltCrtMd');
						me.hSel.opts.isByAreaMode = false;
						me.hSel.opts.isCdrGroupMode = false;
						opts.fltrClbk();
					}
					return false;
				}

				JS_UTIL.scrollTo($jQ('.htlCdrGrp'+cdrId, me.rsltLstCtr), 200, {offset:-30});
				return false;
			});

			if (me.hSel.opts.isAllowHotelLookup) {
				me.rsltLstCtr.append($jQ(`'<div class="hViewAllCtr"><a href="#" class="ui-button ui-button-sec">View All Hotels</a></div>`).click(function() {
					if (opts && opts.fltrClbk) {
						me.rsltCtr.removeClass('hSrchRsltCrtMd');
						me.hSel.opts.isByAreaMode = false;
						me.hSel.opts.isCdrGroupMode = false;
						opts.fltrClbk();
					}
					return false;
				}));
			}
		} else if (me.rsltO.mnAreaA) {
			me.rsltCtr.addClass('hSrchRsltCrtMd');

			var tabsJ = $jQ('<ul class="hRsltTabs"></ul>');
			var mapCntJ = $jQ(`<div class="hRsltTabCnt hRsltTabCntMap">
					<div class="ctyArsSct">
						<div class="arMapCtr"><div class="ctyArMap"></div></div>
						<div class="arLstCtr">
							<div class="arLstHd">Main Areas</div>
							<div class="areaLst"></div>
						</div>
					</div>
				</div>`);

			me.rsltLstCtr.append(tabsJ);
			me.rsltLstCtr.append(mapCntJ);

			var ctyArMap = new TFMap($jQ('.ctyArMap', mapCntJ), {map:{height:400}});
			var mapArLstJ = $jQ('.areaLst', mapCntJ), arOnMapA = [];
			$jQ.each(me.rsltO.mnAreaA, function(i, arDstO) {
				var arCntJ = $jQ(`<div class="hRsltTabCnt hRsltTabCnt${arDstO.id}">
						${arDstO.dsc ? `<div class="cnt--dsc">${arDstO.dsc}</div>`: ``}
						${arDstO.whyA && arDstO.whyA.length > 0 ? `<div class="cnt--dsc cnt--why"><ul class="nmlBlt">${arDstO.whyA.map((why) => `<li>${why}</li>`).join('')}</ul></div>`: ``}
						<div class="hRsltCdLst"></div>
					</div>`);

				var arSmryJ = $jQ(`<div class="areaItm" data-area="${arDstO.id}">
						<div class="area--ttl">${arDstO.nm}</div>
						${arDstO.whyA && arDstO.whyA.length > 0 ? `<div class="area--dsc"><ul class="nmlBlt">${arDstO.whyA.map((why) => `<li>${why}</li>`).join('')}</ul></div>`: `${arDstO.dsc ? `<div class="area--dsc">${arDstO.dsc}</div>`: ``}`}
						${arDstO.hasSltdHtl ? `<div class="area--curhtl">Current hotel is in this area</div>`: ``}
					</div>`).appendTo(mapArLstJ);
				arSmryJ.click(function() {
					if (!arDstO._mrkr) return false;
					if (arSmryJ.hasClass('areaItm-sltd')) {
						arSmryJ.removeClass('areaItm-sltd')
						ctyArMap.autoZoomVisibleMarkers(11);
					} else {
						arSmryJ.addClass('areaItm-sltd').siblings().removeClass('areaItm-sltd');
						ctyArMap.setCenterOnMarkerAndZoom(arDstO._mrkr);
					}
					return false;
				});

				arOnMapA.push(arDstO);
				var hCnt = 0, arHtlLstJ = $jQ('.hRsltCdLst', arCntJ);
				$jQ.each(arDstO.hIdA, function(j, hId) {
					var hItm = me.htlKeys[hId];
					if (!hItm) return true;
					arHtlLstJ.append(hItm.getNode().clone(true).attr('data-hotel-id', hItm.hO.id));
					hCnt++;
				});
				if (hCnt == 0) {
					return true;
				}

				if (me.hSel.opts.isAllowHotelLookup) {
					arCntJ.append($jQ(`'<div class="hViewAllCtr"><a href="#" class="ui-button ui-button-sec">View All Hotels</a></div>`).click(function() {
						if (opts && opts.fltrClbk) {
							me.rsltCtr.removeClass('hSrchRsltCrtMd');
							me.hSel.opts.isCdrGroupMode = false;
							me.hSel.opts.isByAreaMode = false;
							opts.fltrClbk(null, {ovFltPrms:arDstO.fltPrms});
						}
						return false;
					}));
				}

				me.rsltLstCtr.append(arCntJ);
				$jQ(`<li class="htlTab" data-tab="${arDstO.id}">${arDstO.nm}</li>`).appendTo(tabsJ);

				arSmryJ.addClass('areaItm-wcnt').append(`<div class="arVwHtlActCtr u_alignR mrgn10T"><a href="#" class="ui-button ui-button-smpl ui-button--sm arHtlsAct">View Hotels</a></div>`);
				$jQ('.arHtlsAct', arSmryJ).click(function() {
					$jQ('li[data-tab="'+arDstO.id+'"]', tabsJ).click();
					return false;
				});
			});

			$jQ(`<li class="htlTab" data-tab="Map">Map</li>`).prependTo(tabsJ);

			$jQ('li', tabsJ).click(function() {
				var tabJ = $jQ(this), attr = tabJ.attr('data-tab');
				tabJ.addClass('htlTab-sltd').siblings().removeClass('htlTab-sltd');
				$jQ('.hRsltTabCnt', me.rsltLstCtr).addClass('hide').filter('.hRsltTabCnt'+attr).removeClass('hide');
				return false;
			}).filter(':first').click();

			ctyArMap.initialize(function() {
				$jQ.each(arOnMapA, function(i, arDstO) {
					arDstO.staticLabel = arDstO.nm;
					var arMrkr = ctyArMap.createCustomMarker(arDstO.id, arDstO, '', {showFIcon:false, showLblOnMO:false, clkClbk:function() {
						var arJ = $jQ('.areaItm', mapArLstJ).removeClass('areaItm-sltd').filter('[data-area="'+arDstO.id+'"]').addClass('areaItm-sltd');
						$jQ('.arLstCtr', mapCntJ).scrollTo(arJ, 200);
					}});
					arMrkr.setVisible(true);
					arDstO._mrkr = arMrkr;
				});

				ctyArMap.autoZoomVisibleMarkers(11);
			});

			if (me.hSel.opts.isAllowHotelLookup) {
				mapCntJ.append($jQ(`'<div class="hViewAllCtr"><a href="#" class="ui-button ui-button-sec">View All Hotels</a></div>`).click(function() {
					if (opts && opts.fltrClbk) {
						me.rsltCtr.removeClass('hSrchRsltCrtMd');
						me.hSel.opts.isCdrGroupMode = false;
						me.hSel.opts.isByAreaMode = false;
						opts.fltrClbk();
					}
					return false;
				}));
			}
			
		} else {
			me.rsltCtr.removeClass('hSrchRsltCrtMd');
			me.hSel.opts.isCdrGroupMode = false;
			me.hSel.opts.isByAreaMode = false;
			me.rsltCtr.toggleClass('hSrchRsltCdVw hRsltCdLst', (me.srchO && !!me.srchO.srhotels) || !!me.rsltO.isRstPkgCty);

			$jQ.each(me.fltdHtls, function(i, hItm) {
				me.rsltLstCtr.append(hItm.getNode().clone(true).attr('data-hotel-id', hItm.hO.id));
			});

			if (me.hSel.opts.isAllowHotelLookup && me.srchO && !!me.srchO.srhotels) {
				me.rsltLstCtr.append($jQ(`'<div class="hViewAllCtr"><a href="#" class="ui-button ui-button-sec">View All Hotels</a></div>`).click(function() {
					if (opts && opts.fltrClbk) {
						me.rsltCtr.removeClass('hSrchRsltCrtMd');
						me.srchO.srhotels = false;
						opts.fltrClbk();
					}
					return false;
				}));
			}
		}
		if (me.fltdHtls.length == 0) {
			me.rsltLstCtr.append(`<div class="hRsltMsgCtr">${JS_UTIL.getTranslated('No_matching_results')}</div>`);
		}

		if (me.isMapMode) {
			me.rsltMapCtr.removeClass('hide');
			if (!me.hSel.htlMap) {
				me.hSel.htlMap = new TFMap(me.rsltMapCtr, {map:{height:400}});
				me.hSel.htlMap.initialize(function() {
					me.showResultsOnMap(opts);
				});
			} else {
				me.showResultsOnMap(opts);
			}
		} else {
			me.rsltMapCtr.addClass('hide');
		}

		JS_UTIL.scrollTo(me.rsltCtr, 200, {offset:-50});
	}
	this.showResultsOnMap = function(opts) {
		me.hSel.htlMap.clearMarkersWithType('CUSTOM');
		me.hSel.htlMap.closeInfoBox();

		$jQ.each(me.fltdHtls, function(i, hItm) {
			var mrkr = hItm.getMarker(opts);
			if (!mrkr) return true;
			mrkr.setVisible(true);
		});
		me.hSel.htlMap.autoZoomVisibleMarkers();
	}
	this.renderResultsFilters = function(opts) {
		me.hFltrs.renderFilters(me.rsltO, opts);

		var vwMdJ = null;
		if (me.isMapMode) {
			vwMdJ = $jQ('<a href="#" class="ui-button ui-button-smpl ui-button--sm ui-button--ic"><i class="icon-iconP-lst1"></i>' + JS_UTIL.getTranslated("View_as_List") + '</a>').click(function() {
				me.isMapMode = false; me.showResults(opts);
				return false;
			});
		} else {
			vwMdJ = $jQ('<a href="#" class="ui-button ui-button-smpl ui-button--sm ui-button--ic"><i class="icon-iconP-map"></i>' + JS_UTIL.getTranslated("View_on_Map") + '</a>').click(function() {
				me.isMapMode = true; me.showResults(opts);
				return false;
			});
		}
		$jQ('.hRsltVwMd', me.rsltTlbrScCtr).html(vwMdJ);
		if (me.rsltO && (me.rsltO.isShwCms || me.rsltO.isShwNet)) {
			$jQ(`<a href="#" class="ui-button ui-button-smpl ui-button--sm mrgnL10">${me.rsltO.isShwCms ? `Show ${me.rsltO.cmsTxt}`: 'Show Net'}</a>`).click(function() {
				me.rsltCtr.toggleClass('showHtlInctv'); return false;
			}).appendTo($jQ('.hRsltVwMd', me.rsltTlbrScCtr));
		}

		if (me.hSel.opts.isAllowNoStay && me.hSel.opts.isPkgCfgMode) {
			var noStayAct = $jQ('<a href="#" class="ui-button ui-button-smpl ui-button--sm ui-button--ic"><i class="icon-iconP-clsd"></i>' + JS_UTIL.getTranslated("No_stay_required") + '</a>').click(function() {
				if (me.hSel.opts.rmSlctClbk) me.hSel.opts.rmSlctClbk(-1);
				return false;
			});
			$jQ('.hRsltNotRqd', me.rsltTlbrScCtr).show().html(noStayAct);
		}
	}
	this.filter = function() {
		me.fltdHtls = [];
		$jQ.each(me.htls, function(i, htlItm) {
			me.fltdHtls.push(htlItm);
		});
	}
	this.sort = function(srtKey, asc) {
		return me.fltdHtls.sort(function(h1, h2) {
			if (srtKey == 'nm') return h1.sorts[srtKey].localeCompare(h2.sorts[srtKey]) * (asc ? 1: -1);
			return (h1.sorts[srtKey] - h2.sorts[srtKey]) * (asc ? 1: -1);
		});
	}

	this.init();
}

function HotelResultItem(hSel, hRslt, idx, hO) {
	var me = this; this.hO = hO; this.hRslt = hRslt; this.hSel = hSel;

	this.init = function() {
		me.sorts = {rscr:idx, st: me.hO.st, prc: me.hO.opr ? me.hO.opr: me.hO.pr, nm:me.hO.nm};
		me.makeHTML();
	}
	
	this.makeHTML = function() {
		me.node = $jQ('#htlRsltItmTpl').clone().attr('id', '').data('htl', me.hO.id);
		$jQ('.htl-pic-ctr', me.node).css('backgroundImage', 'url(' + (me.hO.img ? me.hO.img: '//cdn.yourholiday.me/static/img/noimage.jpg') + ')');
		if (me.hO.iPfd) me.node.prepend(`<div class="rbnTxt">${JS_UTIL.getTranslated('Preferred')}</div>`);

		var rtCtrJ = $jQ('.urtgCtr', me.node).html(''), hasRt = false;
		if (me.hO.urtO) {
			var rtO = me.hO.urtO;
			rtCtrJ.append(`<div class="urtg-inf"><div class="urtg--txt">${rtO.rtTxt}</div>${rtO.numRt ? `<div class="urtg--num">${rtO.numRt} ratings</div>`: ``}</div>
					<div class="urtg--rt">${rtO.rt}</div>`);
			hasRt = true;
		}
		if (me.hO.hlA || me.hO.nhA) {
			var htipsJ = $jQ('<div class="htipsCtr">');
			if (hasRt) {
				rtCtrJ.html($jQ('<div class="urtgCtr"></div>').append(rtCtrJ.html()));
			} else rtCtrJ.prepend('<div></div>');
			rtCtrJ.append(htipsJ);

			hasRt = true;
			if (me.hO.hlA) {
				htipsJ.append($jQ(`<span class="tips tips-pro qttipB">Pros</span>`).attr('title', `<ul class="nmlBlt">${me.hO.hlA.map((hl) => `<li>${hl}</li>`).join('')}</ul>`));
			}
			if (me.hO.nhA) {
				htipsJ.append($jQ(`<span class="tips tips-con qttipB">Cons</span>`).attr('title', `<ul class="nmlBlt">${me.hO.nhA.map((hl) => `<li>${hl}</li>`).join('')}</ul>`));
			}
		}
		if (!hasRt) rtCtrJ.hide();

		if(me.hO.flt){
			$jQ('.htlExpAtrb', me.node).html(`${me.hO.flt.map((flt) => `<div class="badge badge--primary-light margin-right-sm margin-bottom-sm">${flt}</div>`).join('')}`);	
		}  
		
		if(me.hO.ai_data){
			if(me.hO.ai_data.reason){
				$jQ('.htlExpAtrb', me.node).append($jQ(`<div class="flex margin-y-xs margin-top-sm">${me.hO['ai_data']['reason']}</div>`));	
			}
	    	
		    // Extract pros & cons arrays safely
		    var prosArr = me.hO['ai_data']['pros'] || [];
		    var consArr = me.hO['ai_data']['cons'] || [];
			console.log(prosArr);
			console.log(consArr);
		    // Create a container to hold both badges
	    	var hCtrJ = $jQ('<div class="flex margin-y-xs margin-top-sm"></div>');

		    // --- PROS ---
		    if (prosArr.length > 0) {
		        $jQ(`<span class="badge badge--success-light tips tips-pro qttipB">${prosArr.length} Pros</span>`)
		        .attr('title', `<ul class="nmlBlt">${prosArr.map((hl) => `<li>${hl}</li>`).join('')}</ul>`).appendTo(hCtrJ);
		    }    
	
		    // --- CONS ---
		    if (consArr.length > 0) {
		        $jQ(`<span class="badge badge--error-light margin-left-xs tips tips-pro qttipB">${consArr.length} Cons</span>`)
		        .attr('title', `<ul class="nmlBlt">${consArr.map((hl) => `<li>${hl}</li>`).join('')}</ul>`).appendTo(hCtrJ);
		        
		    }
		    if(prosArr.length > 0 || consArr.length > 0){
				$jQ('.htlExpAtrb', me.node).append(hCtrJ);	
			}
		} else $jQ('.htlExpAtrb', me.node).hide();
		
		$jQ('.name', me.node).text(me.hO.nm);
		if (me.hO.st > 0) {
			$jQ('.stars', me.node).html(`${Array(me.hO.st).fill().map((st) => `<img src="/static/images/ico/star.png">`).join('')}`);
		} else $jQ('.stars', me.node).hide();
		
		if(me.hO.ctag && Array.isArray(me.hO.ctag)){
			$jQ('.ctags', me.node).html(me.hO.ctag.map(tag => `<span class="alabel ${tag.acls}">${tag.nm}</span>`).join(''));
		} else $jQ('.ctags', me.node).hide();
		
		if (me.hO.area || me.hO.loc) {
			$jQ('.loc', me.node).text(me.hO.area ? me.hO.area: me.hO.loc);
		} else $jQ('.htl--loc', me.node).hide();

		if (me.hO.mtchT) {
			$jQ('.htl--mtch', me.node).text(me.hO.mtchT);
		} else $jQ('.htl--mtch', me.node).remove();

		if (me.hO.whyA) {
			$jQ('.htl--dsc', me.node).html(`${me.hO.whyA.length > 1 ? `<ul>${me.hO.whyA.map((why) => `<li>${why}</li>`).join('')}</ul>`: `${me.hO.whyA.join('')}`}`);
		} else $jQ('.htl--dsc', me.node).remove();

		$jQ('.rm--nm', me.node).text(me.hO.rnm);
		if (me.hO.mpN) {
			$jQ('.rm--mp', me.node).text(me.hO.mpN);
		} else {
			$jQ('.rm--mp', me.node).hide();
		}
		if (me.hO.xpSmry) {
			$jQ('.rm--xcl', me.node).html(`<span class="qttipB" title="${me.hO.xpDtlA.join('<br>')}">${me.hO.xpSmry}</span>`).addClass(me.hO.isNR ? 'rm--xcl-nr': '');
		} else $jQ('.rm--xcl', me.node).hide();

		if (me.hO.hsPromo) {
			$jQ('.rm-dtl', me.node).append(`<div class="offr"><div class="offrTxt"><i class="icon-Star-Cirlcle"></i>Special Deal</div></div>`);
		}

		if (me.hO.prD) {
			$jQ('.prcQ', me.node).html(JS_UTIL.getTranslated(me.hO.prQ));
			if (me.hO.oprD) {
				$jQ('.oprD', me.node).html(me.hO.oprD);
			} else {
				$jQ('.oprD', me.node).hide();
			}
			$jQ('.prcD', me.node).html(me.hO.prD).toggleClass('prcCut', !!me.hO.iprCut);
		} else {
			$jQ('.prcQ', me.node).addClass('notAvl').html('Not Available');
			$jQ('.prcD', me.node).hide();
			$jQ('.oprD', me.node).hide();
		}
		if (me.hO.nprD) {
			$jQ('.cmsD', me.node).html(`<span>${me.hO.nprD}</span>`).attr('title', 'Net price');
		} else if (me.hO.cmsD) {
			$jQ('.cmsD', me.node).html(`<span>${me.hO.cmsD}</span>`).attr('title', `Total ${hRslt.rsltO.cmsTxt}`);
		} else $jQ('.cmsD', me.node).remove();

		if (me.hO.prTxt) {
			$jQ('.prcMsg', me.node).html(me.hO.prTxt);
		} else $jQ('.prcMsg', me.node).remove();
	}
	this.getNode = function() {
		return me.node;
	}
	this.getMarker = function() {
		if (!me.hO.lt) return null;

		me.hO.content = $jQ(`<div class="prdMpBox htlMpBox">
				${me.hO.img ? `<div class="imgBlk"><img src="${me.hO.img}"></div>`: ``}
				<div class="dscBlk">
					<div class="ttl">${me.hO.nm}</div>
					${me.hO.st ? `<div><div class="srating rt${hO.st}"></div></div>`: ``}
					<div class="rm--nm">${me.hO.rnm}</div>
					${me.hO.mpN ? `<div class="rm--mp">${me.hO.mpN}</div>`: ``}
					${me.hO.xpSmry ? `<div class="rm--xcl ${me.hO.isNR ? 'rm--xcl-nr': ''}">${me.hO.xpSmry}</div>`: ``}
				</div>
				<div class="extInfB">
					<div class="prcCtr">
						${me.hO.oprD ? `<div class="oprD">${me.hO.oprD}</div>`: ``}
						<div class="prcD">${me.hO.prD}</div>
						<div class="prcQ">${JS_UTIL.getTranslated(me.hO.prQ)}</div>
					</div>
					<div class="actCtr">
						<a href="#" class="ui-button ui-button-smpl ui-button--sm">${JS_UTIL.getTranslated("Details")}</a>
					</div>
				</div>
			</div>`);
		$jQ('.actCtr a', me.hO.content).click(function() {
			me.hSel.loadHotelDetails(me.hO.id, {htlUrl:me.hO.url, isOpenTab:me.hSel.opts.prHtlSrch});
			return false;
		});
		me.mrkr = me.hSel.htlMap.createCustomMarker(me.hO.id, me.hO, '', {showLblOnMO:false, isHTML:true, text:me.hO.prD});
	}

	this.init();
}

function HotelFilters(hSel, hRslt) {
	var me = this; this.hSel = hSel; this.hRslt = hRslt;
	this.fltsApplO = {}; this.applFltrA = [];

	this.renderFilters = function(rsltO, opts) {
		if (!rsltO.fltrs) {
			return;
		}

		me.fltsApplO = {}; me.applFltrA = [];

		var fltrsJ = $jQ('<div class="fltrsLst"></div>');
		$jQ.each(rsltO.fltrs.fltrA, function(i, fltrFld) {
			var fltrO = rsltO.fltrs[fltrFld];
			if (!fltrO || !fltrO.shw) return true;
			var fJ = me.getFilterHTM(fltrO, opts);
			fltrsJ.append(fJ);
		});
		me.hRslt.rsltFltrCtr.html(fltrsJ);
		if (me.hSel.opts.blkFltrSelect) {
			me.hRslt.rsltFltrCtr.removeClass('htlFltrsChg');
			me.fltrApplyJ = $jQ(`<div class="fltrsApply">
					<a href="#" class="ui-button ui-button-sec">${JS_UTIL.getTranslated('Apply_Filters')}</a>
				</div>`).appendTo(me.hRslt.rsltFltrCtr);
			$jQ('a', me.fltrApplyJ).click(function() {
				if (opts && opts.fltrClbk) opts.fltrClbk();
				return false;
			});
		}

		me.hRslt.rsltFltrApplCtr.html('');
		if (rsltO.appFltrs && rsltO.appFltrs.length > 0) {
			$jQ.each(rsltO.appFltrs, function(i, applFltrO) {
				var fO = {typ:applFltrO.ft, nm:applFltrO.fn, fld:applFltrO.fd}, fOpt = {nm:applFltrO.d, val:applFltrO.v};
				var afJ = $jQ(`<div class="fltrApplItm">
						<span class="fltr--nm">${getFacetAppliedHTM(fO, fOpt)}</span>
						<i class="icon-iconP-rmv2"></i>
					</div>`).appendTo(me.hRslt.rsltFltrApplCtr);
				afJ.click(function() {
					me.updateAppliedFilter(fO, {val:fOpt.val});
					if (opts && opts.fltrClbk) opts.fltrClbk();
					return false;
				});

				me.updateAppliedFilter(fO, fOpt);
				me.applFltrA.push({fO:fO, fOpt:fOpt});
			});
			if (rsltO.appFltrs.length > 1) {
				var afJ = $jQ(`<div class="fltrApplClr"><a href="#">clear filters</a></div>`).appendTo(me.hRslt.rsltFltrApplCtr);
				afJ.click(function() {
					me.fltsApplO = {}; me.applFltrA = [];
					if (opts && opts.fltrClbk) opts.fltrClbk();
					return false;
				});
			}
		}
		// me.hRslt.rsltFltrApplCtr.toggleClass('hide', me.applFltrA.length == 0);
		me.hRslt.rsltSortCtr.html(me.getSortHTM(opts)).toggleClass('hide', !me.hRslt.fltdHtls || me.hRslt.fltdHtls.length <= 2);
	}
	this.getFilterHTM = function(fO, opts) {
		var fJ = null, fCtrJ = null;
		fJ = $jQ(`<div class="ddItm fltrItm-${fO.typ.toLowerCase()}">
				<label>${fO.nm}${fO.snm ? `<span class="fltrItm--sub alabel alabel-important">${fO.snm}</span>`: ``}</label>
			</div>`);
		fCtrJ = $jQ('<div class="ddMenuCtr"><div class="ddMenuArr"></div></div>').appendTo(fJ);

		if (fO.opts.length > 8) {fCtrJ = $jQ('<div class="scrlNv fnScrll">').appendTo(fCtrJ);}

		if (fO.typ == 'HOTEL_ID') {
			var oJ = $jQ(`<div class="ddMenuItm">
					<div class="fltrSrchInp"><i class="icon-Search"></i><input type="text" data-label="${fO.nm}" data-role="none"></div>
				</div>`).appendTo(fCtrJ.addClass('ddMenuACCtr'));
			if (fO.opts && fO.opts.length > 0) {
				$jQ('input', oJ).val(fO.opts[0].nm);
			}

			var htlAC = new TFAutocomplete({inpF:$jQ('input', oJ), wclass:'tt-fwidth tt-minwidth tt-nowrap', acOpts: {highlight:true},
				datasets:new TFACDataset({remote:{url:'/gen/msc/hotel-suggest'}, extraParams:{city:me.hRslt.srchO.cid, iSltrMd:true, iSlFw:true}}),
				events: {'select': function(e, item) {
					me.hSel.loadHotelDetails(item.data.id, {htlUrl:item.data.url, isOpenTab:me.hSel.opts.prHtlSrch});
					// me.updateAppliedFilter(fO, {val:item.data.id});
					// if (opts && opts.fltrClbk) opts.fltrClbk();
				}}});

		} else if (fO.typ == 'NEAR_LOCATION_GEN') {
			var oJ = $jQ(`<div class="ddMenuItm">
					<div class="fltrSrchInp"><i class="icon-Search"></i><input type="text" data-label="${fO.nm}" data-role="none"></div>
				</div>`).appendTo(fCtrJ.addClass('ddMenuACCtr'));
			if (fO.opts && fO.opts.length > 0) {
				$jQ('input', oJ).val(fO.opts[0].nm);
			}

			var pAddrAC = new PAddrAutocompleter({addrInp:$jQ('input', oJ), wclass:'tt-fwidth tt-minwidth tt-nowrap', extraParams:{ptyp:'', cid:me.hRslt.srchO.cid}, callBk:function(rspO) {
				pAddrAC.setVal(rspO.pnm ? rspO.pnm: rspO.ad1);
				me.updateAppliedFilter(fO, {val:JS_UTIL.stringifyJSON(rspO)});
				if (opts && opts.fltrClbk) opts.fltrClbk();
			}});

		} else {
			$jQ.each(fO.opts, function(i, fOpt) {
				var oJ = $jQ(`<div class="ddMenuBtn ${fOpt.appl ? 'btnSltd': ''}">
						<div class="chkbx"><div class="chkIIc"></div></div>
						${getFacetDisplayHTM(fO, fOpt)}
					</div>`);
				oJ.click(function() {
					me.updateAppliedFilter(fO, fOpt);
					if (me.hSel.opts.blkFltrSelect) {
						oJ.toggleClass('btnSltd');
						me.hRslt.rsltFltrCtr.addClass('htlFltrsChg');
						me.hRslt.onWindowScroll();
					} else if (opts && opts.fltrClbk) opts.fltrClbk();
					return false;
				});
	
				fCtrJ.append(oJ);
			});
		}

		return fJ;
	}
	var getFacetDisplayHTM = function(fO, fOpt) {
		if (fO.typ == 'STAR_RATING') {
			var st = parseInt(fOpt.val, 10);
			return `<span class="starsFltrItm">${Array(st).fill().map((st) => `<i class="icon-star-solid"></i>`).join('')}</span>`;
		}
		return fOpt.nm;
	}
	var getFacetAppliedHTM = function(fO, fOpt) {
		if (fO.typ == 'STAR_RATING') {
			var st = parseInt(fOpt.val, 10);
			return `${st} star`;
		}
		return fOpt.nm;
	}
	this.updateAppliedFilter = function(fO, fOpt) {
		var applOptA = me.fltsApplO[fO.fld];
		if (!applOptA) {
			applOptA = []; me.fltsApplO[fO.fld] = applOptA;
		}
		var idx = fOpt ? $jQ.inArray(fOpt.val, applOptA): -1;
		if (idx >= 0) {
			applOptA.splice(idx, 1);
		} else {
			if (fO.iSngl) {applOptA = []; me.fltsApplO[fO.fld] = applOptA;}
			if (fOpt) applOptA.push(fOpt.val);
		}
	}
	this.getAppliedFiltersQueryParams = function() {
		var prmsA = [];
		$jQ.each(me.fltsApplO, function(fld, applOptA) {
			$jQ.each(applOptA, function(i, applOpt) {
				var prm = {}; prm[fld+'Fltr'] = applOpt;
				prmsA.push($jQ.param(prm));
			});
		});
		return prmsA;
	}
	this.getSortHTM = function(opts) {
		var fSrtJ = $jQ('<div class="ddItm">').append(`<div class="ddBtn"><div class="btnTxt">${JS_UTIL.getTranslated("Sort")}: ${me.hSel.curSort.nm}</div><i class="icArrDn"></i></div>`);
		var fSrtCtrJ = $jQ('<div class="ddMenuCtr">').append('<div class="ddMenuArr"></div>').appendTo(fSrtJ);

		fSrtCtrJ.append(getSortOptionHTM({nm:JS_UTIL.getTranslated("Recommended"), fld:'rscr', asc:true}, opts));
		if (!me.hSel.opts.isDsbPrcSort) {
			fSrtCtrJ.append(getSortOptionHTM({nm:JS_UTIL.getTranslated("Price1"), fld:'prc', asc:true}, opts));
			fSrtCtrJ.append(getSortOptionHTM({nm:JS_UTIL.getTranslated("Price2"), fld:'prc', asc:false}, opts));
		}
		fSrtCtrJ.append(getSortOptionHTM({nm:JS_UTIL.getTranslated("Name1"), fld:'nm', asc:true}, opts));
		fSrtCtrJ.append(getSortOptionHTM({nm:JS_UTIL.getTranslated("Name2"), fld:'nm', asc:false}, opts));

		return fSrtJ;
	}
	var getSortOptionHTM = function(srtO, opts) {
		var oJ = $jQ(`<div class="ddMenuBtn"><div>${srtO.nm}</div></div>`);
		oJ.click(function() {
			me.hSel.curSort = srtO;
			if (opts && opts.fltrClbk) opts.fltrClbk({isSort:true});
			return false;
		});
		return oJ;
	}
}

function HotelSearchBox(hSel, opts) {
	var me = this; me.hSel = hSel;
	var defaults = {ctr:null, srchCallback:null, fxDt:false, ctyA:null};
	this.opts = $jQ.extend(true, {}, defaults, opts || {});
	me.isCtyRestricted = false;
	this.prevSrchO = null; this.allowSearch = true; this.alSrchTimer = null;

	this.init = function() {
		me.sbCtr = $jQ(me.opts.ctr);
		me.sbJ = me.getSBHTML();
		me.sbCtr.html(me.sbJ);

		$jQ('a.srchAct', me.sbJ).click(function() {
			var srchO = me.getQueryJSON();
			if (!me.isValid(srchO)) {alert('Please provide city and check-in date'); return false;}
			if (me.hSel.opts.isPkgCfgMode) {
				if (!me.isValidPaxChange(me.hSel.hDtlO.dtlO.srchO, srchO)) {
					return false;
				}
			}
			if (!JS_UTIL.isEqualJSON(srchO, me.prevSrchO)){
				me.allowSearch = true;
			}
			if (me.hSel.opts.isPgChgInSrch) {
				document.location.href = JS_UTIL.insAllParams('/hotels/search', me.getQueryParams(srchO));
				return;
			}
			if (me.allowSearch && me.opts.srchCallback) {
				me.prevSrchO = srchO;
				me.origSrchO = srchO;
				if (me.alSrchTimer) clearTimeout(me.alSrchTimer);
				me.alSrchTimer = setTimeout(function(){
					me.allowSearch = true;
				}, me.hSel.opts.hltSrchTout);
				me.allowSearch = false;
				if (srchO.roomSrch) {
					me.roomSrch = srchO.roomSrch;
					me.roomIds = [];
					me.searchRoom(0);
				} else {
					me.roomIds = undefined;
					me.opts.srchCallback(this);
				}
				me.hSel.updateInHistory(srchO, {isReplace:false});
			}

			return false;
			
		});
	}
	
	this.searchRoom = function(rmIdx, opts) {
		me.srchRmIdx = rmIdx;
		me.opts.srchCallback(this, opts);
	}
	
	this.clearPrevSrchO = function(){
		me.prevSrchO = null;
	}
	this.show = function(showSB) {
		me.sbCtr.toggle(showSB);
	}
	this.getSBHTML = function() {
		var sbJ = $jQ("#htlSrchBxTpl").clone().attr("id", "").show();
		if (me.opts.hasHtlAC && !me.opts.srhotels) {
			me.ctyAC = new TFAutocomplete({inpF:$jQ('input[name="city"]', sbJ), wclass:'tt-minwidth', applyChromeACFix:false, acOpts: {highlight:true},
				datasets:new TFACDataset({remote:{url:'/gen/msc/hotel-dest-suggest'}, extraParams:{incCStAr:true, flrHC:true}, oOpts:{display:function(item) {return item.data.nm}, templates:{suggestion:function(item) {
					return `<div class="arptACItm arptACItmWIc"><i class="${item.data.iht ? 'icon-iconP-htl': 'icon-iconP-loc'}"></i><div class="acCnt"><div class="ttl">${item.data.nm}</div>${item.data.rnm ? `<div class="sub">${item.data.rnm}</div>`: ``}</div></div>`;
				}}}}),
				events: {'select': function(e, item) {
					$jQ('input[name="hotelId"]', sbJ).val(item.data.iht ? item.data.id: '');
					$jQ('input[name="cityId"]', sbJ).val(item.data.iht ? '': item.data.id);
					if (item.data.iht) {me.htlO = {id:item.data.id, nm:item.data.nm}; me.ctyO = null;}
					else {me.ctyO = {id:item.data.id, nm:item.data.nm}; me.htlO = null;}
				}}});
		} else {
			let dataset = {};
			if (me.opts.srhotels && me.opts.hCfgO && me.opts.hCfgO.exCtyA) {
				dataset = {dsOpts:{local:me.opts.hCfgO.exCtyA, identify:function(rsp) {return rsp.data.id}}, oOpts:{limit:100, display:function(item) {return item.data.nm}, templates:{suggestion:function(item) {
					return `<div class="arptACItm"><div class="ttl">${item.data.nm}</div>${item.data.rnm ? `<div class="sub">${item.data.rnm}</div>`: ''}</div>`;
				}}}}
				dataset = new TFACDataset(dataset);
			} else {
				dataset = new TFACDataset({remote:{url:'/gen/msc/city-suggest'}, extraParams:{incCStAr:true, srhotels:me.srhotels}, oOpts:{display:function(item) {return item.data.nm}, templates:{suggestion:function(item) {
					return `<div class="arptACItm"><div class="ttl">${item.data.nm}</div>${item.data.rnm ? `<div class="sub">${item.data.rnm}</div>`: ``}</div>`;
				}}}});
			}
			me.ctyAC = new TFAutocomplete({inpF:$jQ('input[name="city"]', sbJ), wclass:'tt-minwidth', mclass:'tt-menu-scroll', applyChromeACFix:false, acOpts: {highlight:true,  minLength:0},
				datasets: dataset,
				events: {'select': function(e, item) {
					$jQ('input[name="hotelId"]', sbJ).val('');
					$jQ('input[name="cityId"]', sbJ).val(item.data.id);
					me.ctyO = {id:item.data.id, nm:item.data.nm};
				}}});
		}
		if (!me.opts.fxDt) {
			var dtPicker = new DatePick({fromInp:$jQ('input[name="checkinDate"]', sbJ), toInp:$jQ('input[name="checkoutDate"]', sbJ), calO:{dateFormat:'dd M yyyy'}});
		}
		var rmsSmryJ = $jQ('.htlSrchPaxInp', sbJ);
		me.roomPax = new TFRoomPax({inpF:$jQ('input[name="roomspax"]', sbJ), smryCtr:rmsSmryJ, maxRooms:parseInt(rmsSmryJ.attr('data-max-rooms'), 10)});
		return sbJ;
	}
	
	this.getQueryJSON = function() {
		var srchO = {}, numRooms = parseInt($jQ('select[name="numRooms"]', me.sbJ).val(), 10);
		if (me.ctyO) {
			srchO.cid = me.ctyO.id; srchO.cnm = me.ctyO.nm;
		}
		if (me.htlO) {
			srchO.hid = me.htlO.id; srchO.hnm = me.htlO.hnm;
		}
		var chkIn = $jQ('input[name="checkinDate"]', me.sbJ).val(), chkOut = $jQ('input[name="checkoutDate"]', me.sbJ).val();
		if (chkIn) srchO.chkIn = moment(chkIn, 'DD MMM YYYY').format('DD/MM/YYYY');
		if (chkOut) srchO.chkOut = moment(chkOut, 'DD MMM YYYY').format('DD/MM/YYYY');
		var nationJ = $jQ(':input[name=nationality]', me.sbJ);
		if (nationJ.length > 0) {
			var nationality = nationJ.val();
			if (nationality) srchO.ntn = nationality;
		}
		srchO.paxes = me.roomPax.getRooms();
		
		if (me.opts.srhotels) srchO.srhotels = me.opts.srhotels
		return srchO;
	}
	
	this.populateFields = function(srchO) {
		if (!srchO) return;
		if (srchO.hid) {
			$jQ('input[name="hotelId"]', me.sbJ).val(srchO.hid);
			$jQ('input[name="cityId"]', me.sbJ).val('');
			if(srchO.hnm){
				me.ctyAC.setVal(srchO.hnm);				
			}
			me.htlO = {id:srchO.hid, hnm:srchO.hnm};
		} else if (srchO.cid) {
			$jQ('input[name="cityId"]', me.sbJ).val(srchO.cid);
			$jQ('input[name="hotelId"]', me.sbJ).val('');
			me.ctyAC.setVal(srchO.cnm);
			me.ctyO = {id:srchO.cid, nm:srchO.cnm};
		}
		if (srchO.chkIn) {
			$jQ('input[name="checkinDate"]', me.sbJ).val(moment(srchO.chkIn, 'DD/MM/YYYY').format('DD MMM YYYY')).change();
			$jQ('input[name="checkoutDate"]', me.sbJ).val((srchO.chkOut ? moment(srchO.chkOut, 'DD/MM/YYYY'): moment(srchO.chkIn, 'DD/MM/YYYY').add(3, 'days')).format('DD MMM YYYY')).change();
		}
		var nationJ = $jQ(':input[name=nationality]', me.sbJ);
		if (srchO.ntn && nationJ.length > 0) {
			nationJ.val(srchO.ntn);
		}
		var paxes = srchO.paxes ? srchO.paxes: {rooms:[{ad:2, ch:0}]};
		me.roomPax.setRooms(paxes);
	}
	this.getQueryParams = function(srchO) {
		var prmO = {};
		if (!srchO) return prmO;
		if (srchO.srhotels) prmO.srhotels = srchO.srhotels;
		if (srchO.cid) prmO.cityId = srchO.cid;
		if (srchO.hid) prmO.hotelId = srchO.hid;
		if (srchO.chkIn) prmO.checkinDate = srchO.chkIn;
		if (srchO.chkOut) prmO.checkoutDate = srchO.chkOut;
		if (srchO.ntn) prmO.nationality = srchO.ntn;
		if (srchO.paxes && srchO.paxes.rooms) {
			prmO.roomspax = JS_UTIL.stringifyJSON(srchO.paxes);
		}
		return prmO;
	}
	this.isValid = function(srchO) {
		if (!srchO) {srchO = me.srchO;}
		if (!srchO) {return false;}
		if ((!srchO.cid && !srchO.hid) || !srchO.chkIn) {return false;}
		return true;
	}

	this.isValidPaxChange = function (prevSrchO, currentSrchO) {
		if (!prevSrchO || !currentSrchO || !prevSrchO.paxes) return false;
		var arePaxCountEqual = POCUTIL.arePaxCountEqual(prevSrchO.paxes, currentSrchO.paxes);
		if (!arePaxCountEqual) {
			var prevRooms = POCUTIL.getFlatPaxCount(prevSrchO.paxes.rooms);
			var alertStr = `Please make sure the total number of adults and children remains the same\nTotal Adults - ${prevRooms.ad}\nTotal Children - ${prevRooms.ch}`;
			if (prevRooms.ch > 0) {
				alertStr += "\nChildren Ages - " + prevRooms.chAge.join(", ");
			}
			alert(alertStr);
			return false;
		}
		return true;
	}

	this.init();
}