UNPKG

@getontime/cli

Version:

Time keeping for live events

2 lines 11.5 kB
(function(){try{var e=typeof window<`u`?window:typeof global<`u`?global:typeof globalThis<`u`?globalThis:typeof self<`u`?self:{};e.SENTRY_RELEASE={id:`f14ad0099eab1969fdd065b56af5fdd3cf530de6`};var t=new e.Error().stack;t&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[t]=`5d664f02-f8d5-4aec-96f0-9fb9f862e1bb`,e._sentryDebugIdIdentifier=`sentry-dbid-5d664f02-f8d5-4aec-96f0-9fb9f862e1bb`)}catch{}})();import{a as e,n as t,t as n}from"./jsx-runtime-BNC90REB.js";import{$ as r,Ct as i,Kt as a,Lt as o,N as s,Pt as c,Q as l,St as u,Tt as d,et as f,k as p,p as m,tt as h}from"./useSocket-B9-0Z7zf.js";import"./Button-CsttsbOH.js";import{g,y as _}from"./useIsSmallScreen-Db4lRgi0.js";import"./Select-CujoWFOD.js";import{G as v,K as y}from"./constants-8b9Q9Bj6.js";import"./SwatchPicker-C0WK8dMM.js";import"./viewParamsEditor.store-BcLRa99Z.js";import{i as b,o as x,r as S,s as C,t as w}from"./EmptyFill-D1gAY2Dp.js";import{t as T}from"./useSettings-CeUw01Bu.js";import{O as E,r as D}from"./useRundown-BubT2Cyp.js";import"./Input-D-3bhaHU.js";import{t as ee}from"./PresetContext-DZh_OrO5.js";import"./assets-DU19UGw8.js";import{s as te,t as O}from"./index-qU8RbaVt.js";import"./Info-QUjDr4I8.js";import"./Empty-CSL3pipV.js";import{i as k,n as A,o as ne,t as re}from"./ViewParamsEditor-ZtF4EeBG.js";import{i as j,n as M}from"./viewUtils-CulstVIy.js";import{t as ie}from"./useWindowTitle-Dvj2xEXy.js";import{t as ae}from"./useAutoTickingClock-CjJeDQz8.js";import{n as oe,t as N}from"./common.options-DXL-8UPx.js";import{t as P}from"./useAnimatedProgress-DJlteBY2.js";import{t as F}from"./useCustomFields-BMD3tm-0.js";import{t as I}from"./viewLoader.utils-BLkafrJE.js";import{t as L}from"./ViewLogo-BuLAMmbq.js";import{t as R}from"./SuperscriptTime-Byp3JLgw.js";import{t as z}from"./useProjectData-DHesqFeW.js";function B(e,t){if(!t)return 0;let n=e.timeStart+e.dayOffset*d,r=t.timeStart+t.duration+t.dayOffset*d;return n===r?0:n-r}var V=e(t(),1);function H(e,t,n){if(!t.current)return;if(!e?.current){t.current.scrollTo({left:0,behavior:`smooth`});return}let r=e.current.getBoundingClientRect(),i=t.current.getBoundingClientRect(),a=r.left-i.left+t.current.scrollLeft-n;t.current.scrollTo({left:a,behavior:`smooth`})}function U({followRef:e,scrollRef:t,doFollow:n,selectedEventId:r,leftOffset:i=0,setScrollFlag:a}){return(0,V.useEffect)(()=>{!n||!t.current||(a?.(!0),window.requestAnimationFrame(()=>{H(r===null?null:e,t,i),a?.(!1)}))},[e,t,n,i,a,r]),(0,V.useCallback)((n=e,a=t,o=i)=>{a.current&&H(r===null?null:n,a,o)},[e,t,i,r])}var W=(e,t)=>{let n=k(t,[{value:`title`,label:`Title`}]);return[{title:A.ClockOptions,collapsible:!0,options:[N(e)]},{title:A.DataSources,collapsible:!0,options:[{id:`main`,title:`Main text`,description:`Select the data source for the main text`,type:`option`,values:n,defaultValue:`title`}]},{title:A.ElementVisibility,collapsible:!0,options:[{id:`hidePast`,title:`Hide Past Events`,description:`Whether to hide events that have passed`,type:`boolean`,defaultValue:!1},{id:`fixedSize`,title:`Fixed timeline size`,description:`Timeline will have a fixed size to prevent scrolling`,type:`boolean`,defaultValue:!1}]}]};function G(e,t){let n=n=>t?.get(n)??e.get(n);return{mainSource:n(`main`),hidePast:j(n(`hidePast`)),fixedSize:j(n(`fixedSize`)),timeformat:oe(e,t)}}function K(){let[e]=_(),t=(0,V.use)(ee);return(0,V.useMemo)(()=>G(e,t?new URLSearchParams(t.search):void 0),[t,e])}function q(e,t,n,r,i){let a=(t<e?t+d:t)-e,o=r*i/a;return{left:(n-e)*i/a,width:o}}function se(e){return Math.floor(e/u)}function ce(e){return Math.ceil(e/u)}function le(e,t){let n=[];for(let r=e;r<t;r++)n.push(r);return n}function ue(e,t){return t===`done`||t===`live`?t:e<=0?`pending`:l(e,e>i*10)}function de(e,t){let{hidePast:n}=K();return(0,V.useMemo)(()=>fe(e,t,n),[n,e,t])}function fe(e,t,n){if(e.length===0)return{scopedRundown:[],firstStart:0,totalDuration:0};let r=[],i=t?1/0:-1,a=null,s=0,l=null;for(let u=0;u<e.length;u++){let d=e[u];if(!c(d)||!o(d)||(d.id===t&&(i=u),n&&u<i))continue;r.push(d),a===null&&(a=d.timeStart);let f=B(d,l);f===0?s+=d.duration:f>0?s+=f+d.duration:f<0&&(s+=Math.max(d.duration+f,0)),E(d,l)&&(l=d)}return{scopedRundown:r,firstStart:a??0,totalDuration:s}}function pe(e,t){if(e.length===0)return{now:null,next:null,followedBy:null};let n=t?S(e,t):null;c(n)||(n=null);let r=n?C(e,n.id)?.nextEvent:b(e).firstEvent,i=r?C(e,r.id)?.nextEvent:null;return{now:n,next:r,followedBy:i}}function me(e,t,n,r,i,a=100){let o=1/0,s=e.map(({start:e,duration:i})=>{let a=q(t,n,e,i,r);return o=Math.min(o,a.width),a});if(!i)return{positions:s,scale:1,totalWidth:r};let c=o<a?a/o:1;return c===1?{positions:s,scale:1,totalWidth:r}:{positions:s.map(e=>({left:e.left*c,width:e.width*c})),scale:c,totalWidth:r*c}}var he={blink:`_blink_gfywu_1`,fourtyfive:`_fourtyfive_gfywu_13`,markers:`_markers_gfywu_17`},J=n();function ge(e){let{startHour:t,endHour:n}=e,r=le(t,n);return(0,J.jsx)(`div`,{className:he.markers,children:r.map(e=>(0,J.jsx)(`span`,{},e))})}var Y={blink:`_blink_2cf73_1`,fourtyfive:`_fourtyfive_2cf73_13`,mirror:`_mirror_2cf73_17`,timelineContainer:`_timelineContainer_2cf73_21`,scroll:`_scroll_2cf73_26`,timeline:`_timeline_2cf73_21`,groupBand:`_groupBand_2cf73_37`,column:`_column_2cf73_49`,maybeInline:`_maybeInline_2cf73_57`,timelineBlock:`_timelineBlock_2cf73_64`,smallArea:`_smallArea_2cf73_76`,content:`_content_2cf73_76`,timeOverview:`_timeOverview_2cf73_88`,hide:`_hide_2cf73_92`,status:`_status_2cf73_117`,due:`_due_2cf73_132`,title:`_title_2cf73_136`,delay:`_delay_2cf73_144`,cross:`_cross_2cf73_154`,separeLeft:`_separeLeft_2cf73_160`},X={format12:`h:mm a`,format24:`HH:mm`};function _e({colour:e,delay:t,duration:n,hasLink:i,left:a,status:o,start:s,dayOffset:c,totalGap:u,isLinkedToLoaded:d,title:f,width:p,cue:m,groupColour:h,ref:g}){let _=r(s,X),b=l(n),x=s+t,S=t>0,C=v(e,.7),w=p>20,T=p<40;return(0,J.jsxs)(`div`,{ref:g,className:y([Y.column,T&&Y.smallArea]),style:{"--color":e,"--lighter":C??``,"--group-colour":h??`transparent`,left:`${a}px`,width:`${p}px`},"data-testid":m,children:[o===`live`?(0,J.jsx)(ve,{}):(0,J.jsx)(`div`,{"data-status":o,className:Y.timelineBlock}),(0,J.jsx)(`div`,{className:Y.groupBand}),(0,J.jsxs)(`div`,{className:y([Y.content,p<20&&Y.hide,!i&&Y.separeLeft]),"data-status":o,style:{"--color":e},children:[(0,J.jsxs)(`div`,{className:Y.maybeInline,children:[(0,J.jsx)(`div`,{className:y([S&&Y.cross]),children:_}),S&&(0,J.jsx)(`div`,{className:Y.delay,children:r(x,X)}),T&&(0,J.jsx)(Z,{delay:t,start:s,dayOffset:c,totalGap:u,isLinkedToLoaded:d,status:o}),T&&(0,J.jsx)(`div`,{className:Y.title,children:f})]}),w&&(0,J.jsxs)(J.Fragment,{children:[!T&&(0,J.jsx)(Z,{delay:t,start:s,dayOffset:c,totalGap:u,isLinkedToLoaded:d,status:o}),!T&&(0,J.jsx)(`div`,{className:Y.title,children:f})]})]}),(0,J.jsx)(`div`,{className:Y.timeOverview,"data-status":o,children:o!==`done`&&(0,J.jsx)(`div`,{className:Y.duration,children:b})})]})}function Z({delay:e,start:t,dayOffset:n,totalGap:r,isLinkedToLoaded:i,status:a}){let o=m(),{getLocalizedString:s}=O(),{timeToStart:c}=h({timeStart:t,delay:e,dayOffset:n,totalGap:r,isLinkedToLoaded:i,countToEnd:!1,duration:0},o),l=ue(c,a);l===`live`?l=s(`timeline.live`):l===`pending`?l=s(`timeline.due`):l===`done`&&(l=s(`timeline.done`));let u=a===`future`&&c<=0;return(0,J.jsx)(`div`,{className:y([Y.status,u&&Y.due]),children:l})}function ve(){let{current:e,duration:t}=s(),n=P(e,t,p());return(0,J.jsx)(`div`,{"data-status":`live`,className:Y.timelineBlock,style:{"--progress":`${n}%`}})}var ye=(0,V.memo)(be);function be({firstStart:e,rundown:t,selectedEventId:n,totalDuration:r}){let{width:i}=g(),{mainSource:a,hidePast:s,fixedSize:l}=K(),f=(0,V.useRef)(null),p=(0,V.useRef)(null),{lastEvent:m}=x(t),h=se(e),_=ce(e+r+(m?.delay??0)),v=h*u,b=_*u;U({followRef:f,scrollRef:p,doFollow:!l,selectedEventId:n,leftOffset:s?0:i/6});let{positions:S,totalWidth:C}=(0,V.useMemo)(()=>me(t.filter(e=>c(e)&&o(e)).map(e=>({start:e.timeStart+(e.dayOffset??0)*d+(e.delay??0),duration:e.duration})),v,b,i,!l),[t,v,b,i,l]),w=n?`done`:`future`,T={};return t.forEach(e=>{c(e)&&o(e)&&(w===`live`&&(w=`future`),e.id===n&&(w=`live`),T[e.id]=w)}),(0,J.jsx)(`div`,{ref:p,className:y([Y.timelineContainer,!l&&Y.scroll]),children:(0,J.jsxs)(`div`,{className:Y.timeline,style:{width:C},children:[(0,J.jsx)(ge,{startHour:h,endHour:_}),t.map((e,t)=>{if(!c(e)||!o(e))return null;let r=S[t];if(!r)return null;let i=M(e,a??`title`)||e.title;return(0,J.jsx)(_e,{ref:e.id===n?f:void 0,colour:e.colour,delay:e.delay??0,duration:e.duration,hasLink:!!e.linkStart,left:r.left,status:T[e.id],start:e.timeStart+(e.dayOffset??0)*d,totalGap:e.totalGap,isLinkedToLoaded:e.isLinkedToLoaded,dayOffset:e.dayOffset,title:i,cue:e.cue,width:r.width,groupColour:e.groupColour},e.id)})]})})}var Q=(0,V.memo)($);function $({category:e,content:t,title:n,status:r}){let i=y([`section`,e===`now`&&`section--now`]),a=y([`section-content`,t?`section-content--${e}`:`section-content--subdue`]);return(0,J.jsxs)(`div`,{className:i,"data-testid":e,children:[(0,J.jsxs)(`div`,{className:`section-title`,children:[(0,J.jsx)(`span`,{className:`section-title__label`,children:n}),r&&(0,J.jsx)(`span`,{className:`section-title__status`,children:r})]}),(0,J.jsx)(`div`,{className:a,children:t??`-`})]})}function xe({now:e,next:t,followedBy:n,mainSource:r}){let{getLocalizedString:a}=O(),o=m(),s=e?M(e,r??`title`)??`-`:a(`timeline.standby`),c=a(`timeline.due`).toUpperCase(),u=M(t,r??`title`)??`-`,d=M(n,r??`title`)??`-`,f,p;if(t!==null){let{timeToStart:e}=h(t,o);f=e<=0?c:l(e,e>i*10)}if(n!==null){let{timeToStart:e}=h(n,o);p=e<=0?c:l(e,e>i*10)}return(0,J.jsxs)(`div`,{className:`title-grid`,children:[(0,J.jsx)(Q,{title:a(`timeline.live`),content:s,category:`now`}),(0,J.jsx)(Q,{title:a(`common.next`),status:f,content:u,category:`next`}),(0,J.jsx)(Q,{title:a(`timeline.followedby`),status:p,content:d,category:`followedBy`})]})}function Se(){let{data:e,status:t}=D(),{data:n,status:r}=z(),{data:i,status:a}=T(),{data:o,status:s}=F();return{data:{events:e,customFields:o,projectData:n,settings:i},status:I([t,r,a,s])}}function Ce(){let{data:e,status:t}=Se();return ie(`Timeline`),t===`pending`?(0,J.jsx)(te,{}):t===`error`?(0,J.jsx)(ne,{variant:`error`,text:`There was an error fetching data, please refresh the page.`}):(0,J.jsx)(we,{...e})}function we({events:e,customFields:t,projectData:n,settings:r}){let i=p(),{mainSource:o,timeformat:s}=K(),{getLocalizedString:c}=O(),{scopedRundown:l,firstStart:u,totalDuration:d}=de(e,i),{now:m,next:h,followedBy:g}=(0,V.useMemo)(()=>pe(l,i),[l,i]),_=f(r?.timeFormat),v=(0,V.useMemo)(()=>W(_,t),[_,t]),b=d>0;return(0,J.jsxs)(`div`,{className:`timeline`,"data-testid":`timeline-view`,children:[(0,J.jsx)(re,{target:a.Timeline,viewOptions:v}),(0,J.jsxs)(`div`,{className:`project-header`,children:[(0,J.jsxs)(`div`,{className:y([`project-header__brand`,!n?.logo&&`project-header__brand--without-logo`]),children:[n?.logo&&(0,J.jsx)(L,{name:n.logo,className:`logo`}),(0,J.jsx)(`div`,{className:`title`,children:n.title})]}),(0,J.jsx)(Te,{timeformat:s})]}),(0,J.jsx)(xe,{now:m,next:h,followedBy:g,mainSource:o}),b?(0,J.jsx)(ye,{firstStart:u,rundown:l,selectedEventId:i,totalDuration:d}):(0,J.jsx)(w,{text:c(`common.no_data`)})]})}function Te({timeformat:e}){let{getLocalizedString:t}=O(),n=r(ae(),{override:e});return(0,J.jsxs)(`div`,{className:`clock-container`,children:[(0,J.jsx)(`div`,{className:`label`,children:t(`common.time_now`)}),(0,J.jsx)(R,{time:n,className:`time`})]})}export{Ce as default}; //# sourceMappingURL=TimelinePage-CWMoznFl.js.map