https://starryskynest.web.app/4676.87d474b8.chunk.js

1"use strict";(self.webpackChunkts_boilerplate=self.webpackChunkts_boilerplate||[]).push([[4676],{84676:function(n,e,t){t.r(e),t.d(e,{default:function(){return $}}),t(14913),t(12824),t(36012),t(4895),t(63534),t(40590),t(5086),t(64216),t(18665),t(29979),t(14602),t(98741),t(15195),t(80115);var r,a,i,o,l,u,s,c,f,d,m,p=t(96540),v=t(20093),h=(t(7452),t(45708),t(7918),t(69193),t(58476),t(58379),t(59581),t(17),t(18636),t(18772),t(14070)),x=t(83182);function b(n,e,t,r,a,i,o){try{var l=n[i](o),u=l.value}catch(n){return void t(n)}l.done?e(u):Promise.resolve(u).then(r,a)}function g(n,e){return function(n){if(Array.isArray(n))return n}(n)||function(n,e){var t=null==n?null:"undefined"!=typeof Symbol&&n[Symbol.iterator]||n["@@iterator"];if(null!=t){var r,a,i,o,l=[],u=!0,s=!1;try{if(i=(t=t.call(n)).next,0===e){if(Object(t)!==t)return;u=!1}else for(;!(u=(r=i.call(t)).done)&&(l.push(r.value),l.length!==e);u=!0);}catch(n){s=!0,a=n}finally{try{if(!u&&null!=t.return&&(o=t.return(),Object(o)!==o))return}finally{if(s)throw a}}return l}}(n,e)||function(n,e){if(n){if("string"==typeof n)return y(n,e);var t={}.toString.call(n).slice(8,-1);return"Object"===t&&n.constructor&&(t=n.constructor.name),"Map"===t||"Set"===t?Array.from(n):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?y(n,e):void 0}}(n,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function y(n,e){(null==e||e>n.length)&&(e=n.length);for(var t=0,r=Array(e);t<e;t++)r[t]=n[t];return r}function w(n,e){return e||(e=n.slice(0)),Object.freeze(Object.defineProperties(n,{raw:{value:Object.freeze(e)}}))}var C=(0,v.i7)(r||(r=w(["\n  0%, 100% { transform: translateY(10px); }\n  50% { transform: translateY(20px); }\n"]))),k=(0,v.i7)(a||(a=w(["\n  0% { \n    opacity: 0; \n    transform: scale(0.8) translateY(10px); \n  }\n  100% { \n    opacity: 1; \n    transform: scale(1) translateY(0px); \n  }\n"]))),R=(0,v.i7)(i||(i=w(["\n  0% { transform: translate(-50%, -50%) scale(0.6); opacity: 0.75; }\n  60% { transform: translate(-50%, -50%) scale(1.2); opacity: 0.28; }\n  100% { transform: translate(-50%, -50%) scale(1.45); opacity: 0; }\n"]))),E=v.Ay.div(o||(o=w(["\n  position: absolute;\n  bottom: 0;\n  left: 50%;\n  transform: translateX(-50%);\n\n  @media (max-width: 768px) {\n    // 모바일에서 화면 중앙에 배치\n    top: 50%;\n    bottom: auto;\n    transform: translate(-50%, -50%);\n  }\n"]))),S=(0,v.Ay)(h.P.div)(l||(l=w(["\n  position: relative;\n  cursor: pointer;\n  pointer-events: auto;\n\n  // 마우스 추적 효과 (더 명확하고 큰 움직임)\n  transform: ",";\n\n  transition: transform 0.2s ease-out;\n\n  // 기본 플로팅 애니메이션\n  animation: "," 6s ease-in-out infinite;\n\n  &:hover {\n    transform: ",";\n  }\n\n  @media (max-width: 768px) {\n    // 모바일에서는 마우스 추적 효과 제거하고 플로팅만 유지\n    transform: ",";\n\n    &:hover {\n      transform: ",";\n    }\n  }\n"])),function(n){return"\n    translateX(".concat(.8*n.mouseX,"px) \n    translateY(").concat(.4*n.mouseY,"px)\n    ").concat(n.isClicked?"scale(1.05)":"scale(1)","\n  ")},C,function(n){return"\n      translateX(".concat(1*n.mouseX,"px) \n      translateY(").concat(.5*n.mouseY,"px)\n      scale(1.02)\n    ")},function(n){return"\n      ".concat(n.isClicked?"scale(1.05)":"scale(1)","\n    ")},function(n){return"\n        ".concat(n.isClicked?"scale(1.05)":"scale(1)","\n      ")}),L=v.Ay.div(u||(u=w(["\n  position: relative;\n  width: auto;\n  height: auto;\n  max-width: 100vw;\n  max-height: 96vh;\n  display: inline-block; // 🎯 컨텐츠 크기에 맞춤\n\n  @media (max-width: 768px) {\n    max-width: 90vw;\n    max-height: 80vh;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"]))),U=v.Ay.img(s||(s=w(["\n  position: ",";\n  top: ",";\n  left: ",";\n  width: auto;\n  height: auto;\n  max-width: 100vw;\n  max-height: 96vh;\n  object-fit: contain;\n  filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.2));\n\n  /* 🎯 부드러운 크로스페이드 */\n  opacity: ",";\n  transition: opacity 1s ease, filter 1s ease;

1\n  cursor: var(--hoverCursorURL), pointer;\n  pointer-events: ",";\n\n  ","\n\n  @media (max-width: 768px) {\n    max-width: 90vw;\n    max-height: 80vh;\n    width: auto;\n    height: auto;\n    object-fit: contain;\n  }\n"])),function(n){return n.isPrimary?"relative":"absolute"},function(n){return n.isPrimary?"auto":0},function(n){return n.isPrimary?"auto":0},function(n){return n.isVisible?1:0},function(n){return n.isVisible?"auto":"none"},function(n){return n.isClicked&&(0,v.AH)(c||(c=w(["\n      filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.3)) brightness(1.1)\n        saturate(1.2);\n    "])))}),I=(0,v.Ay)(h.P.div)(f||(f=w(["\n  z-index: 2;\n  position: absolute;\n  bottom: 100%;\n  left: 50%;\n  transform: translateX(-50%);\n  margin-bottom: 20px;\n  isolation: isolate; /* 자식 pseudo가 텍스트 뒤 레이어로 안전하게 배치되도록 */\n\n  background: transparent;\n  color: var(--menuTextColor);\n  padding: 12px 16px;\n  border-radius: 20px;\n  font-size: 0.9rem;\n  font-weight: 500;\n  white-space: nowrap;\n  max-width: 250px;\n  text-align: center;\n\n  /* 배경 전용 블러 레이어 */\n  &::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    border-radius: 20px;\n    background: var(--menuBackgroundColor);\n    filter: blur(4px);\n    z-index: -1;\n  }\n\n  animation: "," 0.3s ease-out;\n\n  @media (max-width: 768px) {\n    font-size: 0.8rem;\n    padding: 10px 14px;\n    max-width: 200px;\n  }\n"])),k),A=(0,v.Ay)(h.P.div)(d||(d=w(["\n  z-index: 1;\n  position: fixed;\n  left: ","px; /* 클릭 지점 기준 우측으로 오프셋 */\n  top: ","px;\n  transform: translateY(-50%); /* 세로 중앙 정렬 */\n  pointer-events: none;\n\n  display: inline-flex;\n  align-items: center;\n  gap: 10px;\n\n  background: transparent;\n  color: var(--menuTextColor);\n  padding: 12px 16px;\n  border-radius: 20px;\n  font-size: 0.9rem;\n  font-weight: 500;\n  white-space: nowrap;\n  text-align: center;\n\n  animation: "," 0.3s ease-out;\n\n  /* 좌측에 원형 파동 이펙트 (크기 축소) */\n  &::before,\n  &::after {\n    content: '';\n    position: absolute;\n    left: -12px; /* 말풍선 좌측 중앙에 위치 */\n    top: 50%;\n    width: 36px;\n    height: 36px;\n    border-radius: 50%;\n    border: 2px solid var(--primaryColor);\n    background: radial-gradient(\n      circle,\n      var(--primaryColor) 0%,\n      rgba(255, 255, 255, 0) 55%,\n      rgba(255, 255, 255, 0) 70%\n    );\n    transform: translate(-50%, -50%);\n    animation: "," 1.4s ease-out infinite;\n    z-index: -1;\n    box-shadow: 0 0 10px var(--primaryColor),\n      inset 0 0 8px var(--primaryColor);\n  }\n  &::after {\n    animation-delay: 0.4s;\n    opacity: 0.6;\n  }\n\n  /* 중앙 작은 점 (항시 표시) */\n  & > .ripple-core {\n    position: absolute;\n    left: -12px;\n    top: 50%;\n    width: 10px;\n    height: 10px;\n    border-radius: 50%;\n    transform: translate(-50%, -50%);\n    background: radial-gradient(\n      circle,\n      var(--primaryColor) 0%,\n      var(--primaryColor) 55%,\n      rgba(255, 255, 255, 0) 85%,\n      rgba(255, 255, 255, 0) 100%\n    );\n    box-shadow: 0 0 10px var(--primaryColor);\n    z-index: -1;\n  }\n\n  /* 말풍선 배경 블러 */\n  & > .bubble-bg {\n    position: absolute;\n    inset: 0;\n    border-radius: 20px;\n    background: var(--menuBackgroundColor);\n    filter: blur(4px);\n    z-index: -1;\n  }\n\n  @media (max-width: 768px) {\n    font-size: 0.8rem;\n    padding: 10px 14px;\n    max-width: 220px;\n  }\n"])),function(n){return n.clickX+12},function(n){return n.clickY-12},k,R),M=v.Ay.div(m||(m=w(["\n  z-index: 1;\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  pointer-events: none;\n"])));function j(n){var e;return n&&0!==n.length&&null!==(e=n[Math.floor(Math.random()*n.length)])&&void 0!==e?e:null}var P,z=function(n){var e=n.data,t=g((0,p.useState)({x:0,y:0}),2),r=t[0],a=t[1],i=g((0,p.useState)(""),2),o=i[0],l=i[1],u=g((0,p.useState)(!1),2),s=u[0],c=u[1],f=g((0,p.useState)(!1),2),d=f[0],m=f[1],v=g((0,p.useState)(!1),2),h=v[0],y=v[1],w=g((0,p.useState)({x:0,y:0}),2),C=w[0],k=w[1],R=g((0,p.useState)((null==e?void 0:e.baseImgURL)||""),2),P=R[0],z=R[1],O=g((0,p.useState)(""),2),Y=O[0],T=O[1],X=g((0,p.useState)(!1),2),N=X[0],B=X[1],V=g((0,p.useState)({left:0,top:0}),2),H=V[0],W=V[1],D=g((0,p.useState)(!1),2),$=D[0],_=D[1],F=(0,p.useRef)(null),G=(0,p.useRef)(null),J=(0,p.useRef)(null),q=(0,p.useRef)(new Set),K=(0,p.useRef)(new Map),Q=(0,p.useCallback)(function(n){if(!n)return Promise.resolve();if(q.current.has(n))return Promise.resolve();var e=K.current.get(n);if(e)return e;var t=new Promise(function(e,t){var r=new Image;r.src=n,r.onload=function(){q.current.add(n),K.current.delete(n),e()},r.onerror=function(e){K.current.delete(n),t(e)}});return K.current.set(n,t),t},[]);(0,p.useEffect)(function(){if(e){var n=[];

1e.baseImgURL&&n.push(e.baseImgURL),(e.expressions||[]).forEach(function(e){e.imgURL&&n.push(e.imgURL)}),Promise.all(n.map(function(n){return Q(n)})).then(function(){return _(!0)}).catch(function(){return _(!0)})}},[e,Q]);var Z=(0,p.useCallback)(function(){var n,e=(n=regeneratorRuntime.mark(function n(e){return regeneratorRuntime.wrap(function(n){for(;;)switch(n.prev=n.next){case 0:if(e){n.next=2;break}return n.abrupt("return");case 2:if(e!==P){n.next=4;break}return n.abrupt("return");case 4:if(!N){n.next=6;break}return n.abrupt("return");case 6:if($){n.next=16;break}return n.prev=7,n.next=10,Q(e);case 10:n.next=16;break;case 12:return n.prev=12,n.t0=n.catch(7),console.error("이미지 로드 실패:",e,n.t0),n.abrupt("return");case 16:B(!1),T(""),z(e);case 19:case"end":return n.stop()}},n,null,[[7,12]])}),function(){var e=this,t=arguments;return new Promise(function(r,a){var i=n.apply(e,t);function o(n){b(i,r,a,o,l,"next",n)}function l(n){b(i,r,a,o,l,"throw",n)}o(void 0)})});return function(n){return e.apply(this,arguments)}}(),[P,N,Q,$]);(0,p.useEffect)(function(){var n=function(n){if(J.current){var e=J.current.getBoundingClientRect(),t=e.left+e.width/2,r=e.top+e.height/2,i=Math.max(-300,Math.min(300,n.clientX-t)),o=Math.max(-300,Math.min(300,n.clientY-r));a({x:i,y:o})}};return window.addEventListener("mousemove",n),function(){return window.removeEventListener("mousemove",n)}},[]),(0,p.useEffect)(function(){var n=((null==e?void 0:e.scripts)||[]).filter(function(n){return"casual"===n.type||"byExpression"===n.type}),t=1e4*Math.random()+1e4;return G.current=setTimeout(function(){if(!s&&!d&&n.length>0){var t=j(n);if(!t)return;if(l(t.text||""),J.current){var r=J.current,a=r.clientWidth||0,i=r.clientHeight||0,o=20,u=Math.max(o,Math.min(a-o,Math.random()*(a-40)+o)),f=Math.max(o,Math.min(i-o,Math.random()*(i-40)+o)

1);W({left:u,top:f})}if(t.expressionName&&"기본"!==t.expressionName){var p=((null==e?void 0:e.expressions)||[]).find(function(n){return n.name===t.expressionName}),v=(null==p?void 0:p.imgURL)||(null==e?void 0:e.baseImgURL)||"";Z(v)}else Z((null==e?void 0:e.baseImgURL)||"");c(!0),m(!1),F.current=setTimeout(function(){c(!1),Z((null==e?void 0:e.baseImgURL)||"")},3e3)}},t),function(){F.current&&clearTimeout(F.current),G.current&&clearTimeout(G.current)}},[s,d,null==e?void 0:e.scripts,null==e?void 0:e.expressions,null==e?void 0:e.baseImgURL]),(0,p.useEffect)(function(){s||d||z((null==e?void 0:e.baseImgURL)||"")},[null==e?void 0:e.baseImgURL,s,d]);var nn=(0,p.useCallback)(function(n){var t=(null==e?void 0:e.scripts)||[],r=t.filter(function(n){return"onclick"===((null==n?void 0:n.type)||"").toLowerCase()}),a=r.length>0?r:t,i=Math.max(140,Math.min(window.innerWidth-140,n.clientX)),o=Math.max(60,n.clientY);k({x:i,y:o}),y(!0),setTimeout(function(){return y(!1)},300);var u=j(a);if(u){var s,f,d,p=null!==(s=null!==(f=null!==(d=null==u?void 0:u.text)&&void 0!==d?d:null==u?void 0:u.message)&&void 0!==f?f:null==u?void 0:u.content)&&void 0!==s?s:"";if(l(String(p)),null!=u&&u.expressionName&&"기본"!==u.expressionName){var v=((null==e?void 0:e.expressions)||[]).find(function(n){return n.name===u.expressionName}),h=(null==v?void 0:v.imgURL)||(null==e?void 0:e.baseImgURL)||"";Z(h)}else Z((null==e?void 0:e.baseImgURL)||"");c(!0),m(!0)}F.current&&clearTimeout(F.current),G.current&&clearTimeout(G.current),u&&(F.current=setTimeout(function(){c(!1),m(!1),Z((null==e?void 0:e.baseImgURL)||"")},4e3))},[null==e?void 0:e.scripts,null==e?void 0:e.expressions,null==e?void 0:e.baseImgURL,Z]);return p.createElement(p.Fragment,null,p.createElement(E,null,p.createElement(S,{ref:J,mouseX:r.x,mouseY:r.y,isClicked:h,onClick:nn,whileHover:{scale:1.02},whileTap:{scale:.98}},p.createElement(x.N,null,s&&!d&&p.createElement(I,{initial:{opacity:0,scale:.8,y:10},animate:{opacity:1,scale:1,y:0},exit:{opacity:0,scale:.8,y:-10},transition:{duration:.3,ease:"easeOut"},style:{bottom:"auto",left:"".concat(H.left,"px"),top:"".concat(H.top,"px"),transform:"translate(-50%, -100%)"}},o)),p.createElement(L,null,p.createElement(U,{src:P||(null==e?void 0:e.baseImgURL)||"",alt:"standing character current",isClicked:h,draggable:!1,isVisible:!N,isPrimary:!0}),Y&&p.createElement(U,{src:Y,alt:"standing character next",isClicked:h,draggable:!1,isVisible:N,isPrimary:!1})))),p.createElement(M,null,p.createElement(x.N,null,s&&d&&p.createElement(A,{clickX:C.x,clickY:C.y,initial:{opacity:0,scale:.9,y:10},animate:{opacity:1,scale:1,y:0},exit:{opacity:0,scale:.95,y:-10},transition:{duration:.25,ease:"easeOut"}},p.createElement("span",{className:"ripple-core"}),p.createElement("div",{className:"bubble-bg"}),o))))},O=t(25176),Y=t(75907),T=t(90575),X=t(18206),N=t(39565);function B(n,e){return function(n){if(Array.isArray(n))return n}(n)||function(n,e){var t=null==n?null:"undefined"!=typeof Symbol&&n[Symbol.iterator]||n["@@iterator"];if(null!=t){var r,a,i,o,l=[],u=!0,s=!1;try{if(i=(t=t.call(n)).next,0===e){if(Object(t)!==t)return;u=!1}else for(;!(u=(r=i.call(t)).done)&&(l.push(r.value),l.length!==e);u=!0);}catch(n){s=!0,a=n}finally{try{if(!u&&null!=t.return&&(o=t.return(),Object(o)!==o))return}finally{if(s)throw a}}return l}}(n,e)||function(n,e){if(n){if("string"==typeof n)return V(n,e);var t={}.toString.call(n).slice(8,-1);return"Object"===t&&n.constructor&&(t=n.constructor.name),"Map"===t||"Set"===t?Array.from(n):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?V(n,e):void 0}}(n,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function V(n,e){(null==e||e>n.length)&&(e=n.length);for(var t=0,r=Array(e);t<e;t++)r[t]=n[t];return r}var H,W,D=v.Ay.div(P||(H=["\n  position: absolute;\n  width: 100%;\n  height: 100vh;\n  margin: 0 auto;\n  overflow: hidden;\n"],W||(W=H.slice(0)),P=Object.freeze(Object.defineProperties(H,{raw:{value:Object.freeze(W)}})))),$=function(){var n,e=(0,O.vc)(Y.WJ),t=(0,O.vc)(X.Bs),r=B((0,p.useState)(null),2),a=r[0],i=r[1],o=(0,T.useDocument)("".concat(N.Gf.USERS,"/").concat(t),{listen:!0}).data;(0,p.useEffect)(function(){var n,t,r=null!==(n=null!==(t=null==o?void 0:o.standingCharacter)&&void 0!==t?t:null==e?void 0:e.standingCharacter)&&void 0!==n?n:null;i(r)},[null==e?void 0:e.standingCharacter,null==o?void 0:o.standingCharacter]);var l=B((0,p.useState)(null),2),u=l[0],s=l[1],c=null!==(n=null!=a?a:null==e?void 0:e.standingCharacter)&&void 0!==n?n:null,f=(0,T.useDocument)(c?"".concat(c.path,"/").concat(c.key):null).data;return(0,p.useEffect)(function(){null!=f&&f.standingConfig?s({baseImgURL:f.standingConfig.baseImgURL,expressions:f.standingConfig.expressions||[],scripts:f.standingConfig.scripts||[]}):s(null)},[f]),p.createElement(D,null,p.createElement(z,{data:u||null}))}}}]);
2//# sourceMappingURL=4676.87d474b8.chunk.js.map