b53c0593c0
CI / test (push) Has been cancelled
First-cut v2 had transparent cards (alpha 0.55) that disappeared into the harbor backdrop, plus the v1 cream chrome leaked through. This pass: - Bumps --color-surface / surface-2 to 0.85 alpha across every dusk so cards stay readable on top of the photo - Darkens backdrop with a vignette + bumps --color-bg overlay to 0.70 - Adds [data-design=v2] chrome rules: top-nav/bottom-nav glass, theme swatches use dusks tokens, design-toggle cards become glass, install button keeps accent fg color, frame-card gets inset highlight - Brightens --color-text-muted in each dusk for legibility Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
1 line
22 KiB
JavaScript
1 line
22 KiB
JavaScript
import{A as e,B as t,C as n,D as r,F as i,J as a,K as o,N as s,S as c,U as l,V as u,Y as d,_ as ee,a as te,c as ne,f as re,g as f,h as p,i as m,j as ie,l as h,m as ae,p as g,q as _,t as v,u as oe,v as y,x as se,y as b,z as x}from"./_plugin-vue_export-helper-BNDVmFr7.js";import{o as ce,s as le}from"./index-nsK34hVO.js";import{i as ue,n as de,r as fe,t as pe}from"./BaseBottomSheet-Bsol3Sat.js";import{t as S}from"./types-xv3fXrtW.js";import{t as me}from"./PullToRefresh-CSjUpm5h.js";var C=`https://wevisto.com/devices/`;function he(){let{devices:e}=m(ue()),t=new Map,n=new Map,r=window.__PF_MERCURE_URL__;if(!r)return{connectedCount:()=>0};function i(o){if(!t.has(o))try{let s=new URL(r);s.searchParams.append(`topic`,C+o);let c=new EventSource(s.toString(),{withCredentials:!0});c.onmessage=t=>{try{let n=JSON.parse(t.data);if(`deleted`in n&&n.deleted===!0){e.value=e.value.filter(e=>e.id!==n.id),a(n.id);return}let r=n,i=e.value.findIndex(e=>e.id===r.id);i!==-1&&(e.value[i]=r)}catch(e){console.warn(`[mercure] parse error`,e)}},c.onerror=()=>{if(c.readyState===EventSource.CLOSED){a(o);let e=window.setTimeout(()=>{n.delete(o),i(o)},5e3);n.set(o,e)}},t.set(o,c)}catch(e){console.warn(`[mercure] open failed for device `+o,e)}}function a(e){let r=t.get(e);r&&(r.close(),t.delete(e));let i=n.get(e);i!==void 0&&(clearTimeout(i),n.delete(e))}return x(e,e=>{let n=new Set(e.map(e=>e.id));for(let e of n)t.has(e)||i(e);for(let e of[...t.keys()])n.has(e)||a(e)},{immediate:!0,deep:!1}),ie(()=>{for(let e of[...t.keys()])a(e)}),{connectedCount:()=>t.size}}var w=[`src`,`alt`],T={class:`frame-card__body`},E={class:`frame-card__info`},D={class:`frame-card__name`},O={class:`frame-card__status-line`,"aria-live":`polite`},k={class:`frame-card__status-text`},A={key:0,class:`frame-card__sync-line`},j={key:0},M={key:1,class:`frame-card__sync-sep`,"aria-hidden":`true`},N={key:2},P={key:1,class:`frame-card__count`},F={key:0},I={key:1,"aria-hidden":`true`},L=v(n({__name:`FrameCard`,props:{deviceId:{},name:{},size:{},status:{},orientation:{},model:{},thumbnailUrl:{},photoCount:{},lastSync:{},nextSync:{}},emits:[`add-photo`,`edit`],setup(e){let n=e,r=p(()=>{if(n.size!==`large`)return{};let{width:e,height:t}=S(n.model??`v1`,n.orientation);return{aspectRatio:`${e} / ${t}`}}),i=p(()=>({})),o=p(()=>{switch(n.status){case`ok`:return`Online`;case`sync-fail`:return`Sync issue`;case`offline`:return`Offline`}});return(n,l)=>(s(),b(`div`,{class:_([`frame-card`,`frame-card--${e.size}`,`frame-card--${e.status}`])},[e.size===`large`?(s(),b(`button`,{key:0,class:`frame-card__settings-btn`,type:`button`,"aria-label":`Frame settings`,onClick:l[0]||=t=>n.$emit(`edit`,e.deviceId)},[...l[2]||=[f(`svg`,{width:`18`,height:`18`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.5`,"aria-hidden":`true`},[f(`circle`,{cx:`12`,cy:`12`,r:`3`}),f(`path`,{d:`M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z`})],-1)]])):y(``,!0),f(`div`,{class:`frame-card__preview`,style:a(r.value)},[e.thumbnailUrl?(s(),b(`img`,{key:0,src:e.thumbnailUrl,alt:`Current photo on ${e.name}`,class:`frame-card__img`},null,8,w)):(s(),b(`div`,{key:1,class:`frame-card__empty-preview`,style:a(i.value),"aria-hidden":`true`},[...l[3]||=[f(`svg`,{width:`32`,height:`32`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.5`},[f(`rect`,{x:`3`,y:`3`,width:`18`,height:`18`,rx:`2`}),f(`circle`,{cx:`8.5`,cy:`8.5`,r:`1.5`}),f(`polyline`,{points:`21,15 16,10 5,21`})],-1)]],4))],4),f(`div`,T,[f(`div`,E,[f(`p`,D,d(e.name),1),f(`p`,O,[l[4]||=f(`span`,{class:`frame-card__status-dot`,"aria-hidden":`true`},null,-1),f(`span`,k,d(o.value),1)]),e.size===`large`&&(e.lastSync||e.nextSync)?(s(),b(`p`,A,[e.lastSync?(s(),b(`span`,j,`synced `+d(e.lastSync),1)):y(``,!0),e.lastSync&&e.nextSync?(s(),b(`span`,M,`·`)):y(``,!0),e.nextSync?(s(),b(`span`,N,d(e.nextSync),1)):y(``,!0)])):e.size===`compact`&&e.photoCount!==void 0?(s(),b(`p`,P,d(e.photoCount)+` `+d(e.photoCount===1?`photo`:`photos`),1)):y(``,!0)]),c(de,{variant:e.size===`large`?`primary`:`icon-pill`,"aria-label":`Add photo to ${e.name}`,class:`frame-card__add-btn`,onClick:l[1]||=t=>n.$emit(`add-photo`,e.deviceId)},{default:t(()=>[e.size===`large`?(s(),b(`span`,F,`+ Add Photo`)):(s(),b(`span`,I,`+`))]),_:1},8,[`variant`,`aria-label`])])],2))}}),[[`__scopeId`,`data-v-576f3f64`]]),ge=[`id`,`value`,`type`],R=[`for`],_e=[`id`],ve=v(n({__name:`BaseInput`,props:{modelValue:{default:``},label:{},type:{default:`text`},error:{},id:{}},emits:[`update:modelValue`,`blur`],setup(e,{emit:t}){let n=e,i=t,a=p(()=>n.id??`input-${Math.random().toString(36).slice(2)}`);return(t,n)=>(s(),b(`div`,{class:_([`input-wrap`,{"input-wrap--error":!!e.error,"input-wrap--filled":!!e.modelValue}])},[f(`input`,r({id:a.value},t.$attrs,{value:e.modelValue,type:e.type,class:`input-wrap__field`,placeholder:` `,onInput:n[0]||=e=>i(`update:modelValue`,e.target.value),onBlur:n[1]||=e=>i(`blur`,e)}),null,16,ge),f(`label`,{for:a.value,class:`input-wrap__label`},d(e.label),9,R),e.error?(s(),b(`p`,{key:0,id:`${a.value}-error`,class:`input-wrap__error`,role:`alert`},d(e.error),9,_e)):y(``,!0)],2))}}),[[`__scopeId`,`data-v-c8235ab2`]]),ye={class:`orientation-picker`,role:`radiogroup`,"aria-label":`Display orientation`},z=[`aria-checked`,`aria-label`,`onClick`],B=[`viewBox`],V=[`stroke`,`fill`],H=[`fill`],U={class:`orientation-opt__label`},W={class:`orientation-opt__sub`},be=v(n({__name:`OrientationPicker`,props:{modelValue:{}},emits:[`update:modelValue`],setup(e){let t=[{value:`landscape`,label:`Landscape`,sub:`Ribbon at bottom`,viewBox:`0 0 48 48`,rect:{x:4,y:12,width:40,height:24},ribbon:{x:20,y:36,width:8,height:5}},{value:`portrait`,label:`Portrait`,sub:`Ribbon on left`,viewBox:`0 0 48 48`,rect:{x:12,y:4,width:24,height:40},ribbon:{x:7,y:20,width:5,height:8}}];return(n,a)=>(s(),b(`div`,ye,[(s(),b(g,null,i(t,t=>f(`button`,{key:t.value,type:`button`,role:`radio`,"aria-checked":e.modelValue===t.value,"aria-label":t.label,class:_([`orientation-opt`,{"orientation-opt--active":e.modelValue===t.value}]),onClick:e=>n.$emit(`update:modelValue`,t.value)},[(s(),b(`svg`,{class:`orientation-opt__diagram`,viewBox:t.viewBox,fill:`none`,"aria-hidden":`true`},[f(`rect`,r({ref_for:!0},t.rect,{rx:`2`,stroke:e.modelValue===t.value?`var(--color-primary)`:`currentColor`,"stroke-width":`1.5`,fill:e.modelValue===t.value?`color-mix(in srgb, var(--color-primary) 12%, transparent)`:`var(--color-surface-2)`}),null,16,V),f(`rect`,r({ref_for:!0},t.ribbon,{fill:e.modelValue===t.value?`var(--color-primary)`:`var(--color-text-muted)`,rx:`1`}),null,16,H)],8,B)),f(`span`,U,d(t.label),1),f(`span`,W,d(t.sub),1)],10,z)),64))]))}}),[[`__scopeId`,`data-v-679dae08`]]),xe={class:`home-view`},Se={key:0,class:`home-view__loading`,"aria-live":`polite`},Ce={key:1,class:`home-view__empty`},we={key:2,class:`home-view__single`},Te=[`aria-label`],Ee={class:`home-view__sheet-field`},De={class:`home-view__sheet-field`},Oe={class:`home-view__sheet-field`},ke={key:0,class:`home-view__times-mode`},Ae={class:`home-view__times-list`},je=[`value`,`onChange`],Me=[`value`],Ne=[`value`,`onChange`],Pe=[`value`],Fe=[`value`,`onChange`],Ie=[`aria-label`,`onClick`],Le={key:0,class:`home-view__times-empty`},Re=[`label`],ze=[`value`],Be={key:1,class:`home-view__interval-mode`},Ve={class:`home-view__interval-input-row`},He={class:`home-view__next-update`,"aria-live":`polite`},Ue={class:`home-view__sheet-field`},We={class:`home-view__rotation-checkbox`},Ge={class:`home-view__remove-modal-card`},Ke={class:`home-view__remove-confirm-actions`},qe=[`disabled`],Je=[`disabled`],G=v(n({__name:`HomeView`,setup(n){function r(e){return e.wakeTimes.length>0?1440*60*1e3:e.rotationIntervalMinutes*6e4}function a(e){if(!e.lastSeenAt)return`offline`;let t=Date.now()-new Date(e.lastSeenAt).getTime(),n=r(e);return t<=n?`ok`:t<=2*n?`sync-fail`:`offline`}function m(e){if(!e.lastSeenAt)return null;let t=Date.now()-new Date(e.lastSeenAt).getTime();if(t<6e4)return`just now`;if(t<36e5)return`${Math.round(t/6e4)}m ago`;if(t<864e5)return`${Math.round(t/36e5)}h ago`;let n=Math.round(t/864e5);return n===1?`yesterday`:`${n} days ago`}function _(e){let t=Math.floor(e/60),n=e%60,r=t>=12?`PM`:`AM`,i=t%12;i===0&&(i=12);let a=n===0?``:`:${String(n).padStart(2,`0`)}`;return`${i}${a} ${r}`}function v(e,t){let n=new Intl.DateTimeFormat(`en-GB`,{timeZone:t,hour:`2-digit`,minute:`2-digit`,hour12:!1}).formatToParts(e),r=parseInt(n.find(e=>e.type===`hour`)?.value??`0`,10),i=parseInt(n.find(e=>e.type===`minute`)?.value??`0`,10);return r*60+i}function x(e,t){if(e.length===0)return null;let n=v(new Date,t),r=null,i=1/0;for(let t of e){let e=t>n?t-n:1440+(t-n);e<i&&(i=e,r={minutes:t,today:t>n})}return r}function S(e){let t=null;if(e.nextPollExpectedAt)t=new Date(e.nextPollExpectedAt).getTime();else if(e.wakeTimes.length>0){let t=x(e.wakeTimes,e.timezone||`UTC`);return t?`next sync ~${_(t.minutes)} ${t.today?`today`:`tomorrow`}`:null}else if(e.lastSeenAt)t=new Date(e.lastSeenAt).getTime()+e.rotationIntervalMinutes*6e4;else return null;let n=t-Date.now();if(n<=0)return null;if(n<6e4)return`next sync in <1m`;if(n<36e5)return`next sync in ${Math.round(n/6e4)}m`;if(n<864e5){let n=e.timezone||`UTC`,r=v(new Date(t),n),i=et(new Date(t),n),a=i===0?`today`:i===1?`tomorrow`:`in ${i}d`;return`next sync ~${_(r)} ${a}`}return`next sync in ${Math.round(n/864e5)}d`}function C(e){return e.currentImageId?`/api/devices/${e.id}/preview?v=${e.currentImageId}`:void 0}let w=le(),T=ce(),E=ue(),D=fe();he(),e(async()=>{await E.fetchDevices(),document.addEventListener(`visibilitychange`,O);let e=Number(T.query.setup);e&&($(e),w.replace({query:{...T.query,setup:void 0}}))}),ie(()=>{document.removeEventListener(`visibilitychange`,O)});function O(){document.visibilityState===`visible`&&E.fetchDevices({silent:!0})}let k=l(null);function A(){return window.scrollY>0?!1:(k.value?.scrollTop??0)===0}async function j(){await E.fetchDevices({silent:!0})}let M=l(null),N=null;function P(e){N=e,M.value?.click()}function F(e){let t=e.target,n=t.files?.[0];t.value=``,n&&(D.init(n,N??void 0),N=null,w.push(`/upload`))}let I=[1,2,3,4,5,6,7,8,9,10,11,12],ge=[0,5,10,15,20,25,30,35,40,45,50,55];function R(e){let t=Math.floor(e/60),n=e%60,r=t>=12?`PM`:`AM`,i=t%12;return i===0&&(i=12),{h:i,mm:n,p:r}}function _e(e,t,n){let r=e%12;return n===`PM`&&(r+=12),r*60+t}let ye=[{label:`Americas`,zones:[{value:`America/New_York`,label:`Eastern — New York, Toronto`},{value:`America/Chicago`,label:`Central — Chicago, Mexico City`},{value:`America/Denver`,label:`Mountain — Denver, Calgary`},{value:`America/Phoenix`,label:`Mountain (no DST) — Phoenix`},{value:`America/Los_Angeles`,label:`Pacific — Los Angeles, Vancouver`},{value:`America/Anchorage`,label:`Alaska — Anchorage`},{value:`Pacific/Honolulu`,label:`Hawaii — Honolulu`},{value:`America/Sao_Paulo`,label:`Brasília — São Paulo`},{value:`America/Argentina/Buenos_Aires`,label:`Argentina — Buenos Aires`},{value:`America/Bogota`,label:`Colombia — Bogotá`}]},{label:`Europe`,zones:[{value:`Europe/London`,label:`GMT/BST — London, Dublin`},{value:`Europe/Lisbon`,label:`WET/WEST — Lisbon`},{value:`Europe/Paris`,label:`CET/CEST — Paris, Brussels, Amsterdam`},{value:`Europe/Berlin`,label:`CET/CEST — Berlin, Vienna, Zurich`},{value:`Europe/Stockholm`,label:`CET/CEST — Stockholm, Oslo, Copenhagen`},{value:`Europe/Helsinki`,label:`EET/EEST — Helsinki, Tallinn, Riga`},{value:`Europe/Warsaw`,label:`CET/CEST — Warsaw, Prague, Budapest`},{value:`Europe/Rome`,label:`CET/CEST — Rome, Madrid`},{value:`Europe/Athens`,label:`EET/EEST — Athens, Bucharest`},{value:`Europe/Istanbul`,label:`TRT — Istanbul`},{value:`Europe/Moscow`,label:`MSK — Moscow`}]},{label:`Asia & Pacific`,zones:[{value:`Asia/Dubai`,label:`GST — Dubai, Abu Dhabi`},{value:`Asia/Karachi`,label:`PKT — Karachi, Islamabad`},{value:`Asia/Kolkata`,label:`IST — India`},{value:`Asia/Dhaka`,label:`BST — Dhaka, Bangladesh`},{value:`Asia/Bangkok`,label:`ICT — Bangkok, Jakarta, Hanoi`},{value:`Asia/Singapore`,label:`SGT — Singapore, Kuala Lumpur`},{value:`Asia/Shanghai`,label:`CST — Beijing, Shanghai, Taipei`},{value:`Asia/Seoul`,label:`KST — Seoul`},{value:`Asia/Tokyo`,label:`JST — Tokyo`},{value:`Australia/Sydney`,label:`AEDT/AEST — Sydney, Melbourne`},{value:`Australia/Brisbane`,label:`AEST (no DST) — Brisbane`},{value:`Australia/Perth`,label:`AWST — Perth`},{value:`Pacific/Auckland`,label:`NZDT/NZST — Auckland`}]},{label:`Africa & Middle East`,zones:[{value:`Africa/Cairo`,label:`EET — Cairo`},{value:`Africa/Nairobi`,label:`EAT — Nairobi, East Africa`},{value:`Africa/Johannesburg`,label:`SAST — Johannesburg`},{value:`Africa/Lagos`,label:`WAT — Lagos, West Africa`}]},{label:`UTC`,zones:[{value:`UTC`,label:`UTC — Coordinated Universal Time`}]}],z=l(!1),B=l(!1),V=l(!1),H=l(!1),U=l(null),W=l(``),G=l(`landscape`),K=l(`interval`),q=l([]),J=l(60),Y=l(`UTC`),X=l(`oldest_upload`),Z=l(!1),Ye=[540,1080,720,1260,360,900,450,1170,0];function Xe(){for(let e of Ye)if(!q.value.includes(e)){q.value=[...q.value,e];return}for(let e=0;e<1440;e+=5)if(!q.value.includes(e)){q.value=[...q.value,e];return}}function Ze(e){q.value=q.value.filter((t,n)=>n!==e)}function Q(e,t,n){let r=R(q.value[e]),i=t===`h`?parseInt(n,10):r.h,a=t===`mm`?parseInt(n,10):r.mm,o=t===`p`?n:r.p,s=[...q.value];s[e]=_e(i,a,o),q.value=s}let Qe=p(()=>{let e=U.value;if(!e)return``;let t=e.timezone||`UTC`,n;if(e.nextPollExpectedAt)n=new Date(e.nextPollExpectedAt).getTime();else if(e.lastSeenAt){let r=new Date(e.lastSeenAt).getTime();n=e.wakeTimes.length>0?$e(r,e.wakeTimes,t):r+e.rotationIntervalMinutes*6e4}else return`Next update: when the frame next connects`;return n<Date.now()&&(n=Date.now()),tt(n,t)});function $e(e,t,n){let r=v(new Date(e),n),i=1/0;for(let e of t){let t=e-r;t<=0&&(t+=1440),t<i&&(i=t)}return e+i*6e4}function et(e,t){let n=new Intl.DateTimeFormat(`en-CA`,{timeZone:t,year:`numeric`,month:`2-digit`,day:`2-digit`}),r=Date.parse(n.format(new Date)+`T00:00:00Z`),i=Date.parse(n.format(e)+`T00:00:00Z`);return Math.round((i-r)/864e5)}function tt(e,t){let n=e-Date.now();if(n<=0)return`Next update: any moment`;if(n<9e4)return`Next update: in <1 min`;if(n<36e5)return`Next update: in ~${Math.round(n/6e4)} min`;let r=v(new Date(e),t),i=et(new Date(e),t),a=i===0?`today`:i===1?`tomorrow`:`in ${i} days`;return`Next update: ~${_(r)} ${a}`}function $(e){let t=E.devices.find(t=>t.id===e);t&&(U.value=t,W.value=t.name,G.value=t.orientation,Y.value=t.timezone??`UTC`,J.value=t.rotationIntervalMinutes,q.value=[...t.wakeTimes],K.value=t.wakeTimes.length>0?`times`:`interval`,X.value=t.rotationMode,Z.value=t.prioritizeNeverShown,H.value=!1,z.value=!0)}async function nt(){if(U.value){V.value=!0;try{await E.removeDevice(U.value.id),z.value=!1,H.value=!1}finally{V.value=!1}}}async function rt(){if(U.value){B.value=!0;try{let e={name:W.value.trim()||U.value.name,orientation:G.value,timezone:Y.value,rotationMode:X.value,prioritizeNeverShown:Z.value};K.value===`times`?e.wakeTimes=[...q.value]:(e.wakeTimes=[],e.rotationIntervalMinutes=Math.max(1,Math.min(1440,J.value||1))),await E.updateDevice(U.value.id,e),z.value=!1}finally{B.value=!1}}}return(e,n)=>(s(),b(g,null,[f(`main`,xe,[c(me,{"is-at-top":A,"on-refresh":j},{default:t(()=>[o(E).loading?(s(),b(`div`,Se,` Loading… `)):o(E).devices.length===0?(s(),b(`div`,Ce,[...n[11]||=[f(`div`,{class:`home-view__empty-card`},[f(`svg`,{class:`home-view__empty-icon`,width:`48`,height:`48`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.5`,"aria-hidden":`true`},[f(`rect`,{x:`3`,y:`3`,width:`18`,height:`18`,rx:`2`}),f(`circle`,{cx:`8.5`,cy:`8.5`,r:`1.5`}),f(`polyline`,{points:`21,15 16,10 5,21`})]),f(`p`,{class:`home-view__empty-title`},`Set up your first frame`),f(`p`,{class:`home-view__empty-sub`},` Power on your WeVisto frame and scan the QR code it displays to get started. `)],-1)]])):o(E).devices.length===1?(s(),b(`div`,we,[c(L,{deviceId:o(E).devices[0].id,name:o(E).devices[0].name,size:`large`,status:a(o(E).devices[0]),orientation:o(E).devices[0].orientation,model:o(E).devices[0].model,thumbnailUrl:C(o(E).devices[0]),lastSync:m(o(E).devices[0]),nextSync:S(o(E).devices[0]),onAddPhoto:P,onEdit:$},null,8,[`deviceId`,`name`,`status`,`orientation`,`model`,`thumbnailUrl`,`lastSync`,`nextSync`])])):(s(),b(`div`,{key:3,ref_key:`stackEl`,ref:k,class:`home-view__stack`,role:`list`,"aria-label":`Frames`},[(s(!0),b(g,null,i(o(E).devices,e=>(s(),b(`div`,{key:e.id,class:`home-view__slide`,role:`listitem`,"aria-label":e.name},[c(L,{deviceId:e.id,name:e.name,size:`large`,status:a(e),orientation:e.orientation,model:e.model,thumbnailUrl:C(e),lastSync:m(e),nextSync:S(e),onAddPhoto:P,onEdit:$},null,8,[`deviceId`,`name`,`status`,`orientation`,`model`,`thumbnailUrl`,`lastSync`,`nextSync`])],8,Te))),128))],512))]),_:1}),f(`input`,{ref_key:`fileInputEl`,ref:M,type:`file`,accept:`image/jpeg,image/png,image/webp,image/gif`,hidden:``,onChange:F},null,544)]),c(pe,{modelValue:z.value,"onUpdate:modelValue":n[8]||=e=>z.value=e,label:`Frame settings`},{default:t(()=>[n[24]||=f(`h2`,{class:`home-view__sheet-title`},`Frame settings`,-1),f(`div`,Ee,[c(ve,{modelValue:W.value,"onUpdate:modelValue":n[0]||=e=>W.value=e,label:`Frame name`,maxlength:`100`},null,8,[`modelValue`])]),f(`div`,De,[n[12]||=f(`p`,{class:`home-view__sheet-label`},`Orientation`,-1),c(be,{modelValue:G.value,"onUpdate:modelValue":n[1]||=e=>G.value=e},null,8,[`modelValue`])]),f(`div`,Oe,[n[19]||=f(`p`,{class:`home-view__sheet-label`},`Update frequency`,-1),u(f(`select`,{class:`home-view__mode-select`,"onUpdate:modelValue":n[2]||=e=>K.value=e,"aria-label":`Update frequency mode`},[...n[13]||=[f(`option`,{value:`times`},`At specific time(s)`,-1),f(`option`,{value:`interval`},`Every X minutes`,-1)]],512),[[h,K.value]]),K.value===`times`?(s(),b(`div`,ke,[f(`div`,Ae,[(s(!0),b(g,null,i(q.value,(e,t)=>(s(),b(`div`,{key:t,class:`home-view__time-row`},[f(`select`,{class:`home-view__time-part`,value:R(e).h,"aria-label":`Hour`,onChange:e=>Q(t,`h`,e.target.value)},[(s(),b(g,null,i(I,e=>f(`option`,{key:e,value:e},d(e),9,Me)),64))],40,je),n[16]||=f(`span`,{class:`home-view__time-sep`},`:`,-1),f(`select`,{class:`home-view__time-part`,value:R(e).mm,"aria-label":`Minutes`,onChange:e=>Q(t,`mm`,e.target.value)},[(s(),b(g,null,i(ge,e=>f(`option`,{key:e,value:e},d(String(e).padStart(2,`0`)),9,Pe)),64))],40,Ne),f(`select`,{class:`home-view__time-part home-view__time-part--ampm`,value:R(e).p,"aria-label":`AM or PM`,onChange:e=>Q(t,`p`,e.target.value)},[...n[14]||=[f(`option`,{value:`AM`},`AM`,-1),f(`option`,{value:`PM`},`PM`,-1)]],40,Fe),f(`button`,{type:`button`,class:`home-view__time-remove`,"aria-label":`Remove ${_(e)}`,onClick:e=>Ze(t)},[...n[15]||=[f(`svg`,{width:`18`,height:`18`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"aria-hidden":`true`},[f(`polyline`,{points:`3 6 5 6 21 6`}),f(`path`,{d:`M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6`}),f(`path`,{d:`M10 11v6`}),f(`path`,{d:`M14 11v6`})],-1)]],8,Ie)]))),128)),q.value.length===0?(s(),b(`p`,Le,`No update times yet — add one below.`)):y(``,!0)]),f(`button`,{type:`button`,class:`home-view__time-add`,onClick:Xe},`+ Add time`),u(f(`select`,{class:`home-view__tz-select`,"onUpdate:modelValue":n[3]||=e=>Y.value=e},[(s(),b(g,null,i(ye,e=>f(`optgroup`,{key:e.label,label:e.label},[(s(!0),b(g,null,i(e.zones,e=>(s(),b(`option`,{key:e.value,value:e.value},d(e.label),9,ze))),128))],8,Re)),64))],512),[[h,Y.value]])])):(s(),b(`div`,Be,[f(`div`,Ve,[n[17]||=f(`span`,null,`Every`,-1),u(f(`input`,{type:`number`,inputmode:`numeric`,pattern:`[0-9]*`,min:`1`,max:`1440`,class:`home-view__interval-input`,"onUpdate:modelValue":n[4]||=e=>J.value=e,"aria-label":`Update interval in minutes`},null,512),[[oe,J.value,void 0,{number:!0}]]),n[18]||=f(`span`,null,`minutes`,-1)])])),f(`p`,He,d(Qe.value),1),n[20]||=f(`p`,{class:`home-view__propagation-note`},` Changes will only take effect at the next device update. To force an immediate refresh, briefly disconnect and reconnect the frame’s power. `,-1)]),f(`div`,Ue,[n[23]||=f(`p`,{class:`home-view__sheet-label`},`Image selection`,-1),u(f(`select`,{class:`home-view__mode-select`,"onUpdate:modelValue":n[5]||=e=>X.value=e,"aria-label":`Image selection mode`},[...n[21]||=[f(`option`,{value:`oldest_upload`},`Oldest upload first`,-1),f(`option`,{value:`newest_upload`},`Newest upload first`,-1),f(`option`,{value:`least_recently_shown`},`Least recently shown`,-1),f(`option`,{value:`random`},`Random`,-1)]],512),[[h,X.value]]),f(`label`,We,[u(f(`input`,{type:`checkbox`,"onUpdate:modelValue":n[6]||=e=>Z.value=e},null,512),[[ne,Z.value]]),n[22]||=f(`span`,null,`Show never-shown images first`,-1)])]),c(de,{variant:`primary`,class:`home-view__sheet-save`,disabled:B.value,onClick:rt},{default:t(()=>[se(d(B.value?`Saving…`:`Save`),1)]),_:1},8,[`disabled`]),f(`button`,{type:`button`,class:`home-view__remove`,onClick:n[7]||=e=>H.value=!0},`Remove this frame`)]),_:1},8,[`modelValue`]),(s(),ee(ae,{to:`body`},[c(te,{name:`home-view__remove-modal`},{default:t(()=>[H.value?(s(),b(`div`,{key:0,class:`home-view__remove-modal`,role:`alertdialog`,"aria-labelledby":`remove-confirm-title`,onClick:n[10]||=re(e=>H.value=!1,[`self`])},[f(`div`,Ge,[n[25]||=f(`p`,{class:`home-view__remove-confirm-title`,id:`remove-confirm-title`},` Remove this frame? `,-1),n[26]||=f(`p`,{class:`home-view__remove-confirm-body`},` Use this if you’re selling or giving away the frame. It deletes this frame from your account and unlinks it from your photos so the next owner can claim it fresh. This can’t be undone. `,-1),n[27]||=f(`p`,{class:`home-view__remove-confirm-aside`},` On the frame itself, the new owner can also do a factory reset by holding the small button on the back until the screen starts to flash. (If they only tap it briefly, the frame just refreshes its current image — keep holding until it flashes.) `,-1),f(`div`,Ke,[f(`button`,{type:`button`,class:`home-view__remove-cancel`,disabled:V.value,onClick:n[9]||=e=>H.value=!1},`Cancel`,8,qe),f(`button`,{type:`button`,class:`home-view__remove-confirm-btn`,disabled:V.value,onClick:nt},d(V.value?`Removing…`:`Yes, remove`),9,Je)])])])):y(``,!0)]),_:1})]))],64))}}),[[`__scopeId`,`data-v-7458107d`]]);export{G as default}; |