"use strict";(self.webpackChunk_multimediallc_cb_ts=self.webpackChunk_multimediallc_cb_ts||[]).push([[977],{9467:(t,e,a)=>{a.d(e,{HF:()=>N,t1:()=>I});var o=a(7063),s=a(5216),i=a(82),l=a(7882),r=a(7407),n=a(4947),d=a(1372),c=a(2945),h=a(9118),g=a(5079);class m extends i.b{constructor(t){super(t),this._sortFieldParam=t.sortFieldParam}get sortFieldParam(){return this._sortFieldParam}get isAscending(){return this.state.isAscending}createElement(t){return(0,d.tT)("span",{className:"sortable","data-param":t.sortFieldParam,onClick:t.onSortChange,"data-testid":t.sortFieldParam},t.text,(0,d.tT)("div",{bind:{className:()=>`sortable-arrow ${this.state.isAscending?"ascending":"descending"}${this.state.isActive?" active":""}`}}))}}class u extends i.b{createElement(t){return this.props=t,this._sortableFields=new Map,(0,d.tT)("div",{className:"headers"},(0,d.tT)("div",{className:"tag_row"},Array.from(N.HASHTAG_SORT_FIELD_MAP.keys(),(t=>{var e,a;return(0,d.tT)(m,{classRef:e=>{this._sortableFields.set(t,e)},onSortChange:()=>this.onSortChange(t),sortFieldParam:t,text:null!==(e=null===(a=N.HASHTAG_SORT_FIELD_MAP.get(t))||void 0===a?void 0:a.text)&&void 0!==e?e:"",isActive:!1,isAscending:!0})})),(0,d.tT)("span",{className:"room_thumbnails"},"Top Rooms")))}initUI(t){var e;super.initUI(t),null===(e=this.getSortableFieldByKey("ht"))||void 0===e||e.element.classList.add("tag")}resetFields(){this._sortableFields.forEach((t=>{t.setState({isAscending:!1,isActive:!1})}))}getSortableFieldByKey(t){return this._sortableFields.get(t)}onSortChange(t){const e=this._sortableFields.get(t);void 0!==e&&this.props.sortableTagTable.load({field:e.sortFieldParam,asc:e.isAscending,page:`${this.props.sortableTagTable.page}`,gender:this.props.sortableTagTable.gender,toggleSortField:!0})}}var p,T=a(2641),v=a(8423),b=a(8451),f=a(6716),w=a(8374),S=a(7321);class A extends g.kb{createElement(t){const e=t.roomInfo;return(0,d.tT)("li",{className:"tag-table-room-card",onClick:t=>this.fireRoomClick(t),onMouseOver:e=>{T.Bv.fire({...t,roomImage:this.img})},onMouseOut:t=>{T.MJ.fire({event:t,forceHide:!1})}},(0,b.HK)((0,d.tT)("a",{className:"room_link","data-roomlink":"true",href:`/${e.room}/`,"data-room":e.room},(0,d.tT)("img",{ref:t=>{this.img=t},"data-room-nav":!0,className:"room_thumb",src:(0,S.s)(e.room),loading:"lazy"}))))}}class C extends w.y{initUI(t){this.roomListProps=t,this.roomClickEvent=new v.c_("roomClick"),this.roomClickEvent.listen((t=>{f.VZ.fire(t.roomInfo.room)})),this.roomBeforeClickEvent=new v.c_("roomBeforeClick"),this.roomBeforeClickEvent.listen((e=>{this.saveRoomListSourceCookie(e,t)})),this.updateState()}createRoomCard(t){return new A(t)}createElement(){return(0,d.tT)("ul",{className:"tag-table-roomlist"})}updateFollowStars(){}bindCachedFollowStarFix(){}unbindCachedFollowStarFix(){}}class _ extends i.b{createElement(t){return(0,d.tT)("div",{className:"tag_row"},(0,d.tT)("span",{className:"tag","data-testid":"hashtag-list-item"},(0,d.tT)("a",{href:(e=t.hashtag,a=t.gender,""===e?"/tag/":`/tag/${e}/${a!==l.YT.All?`${l.hf.get(a)}/`:""}`),title:t.hashtag},"#",t.hashtag)),(0,d.tT)("span",{className:"viewers"},t.viewerCount),(0,d.tT)("span",{className:"rooms"},t.roomCount),(0,d.tT)("span",{className:"room_thumbnails"},(0,d.tT)(C,{roomListSource:"tp",animate:!1,rooms:()=>t.topRooms.slice(0,t.thumbnailLimit),sourceIndex:()=>t.hashtagIndex,hashtag:()=>t.hashtag,showLocation:t.showLocation})));var e,a}}class F extends i.b{createElement(t){return(0,d.tT)("div",{className:"tag_row placeholder"},(0,d.tT)("span",{className:"tag"},(0,d.tT)("div",null," ")),(0,d.tT)("span",{className:"viewers"},(0,d.tT)("div",null," ")),(0,d.tT)("span",{className:"rooms"},(0,d.tT)("div",null," ")),(0,d.tT)("span",{className:"room_thumbnails"},(0,d.tT)("ul",{className:"tag-table-roomlist"},Array(6).fill(0).map((()=>(0,d.tT)("li",{className:"tag-table-room-card room_thumb"}))))))}}class P extends g.kb{setImageStreamer(){}createFollowStar(t){}initUI(t){super.initUI(t),this.img.loading="eager",this.element.style.margin="0"}}class y extends i.b{createElement(t){return this.props=t,(0,d.tT)("div",{id:"tag_tip",style:{height:"175px"},onMouseOut:t=>{T.MJ.fire({event:t,forceHide:!1})},onClick:()=>T.MJ.fire({forceHide:!0})},(0,d.tT)("ul",{className:"list",ref:t=>{this.roomList=t}}))}initUI(t){super.initUI(),(0,w.L)(this.roomList,t.showLocation)}updateState(){super.updateState(),void 0!==this.roomCard&&this.removeChild(this.roomCard);const t={...this.state.roomInfo,img:(0,S.s)(this.state.roomInfo.room),location:this.props.showLocation?this.state.roomInfo.location:void 0};this.roomCard=new P({...this.state,roomInfo:t}),this.addChild(this.roomCard,this.roomList)}}const L="/tags/",I="tgsrt";class N extends i.b{createElement(t){return this.props=t,(0,d.tT)("div",{id:"tag-table-container"},(0,d.tT)("h2",{className:"no-tags-message",bind:{display:()=>{var t;return void 0===this.state.tableData||0===(null===(t=this.state.tableData)||void 0===t?void 0:t.total)?"block":"none"}}},"No tags to display."),(0,d.tT)("div",{bind:{display:()=>void 0!==this.state.tableData&&0!==this.state.tableData.total?"inline-block":"none"},id:"tag_table"},(0,d.tT)(u,{sortableTagTable:this,classRef:t=>{this.tagTableHeader=t}}),(0,d.tT)("div",{className:"tag-table-body",ref:t=>{this.tagTableBody=t}},this.createPlaceHolderRows())),(0,d.tT)("div",{id:"roomlist_pagination",bind:{display:()=>{var t;return void 0!==this.state.tableData&&0!==(null===(t=this.state.tableData)||void 0===t?void 0:t.total)?"flex":"none"}}},(0,d.tT)(h.d,{classRef:t=>{this.pagination=t},onPageChange:()=>{this.load({field:this.state.activeField,asc:this.state.activeFieldSortAsc,page:`${this.pagination.currentPage}`,gender:this.state.gender,toggleSortField:!1}),this.element.scrollIntoView()},itemsPerPage:N.TAG_PAGE_SIZE,reloadOnPageChange:!1})))}constructor(t){super(t),this.updateInProgress=!1,this.initialLoad=!0,this.state.activeField="",this.state.activeFieldSortAsc=!1,this.state.gender=l.YT.All,this.bindUpdateTagTableListeners(),this.bindTagToolTip(),this.loadTableFromExistingParams(),(0,c.KZ)(new Map([["g",""]]))}loadTableFromExistingParams(){var t;let e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0];const a=(0,c.JO)(window.location.search),o=a.sort,s=null!==(t=a.page)&&void 0!==t?t:"1",i=(0,l.Bg)();let r="",n=!1;void 0!==o&&(n=!o.startsWith("-"),r=n?o:o.slice(1)),this.load({field:r,asc:n,page:s,gender:i,toggleSortField:!1},e)}clearTagTableRows(){for(;null!==this.tagTableBody.lastChild;)this.tagTableBody.removeChild(this.tagTableBody.lastChild)}updateState(){if(super.updateState(),void 0!==this.state.tableData&&0!==this.state.tableData.total){this.clearTagTableRows();for(let t=0;t<this.state.tableData.hashtags.length;t++){const e=this.state.tableData.hashtags[t];this.addChild(new _({followed:e.followed,gender:this.state.gender,hashtagIndex:t+1,hashtag:e.hashtag,roomCount:e.roomCount,showLocation:this.props.showLocation,thumbnailLimit:12,topRooms:e.topRooms,viewerCount:e.viewerCount}),this.tagTableBody)}}}setActiveSortableField(t,e){this.tagTableHeader.resetFields();const a=this.tagTableHeader.getSortableFieldByKey(t);void 0!==a&&a.setState({isAscending:e.isAscending,isActive:e.isActive})}toggleSortField(t){var e;let a;const o=this.state.activeField===t.field,s=o&&!t.asc,i=o&&t.asc;return a=i?"":t.field,this.setActiveSortableField(a,{isAscending:s,isActive:!i}),(0,r.bT)("TagPageArrowClicked",{ArrowName:null===(e=N.HASHTAG_SORT_FIELD_MAP.get(t.field))||void 0===e?void 0:e.fieldName,ArrowDirection:i?"default":s?"ascending":"descending"}),{field:a,asc:s}}async load(t){let e=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];if(this.updateInProgress)return;this.pagination.hideElement(),this.updateInProgress=!0,this.clearTagTableRows(),this.tagTableBody.appendChild(this.createPlaceHolderRows());let a={field:t.field,asc:t.asc};t.toggleSortField?a=this.toggleSortField(t):this.setActiveSortableField(t.field,{isAscending:t.asc,isActive:!0});const o=this.state.gender!==t.gender,s=parseInt(t.page),i=this.state.page!==s,l={sort:""!==a.field?`${a.asc?"":"-"}${a.field}`:"",page:s,gender:t.gender,limit:N.TAG_PAGE_SIZE};e&&this.updateUrlWithGenderAndParams(l,!this.initialLoad&&(o||i));const r=await this.handleTagTableResponse(s,l);this.pagination.setState({totalItems:r.total,currentPage:s}),this.pagination.showElement("flex"),this.setState({tableData:r,activeField:a.field,activeFieldSortAsc:a.asc,page:s,gender:t.gender}),this.updateInProgress=!1,this.initialLoad=!1}async handleTagTableResponse(t,e){let a=await this.getApiResponse(e);return 0===a.hashtags.length&&t>h.d.calculateMaxPages(a.total,N.TAG_PAGE_SIZE)&&(this.pagination.currentPage=1,(0,c.KZ)(new Map([["page",""]])),a=await this.getApiResponse({...e,page:1})),a}async getApiResponse(t){const e=N.mapTagTableDataParamsToObject(t),a=await(0,s.Aw)(`api/ts/hashtags/tag-table-data/?${(0,c.Go)(e)}`);return function(t){var e;const a=t.getList("hashtags");return{hashtags:null!==(e=null==a?void 0:a.map((t=>{return{followed:(e=t).getBoolean("followed",!1,!1),hashtag:e.getString("hashtag"),viewerCount:e.getNumber("viewer_count"),roomCount:e.getNumber("room_count"),topRooms:null!==(a=null===(o=e.getList("top_rooms"))||void 0===o?void 0:o.map((t=>(0,g.ak)(t))))&&void 0!==a?a:[]};var e,a,o})))&&void 0!==e?e:[],total:t.getNumber("total")}}(new o.N6(a.responseText))}bindUpdateTagTableListeners(){T.d2.listen((t=>{this.load({field:this.state.activeField,asc:this.state.activeFieldSortAsc,page:"1",gender:t,toggleSortField:!1})}))}bindTagToolTip(){this.tagToolTip=new y({showLocation:this.props.showLocation}),this.addChild(this.tagToolTip),T.Bv.listen((t=>{let e;const a=t.roomImage.getBoundingClientRect(),o=Math.round(a.top+window.pageYOffset),s=Math.round(a.left+window.pageXOffset),i=getComputedStyle(this.tagToolTip.element),l=parseInt(i.height),r=parseInt(i.width);e=window.innerHeight-o+window.pageYOffset<300?-16-l:a.height+8,this.tagToolTip.element.style.left=s+a.width/2-r/2+"px",this.tagToolTip.element.style.top=`${o+e}px`,this.tagToolTip.setState(t),this.tagToolTip.showElement()})),T.MJ.listen((t=>{let e=!1;void 0!==t.event&&(e=t.event.relatedTarget===this.tagToolTip.element||this.tagToolTip.element.contains(t.event.relatedTarget)),e&&!0!==t.forceHide||this.tagToolTip.hideElement()}))}updateUrlWithGenderAndParams(t,e){let a=L;t.gender!==l.YT.All&&(a=`${L}${l.hf.get(t.gender)}/`);const o=(0,c.JO)(window.location.search);o.page=`${t.page}`,1!==t.page?o.page=`${t.page}`:delete o.page,""!==t.sort?o.sort=t.sort:delete o.sort;const i=(0,c.Go)(o),r=(0,s._Y)(`${a}${i?`?${i}`:""}`);e?window.history.pushState(void 0,"",r):window.history.replaceState(void 0,"",r),T.ol.fire()}static mapTagTableDataParamsToObject(t){return{sort:t.sort,page:`${t.page}`,g:t.gender,limit:`${t.limit}`}}createPlaceHolderRows(){return(0,d.tT)(d.FK,null,Array(10).fill(0).map((()=>(0,d.tT)(F,null))))}get page(){return this.state.page}get gender(){return this.state.gender}}(p=N).HASHTAG_SORT_FIELD_MAP=new Map([["ht",{fieldName:"hashtag",text:n.R.hashtag}],["vc",{fieldName:"viewers",text:n.R.viewers}],["rc",{fieldName:"rooms",text:n.R.rooms}]]),p.TAG_PAGE_SIZE=100},2641:(t,e,a)=>{a.d(e,{Bv:()=>i,MJ:()=>l,d2:()=>s,ol:()=>r});var o=a(8423);const s=new o.c_("updateTagTableGenderEvent"),i=new o.c_("showTagTableToolTip"),l=new o.c_("hideTagTableToolTip"),r=new o.c_("updateTagTableSortFieldEvent")},1528:(t,e,a)=>{a.d(e,{i:()=>p,m:()=>T});var o=a(8861),s=a(9467),i=a(9461),l=a(7321),r=a(2709),n=a(7407),d=a(1372),c=a(2945),h=a(3124);class g extends r.u{constructor(){super(...arguments),this.sortOptions=[["","Popular (Default)"],["rec","Recommended For You",()=>void 0!==i.Bm.current.loggedInUser],["rv","Viewers (Low to High)"],["rand","Randomized"]],this.cookieName="rlsrt",this.clickPageAction="CamSortIconClicked",this.changePageAction="CamSortIconChanged"}reload(){(0,l.tF)()}get availableSortOptions(){return this.sortOptions.filter((t=>{let[e,a,o]=t;return void 0===o||o()}))}init(){this.initElement(),this.applySortParam(),h.DQ.listen((()=>{this.selectFormElement.disabled=!0,this.selectFormElement.blur(),window.setTimeout((()=>{this.selectFormElement.disabled=!1}),100)}))}parseSortParam(t){const e=this.availableSortOptions.map((t=>{let[e]=t;return e}));let a="";if(null!==t&&e.includes(a))a=t;else if(void 0!==this.cookieName){const t=(0,o.oD)(this.cookieName);void 0!==t&&e.includes(t)&&(a=t)}return a}applySortParam(){const t=new URLSearchParams(window.location.search).get("sort"),e=this.parseSortParam(t);e!==(null!=t?t:"")&&(this.setRoomListSortCookie(e),(0,c.KZ)(new Map([["sort",e]])),this.reload()),""!==e&&this.button.classList.add("active");const a=this.element.querySelector(`option[value="${e}"]`);null!==a&&a.setAttribute("selected","selected")}setRoomListSortCookie(t){void 0!==this.cookieName&&(0,o.uC)(this.cookieName,t,{days:3})}initElement(){let t="";this.element=(0,d.tT)("div",null,(0,d.tT)("button",{className:"mobile-sorting-button",ref:t=>this.button=t},"Sort Options"),(0,d.tT)("form",{id:"mobile-sorting-form"},(0,d.tT)("select",{id:"mobile-sorting-options",ref:t=>this.selectFormElement=t,onClick:e=>{(0,n.bT)(this.clickPageAction),t=e.target.value},onChange:e=>{const a=e.target.value;(0,c.KZ)(new Map([["sort",a]])),this.setRoomListSortCookie(a),""===a?this.button.classList.remove("active"):this.button.classList.add("active"),(0,n.bT)(this.changePageAction,{option_change_from:t,option_change_to:a}),this.reload()}},this.availableSortOptions.map((t=>{let[e,a]=t;return(0,d.tT)("option",{value:e},a)})))))}}class m extends g{constructor(){super(...arguments),this.sortOptions=[["","Popular (Default)"],["-vc","Viewers (High to Low)"],["vc","Viewers (Low to High)"],["-rc","Rooms (High to Low)"],["rc","Rooms (Low to High)"],["ht","A to Z"],["-ht","Z to A"]],this.cookieName=s.t1,this.clickPageAction="TagsSortIconClicked",this.changePageAction="TagsSortIconChanged"}reload(){location.reload()}}function u(t){const e=new t;return e.init(),e.element}function p(){return u(g)}function T(){return u(m)}},3856:(t,e,a)=>{a.d(e,{t:()=>l,x:()=>i});var o=a(9466),s=a(7407);function i(){const t=document.querySelector("#mobile-hashtag-ticker .scroll-container");null!==t&&(0,o.r0)(t,(t=>{t&&(0,s.bT)("HomepageTagScrolled")}))}function l(){document.querySelectorAll(".scroll-rooms").forEach(((t,e)=>{const a=function(t,e){return a=>{var o;a||(0,s.bT)("TagRoomScrolled",{tagName:`${t.dataset.tag}`,tagOffset:`${o=t.scrollLeft,Math.round(o/87)}`,tagRank:`${e+1}`})}}(t,e);(0,o.r0)(t,a)}))}},6164:(t,e,a)=>{var o=a(4801),s=a(4184),i=a(7872),l=a(7321),r=a(8451),n=a(1528),d=a(3856),c=a(9394);(0,c.h)(class extends c.y{initMobile(){if(super.initMobile(),(0,i.cl)(),(0,d.x)(),(0,l.T1)(document.body),this.addCountryFlag(),l.HA.getInstance().addOnLoadHandler(this.addCountryFlag),null!==document.getElementById("mobile-sort-container")){const t=document.querySelector("#mobile-sort-container");null!==t&&t.appendChild((0,n.i)())}this.debounceTemplateRoomCardLinks(),l.HA.getInstance().addOnLoadHandler(this.debounceTemplateRoomCardLinks)}debounceTemplateRoomCardLinks(){document.querySelectorAll(".room_list_room a:not([href^='/tag/'])").forEach((t=>{(0,r.HK)(t,!0,6e3)}))}addCountryFlag(){document.querySelectorAll(".room_list_room span[data-country]").forEach((t=>{const{flagCode:e,flagName:a}=(0,s.BL)(t.dataset.country);var i;e&&a?t.appendChild(new o.T({component:"FlagIcon",componentProps:{countryCode:e,countryName:a}}).render()):null===(i=t.parentNode)||void 0===i||i.removeChild(t)}))}})}},t=>{var e=e=>t(t.s=e);t.O(0,[302,319],(()=>(e(4777),e(2021),e(5132),e(6164)))),t.O()}]);
//# sourceMappingURL=mobile_roomlist-prod-1e8ed04d7c736252a2eb.js.map