UNPKG

@expofp/floorplan

Version:

Interactive floor plan library for expos and events

2 lines (1 loc) 6.39 kB
import{jsx as e,jsxs as l,Fragment as I}from"react/jsx-runtime";import"./Event.scss";import c from"classnames";import g from"dateformat";import{observer as M,useLocalStore as T,useObserver as x}from"mobx-react-lite";import{useEffect as F,useRef as C,useState as y}from"react";import u from"../data";import a,{uiState as s}from"../store";import{GaEventActions as m,sendEventToGa as v}from"../tools/gtag";import O from"../tools/settings";import H from"../ui/Button";import{useReaction as j}from"../utils/mobx";import A from"../utils/sanitizeHtml";import B from"./EventBadge";import V from"./ShowMoreButton";import G from"./SidebarActions";import{getDescription as L}from"./utils/getDescription";function R(){const n=C(null),o=T(()=>({collapsed:!0,updateOverlayContent:null,get event(){return s.selectedEventItem},get booth(){return this.event?.boothId?a.boothStore.booths.find(t=>t.id===this.event.boothId):null},get disableCollapse(){return(this.event?.description||"").length<800}})),[k,D]=y(!1),[h,_]=y(!1),f=C(null);F(()=>{(()=>{if(f.current){const r=f.current.offsetHeight;D(r>300)}})()},[]),j(()=>o.event,()=>{n.current&&n.current.parentElement&&(n.current.parentElement.scrollTop=0),o.collapsed=!0,_(!1)});function q(t,r){if(b(r),s.kiosk)return t.preventDefault()}function b(t){o.event&&v(t,o.event.name)}const N=t=>{const r=a.sessionsFilterStore.state.filters.use24hFormat.value,p=new Date(t);return g(p,r?"HH:MM":"h:MMtt")},w=t=>{const r=new Date(t);return g(r,"dddd, mmmm d, yyyy")};return x(()=>{const t=o.event;if(!t)return null;const r=l(I,{children:[e("div",{className:"efp-event__bar",children:e("span",{onClick:()=>a.toggleMapOverlay(),children:l("div",{className:"efp-event__bar-name",children:[e("div",{className:"efp-event__bar-icon",children:e("i",{className:"icon-event-solid"})}),l("span",{dir:"auto",children:[t.name,e(B,{event:t})]})]})})}),e("div",{className:"efp-event__bar-booth",onClick:()=>a.toggleMapOverlay(),children:u.boothTerm})]}),p=()=>{o.collapsed=!1,setTimeout(o.updateOverlayContent)};function J(i,d){return!i||!d||s.kiosk||s.previewMode?null:e("div",{className:"event-custom-button",children:e(H,{link:d,inline:!0,onClick:E=>{E.preventDefault(),b(m.ClickCustomButton),window.open(d,"_blank","noopener,noreferrer")},target:"_blank",children:i})})}const S=c({"efp-event":!0,[s.responsiveClass]:!0});return l("div",{className:S,children:[l("div",{className:"efp-event__header",children:[l("div",{className:"efp-event__header-name",children:[e("div",{className:"efp-event__header-icon",children:e("i",{className:"icon-event-solid"})}),l("span",{dir:"auto",children:[t.name,e(B,{event:t})]})]}),e("button",{type:"button",onClick:()=>a.searchStore.handleBackAction(),className:"efp-event__header-close",children:e("i",{className:"icon-close"})})]}),e("div",{className:"efp-event__buttons",children:!s.isGuidedToursActive&&e(G,{showBookmark:!s.disableBookmarked&&!u.hideBookmarks&&!s.kiosk,showDirections:o.booth&&O.wayfinding,inBookmark:o.event?.bookmarked||!1,showShare:!0,showVisited:!s.kiosk,visited:o.event?.visited||!1,onClickBookmark:$,onClickShare:K,onClickDirections:()=>{o.booth&&a.routeStore.clickRoute(null,o.booth)},onClickVisited:z})}),l("div",{className:c("efp-event__details",{"details-hidden":s.kiosk&&k&&!h}),ref:f,children:[l("div",{className:c("efp-event-booths",{"is-links-disabled":s.isGuidedToursActive}),children:[o.booth&&l("a",{href:`?${o.booth.slug}`,onClick:i=>{i.preventDefault(),a.toggleMapOverlay(),a.selectBooth(o.booth)},className:"efp-event-booths__booth",children:[e("div",{className:"efp-event-booths__booth-name",children:o.booth.name}),o.booth.layer&&e("div",{className:"efp-event-categories__booth-level",children:u.shortLevelName?o.booth.layer.shortName:o.booth.layer.description})]}),t.hasTracks&&t.tracks.map(i=>e("div",{className:"efp-event-booths__track",children:i.name},i.id))]}),l("div",{className:"efp-event-list",children:[l("div",{className:"efp-event-list__block",children:[e("div",{className:"efp-event-list__block-icon",children:e("i",{className:"icon-event-solid"})}),e("div",{className:"efp-event-list__block-content",children:e("div",{className:"efp-event-list__block-item",children:l("div",{className:"efp-event-list__block-info",children:[e("div",{className:"efp-event-list__block-title",children:w(t.startDate)}),l("div",{className:"efp-event-list__block-description",children:[N(t.startDate)," to ",t.endDate?N(t.endDate):"-"]})]})})})]}),t.hasSpeakers&&l("div",{className:"efp-event-list__block",children:[e("div",{className:"efp-event-list__block-icon",children:e("i",{className:"icon-speaker-solid"})}),e("div",{className:"efp-event-list__block-content",children:t.speakers.map(i=>l("a",{href:`?${i.slug}`,onClick:d=>{d.preventDefault(),a.selectSpeaker(i,!0)},className:"efp-event-list__block-item efp-event-list__block-item--clickable",children:[i.photoFile&&e("div",{className:"efp-event-list__block-avatar",children:e("img",{src:i.photoFile,alt:i.name})}),l("div",{className:"efp-event-list__block-info",children:[e("div",{className:"efp-event-list__block-title",children:i.name}),l("div",{className:"efp-event-list__block-description",children:[i.company&&e("strong",{children:i.company}),i.jobTitle&&e("span",{children:i.jobTitle})]})]})]},i.id))})]})]}),(t.description||t.logoFile)&&l("div",{className:c("efp-event-description",{collapsed:o.collapsed&&!o.disableCollapse&&!s.kiosk}),children:[t.logoFile&&e("div",{className:c("efp-event-description__logo",{"efp-event-description__logo--left":!t.description}),children:e("img",{src:t.logoFile,alt:t.name,crossOrigin:"anonymous"})}),t.description&&e("span",{className:"event-description__content",dir:"auto",dangerouslySetInnerHTML:{__html:A(L(t.description))},onClick:p})]})]}),s.kiosk&&k&&e(V,{className:c("efp-event__show-more",{"is-sticky":h}),expanded:h,onClick:()=>_(i=>!i)})]})})}function K(){const n=s.selectedEventItem;n&&(v(m.ClickCustomButton,n.name),a.toggleModal("share"))}function $(){const n=s.selectedEventItem;n&&(n.bookmarked=!n.bookmarked,s.onBookmarkClick&&s.onBookmarkClick({name:n.name,bookmarked:n.bookmarked,externalId:n.externalId}),v(m.ClickCustomButton,n.name))}function z(){const n=s.selectedEventItem;n&&(n.visited=!n.visited,s.onVisitedClick&&s.onVisitedClick({name:n.name,visited:n.visited,externalId:n.externalId}),v(m.ClickCustomButton,n.name))}const W=M(()=>s.selectedEventItem?e(R,{}):null);export default W;