Hwado _ Rigger

이미지에 마우스를 올려보세요.
랜덤으로 대사가 나옵니다.

(function () { const root = document.getElementById( "interactive-character" ); if (!root || root.dataset.initialized === "true") { return; } root.dataset.initialized = "true"; const portrait = root.querySelector( ".character-portrait" ); const img = root.querySelector( ".character-image" ); const dialog = root.querySelector( ".character-dialog" ); /* ======================================== 이미지 주소 ======================================== */ const imageURLs = { default: "https://framerusercontent.com/images/hYsaoXK4sK33ttE3rKQqcNuCh1I.gif?scale-down-to=512&width=1200&height=1200", x: "https://framerusercontent.com/images/Vj9O7CW9UaPIakjdJ8QCbYC3Fk.png?scale-down-to=512&width=1200&height=1200", o: "https://framerusercontent.com/images/wCRMaXrn7kQ6bgF8w8NnXlnKY.png?scale-down-to=512&width=1200&height=1200" }; /* ======================================== X / O 랜덤 대사 ======================================== */ const dialogues = { x: [ "일러스트 작업은 아직 받지 않습니다.", "모델 그릴 때, 스크린 쓰지 마세요.", "모델 그릴 때, 오버레이 안됩니다.", "머리카락 한 장으로 주지 마세요.", "레이어 이름 붙여주세요.", "좌우 합쳐 놓지 마세요.", "폴더 째로 마스크 쓰지 마세요. ", "파츠 주변 정리 하세요.", "안 보이는 부분도 그리세요.", "지저분하게 두지 마세요, 다 다듬어 오세요.", "파일 공유하지 마세요. 당신을 조질 것이다.", "무단 판매 적발 시, 법적 대응합니다.", "모델 구동 파일을 역복원하여 편집 가능한 파일로 만들지 마십시오.", "벌레 싫어." ], o: [ "곱하기, 더하기는 써도 좋습니다.", "선, 면 분리 하셔도 괜찮습니다.", "파츠 분리는 주변에게 묻는 게 가장 빠릅니다.", "요구 사항은 한 번에 정리해주시면 사랑합니다.", "전 그렇게 딱딱한 사람 아닙니다. 편하게 질문하셔도 괜찮습니다.", "참고 자료 보내셔도 괜찮습니다. 무례한 게 아닙니다.", "말랑한 거 좋아합니다.", "저 건강합니다." ] }; let lastDialogue = { x: "", o: "" }; let currentState = "default"; /* ======================================== 이미지 변경 ======================================== */ function setImage(state) { if (currentState === state) return; currentState = state; img.src = imageURLs[state]; } /* ======================================== 기본 상태 ======================================== */ function resetCharacter() { setImage("default"); dialog.textContent = ""; dialog.classList.remove("is-visible"); } /* ======================================== X / O 랜덤 선택 ======================================== */ function activateCharacter() { const state = Math.random() < 0.5 ? "x" : "o"; const list = dialogues[state]; let choices = list.filter(function (line) { return line !== lastDialogue[state]; }); if (choices.length === 0) { choices = list; } const selectedDialogue = choices[Math.floor(Math.random() * choices.length)]; lastDialogue[state] = selectedDialogue; setImage(state); dialog.textContent = selectedDialogue; dialog.classList.add("is-visible"); } /* ======================================== PC: 마우스를 올리면 활성화 ======================================== */ root.addEventListener("pointerenter", function (event) { if (event.pointerType !== "mouse") return; activateCharacter(); }); root.addEventListener("pointerleave", function (event) { if (event.pointerType !== "mouse") return; resetCharacter(); }); /* ======================================== 모바일: 캐릭터를 누르면 활성화 ======================================== */ portrait.addEventListener("click", function (event) { if ( !window.matchMedia( "(hover: none), (pointer: coarse)" ).matches ) { return; } event.stopPropagation(); activateCharacter(); }); /* 배경을 누르면 기본 상태로 복귀 */ document.addEventListener("click", function (event) { if ( !window.matchMedia( "(hover: none), (pointer: coarse)" ).matches ) { return; } if (!root.contains(event.target)) { resetCharacter(); } }); /* X / O 이미지 미리 불러오기 */ [imageURLs.x, imageURLs.o].forEach(function (url) { const preload = new Image(); preload.src = url; }); /* 최초 기본 상태 */ resetCharacter(); })();

• X (Twitter)
• Commission site

• Back

• EN
• KR
• JP

Hwado _ Vtuber

• X (Twitter)
• Chzzk (stream)
• Cime (stream)
• Youtube (archive)

• EN
• KR
• JP

• Back