https://www.trainwithkickoff.com/_next/static/chunks/6753.860fae63b09d6af9.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[6753],{94783:function(e,t,n){"use strict";n.r(t),n.d(t,{default:function(){return D}});var s=n(73292),a=n(76341),o=n(67462),r=n(93128),i=n(85893),c=n(93568),l=n(13946),d=n(71689),_=n(82946),u=n(67294),h=n(93967),x=n.n(h),g=n(796),f=n(84420),p=n.n(f),y=n(9076),w=function(e){var t=e.className;return(0,i.jsx)("svg",{width:"18",height:"19",viewBox:"0 0 18 19",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:t,children:(0,i.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M15 0.501404H3C1.34315 0.501404 0 1.84455 0 3.5014V15.5014C0 17.1583 1.34315 18.5014 3 18.5014H15C16.6569 18.5014 18 17.1583 18 15.5014V3.5014C18 1.84455 16.6569 0.501404 15 0.501404ZM16 15.5014C16 16.0537 15.5523 16.5014 15 16.5014H3C2.44772 16.5014 2 16.0537 2 15.5014V3.5014C2 2.94912 2.44772 2.5014 3 2.5014H15C15.5523 2.5014 16 2.94912 16 3.5014V15.5014ZM7.92121 10.8914L11.7012 5.89139H11.6912C12.0281 5.44956 12.6594 5.36449 13.1012 5.70139C13.543 6.03828 13.6281 6.66956 13.2912 7.11139L8.72121 13.1114C8.53241 13.3566 8.2407 13.5006 7.93121 13.5014C7.62343 13.503 7.33203 13.3629 7.14121 13.1214L4.71121 10.0114C4.37155 9.57508 4.4499 8.94604 4.88621 8.60639C5.32251 8.26673 5.95155 8.34508 6.29121 8.78139L7.92121 10.8914Z",fill:"#830051"})})},m=n(78514),v=n.n(m),C=function(e){var t=e.className;return(0,i.jsx)("svg",{width:"18",height:"19",viewBox:"0 0 18 19",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:t,children:(0,i.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M15 18.5014H3H3C1.34315 18.5014 0 17.1583 0 15.5014V3.5014V3.5014C-2.50178e-07 1.84455 1.34315 0.501404 3 0.501404H15C16.6569 0.501404 18 1.84455 18 3.5014V15.5014C18 17.1583 16.6569 18.5014 15 18.5014ZM3 2.5014C2.44772 2.5014 2 2.94912 2 3.5014V15.5014C2 16.0537 2.44772 16.5014 3 16.5014H15C15.5523 16.5014 16 16.0537 16 15.5014V3.5014C16 2.94912 15.5523 2.5014 15 2.5014L3 2.5014Z",fill:"#E0E0E0"})})},j=n(1802),k={sm:18},b=function(e){var t=e.size;return(0,i.jsx)("svg",{width:k[t]||24,height:k[t]||24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,i.jsx)("path",{d:"M17 3C17.2626 2.73735 17.5744 2.52901 17.9176 2.38687C18.2608 2.24473 18.6286 2.17157 19 2.17157C19.3714 2.17157 19.7392 2.24473 20.0824 2.38687C20.4256 2.52901 20.7374 2.73735 21 3C21.2626 3.26264 21.471 3.57444 21.6131 3.9176C21.7553 4.26077 21.8284 4.62856 21.8284 5C21.8284 5.37143 21.7553 5.73923 21.6131 6.08239C21.471 6.42555 21.2626 6.73735 21 7L7.5 20.5L2 22L3.5 16.5L17 3Z",stroke:"#8F8F8F",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})},E=function(e){var t=e.message,n=e.selected,s=e.onSelection,a=e.onDragEnd,o=e.onTransformEnd,r=e.scaleX,c=e.scaleY,l=e.rotation,d=e.x,_=e.y,h=(0,u.useRef)(),x=(0,u.useRef)();return(0,u.useEffect)(function(){n&&(x.current.nodes([h.current]),x.current.getLayer().batchDraw())},[n]),(0,i.jsxs)(i.Fragment,{children:[(0,i.jsxs)(g.__,{ref:h,x:void 0===d?40:d,y:void 0===_?100:_,scaleX:r,scaleY:c,rotation:l,draggable:!0,onDragEnd:a,onTransformEnd:o,onClick:s,onTap:s,children:[(0,i.jsx)(g.Vp,{fill:"white",pointerWidth:10,pointerHeight:10,lineJoin:"round",cornerRadius:5}),(0,i.jsx)(g.xv,{x:150,y:250,fontSize:18,rotation:0,padding:5,text:t})]}),n&&(0,i.jsx)(g.$T,{ref:x})]})},L=n(65275),T=n(80129),W=["Write in a custom message","Write in a custom message","Train with me on Kickoff \uD83D\uDCAA","Exercise. Nutrition. Sleep. Habits.","Let's crush your fitness goals together!","Let's GOOOOO!"],D=function(){var e=(0,u.useRef)(),t=(0,j.z)(),n=t.image,h=t.history,f=t.setHistory,m=t.logPageView,k=(0,T.e)().add,D=(0,r._)(p()(n.url,"anonymous"),1)[0],H=(0,r._)((0,u.useState)(),2),N=H[0],S=H[1],R=(0,r._)((0,u.useState)(h&&h.textPositions?h.textPositions:{}),2),U=R[0],Z=R[1],P=c.Z(l.Z)(function(e,t,n){return e[n]={key:"option-".concat(n),value:t,selected:!1},e},{},W),V=(0,r._)((0,u.useState)(P),2),O=V[0],F=V[1],I=(0,r._)((0,u.useState)(),2),X=I[0],B=I[1];(0,u.useEffect)(function(){m({location:"Content Editor"})},[]),(0,u.useEffect)(function(){var t;try{t=e.current.toDataURL()}catch(e){L.Z.notify(Error("Failed to parse stage image: ".concat(e))),k("Something went wrong, please refresh the page!")}t&&h&&D&&h.dataUri!==t&&f((0,o._)((0,a._)({},h),{dataUri:t}))},[D,h,f,k]);var G=function(t){var n=t.target,r=n.name,i=n.checked;F((0,o._)((0,a._)({},O),(0,s._)({},r,(0,o._)((0,a._)({},O[r]),{selected:i})))),f((0,o._)((0,a._)({},h),{options:(0,o._)((0,a._)({},O),(0,s._)({},r,(0,o._)((0,a._)({},O[r]),{selected:i}))),dataUri:e.current.toDataURL()}))},M=function(e){var t=e.target,n=t.name,r=t.value;F((0,o._)((0,a._)({},O),(0,s._)({},n,(0,o._)((0,a._)({},O[n]),{value:r}

1))))},Y=function(t){t.target.getParent()&&"Layer"===t.target.getParent().getType()&&(B(),f((0,o._)((0,a._)({},h),{dataUri:e.current.toDataURL()})))};return(0,i.jsxs)("div",{className:v().container,children:[(0,i.jsx)(y.Z,{is:"h1",className:v().h1,children:"Create engaging content"}),(0,i.jsx)(y.Z,{is:"p",className:v().subtitle,children:"Use our tool to make a post or just click Continue if you want to use your own content!"}),(0,i.jsx)(y.Z,{is:"p",className:v().scrollText,children:"Scroll down to add text to your image!"}),(0,i.jsxs)("div",{className:v().content,children:[(0,i.jsx)("div",{className:v().checkboxGroup,children:c.Z(d.Z)(function(e,t){return(0,i.jsx)("div",{className:x()(v().checkbox,(0,s._)({},v().selected,O[e].selected)),children:(0,i.jsxs)("label",{children:[(0,i.jsxs)("div",{style:{display:"flex"},children:[(0,i.jsx)("input",{type:"checkbox",name:t,onChange:G,checked:O[e].selected}),(0,i.jsx)(C,{className:v().unchecked})," ",(0,i.jsx)(w,{className:v().checked})]}),t<=1&&N===t?(0,i.jsx)("textarea",{type:"text",name:t,value:O[e].value,onChange:M,autoFocus:!0,onFocus:function(e){return e.target.select()},onBlur:function(){return S()}}):(0,i.jsxs)("span",{className:v().text,onClick:function(){return S(t)},children:[O[e].value,t<=1&&(0,i.jsx)(b,{size:"sm"})]})]})},"".concat(O[e].key))},_.Z(O))}),(0,i.jsx)("div",{className:v().canvasWrapper,children:(0,i.jsx)(g.Hf,{ref:e,width:window.innerWidth<768?window.innerWidth-42:400,height:window.innerWidth<768?window.innerWidth-42:400,onMouseDown:Y,onTouchStart:Y,style:{display:"flex",justifyContent:"center",backgroundColor:D?"transparent":"#C5C8C7"},children:(0,i.jsxs)(g.mh,{children:[!D&&(0,i.jsx)(g.xv,{x:window.innerWidth<768?40:100,y:window.innerWidth<768?100:150,fontSize:18,rotation:0,padding:5,fill:"white",align:"center",text:"No Image Selected.\n\nPlease select an image\n on the previous page"}),(0,i.jsx)(g.Ee,{image:D,width:window.innerWidth<768?window.innerWidth-42:400,height:window.innerWidth<768?window.innerWidth-42:400,preventDefault:!1}),Object.keys(O).filter(function(e){return O[e].selected}).map(function(t){return(0,i.jsx)(E,{message:O[t].value,selected:X===O[t].key,onSelection:function(){B(O[t].key)},x:U[t]&&U[t].x,y:U[t]&&U[t].y,scaleX:U[t]&&U[t].scaleX,scaleY:U[t]&&U[t].scaleY,rotation:U[t]&&U[t].rotation,onDragEnd:function(n){Z((0,o._)((0,a._)({},U),(0,s._)({},t,(0,o._)((0,a._)({},U[t]),{x:n.target.x(),y:n.target.y()})))),f((0,o._)((0,a._)({},h),{textPositions:(0,o._)((0,a._)({},U),(0,s._)({},t,(0,o._)((0,a._)({},U[t]),{x:n.target.x(),y:n.target.y()}))),dataUri:e.current.toDataURL()}))},onTransformEnd:function(n){Z((0,o._)((0,a._)({},U),(0,s._)({},t,(0,o._)((0,a._)({},U[t]),{scaleX:n.target.scaleX(),scaleY:n.target.scaleY(),rotation:n.target.rotation()})))),f((0,o._)((0,a._)({},h),{textPositions:(0,o._)((0,a._)({},U),(0,s._)({},t,(0,o._)((0,a._)({},U[t]),{scaleX:n.target.scaleX(),scaleY:n.target.scaleY(),rotation:n.target.rotation()}))),dataUri:e.current.toDataURL()}))}},t)})]})})})]})]})}},78514:function(e){e.exports={colors:"'styles/colors.module.css'",PURPLE:"#830051",WHITE:"#fff",breakpoints:"'styles/breakpoints.module.css'",DESKTOP_LG_WIDTH:"1600px",DESKTOP_MED_WIDTH:"1200px",DESKTOP_WIDTH:"993px",TABLET_WIDTH:"768px",container:"styles_container__yLg1_",h1:"styles_h1__8Q3_g",h2:"styles_h2__LGtdv",p:"styles_p__g0aVR",subtitle:"styles_subtitle__S4SiJ",label:"styles_label__bFkQv",content:"styles_content__I5FXg",canvasWrapper:"styles_canvasWrapper__oxqTB",checkboxGroup:"styles_checkboxGroup__3j9vu",checkbox:"styles_checkbox__UeRQx",selected:"styles_selected__v7IIR",text:"styles_text__c2UdO",unchecked:"styles_unchecked__SuG41",checked:"styles_checked__Ugn75",img:"styles_img__vWtRn",buttonWrapper:"styles_buttonWrapper__vBOH0",mobileDownloadText:"styles_mobileDownloadText__5BGT_",button:"styles_button__pU8Fp",scrollText:"styles_scrollText___0Knb"}}}]);
2//# sourceMappingURL=6753.860fae63b09d6af9.js.map