팝빌 알림톡 기능 추가

2025-09-04 12:32:31 +09:00
parent 37d0dcb48f
commit 66f6a75a10
99 changed files with 8876 additions and 260 deletions
--- a/mobile/skin/social/consent_modal.inc.php
+++ b/mobile/skin/social/consent_modal.inc.php
@ -0,0 +1,85 @@
+<!-- HTML -->
+<?php if (!defined('_GNUBOARD_')) exit; ?>
+<dialog id="consentDialog" aria-labelledby="consentDialogTitle" aria-describedby="consentDialogBody">
+  <form method="dialog" class="cd-card">
+    <header class="cd-head">
+      <h3 id="consentDialogTitle" class="cd-title">안내</h3>
+    </header>
+    <div id="consentDialogBody" class="cd-body"></div>
+    <footer class="cd-actions">
+      <button type="button" class="cd-agree">동의합니다</button>
+      <button value="close" class="cd-close">닫기</button>
+    </footer>
+  </form>
+</dialog>
+
+<!-- 스타일 -->
+<style>
+#consentDialog { padding:0; border:none; border-radius:12px; }
+#consentDialog::backdrop { background: rgba(0,0,0,.45); backdrop-filter: blur(5px);}
+.cd-card { max-width: 560px; background:#fff; border-radius:12px; }
+.cd-head { display:flex; align-items:center; justify-content:space-between; padding:16px; }
+.cd-title { margin:0; font-size:18px; font-weight:bold; word-break:keep-all; }
+.cd-body { max-height:500px; overflow-y:auto; padding:16px; border-top:1px solid #e6e6e9; border-bottom:1px solid #e6e6e9; line-height:1.6; font-size:14px; color:#222; }
+.cd-actions { display:flex; gap:8px; justify-content:flex-end; padding:12px 16px 16px; }
+.cd-actions .cd-agree { padding:8px 14px; border:1px solid #3a8afd; background:#3a8afd; color:#fff; border-radius:8px; }
+.cd-actions .cd-close { padding:8px 14px; border:1px solid #ccc; background:#fff; color:#111; border-radius:8px; }
+</style>
+
+<!-- JS -->
+<script>
+(function(){
+  const dlg = document.getElementById('consentDialog');
+  if (!dlg) return;
+
+  const body   = document.getElementById('consentDialogBody');
+  const titleE = document.getElementById('consentDialogTitle');
+  let opener   = null;
+
+  const openFrom = (btn) => {
+    opener = btn;
+    const tplSel = btn.getAttribute('data-template');
+    const title  = btn.getAttribute('data-title') || '안내';
+    const tpl    = tplSel ? document.querySelector(tplSel) : null;
+
+    titleE.textContent = title;
+    body.innerHTML     = tpl ? tpl.innerHTML : '';
+
+    dlg.dataset.check      = btn.getAttribute('data-check') || '';
+    dlg.dataset.checkGroup = btn.getAttribute('data-check-group') || '';
+
+    if (dlg.showModal) dlg.showModal(); else dlg.setAttribute('open','');
+  };
+
+  const closeDialog = () => {
+    if (dlg.close) dlg.close(); else dlg.removeAttribute('open');
+    if (opener) opener.focus();
+  };
+
+  document.addEventListener('click', (e)=>{
+    const trigger = e.target.closest('.js-open-consent');
+    if (trigger) { openFrom(trigger); return; }
+
+    if (e.target.classList.contains('cd-agree')) {
+      const sel      = dlg.dataset.check;
+      const groupSel = dlg.dataset.checkGroup;
+
+      if (groupSel) {
+        document.querySelectorAll(groupSel).forEach(cb => {
+          cb.checked = true;
+          cb.dispatchEvent(new Event('change', {bubbles:true}));
+        });
+      }
+      if (sel) {
+        const cb = document.querySelector(sel);
+        if (cb) { cb.checked = true; cb.dispatchEvent(new Event('change', {bubbles:true})); }
+      }
+      closeDialog();
+      e.preventDefault();
+      return;
+    }
+  });
+
+  dlg.addEventListener('cancel', (e)=>{ e.preventDefault(); closeDialog(); });
+})();
+</script>