Главная Обзор Помощь
Вход
yunoadmin
/
bambuddy
зеркало из https://github.com/maziggy/bambuddy
1
0
Ответвить 0
Файлы Задачи 0 Вики
Дерево: f29b735bbe
Ветки Метки
bambuddy
/
static
/
assets
/
StreamOverlayPage-CmvEYNWa.js

StreamOverlayPage-CmvEYNWa.js 16 KB
История Исходник

1 
  1. import{i as e}from"./rolldown-runtime-aKtaBQYM.js";import{S as t,T as n,a as r,k as i,t as a,w as o}from"./client-A76-KVrT.js";import{d as s,f as c}from"./chunk-62JRHF6Z-BO6hRIIV.js";import{n as l}from"./QueryClientProvider-CRNM5YV-.js";import{t as u}from"./useQuery-wqfadfch.js";import{t as d}from"./box-dob8B1j7.js";import{t as ee}from"./clock-ZK0CazNO.js";import{t as f}from"./flame-Cedt8kHB.js";import{t as p}from"./layers-BxB5YWup.js";import{t as m}from"./printer-BWcjSJIp.js";import{t as h}from"./square-BgO8o2QK.js";import{t as g}from"./timer-OEatEhD-.js";import{c as _,o as v}from"./date-G9KUauqz.js";import{n as y,r as b,t as x}from"./useSidewaysBox-CCRxxEAM.js";import{t as S}from"./printerModel-DrNvERGQ.js";import{a as C,n as w,o as T,s as te,t as E}from"./OverlayFrame-ChV6285e.js";var D=e(i(),1),O=o();function k(e){let[t,n]=(0,D.useState)(()=>window.matchMedia(`(orientation: portrait)`).matches);return(0,D.useEffect)(()=>{if(e)return;let t=window.matchMedia(`(orientation: portrait)`),r=e=>n(e.matches);return n(t.matches),t.addEventListener(`change`,r),()=>t.removeEventListener(`change`,r)},[e]),e??(t?`portrait`:`landscape`)}function A(e){let{t}=n(),r=(0,D.useRef)(null),i=b(e.camera?.imgRef??r,e.camera?.url),a=1-(e.backgroundTransparency??0)/100,o={"--overlay-background-alpha":a,"--overlay-identity-alpha":a*.9,"--overlay-panel-alpha":a*.88};(0,D.useLayoutEffect)(()=>{if(a===1)return;let e=document.body.style.backgroundColor;return document.body.style.backgroundColor=`transparent`,()=>{document.body.style.backgroundColor=e}},[a]);let s=k(e.layout),{camera:c,name:l,model:u,filename:d,status:f,state:h,progress:_,layers:v,remaining:x,eta:S,temperatures:C}=e,w=T(e.progressBackground),te=d||f||_!=null||v||x||S||C.length>0,E=c?.rotation??0,A=Math.abs(E%180)===90,j=(0,D.useRef)(null),M=y(j,A&&c!=null),N=[{key:`layers`,icon:(0,O.jsx)(p,{}),label:t(`streamOverlay.layer`),value:v},{key:`remaining`,icon:(0,O.jsx)(g,{}),label:t(`streamOverlay.remaining`),value:x},{key:`eta`,icon:(0,O.jsx)(ee,{}),label:t(`streamOverlay.eta`),value:S}].filter(e=>e.value!=null);return(0,O.jsxs)(`div`,{className:`updated-overlay`,"data-size":e.size,"data-layout":s,"data-state":h,style:o,children:[(0,O.jsxs)(`header`,{className:`updated-overlay__header`,children:[(l||u)&&(0,O.jsxs)(`div`,{className:`updated-overlay__identity`,children:[(0,O.jsx)(m,{"aria-hidden":`true`}),(0,O.jsxs)(`div`,{children:[l&&(0,O.jsx)(`strong`,{children:l}),u&&(0,O.jsx)(`span`,{children:u})]})]}),(0,O.jsxs)(`div`,{className:`updated-overlay__logo flex flex-col items-end`,children:[e.customLogo,(0,O.jsx)(`a`,{href:`https://github.com/maziggy/bambuddy`,target:`_blank`,rel:`noopener noreferrer`,children:(0,O.jsx)(`img`,{src:`/img/bambuddy_logo_powered_by.png`,alt:`Bambuddy`})})]})]}),c&&(0,O.jsx)(`div`,{className:`updated-overlay__camera`,ref:j,children:(0,O.jsx)(`img`,{ref:i,alt:t(`streamOverlay.cameraStream`),style:{transform:`translate(-50%, -50%) rotate(${E}deg)`,...A&&M?{width:M.height,height:M.width}:{}},onError:c.onError})}),te&&(0,O.jsxs)(`section`,{className:`updated-overlay__panel`,children:[(d||f)&&(0,O.jsxs)(`div`,{className:`updated-overlay__summary`,children:[d&&(0,O.jsx)(`h1`,{children:d}),f&&(0,O.jsxs)(`div`,{className:`updated-overlay__status`,children:[(0,O.jsx)(`span`,{"aria-hidden":`true`}),f]})]}),_!=null&&(0,O.jsxs)(`div`,{className:`updated-overlay__progress`,children:[(0,O.jsx)(`span`,{style:w,children:t(`streamOverlay.progress`)}),(0,O.jsx)(`div`,{role:`progressbar`,"aria-label":t(`streamOverlay.progress`),"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":_,children:(0,O.jsx)(`div`,{style:{width:`${_}%`,background:e.progressBackground}})}),(0,O.jsxs)(`strong`,{style:w,children:[Math.round(_),`%`]})]}),(N.length>0||C.length>0)&&(0,O.jsxs)(`div`,{className:`updated-overlay__readings`,children:[N.length>0&&(0,O.jsx)(`div`,{className:`updated-overlay__stats`,children:N.map(e=>(0,O.jsxs)(`div`,{className:`updated-overlay__reading`,children:[e.icon,(0,O.jsxs)(`div`,{children:[(0,O.jsx)(`span`,{children:e.label}),(0,O.jsx)(`strong`,{children:e.value})]})]},e.key))}),C.length>0&&(0,O.jsx)(`div`,{className:`updated-overlay__temperatures`,children:C.map(e=>(0,O.jsxs)(`div`,{className:`updated-overlay__reading`,children:[e.icon,(0,O.jsxs)(`div`,{children:[(0,O.jsx)(`span`,{children:e.label}),(0,O.jsxs)(`strong`,{children:[Math.round(e.current),`°C`,e.target!=null&&e.target>0&&Math.round(e.target)!==Math.round(e.current)&&(0,O.jsxs)(`small`,{children:[` / `,Math.round(e.target),`°C`]})]})]})]},e.key))})]})]})]})}var j=6e4,M=3e3,N=200;function ne(e){let[t,n]=(0,D.useState)(Date.now),[r,i]=(0,D.useState)(!1),a=(0,D.useRef)(null),o=(0,D.useRef)(null),s=(0,D.useCallback)(()=>{a.current?.removeAttribute(`src`),i(!0)},[]),c=(0,D.useCallback)(()=>{o.current!==null&&(clearTimeout(o.current),o.current=null),i(!1),n(e=>e+1)},[]);return(0,D.useEffect)(()=>{if(!e)return;let t=setTimeout(s,j-N),n=setTimeout(c,j);return()=>{clearTimeout(t),clearTimeout(n),o.current!==null&&(clearTimeout(o.current),o.current=null),i(!1)}},[e,t,c,s]),{imageKey:t,closing:r,imgRef:a,handleStreamError:(0,D.useCallback)(t=>{!e||o.current!==null||t&&!t.currentTarget.getAttribute(`src`)||(s(),o.current=setTimeout(c,M))},[e,c,s])}}function re(e,t,n){if(!e)return``;if(!t)return e;let r=t.match(/plate_(\d+)\.gcode/);return r&&parseInt(r[1],10)>1?`${e} — ${n(`printers.plateNumber`,`Plate {{number}}`,{number:r[1]})}`:e}function ie(e){let t=e.get(`show`)?.split(`,`)||[`progress`,`layers`,`eta`,`filename`,`status`],n=parseInt(e.get(`fps`)||`15`,10),r=Math.min(Math.max(isNaN(n)?15:n,1),30),i=e.get(`camera`),a=i!==`false`&&i!==`0`,o=Number(e.get(`backgroundTransparency`)),s=Number.isFinite(o)?Math.min(100,Math.max(0,o)):0,c=e.get(`layout`);return{layout:c===`portrait`||c===`landscape`?c:null,backgroundTransparency:s,size:e.get(`size`)||`medium`,fps:r,updatedArtwork:e.get(`artwork`)===`2`,showCamera:a,showProgress:t.includes(`progress`),showLayers:t.includes(`layers`),showEta:t.includes(`eta`),showFilename:t.includes(`filename`),showStatus:t.includes(`status`),showPrinter:t.includes(`printer`),showModel:t.includes(`model`),showNozzle:t.includes(`nozzle`),showBed:t.includes(`bed`),showChamber:t.includes(`chamber`)}}function ae(e,t){if(e.stg_cur_name)return e.stg_cur_name;switch(e.state){case`RUNNING`:return t(`streamOverlay.status.printing`);case`PAUSE`:return t(`streamOverlay.status.paused`);case`FINISH`:return t(`streamOverlay.status.finished`);case`FAILED`:return t(`streamOverlay.status.failed`);case`IDLE`:return t(`streamOverlay.status.idle`);default:return e.state||t(`streamOverlay.status.unknown`)}}function P(e,t){let n=e[t];return typeof n==`number`?n:null}function oe({icon:e,label:t,current:n,target:r,sizes:i}){let a=r!=null&&r>0&&Math.round(r)!==Math.round(n);return(0,O.jsxs)(`div`,{className:`flex items-center ${i.gap} text-white/70`,children:[e,(0,O.jsxs)(`span`,{className:`classic-overlay__text ${i.text}`,children:[(0,O.jsx)(`span`,{className:`mr-1`,children:t}),(0,O.jsxs)(`span`,{className:`text-white`,children:[Math.round(n),`°C`]}),a&&(0,O.jsxs)(O.Fragment,{children:[(0,O.jsx)(`span`,{className:`mx-1`,children:`/`}),(0,O.jsxs)(`span`,{children:[Math.round(r),`°C`]})]})]})]})}function se(e){switch(e){case`small`:return{container:`p-3`,text:`text-sm`,textLarge:`text-lg`,progressHeight:`h-2`,icon:`w-3 h-3`,gap:`gap-2`,logoHeight:`h-12`};case`large`:return{container:`p-6`,text:`text-xl`,textLarge:`text-3xl`,progressHeight:`h-4`,icon:`w-6 h-6`,gap:`gap-4`,logoHeight:`h-24`};default:return{container:`p-4`,text:`text-base`,textLarge:`text-xl`,progressHeight:`h-3`,icon:`w-4 h-4`,gap:`gap-3`,logoHeight:`h-16`}}}function F(){let{printerId:e}=s(),[i]=c(),{t:o}=n(),k=l(),j=parseInt(e||`0`,10),M=(0,D.useMemo)(()=>ie(i),[i]),N=se(M.size),F=i.get(`token`),I=F!=null&&F!==``,L=te(i.get(`logo`)===`1`,F),R=C(i.get(`progressFrom`),i.get(`progressTo`)),z=T(R),B=L?(0,O.jsx)(`img`,{src:L,alt:o(`streamOverlay.branding.logo`),className:`mb-2 object-contain`,style:{maxHeight:M.layout?w[M.layout].height*.14:`14vh`,maxWidth:M.layout?w[M.layout].width*.2:`20vw`}}):null,{data:V}=u({queryKey:[`overlayStatus`,j,F],queryFn:()=>r.getOverlayStatus(j,F??void 0),enabled:j>0&&I,refetchInterval:2e3}),{data:H}=u({queryKey:[`printer`,j],queryFn:()=>r.getPrinter(j),enabled:j>0&&!I}),{data:ce}=u({queryKey:[`printerStatus`,j],queryFn:()=>r.getPrinterStatus(j),enabled:j>0&&!I,refetchInterval:2e3}),{data:le}=u({queryKey:[`settings`],queryFn:r.getSettings,enabled:!I}),U=(0,D.useMemo)(()=>I?V&&{name:V.name,model:V.model,camera_rotation:V.camera_rotation}:H,[I,V,H]),W=[M.showPrinter?U?.name:null,M.showModel?S(U?.model??null):null].filter(Boolean).join(` · `),G=I?V:ce,{imageKey:ue,closing:de,imgRef:fe,handleStreamError:pe}=ne(j>0&&M.showCamera&&G!=null),me=(I?V?.time_format:le?.time_format)||`system`;(0,D.useEffect)(()=>{if(!j||I)return;let e=null,t=!1;return(async()=>{let n;try{n=(await r.getWebSocketToken()).token}catch(e){let t=e instanceof a?e.status:0;if(t===401||t===403)return}if(t)return;let i=window.location.protocol===`https:`?`wss:`:`ws:`,o=n?`?token=${encodeURIComponent(n)}`:``,s=`${i}//${window.location.host}/api/v1/ws${o}`;e=new WebSocket(s),e.onmessage=e=>{try{let t=JSON.parse(e.data);t.type===`printer_status`&&t.printer_id===j&&k.setQueryData([`printerStatus`,j],e=>e?{...e,...t.data}:t.data)}catch{}},e.onerror=()=>{}})(),()=>{t=!0,e&&e.close()}},[j,I,k]),(0,D.useEffect)(()=>(document.title=U?`${U.name} - ${o(`streamOverlay.title`)}`:o(`streamOverlay.title`),()=>{document.title=`Bambuddy`}),[U,o]);let he=(0,D.useRef)(null),K=x(U?.camera_rotation),q=y(he,K&&!M.layout&&!M.updatedArtwork&&M.showCamera&&G!=null),ge=`/api/v1/printers/${j}/camera/stream?fps=${M.fps}&t=${ue}`,_e=I&&F?`${ge}&token=${encodeURIComponent(F)}`:t(ge),ve=b(fe,de?void 0:_e);if(!j)return(0,O.jsx)(`div`,{className:`min-h-screen bg-black flex items-center justify-center`,children:(0,O.jsx)(`p`,{className:`text-white`,children:o(`streamOverlay.invalidPrinterId`)})});if(!G)return(0,O.jsx)(`div`,{className:`min-h-screen bg-black flex items-center justify-center`,children:(0,O.jsx)(`p`,{className:`text-gray-400`,children:o(`common.loading`)})});let J=G.connected&&(G.state===`RUNNING`||G.state===`PAUSE`),Y=G.progress||0,X=G.temperatures??{},Z=[];if(M.showNozzle){let e=P(X,`nozzle`),t=P(X,`nozzle_2`);e!=null&&Z.push({key:`nozzle`,icon:(0,O.jsx)(f,{className:`classic-overlay__icon ${N.icon}`}),label:o(`printers.heaterHistory.nozzle`,`Nozzle`),current:e,target:P(X,`nozzle_target`)}),t!=null&&Z.push({key:`nozzle_2`,icon:(0,O.jsx)(f,{className:`classic-overlay__icon ${N.icon}`}),label:o(`printers.heaterHistory.nozzle2`,`Nozzle 2`),current:t,target:P(X,`nozzle_2_target`)})}if(M.showBed){let e=P(X,`bed`);e!=null&&Z.push({key:`bed`,icon:(0,O.jsx)(h,{className:`classic-overlay__icon ${N.icon}`}),label:o(`printers.heaterHistory.bed`,`Bed`),current:e,target:P(X,`bed_target`)})}if(M.showChamber){let e=P(X,`chamber`);e!=null&&Z.push({key:`chamber`,icon:(0,O.jsx)(d,{className:`classic-overlay__icon ${N.icon}`}),label:o(`printers.heaterHistory.chamber`,`Chamber`),current:e,target:P(X,`chamber_target`)})}if(M.updatedArtwork){let e=G.connected&&J,t=G.remaining_time,n=e&&M.showEta&&t!=null&&t>0,r=(0,O.jsx)(A,{layout:M.layout??void 0,backgroundTransparency:M.backgroundTransparency,customLogo:B,progressBackground:R,size:M.size,camera:M.showCamera?{url:de?void 0:_e,rotation:U?.camera_rotation??0,onError:pe,imgRef:fe}:null,name:M.showPrinter?U?.name??null:null,model:M.showModel&&S(U?.model??null)||null,filename:M.showFilename&&G.current_print?re(G.current_print.replace(/\.gcode\.3mf$|\.3mf$|\.gcode$/i,``),G.gcode_file,o):null,status:M.showStatus?G.connected?ae(G,o):o(`streamOverlay.printerOffline`):null,state:G.connected?G.state:null,progress:e&&M.showProgress?Math.min(100,Math.max(0,Number.isFinite(Y)?Y:0)):null,layers:e&&M.showLayers&&G.layer_num!=null&&G.total_layers!=null&&G.total_layers>0?`${G.layer_num} / ${G.total_layers}`:null,remaining:n?v(t*60):null,eta:n?_(t,me,o):null,temperatures:G.connected?Z:[]});return M.layout?(0,O.jsx)(E,{layout:M.layout,children:r}):r}let Q=M.layout?w[M.layout]:null,$=U?.camera_rotation??0,ye=(0,O.jsxs)(`div`,{ref:he,className:`classic-overlay min-h-screen bg-black relative overflow-hidden`,"data-layout":M.layout??void 0,"data-size":M.size,children:[M.showCamera&&(0,O.jsx)(`img`,{ref:ve,alt:o(`streamOverlay.cameraStream`),className:`absolute inset-0 w-full h-full object-contain`,style:Q?{left:`50%`,top:`50%`,maxWidth:`none`,width:K?Q.height:Q.width,height:K?Q.width:Q.height,transform:`translate(-50%, -50%) rotate(${$}deg)`}:q?{left:`50%`,top:`50%`,maxWidth:`none`,width:q.height,height:q.width,transform:`translate(-50%, -50%) rotate(${$}deg)`}:$?{transform:`rotate(${$}deg)`}:void 0,onError:pe},ue),(0,O.jsxs)(`div`,{className:`absolute top-4 right-4 z-10 flex flex-col items-end`,children:[B,(0,O.jsx)(`a`,{href:`https://github.com/maziggy/bambuddy`,target:`_blank`,rel:`noopener noreferrer`,children:(0,O.jsx)(`img`,{src:`/img/bambuddy_logo_dark_transparent.png`,alt:`Bambuddy`,className:`classic-overlay__logo ${N.logoHeight} object-contain drop-shadow-lg hover:scale-105 transition-transform`})})]}),(0,O.jsx)(`div`,{className:`absolute bottom-0 left-0 right-0 z-10 bg-gradient-to-t from-black/80 via-black/60 to-transparent`,children:(0,O.jsxs)(`div`,{className:`classic-overlay__panel ${N.container}`,children:[W&&(0,O.jsxs)(`div`,{className:`flex items-center ${N.gap} mb-2`,children:[(0,O.jsx)(m,{className:`classic-overlay__icon ${N.icon} shrink-0 text-white/70`}),(0,O.jsx)(`span`,{className:`classic-overlay__text ${N.text} min-w-0 truncate text-white font-medium`,children:W})]}),M.showFilename&&G.current_print&&(0,O.jsx)(`div`,{className:`classic-overlay__filename ${N.textLarge} text-white font-semibold mb-2 truncate drop-shadow-md`,children:re(G.current_print.replace(/\.gcode\.3mf$|\.3mf$|\.gcode$/i,``),G.gcode_file,o)}),M.showStatus&&(0,O.jsx)(`div`,{className:`classic-overlay__text ${N.text} text-white/70 mb-2`,children:G.connected?ae(G,o):o(`streamOverlay.printerOffline`)}),M.showProgress&&J&&(0,O.jsxs)(`div`,{className:`mb-3`,children:[(0,O.jsxs)(`div`,{className:`flex items-center justify-between mb-1 classic-overlay__text ${N.text}`,children:[(0,O.jsx)(`span`,{className:`text-white/70`,style:z,children:o(`streamOverlay.progress`)}),(0,O.jsxs)(`span`,{className:`text-white font-bold`,style:z,children:[Math.round(Y),`%`]})]}),(0,O.jsx)(`div`,{className:`w-full bg-white/20 rounded-full ${N.progressHeight}`,children:(0,O.jsx)(`div`,{className:`bg-bambu-green ${N.progressHeight} rounded-full transition-all duration-500`,style:{width:`${Y}%`,background:R}})})]}),J&&(M.showLayers||M.showEta)&&(0,O.jsxs)(`div`,{className:`flex items-center ${N.gap} flex-wrap`,children:[M.showLayers&&G.layer_num!=null&&G.total_layers!=null&&G.total_layers>0&&(0,O.jsxs)(`div`,{className:`flex items-center ${N.gap} text-white/70`,children:[(0,O.jsx)(p,{className:`classic-overlay__icon ${N.icon}`}),(0,O.jsxs)(`span`,{className:`classic-overlay__text ${N.text}`,children:[(0,O.jsx)(`span`,{className:`text-white`,children:G.layer_num}),(0,O.jsx)(`span`,{className:`mx-1`,children:`/`}),(0,O.jsx)(`span`,{children:G.total_layers})]})]}),M.showEta&&G.remaining_time!=null&&G.remaining_time>0&&(0,O.jsxs)(O.Fragment,{children:[(0,O.jsxs)(`div`,{className:`flex items-center ${N.gap} text-white/70`,children:[(0,O.jsx)(g,{className:`classic-overlay__icon ${N.icon}`}),(0,O.jsx)(`span`,{className:`classic-overlay__text ${N.text} text-white`,children:v(G.remaining_time*60)})]}),(0,O.jsxs)(`div`,{className:`flex items-center ${N.gap} text-white/70`,children:[(0,O.jsx)(ee,{className:`classic-overlay__icon ${N.icon}`}),(0,O.jsxs)(`span`,{className:`classic-overlay__text ${N.text} text-white`,children:[o(`streamOverlay.eta`),` `,_(G.remaining_time,me,o)]})]})]})]}),Z.length>0&&G.connected&&(0,O.jsx)(`div`,{className:`flex items-center ${N.gap} flex-wrap mt-2`,children:Z.map(e=>(0,O.jsx)(oe,{icon:e.icon,label:e.label,current:e.current,target:e.target,sizes:N},e.key))})]})})]});return M.layout?(0,O.jsx)(E,{layout:M.layout,children:ye}):ye}export{F as StreamOverlayPage};
    2.