Files
pictureFrame-webApp/public/build/assets/SettingsView-_97MLfM_.js
T
football2801 59f5e6e0eb
CI / test (push) Has been cancelled
polish(design-v2): settings reorder + section cards + cog + yellow active
User-reported gaps:
- Settings section order: Account top, Theme middle, Design bottom,
  Install at end (was Install/Design/Theme/Account)
- Settings sections wrapped in glass cards with backdrop blur so they
  read against the harbor backdrop (was flat text)
- Desktop settings now 2-column grid; section cards pack in pairs
- FrameCard cog button: was white-opaque, now dark glass with light
  icon so it sits cleanly on the v2 dark photo backdrop
- Orientation picker active state: yellow border + yellow diagram tint
  (was theme primary which clashed with the dusks aesthetic)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-15 16:51:03 -04:00

1 line
8.5 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import{C as e,F as t,J as n,K as r,N as i,U as a,V as o,Y as s,f as c,g as l,h as u,p as ee,q as d,t as f,u as p,v as m,x as h,y as g}from"./_plugin-vue_export-helper-BNDVmFr7.js";import{n as te,r as ne,t as re}from"./index-CToMjSpo.js";var _=a(null),v=a(!1);function y(){return typeof window>`u`?!1:window.matchMedia?.(`(display-mode: standalone)`).matches?!0:window.navigator.standalone===!0}function b(){if(typeof navigator>`u`)return!1;let e=navigator.userAgent,t=e.includes(`Mac`)&&navigator.maxTouchPoints>1;return/iPhone|iPod/.test(e)||t}var x=!1;function S(){x||typeof window>`u`||(x=!0,v.value=y(),window.addEventListener(`beforeinstallprompt`,e=>{e.preventDefault(),_.value=e}),window.addEventListener(`appinstalled`,()=>{_.value=null,v.value=!0}),window.matchMedia?.(`(display-mode: standalone)`).addEventListener(`change`,e=>{v.value=e.matches}))}S();function ie(){let e=b(),t=u(()=>_.value!==null);async function n(){let e=_.value;if(!e)return!1;await e.prompt();let t=await e.userChoice;return _.value=null,t.outcome===`accepted`}return{isStandalone:v,isIOS:e,canPromptInstall:t,install:n}}var ae={class:`settings`},oe={class:`settings__section`},se={class:`settings__row`},ce={class:`settings__row-value`},le={class:`settings__section`},ue={class:`theme-grid`,role:`radiogroup`,"aria-label":`Choose theme`},de=[`aria-checked`,`aria-label`,`onClick`],fe={class:`theme-swatch__label`},C={key:0,class:`theme-swatch__check`,"aria-hidden":`true`},w={class:`settings__section`},T={class:`design-toggle`,role:`radiogroup`,"aria-label":`Design version`},E=[`aria-checked`],D=[`aria-checked`],O={key:0,class:`settings__section`},k={class:`install-modal__card`},A={class:`pw-form__field`},j={class:`pw-form__field`},M={class:`pw-form__field`},N=[`aria-invalid`],P={key:0,class:`pw-form__error`},F={key:0,class:`pw-form__error`,role:`alert`},I={key:1,class:`pw-form__success`,role:`status`},L=[`disabled`],R={class:`install-modal__card`},pe={id:`install-modal-title`,class:`install-modal__title`},z={class:`install-modal__steps`},B={key:0},me={key:1},he={key:0},V=f(e({__name:`SettingsView`,setup(e){let f=ne(),{saveTheme:_}=te(),{isStandalone:v,isIOS:y,canPromptInstall:b,install:x}=ie(),S=u(()=>f.user?.theme??`warm-craft`),V=u(()=>f.user?.designVersion??`v1`),H=a(!1);function ge(e){_(e)}async function U(e){if(V.value===e)return;let t=V.value;f.user&&(f.user.designVersion=e),document.documentElement.setAttribute(`data-design`,e);try{if(!(await fetch(`/api/user/design`,{method:`PATCH`,headers:{"Content-Type":`application/json`},body:JSON.stringify({designVersion:e})})).ok)throw Error(`save failed`)}catch{f.user&&(f.user.designVersion=t),document.documentElement.setAttribute(`data-design`,t)}}async function W(){!await x()&&!b.value&&(H.value=!0)}let G=a(!1),K=a(``),q=a(``),J=a(``),Y=a(!1),X=a(null),Z=a(!1),Q=u(()=>J.value.length>0&&J.value!==q.value);function _e(){K.value=``,q.value=``,J.value=``,X.value=null,Z.value=!1,Y.value=!1}function $(){G.value=!1,_e()}async function ve(){if(!Q.value){X.value=null,Z.value=!1,Y.value=!0;try{let e=await fetch(`/api/user/password`,{method:`PATCH`,headers:{"Content-Type":`application/json`},body:JSON.stringify({currentPassword:K.value,newPassword:q.value})});if(e.status===204){Z.value=!0,K.value=``,q.value=``,J.value=``,setTimeout($,1500);return}X.value=(await e.json().catch(()=>({})))?.error??`Could not update password.`}catch{X.value=`Network error. Try again.`}finally{Y.value=!1}}}return(e,a)=>(i(),g(`main`,ae,[a[33]||=l(`h1`,{class:`settings__title`},`Settings`,-1),l(`section`,oe,[a[10]||=l(`h2`,{class:`settings__section-title`},`Account`,-1),l(`div`,se,[a[9]||=l(`span`,{class:`settings__row-label`},`Signed in as`,-1),l(`span`,ce,s(r(f).user?.email),1)]),l(`button`,{type:`button`,class:`settings__action-link`,onClick:a[0]||=e=>G.value=!0},` Change password `),a[11]||=l(`a`,{href:`/logout`,class:`settings__logout`},`Sign out`,-1)]),l(`section`,le,[a[13]||=l(`h2`,{class:`settings__section-title`},`Theme`,-1),l(`div`,ue,[(i(!0),g(ee,null,t(r(re),e=>(i(),g(`button`,{key:e.id,type:`button`,role:`radio`,"aria-checked":S.value===e.id,"aria-label":e.label,class:d([`theme-swatch`,{"theme-swatch--active":S.value===e.id}]),style:n({"--swatch-bg":e.bg,"--swatch-primary":e.primary,"--swatch-text":e.text}),onClick:t=>ge(e.id)},[a[12]||=l(`span`,{class:`theme-swatch__preview`,"aria-hidden":`true`},[l(`span`,{class:`theme-swatch__bar`}),l(`span`,{class:`theme-swatch__dot`})],-1),l(`span`,fe,s(e.label),1),S.value===e.id?(i(),g(`span`,C,``)):m(``,!0)],14,de))),128))])]),l(`section`,w,[a[16]||=l(`h2`,{class:`settings__section-title`},`Design (beta)`,-1),a[17]||=l(`p`,{class:`settings__hint`},` Try the new atmospheric look. Your theme picks above still apply — v2 just renders them as dusks over a Camogli harbor backdrop. `,-1),l(`div`,T,[l(`button`,{type:`button`,role:`radio`,"aria-checked":V.value===`v1`,class:d([`design-toggle__opt`,{"design-toggle__opt--active":V.value===`v1`}]),onClick:a[1]||=e=>U(`v1`)},[...a[14]||=[l(`span`,{class:`design-toggle__label`},`Original`,-1),l(`span`,{class:`design-toggle__sub`},`cream & terracotta`,-1)]],10,E),l(`button`,{type:`button`,role:`radio`,"aria-checked":V.value===`v2`,class:d([`design-toggle__opt`,{"design-toggle__opt--active":V.value===`v2`}]),onClick:a[2]||=e=>U(`v2`)},[...a[15]||=[l(`span`,{class:`design-toggle__label`},`Atmospheric`,-1),l(`span`,{class:`design-toggle__sub`},`harbor dusks · beta`,-1)]],10,D)])]),r(v)?m(``,!0):(i(),g(`section`,O,[a[18]||=l(`h2`,{class:`settings__section-title`},`Install app`,-1),a[19]||=l(`p`,{class:`settings__hint`},` Pin WeVisto to your home screen so it opens like a native app. `,-1),r(b)?(i(),g(`button`,{key:0,type:`button`,class:`settings__install`,onClick:W},` Install WeVisto `)):(i(),g(`button`,{key:1,type:`button`,class:`settings__install`,onClick:a[3]||=e=>H.value=!0},` Add to Home Screen `))])),G.value?(i(),g(`div`,{key:1,class:`install-modal`,role:`dialog`,"aria-modal":`true`,"aria-labelledby":`pw-modal-title`,onClick:c($,[`self`])},[l(`div`,k,[l(`button`,{type:`button`,class:`install-modal__close`,"aria-label":`Close`,onClick:$},`×`),a[24]||=l(`h2`,{id:`pw-modal-title`,class:`install-modal__title`},`Change password`,-1),l(`form`,{class:`pw-form`,onSubmit:c(ve,[`prevent`])},[l(`label`,A,[a[20]||=l(`span`,{class:`pw-form__label`},`Current password`,-1),o(l(`input`,{"onUpdate:modelValue":a[4]||=e=>K.value=e,type:`password`,autocomplete:`current-password`,required:``,class:`pw-form__input`},null,512),[[p,K.value]])]),l(`label`,j,[a[21]||=l(`span`,{class:`pw-form__label`},`New password`,-1),o(l(`input`,{"onUpdate:modelValue":a[5]||=e=>q.value=e,type:`password`,autocomplete:`new-password`,minlength:`8`,required:``,class:`pw-form__input`},null,512),[[p,q.value]]),a[22]||=l(`span`,{class:`pw-form__hint`},`At least 8 characters.`,-1)]),l(`label`,M,[a[23]||=l(`span`,{class:`pw-form__label`},`Confirm new password`,-1),o(l(`input`,{"onUpdate:modelValue":a[6]||=e=>J.value=e,type:`password`,autocomplete:`new-password`,required:``,class:`pw-form__input`,"aria-invalid":Q.value?`true`:`false`},null,8,N),[[p,J.value]]),Q.value?(i(),g(`span`,P,`Passwords don't match.`)):m(``,!0)]),X.value?(i(),g(`p`,F,s(X.value),1)):m(``,!0),Z.value?(i(),g(`p`,I,`Password updated.`)):m(``,!0),l(`button`,{type:`submit`,class:`settings__install`,disabled:Y.value||Q.value||!K.value||!q.value},s(Y.value?`Saving…`:`Update password`),9,L)],32)])])):m(``,!0),H.value?(i(),g(`div`,{key:2,class:`install-modal`,role:`dialog`,"aria-modal":`true`,"aria-labelledby":`install-modal-title`,onClick:a[8]||=c(e=>H.value=!1,[`self`])},[l(`div`,R,[l(`button`,{type:`button`,class:`install-modal__close`,"aria-label":`Close`,onClick:a[7]||=e=>H.value=!1},`×`),l(`h2`,pe,s(r(y)?`Add to your iPhone home screen`:`Add to your home screen`),1),l(`ol`,z,[r(y)?(i(),g(`li`,B,[...a[25]||=[h(` Tap the `,-1),l(`strong`,null,`Share`,-1),h(` icon at the bottom of Safari (the square with an up-arrow). `,-1)]])):(i(),g(`li`,me,[...a[26]||=[h(` Open your browser's menu (usually the three dots `,-1),l(`strong`,null,``,-1),h(` in the top right). `,-1)]])),l(`li`,null,[a[28]||=h(` Scroll down and tap `,-1),a[29]||=l(`strong`,null,`Add to Home Screen`,-1),r(y)?m(``,!0):(i(),g(`span`,he,[...a[27]||=[h(`or `,-1),l(`strong`,null,`Install app`,-1)]])),a[30]||=h(`. `,-1)]),a[31]||=l(`li`,null,[h(` Tap `),l(`strong`,null,`Add`),h(` in the top right to confirm. `)],-1)]),a[32]||=l(`p`,{class:`install-modal__footer`},` The app will appear on your home screen. Open it from there and it runs like a regular app — no address bar, no tabs. `,-1)])])):m(``,!0)]))}}),[[`__scopeId`,`data-v-534eb134`]]);export{V as default};