diff --git a/src/js/08-chat.js b/src/js/08-chat.js index 28551271a17b8830378402d0ac29cc2a9c85569e..e622a47d1e1a2b7ecbe2b59c24dda59320058aa8 100644 --- a/src/js/08-chat.js +++ b/src/js/08-chat.js @@ -59,6 +59,22 @@ </path> ` + // 네트워크 상태 확인 및 버튼 제어 + function toggleChatButton() { + if (!navigator.onLine) { + chatButton.style.display = 'none' // 오프라인 상태면 chatButton 숨김 + } else { + chatButton.style.display = 'flex' // 온라인 상태면 chatButton 보이게 함 + } + } + + // 초기 상태 설정 + toggleChatButton() + + // 네트워크 상태 변경 이벤트 리스너 + window.addEventListener('online', toggleChatButton) + window.addEventListener('offline', toggleChatButton) + chatButton.addEventListener('click', () => { chat.classList.toggle('show') diff --git a/src/partials/toc.hbs b/src/partials/toc.hbs index ae895c5493ddedbc1f30130667ed9b66b0650874..ec351aea869ab6176c3c3a5559be5a9ef7729f4e 100644 --- a/src/partials/toc.hbs +++ b/src/partials/toc.hbs @@ -1,12 +1,10 @@ <aside class="toc sidebar" data-title="{{{or page.attributes.toctitle 'Contents'}}}" data-levels="{{{or page.attributes.toclevels 2}}}"> <div class="toc-menu"></div> - {{#if env.SITE_SEARCH_PROVIDER}} <div class="chat-btn"> <svg id="chat-icon" data-slot="icon" fill="#fff" stroke-width="1.5" stroke="#0072ce" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="32" height="32"> <path stroke-linecap="round" stroke-linejoin="round" d="M7.188 10a.312.312 0 1 1-.625 0 .312.312 0 0 1 .625 0Zm0 0h-.313m3.438 0a.312.312 0 1 1-.625 0 .312.312 0 0 1 .625 0Zm0 0h-.313m3.437 0a.312.312 0 1 1-.625 0 .312.312 0 0 1 .625 0Zm0 0h-.312M17.5 10c0 3.797-3.353 6.875-7.5 6.875a8.735 8.735 0 0 1-2.292-.303 5.368 5.368 0 0 1-3.639 1.576 5.364 5.364 0 0 1-.428-.059 4.025 4.025 0 0 0 .88-1.818c.081-.409-.12-.806-.422-1.098C3.273 13.484 2.5 11.825 2.5 10c0-3.797 3.353-6.875 7.5-6.875s7.5 3.078 7.5 6.875Z"></path> </svg> </div> - {{/if}} <div class="chat"> <div class="chat-head"> <i class="chat-logo"></i>