https://www.delius-klasing.de/_next/static/chunks/CyclingStatsLiveRaceWidget.cb695f61c0f99cf4.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[12070,88421],{65979:(e,t,i)=>{i.r(t),i.d(t,{DistanceInfoBar:()=>l});var a=i(6029),n=i(55729),r=i(5700);let l=({totalDistanceKm:e,completedKm:t,remainingKm:i})=>{let l=(0,r.c)("common"),s=e=>null==e?"–":e.toLocaleString("de-DE",{minimumFractionDigits:0,maximumFractionDigits:1}),d=(0,n.useRef)(null),c=(0,n.useRef)(null),o=(0,n.useRef)(null),u=(0,n.useRef)(null),[m,h]=(0,n.useState)(null),f=(0,n.useId)(),x=`distArrow-${f.replace(/:/g,"")}`,g=e>0?t/e*100:0,v=(0,n.useCallback)(()=>{if(!d.current||!c.current||!o.current||!u.current)return;let e=d.current.getBoundingClientRect().width;if(e<=0)return;let t=c.current.getBoundingClientRect().width,i=o.current.getBoundingClientRect().width,a=u.current.getBoundingClientRect().width,n=Math.min(Math.max(g,(t+i/2+8)/e*100),(e-a-i/2-8)/e*100),r=n/100*e-i/2;h({labelPct:n,a1Start:t+4,a1End:r-4,a2Start:r+i+4,a2End:e-a-4,containerWidth:e})},[g]);(0,n.useEffect)(()=>{let e=requestAnimationFrame(v);return window.addEventListener("resize",v),()=>{cancelAnimationFrame(e),window.removeEventListener("resize",v)}},[v]);let j=m?.labelPct??Math.min(Math.max(g,15),85);return(0,a.jsxs)("div",{ref:d,className:"relative mt-2 font-sans text-xs md:text-sm",style:{height:44,marginLeft:30,marginRight:5},children:[(0,a.jsxs)("div",{ref:c,className:"absolute left-0 top-0 z-10 bg-white pr-1 text-left",children:[(0,a.jsx)("div",{className:"text-gray-600",children:"Start"}),(0,a.jsxs)("div",{className:"font-bold",children:[s(e)," km"]})]}),(0,a.jsxs)("div",{ref:o,className:"absolute top-0 z-10 bg-white px-1 text-center",style:{left:`${j}%`,transform:"translateX(-50%)"},children:[(0,a.jsx)("div",{className:"text-gray-600",children:l("PCS_DRIVEN")}),(0,a.jsxs)("div",{className:"font-bold",children:[s(t)," km"]})]}),(0,a.jsxs)("div",{ref:u,className:"absolute right-0 top-0 z-10 bg-white pl-1 text-right",children:[(0,a.jsx)("div",{className:"text-gray-600",children:l("PCS_TO_FINISH")}),(0,a.jsxs)("div",{className:"font-bold",children:[s(i)," km"]})]}),m&&m.containerWidth>0&&(0,a.jsxs)("svg",{width:"100%",height:"100%",className:"absolute inset-0 z-0",viewBox:`0 0 ${m.containerWidth} 44`,preserveAspectRatio:"none",children:[(0,a.jsx)("defs",{children:(0,a.jsx)("marker",{id:x,markerWidth:"6",markerHeight:"5",refX:"6",refY:"2.5",orient:"auto",children:(0,a.jsx)("polygon",{points:"0 0, 6 2.5, 0 5",fill:"#9ca3af"})})}),m.a1End-m.a1Start>12&&(0,a.jsx)("line",{x1:m.a1Start,y1:22,x2:m.a1End,y2:22,stroke:"#9ca3af",strokeWidth:"1",markerEnd:`url(#${x})`,vectorEffect:"non-scaling-stroke"}),m.a2End-m.a2Start>12&&(0,a.jsx)("line",{x1:m.a2Start,y1:22,x2:m.a2End,y2:22,stroke:"#9ca3af",strokeWidth:"1",markerEnd:`url(#${x})`,vectorEffect:"non-scaling-stroke"})]})]})}},77134:(e,t,i)=>{i.r(t),i.d(t,{LiveRaceWidget:()=>m});var a=i(6029),n=i(55729),r=i(91694),l=i(5700),s=i(17555),d=i(82364),c=i(33364),o=i(6888),u=i(65979);let m=({event:e,stage:t})=>{let i=(0,r.Ym)(),m=(0,l.c)("common"),[h,f]=(0,n.useState)(null),[x,g]=(0,n.useState)(null),[v,j]=(0,n.useState)(!0),b=t?.stage_id;if((0,n.useEffect)(()=>{b&&(async()=>{j(!0);try{let[e,t]=await Promise.all([(0,s.h)(`/api/stage_profile?stage_id=${b}`),(0,s.h)(`/api/stage_live?stage_id=${b}`)]);e.ok&&f(await e.json()),t.ok&&g(await t.json())}catch(e){console.error("LiveRaceWidget fetch failed",e)}finally{j(!1)}})()},[b]),v)return(0,a.jsxs)("div",{className:"mt-6",children:[(0,a.jsx)("div",{className:"mb-2 h-8 w-2/3 animate-pulse rounded bg-neutral-200"}),(0,a.jsx)("div",{className:"h-48 w-full animate-pulse rounded bg-neutral-200"})]});if(!(h?.altitude_profile?.length>0))return null;let _=x?.live_situation_meta?.leader_distance_m,k=x?.stage?.distance||t?.distance||0,p=_?Math.round(_/1e3*10)/10:0,w=Math.round((k-p)*10)/10,N=(0,d.getLivetickerLink)(e?.title,e?.event_id,t?.title,t?.stage_id,i);return(0,a.jsxs)("div",{className:"mt-6 min-w-0 overflow-hidden",children:[(0,a.jsxs)("h3",{className:"mb-3 font-rubric text-xl font-medium leading-snug text-skin-primary md:text-3xl",children:[m("PCS_LIVE_NOW")," ",e?.title]}),(0,a.jsx)(o.default,{altitudeProfile:h.altitude_profile,leaderDistanceM:_,liveSituation:null!=_?x?.live_situation:void 0,height:220}),null!=_&&(0,a.jsx)(u.DistanceInfoBar,{totalDistanceKm:k,completedKm:p,remainingKm:w}),(0,a.jsx)("div",{className:"mt-4 flex justify-center",children:(0,a.jsx)(c.$,{buttonColor:"primary",buttonOutline:!1,buttonSize:"md",link:N,buttonLabel:m("PCS_TO_LIVE_TICKER"),fullWidth:!1,className:"!border-red-600 !bg-red-600 !text-white"})})]})}}}]);