https://trynow.ai/_nuxt/67FGdu0n.js

1import{a7 as O,cd as Y,cc as A,c1 as G,bO as H,ct as W,Y as d,R as t,bz as a,aT as $,a5 as r,cz as p,a4 as h,bo as i,f as b,be as z,O as L,v as J,w as K,b2 as c,y as Q,U as X,aR as Z,W as ee,bb as te,b7 as ae}from"./CR0f8w3d.js";import{_ as le}from"./Dj8IJA2B.js";import{_ as oe}from"./Bmu_bt15.js";import{_ as se}from"./Ttt_SCdm.js";import{n as re}from"./5KGBOyEp.js";import{u as ie}from"./Drwiatqs.js";import{u as ne}from"./CEatvPyj.js";import{u as ce}from"./C6AWRA15.js";import{u as de}from"./D9U5TwCT.js";import{u as ue}from"./B1JM-ujc.js";import"./CTqZoBb7.js";import"./Ds1EKDz4.js";import"./XFJcC5M_.js";import"./D9EczBdA.js";import"./CxT0_RJ6.js";import"./BQpmNT64.js";import"./DIbV7pgs.js";import"./3YiafU0C.js";import"./DDASow36.js";import"./Dv7XJYq1.js";import"./osFJBD5T.js";const me={class:"relative isolate flex flex-1 flex-col"},pe={class:"absolute inset-x-0 top-0 -z-10 h-[40rem] overflow-hidden tall:h-[80vh]"},ge=["src"],he={class:"mx-auto flex w-full max-w-[1048px] flex-1 flex-col items-start px-6 pb-10 pt-20 sm:pt-24 md:pb-30"},fe={class:"mb-10 flex animate-fade-up flex-col items-start gap-3 text-left"},_e={class:"inline-flex items-center gap-2 rounded-full bg-black/5 px-3 py-1 text-xs font-medium uppercase tracking-wide text-highlighted ring-1 ring-default backdrop-blur dark:bg-white/10 dark:text-white/90 dark:ring-white/15"},be={class:"flex items-center gap-2"},ve={class:"text-3xl font-bold leading-tight tracking-tight text-highlighted sm:text-4xl"},ye={class:"max-w-2xl text-base leading-relaxed text-toned dark:text-white/85"},xe={class:"grid w-full gap-x-6 gap-y-6 md:grid-cols-2 md:gap-y-4"},ke=["src","alt"],we={class:"flex flex-col gap-4"},$e={class:"grid grid-cols-4 gap-1.5"},ze={class:"flex items-center gap-3"},Ie=["src"],Ce={class:"text-xs text-muted"},Re={class:"mt-8 w-full"},Te={class:"mb-3 text-lg font-semibold tracking-tight"},Se={key:0,class:"grid grid-cols-2 gap-3 sm:grid-cols-3 md:grid-cols-4"},Le=["disabled","onClick"],Pe=["src","alt"],Fe={key:0,class:"absolute inset-0 grid place-items-center bg-black/40"},Ue={class:"flex flex-col gap-1 p-2"},Ve={class:"truncate text-sm font-medium"},De={class:"text-xs text-muted"},Ee={key:1,class:"flex flex-col items-center gap-2 rounded-xl border border-default bg-elevated py-10 text-center"},Be={class:"text-sm text-muted"},it=O({__name:"index",setup(qe){const u=ce("collage-card-maker"),s=ie(),v=Y(),I=A(),f=G(),y=typeof I.query.template=="string"?I.query.template:null;y?v.replace({path:f("/collage-card-maker/result"),query:{template:y}}):de(u,"start");const{loadTemplate:P,loadingTemplateId:C,TEMPLATES_API:R}=ne(),F=ue(),T=L(()=>F.value==="dark"),U=L(()=>T.value?"background: linear-gradient(180deg, rgba(0, 0, 0, 0) 45%, var(--ui-bg) 100%), linear-gradient(180deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.72) 100%);":"background: linear-gradient(180deg, rgba(255, 255, 255, 0) 45%, var(--ui-bg) 100%), linear-gradient(180deg, rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0.82) 100%);"),V=[1,2,3,4],S=te(null);async function D(e){const o=e.target.files?.[0];o&&(s.styleImage.value=await re(o,{maxDimension:1024,quality:.8}),e.target.value="")}function E(){s.baseImage.value=null,s.layers.value=[],s.templateTitle.value=null,s.templateId.value=null,v.push(f("/collage-card-maker/edit"))}const{data:x}=H(R,{server:!1,lazy:!0,immediate:!y,default:()=>({templates:[]})},"$cYtR8E4c5r"),k=ae({});function _(e){return e.slots&&e.aspectRatio?{slots:e.slots,aspectRatio:e.aspectRatio}:k[e.id]??null}W(()=>x.value?.templates,async e=>{for(const o of e??[])if(!(o.slots&&o.aspectRatio||k[o.id]))try{const m=await $fetch(`${R}/${o.id}`);k[o.id]={aspectRatio:m.base.width/m.base.height,slots:m.layers.filter(n=>n.isPlaceholder).map(n=>({x:n.x,y:n.y,w:n.w,h:n.h,rotation:n.rotation}))}}catch{}},{immediate:!0});function B(e){return P(e.id,e.title).then(()=>v.push(f("/collage-card-maker/result"))).catch(()=>{})}return(e,o)=>{const m=J,n=K,q=le,w=oe,N=Q,j=se;return c(),d("div",me,[t("div",pe,[t("img",{src:a(u).images.thumbnail,alt:"","aria-hidden":"true",decoding:"async",class:"size-full scale-110 object-cover blur-xl"},null,8,ge),t("div",{class:"absolute inset-0",style:$(a(U))},null,4)]),t("div",he,[r(m,{variant:"ghost",icon:"i-lucide-arrow-left",to:a(f)("/"),class:"mb-6 text-highlighted hover:bg-black/5 dark:hover:bg-white/10"},{default:p(()=>[h(i(e.$t("shell.back")),1)]),_:1},8,["to"]),t("header",fe,[t("span",_e,[r(n,{name:`i-lucide-${a(u).icon}`,class:"size-3.5 text-(--ui-primary)"},null,8,["name"]),h(" "+i(a(u).category),1)]),t("div",be,[t("h1",ve,i(a(u).title),1),r(q,{tryout:a(u),"on-dark":a(T)},null,8,["tryout","on-dark"])]),t("p",ye,i(a(u).description),1)]),t("div",xe,[t("img",{src:a(u).images.cover,alt:a(u).title,class:"h-auto w-full rounded-2xl"},null,8,ke),r(j,null,{default:p(()=>[t("div",we,[r(w,{label:e.$t("t.collage-card-maker.placeholdersLabel")},{default:p(()=>[t("div",$e,[(c(),d(b,null,z(V,l=>r(m,{key:l,variant:a(s).placeholders.value===l?"solid":"soft",color:a(s).placeholders.value===l?"primary":"neutral",block:"",onClick:g=>a(s).placeholders.value=l},{default:p(()=>[h(i(l),1)]),_:2},1032,["variant","color","onClick"])),64))])]),_:1},8,["label"]),r(w,{label:e.$t("t.collage-card-maker.styleLabel"),hint:e.$t("t.collage-card-maker.optional")},{default:p(()=>[r(N,{modelValue:a(s).stylePrompt.value,"onUpdate:modelValue":o[0]||(o[0]=l=>a(s).stylePrompt.value=l),placeholder:e.$t("t.collage-card-maker.stylePlaceholder"),rows:2,autoresize:"",class:"w-full"},null,8,["modelValue","placeholder"])]),_:1},8,["label","hint"]),r(w,{label:e.$t("t.collage-card-maker.styleImageLabel"),hint:e.$t("t.collage-card-maker.optional")},{default:p(()=>[t("input",{ref_key:"styleInputEl",ref:S,type:"file",accept:"image/*",class:"hidden",onChange:D},null,544),t("div",ze,[a(s).styleImage.value?(c(),d(b,{key:0},[t("img",{src:a(s).styleImage.value,alt:"",class:"size-14 rounded-lg border border-default object-cover"},null,8,Ie),r(m,{size:"xs",variant:"ghost",color:"neutral",icon:"i-lucide-x",onClick:o[1]||(o[1]=l=>a(s).styleImage.value=null)},{default:p(()=>[h(i(e.$t("t.collage-card-maker.removeStyleImage")),1)]),_:1})],64)):(c(),X(m,{key:1,size:"sm",variant:"soft",color:"neutral",icon:"i-lucide-image-plus",onClick:o[2]||(o[2]=l=>a(S)?.click())},{default:p(()=>[h(i(e.$t("t.collage-card-maker.addStyleImage")),1)]),_:1}))])]),_:1},8,["label","hint"]),r(m,{color:"primary",size:"xl",icon:"i-lucide-wand-sparkles",block:"",onClick:E},{default:p(()=>[h(i(e.$t("t.collage-card-maker.generateDesign")),1)]),_:1}),t("p",Ce,i(e.$t("t.collage-card-maker.designHint")),1)])]),_:1})]),t("div",Re,[t("h2",Te,i(e.$t("t.collage-card-maker.templatesHeading")),1),a(x)?.templates?.length?(c(),d("div",Se,[(c(!0),d(b,null,z(a(x).templates,l=>(c(),d("button",{key:l.id,type:"button",class:"group flex flex-col overflow-hidden rounded-xl border border-default bg-elevated text-left transition hover:border-(--ui-primary)/50 hover:shadow-md",disabled:a(C)!==null,onClick:g=>B(l)},[t("div",{class:Z(["relative w-full overflow-hidden",!_(l)?.aspectRatio&&"aspect-[3/4]"]),style:$(_(l)?.aspectRatio?{aspectRatio:String(_(l).aspectRatio)}:void 0)},[t("img",{src:l.thumbnail,alt:l.title,class:"size-full object-cover transition group-hover:scale-[1.02]"},null,8,Pe),(c(!0),d(b,null,z(_(l)?.slots,(g,M)=>(c(),d("div",{key:M,class:"pointer-events-none absolute rounded-sm border-4 border-white bg-white/30 shadow-[0_0_0_1px_rgba(0,0,0,0.5)]",style:$({left:`${g.x*100}%`,top:`${g.y*100}%`,width:`${g.w*100}%`,height:`${g.h*100}%`,transform:g.rotation?`rotate(${g.rotation}deg)`:void 0})},null,4))),128)),a(C)===l.id?(c(),d("div",Fe,[r(n,{name:"i-lucide-loader-circle",class:"size-6 animate-spin text-white"}

1)])):ee("",!0)],6),t("div",Ue,[t("p",Ve,i(l.title),1),t("p",De,i(e.$t("t.collage-card-maker.photoSlots",{count:l.placeholders})),1)])],8,Le))),128))])):(c(),d("div",Ee,[r(n,{name:"i-lucide-layout-template",class:"size-8 text-muted"}),t("p",Be,i(e.$t("t.collage-card-maker.noTemplatesYet")),1)]))])])])}}});export{it as default};