Peler

: / var / www / html / wp-content / themes / bayisihat-jurnal /
Filename : tpl-alat-edd.php
back
<?php
/* Template Name: Alat — Kalkulator EDD */
if (!defined('ABSPATH')) exit; get_header(); ?>
<?php echo bs_breadcrumbs_html(); ?>
<header class="wrap tool-hero">
  <p class="eyebrow">Alat percuma</p>
  <h1>Kalkulator Tarikh Jangka Bersalin (EDD)</h1>
  <p>Masukkan hari pertama haid terakhir anda — kami kira tarikh jangka bersalin, usia kandungan hari ini dan trimester semasa.</p>
</header>
<div class="wrap">
  <div class="tool-box reveal">
    <form class="tool-form" id="edd-form" onsubmit="return false">
      <div class="tool-field">
        <label for="edd-lmp">Hari pertama haid terakhir (LMP)</label>
        <input type="date" id="edd-lmp" required>
      </div>
      <div class="tool-field" style="max-width:220px">
        <label for="edd-cycle">Purata kitaran haid (hari)</label>
        <select id="edd-cycle"><?php for($i=21;$i<=35;$i++){ echo '<option value="'.$i.'"'.($i===28?' selected':'').'>'.$i.' hari</option>'; } ?></select>
      </div>
      <button class="btn btn--primary" id="edd-btn" type="submit">Kira Tarikh Bersalin</button>
    </form>
    <div class="tool-result" id="edd-result" aria-live="polite">
      <p class="eyebrow" style="margin-bottom:.2rem">Tarikh jangka bersalin anda</p>
      <div class="tool-result__big" id="edd-date">—</div>
      <p id="edd-note" style="color:var(--muted);font-size:.98rem"></p>
      <div class="tool-result__grid">
        <div class="tool-stat"><b id="edd-week">—</b><span>Usia kandungan hari ini</span></div>
        <div class="tool-stat"><b id="edd-tri">—</b><span>Trimester semasa</span></div>
        <div class="tool-stat"><b id="edd-left">—</b><span>Anggaran hari lagi</span></div>
      </div>
      <p style="margin-top:1.4rem"><a class="btn btn--ghost" id="edd-weeklink" href="<?php echo esc_url(home_url('/kehamilan-mingguan/')); ?>">Lihat perkembangan minggu anda →</a></p>
    </div>
  </div>
  <p class="tool-note"><strong>Bagaimana ia dikira?</strong> Kami guna kaedah Naegele yang sama digunakan di klinik: tarikh haid akhir + 280 hari (40 minggu), dilaraskan mengikut panjang kitaran anda. Ingat — EDD hanyalah <em>anggaran</em>; kebanyakan bayi lahir dalam lingkungan minggu 37 hingga 42. Doktor mungkin melaraskan tarikh berdasarkan imbasan awal. Baca lanjut: <a href="<?php echo esc_url(home_url('/cara-kira-tarikh-bersalin/')); ?>">Cara kira tarikh jangka bersalin</a>.</p>
</div>
<section class="wrap section reveal"><?php echo bs_newsletter_form('Hamil? Dapatkan panduan mingguan percuma', 'Langgan & dapatkan checklist hospital bag + jadual imunisasi (PDF percuma).'); ?></section>
<script>
(function(){
  var BM = ['Januari','Februari','Mac','April','Mei','Jun','Julai','Ogos','September','Oktober','November','Disember'];
  var form = document.getElementById('edd-form');
  form.addEventListener('submit', function(){
    var lmpVal = document.getElementById('edd-lmp').value;
    if (!lmpVal) return;
    var lmp = new Date(lmpVal + 'T00:00:00');
    var cycle = parseInt(document.getElementById('edd-cycle').value, 10) || 28;
    var today = new Date(); today.setHours(0,0,0,0);
    var msDay = 86400000;
    var diffDays = Math.floor((today - lmp) / msDay);
    if (diffDays < 0) { alert('Tarikh haid akhir tidak boleh pada masa hadapan.'); return; }
    if (diffDays > 320) { alert('Tarikh ini melebihi 45 minggu yang lalu — sila semak semula.'); return; }
    var edd = new Date(lmp.getTime() + (280 + (cycle - 28)) * msDay);
    var w = Math.floor(diffDays / 7), d = diffDays % 7;
    var weekNum = Math.min(42, w + 1); // minggu semasa (minggu ke-N)
    var tri = w < 13 ? 'Pertama' : (w < 27 ? 'Kedua' : 'Ketiga');
    var left = Math.max(0, Math.round((edd - today) / msDay));
    document.getElementById('edd-date').textContent = edd.getDate() + ' ' + BM[edd.getMonth()] + ' ' + edd.getFullYear();
    document.getElementById('edd-week').textContent = w + ' minggu ' + d + ' hari';
    document.getElementById('edd-tri').textContent = tri;
    document.getElementById('edd-left').textContent = left + ' hari';
    document.getElementById('edd-note').textContent = 'Anda kini dalam minggu ke-' + weekNum + ' kehamilan (anggaran berdasarkan LMP).';
    var wl = document.getElementById('edd-weeklink');
    wl.href = '<?php echo esc_js(home_url('/kehamilan-mingguan/')); ?>#minggu-' + Math.min(40, Math.max(1, weekNum));
    wl.textContent = 'Lihat perkembangan minggu ke-' + Math.min(40, Math.max(1, weekNum)) + ' →';
    document.getElementById('edd-result').classList.add('show');
  });
})();
</script>
<?php get_footer(); ?>