nodebb-plugin-niki-loyalty 1.0.21 → 1.0.23

package/static/lib/client.js

@@ -1,248 +1,451 @@
 'use strict';
 
-/* globals document, $, window, ajaxify, app, localStorage */
-
 $(document).ready(function () {
-    
-    // --- GENEL AYARLAR ---
-    const config = {
-        // Widget Görünümü
-        logoUrl: "https://i.ibb.co/nZvtpss/logo-placeholder.png",
-        defaultLabel: "PUANIM",
-        
-        // Topic Notification Ayarları
-        targetCategoryId: 1,       // Takip edilecek Kategori ID
-        checkInterval: 300000,     // 5 Dakika (ms)
-        showDuration: 15000,       // Konu ekranda kaç sn kalsın?
-        maxShowCount: 5,           // Bir konu bir kişiye max kaç kez gösterilsin?
-        topicValidity: 86400000,   // Konu 24 saatten eskiyse gösterme (ms)
-
-        // API Yolları
-        walletRoute: 'niki-wallet',
-        csrf_token: config.csrf_token
-    };
-
-    // Global Durum Değişkenleri
-    let currentPoints = "...";     // Başlangıçta boş
-    let isTopicAnimating = false;  // Şu an konu mu gösteriliyor?
-
-    // --- 1. WIDGET HTML ŞABLONU ---
-    const widgetHtml = `
-        <div id="niki-floating-widget" class="niki-hidden">
-            <div id="niki-widget-content" class="niki-widget-content">
-                <img src="${config.logoUrl}" class="niki-widget-logo" alt="Niki">
-                <div class="niki-widget-text">
-                    <span id="niki-lbl" class="niki-lbl">${config.defaultLabel}</span>
-                    <span id="niki-val" class="niki-val">${currentPoints}</span>
-                </div>
-            </div>
+  // =========================================
+  // AYARLAR
+  // =========================================
+  const NIKI_LOGO_URL = "https://i.ibb.co/nZvtpss/logo-placeholder.png";
+
+  // 60/120/180/250 → QR üret (kasa okutup puan düşsün)  ✅ senin istediğin
+  // Not: Backend tarafında /api/niki-loyalty/claim rewardId ile token döndürmeli,
+  //      puan düşümü scan-coupon tarafında olmalı.
+  const REWARDS_FALLBACK = [
+    { id: 'cookie', at: 60,  title: 'Ücretsiz Kurabiye' },
+    { id: 'c35',    at: 120, title: '%35 İndirimli Kahve' },
+    { id: 'c60',    at: 180, title: '%60 İndirimli Kahve' },
+    { id: 'coffee', at: 250, title: 'Ücretsiz Kahve' },
+  ];
+
+  // QR ekranda kalma süresi (eski gibi) ✅ 2 dakika
+  const QR_TTL_SECONDS = 120;
+
+  // =========================================
+  // FLOATING WIDGET
+  // =========================================
+  const widgetHtml = `
+    <div id="niki-floating-widget" class="niki-hidden">
+      <div class="niki-widget-content" onclick="ajaxify.go('niki-wallet')">
+        <img src="${NIKI_LOGO_URL}" class="niki-widget-logo" alt="Niki">
+        <div class="niki-widget-text">
+          <span class="niki-lbl">PUANIM</span>
+          <span class="niki-val" id="niki-live-points">...</span>
         </div>
-    `;
-
-    // --- 2. BAŞLATMA FONKSİYONU ---
-    function initNikiWidget() {
-        // Kullanıcı giriş yapmamışsa widget'ı gösterme
-        if (!app.user.uid || app.user.uid <= 0) return;
-
-        // HTML Enjeksiyonu
-        if ($('#niki-floating-widget').length === 0) {
-            $('body').append(widgetHtml);
-        }
+      </div>
+    </div>
+  `;
+
+  function fixLogo() {
+    const img = document.querySelector("img.niki-widget-logo");
+    if (img && img.src !== NIKI_LOGO_URL) img.src = NIKI_LOGO_URL;
+  }
+
+  function showNikiToast(msg, kind) {
+    $('.niki-toast').remove();
+    const icon = (kind === 'err') ? 'fa-triangle-exclamation' : (kind === 'warn' ? 'fa-circle-info' : 'fa-paw');
+    const toast = $(`<div class="niki-toast niki-${kind || 'ok'}"><i class="fa ${icon}"></i> ${msg}</div>`);
+    $('body').append(toast);
+    setTimeout(() => toast.addClass('show'), 50);
+    setTimeout(() => {
+      toast.removeClass('show');
+      setTimeout(() => toast.remove(), 350);
+    }, 3000);
+  }
+
+  function setPointsUI(points) {
+    const p = Number.isFinite(+points) ? +points : 0;
+    $('#niki-live-points').text(p);
+    $('#niki-floating-widget').removeClass('niki-hidden');
+    localStorage.setItem('niki_last_points', String(p));
+
+    // Wallet tpl içinde varsa güncelle
+    $('#my-points, #niki-wallet-points, .niki-wallet-points').text(p);
+    $('#target-txt').text(`${p} / 250`);
+  }
+
+  function initNikiWidget() {
+    if (!app.user.uid || app.user.uid <= 0) return;
+
+    if ($('#niki-floating-widget').length === 0) {
+      $('body').append(widgetHtml);
+    }
 
-        const $widget = $('#niki-floating-widget');
-        const $val = $('#niki-val');
+    const cachedPoints = localStorage.getItem('niki_last_points');
+    if (cachedPoints !== null) {
+      $('#niki-live-points').text(cachedPoints);
+      $('#niki-floating-widget').removeClass('niki-hidden');
+    }
 
-        // CACHE KONTROLÜ (Hızlı açılış için)
-        const cachedPoints = localStorage.getItem('niki_last_points');
-        if (cachedPoints !== null) {
-            currentPoints = cachedPoints;
-            $val.text(currentPoints);
-            $widget.removeClass('niki-hidden');
-        }
+    fixLogo();
+
+    $.get('/api/niki-loyalty/wallet-data', function (data) {
+      const freshPoints = data?.points || 0;
+      setPointsUI(freshPoints);
+      fixLogo();
+
+      // Wallet sayfasındaysa rewards render et
+      if (isWalletPage()) {
+        renderWalletFromData(data);
+      }
+    }).fail(function () {
+      if (cachedPoints === null) {
+        setPointsUI(0);
+      }
+    });
+  }
 
-        // GÜNCEL VERİ ÇEKME (Sunucudan)
-        $.get('/api/niki-loyalty/wallet-data', function(data) {
-            const freshPoints = data.points || 0;
-            currentPoints = freshPoints;
-            
-            // Eğer şu an konu animasyonu oynamıyorsa puanı güncelle
-            if (!isTopicAnimating) {
-                $val.text(freshPoints);
-            }
-
-            $widget.removeClass('niki-hidden');
-            localStorage.setItem('niki_last_points', freshPoints); // Cache güncelle
-            fixLogo();
-        }).fail(function() {
-            // Hata olursa ve cache yoksa 0 göster
-            if (cachedPoints === null) {
-                currentPoints = "0";
-                $val.text("0");
-                $widget.removeClass('niki-hidden');
-            }
-        });
+  function isWalletPage() {
+    // nodebb template adı her projede değişebilir; pathname ile de kontrol edelim
+    const p = window.location.pathname || '';
+    return (ajaxify?.data?.template === 'niki-wallet') || p.indexOf('niki-wallet') > -1;
+  }
 
-        // Tıklama Olayı (Event Delegation)
-        $('body').off('click', '#niki-widget-content').on('click', '#niki-widget-content', function () {
-            const link = $(this).data('link') || config.walletRoute;
-            ajaxify.go(link);
-        });
+  initNikiWidget();
 
-        // Topic Notification Kontrolünü Başlat
-        startTopicCheck();
+  $(window).on('action:ajaxify.end', function () {
+    initNikiWidget();
+    setTimeout(fixLogo, 400);
+  });
+
+  // =========================================
+  // HEARTBEAT
+  // =========================================
+  let activeSeconds = 0;
+  let isUserActive = false;
+  let idleTimer;
+
+  function resetIdleTimer() {
+    isUserActive = true;
+    clearTimeout(idleTimer);
+    idleTimer = setTimeout(() => { isUserActive = false; }, 30000);
+  }
+  $(window).on('mousemove scroll keydown click touchstart', resetIdleTimer);
+
+  setInterval(() => {
+    if (ajaxify?.data?.template?.topic && document.visibilityState === 'visible' && isUserActive) {
+      activeSeconds++;
     }
-
-    // --- 3. TOPIC NOTIFICATION SİSTEMİ ---
-    function startTopicCheck() {
-        // Eski interval varsa temizle
-        if (window.nikiTopicInterval) clearInterval(window.nikiTopicInterval);
-
-        // Fonksiyon: Kontrol Et ve Göster
-        const checkAndShow = function() {
-            $.get('/api/category/' + config.targetCategoryId, function (data) {
-                if (data && data.topics && data.topics.length > 0) {
-                    const topic = data.topics[0];
-                    const now = Date.now();
-
-                    // KURAL 1: Süre Kontrolü (24 Saat)
-                    if (now - topic.timestamp > config.topicValidity) return;
-
-                    // KURAL 2: Gösterim Sayısı Kontrolü (LocalStorage)
-                    let storageData = JSON.parse(localStorage.getItem('niki_topic_tracking') || '{}');
-                    
-                    // Konu değişmişse sayacı sıfırla
-                    if (storageData.tid !== topic.tid) {
-                        storageData = { tid: topic.tid, count: 0 };
-                    }
-
-                    // KURAL 3: Limit Dolmadıysa Göster
-                    if (storageData.count < config.maxShowCount) {
-                        animateTopicNotification(topic);
-
-                        // Sayacı artır ve kaydet
-                        storageData.count++;
-                        localStorage.setItem('niki_topic_tracking', JSON.stringify(storageData));
-                    }
-                }
-            });
-        };
-
-        // Sayfa açılır açılmaz bir kez kontrol et
-        checkAndShow();
-
-        // Sonra 5 dakikada bir devam et
-        window.nikiTopicInterval = setInterval(checkAndShow, config.checkInterval);
+    if (activeSeconds >= 60) {
+      sendHeartbeat();
+      activeSeconds = 0;
     }
+  }, 1000);
 
-    function animateTopicNotification(topic) {
-        const $val = $('#niki-val');
-        const $lbl = $('#niki-lbl');
-        const $container = $('#niki-widget-content');
-
-        if ($val.length > 0) {
-            isTopicAnimating = true; // Flag'i kaldır (Puan güncellemesi araya girmesin)
-
-            $val.fadeOut(200, function () {
-                $lbl.text('YENİ KONU:');
-                $(this).text(topic.title).fadeIn(200);
-
-                // Linki ve Stili Değiştir
-                $container.data('link', 'topic/' + topic.slug);
-                $container.addClass('highlight-topic');
-            });
-
-            // 15 Saniye sonra eski haline dön
-            setTimeout(function () {
-                $val.fadeOut(200, function () {
-                    $lbl.text(config.defaultLabel);
-                    $(this).text(currentPoints).fadeIn(200); // Güncel puanı yaz
-
-                    // Linki ve Stili Sıfırla
-                    $container.data('link', config.walletRoute);
-                    $container.removeClass('highlight-topic');
-                    
-                    isTopicAnimating = false; // Flag'i indir
-                });
-            }, config.showDuration);
-        }
-    }
+  function sendHeartbeat() {
+    $.post('/api/niki-loyalty/heartbeat', { _csrf: config.csrf_token }, function (res) {
+      if (res && res.earned) {
+        setPointsUI(res.total);
+        showNikiToast(`+${res.points} Puan Kazandın! ⚡`, 'ok');
+
+        $('#niki-floating-widget').addClass('niki-bounce');
+        setTimeout(() => $('#niki-floating-widget').removeClass('niki-bounce'), 500);
 
-    // --- 4. YARDIMCI FONKSİYONLAR ---
-    function fixLogo() {
-        const img = document.querySelector("img.niki-widget-logo");
-        if (img && img.src !== config.logoUrl) {
-            img.src = config.logoUrl;
+        // wallet açıksa güncelle
+        if (isWalletPage()) {
+          refreshWallet();
+        }
+      }
+    });
+  }
+
+  // =========================================
+  // WALLET: Rewards render + QR flow (2 dk)
+  // =========================================
+  let pollInterval = null;
+  let initialPointsForQR = null;
+  let timerInterval = null;
+
+  function refreshWallet() {
+    $.get('/api/niki-loyalty/wallet-data', function (data) {
+      setPointsUI(data?.points || 0);
+      renderWalletFromData(data);
+    });
+  }
+
+  function renderWalletFromData(data) {
+    // 1) Bar (varsa)
+    try {
+      const p = parseInt(data?.points || 0, 10) || 0;
+      const goal = parseInt(data?.barMax || 250, 10) || 250;
+      const pct = Math.min(100, (p / goal) * 100);
+      $('#prog-bar').css('width', pct + '%');
+      $('#target-txt').text(`${p} / ${goal}`);
+    } catch (e) {}
+
+    // 2) Rewards container varsa bas
+    const $wrap = $('#niki-rewards');
+    if ($wrap.length === 0) return;
+
+    const points = parseInt(data?.points || 0, 10) || 0;
+    const rewards = Array.isArray(data?.rewards) && data.rewards.length ? data.rewards : REWARDS_FALLBACK.map(r => ({
+      id: r.id, at: r.at, title: r.title, unlocked: points >= r.at
+    }));
+
+    const cards = rewards.map(r => {
+      const at = parseInt(r.at || 0, 10) || 0;
+      const unlocked = points >= at;
+
+      const btnText = unlocked ? 'QR OLUŞTUR' : `${at - points} PUAN EKSİK`;
+      const btnDisabled = unlocked ? '' : 'disabled';
+
+      return `
+        <div class="niki-r-card ${unlocked ? 'on' : ''}" style="display:flex;align-items:center;justify-content:space-between;padding:12px 12px;border-radius:16px;background:#FAFAFA;border:1px solid #EEE;margin:10px 0;">
+          <div style="text-align:left;">
+            <div style="font-weight:800;color:#1a1a1a;font-size:13px;">${escapeHtml(r.title)}</div>
+            <div style="color:#888;font-size:11px;font-weight:700;margin-top:2px;">${at} puan</div>
+          </div>
+          <button class="niki-genqr-btn" data-reward="${escapeAttr(r.id)}" data-title="${escapeAttr(r.title)}" data-cost="${at}"
+            ${btnDisabled}
+            style="border:none;border-radius:14px;padding:12px 12px;font-weight:900;font-size:12px;cursor:${unlocked ? 'pointer' : 'not-allowed'};background:${unlocked ? '#1a1a1a' : '#E0E0E0'};color:${unlocked ? '#fff' : '#999'};min-width:120px;">
+            ${btnText}
+          </button>
+        </div>
+      `;
+    }).join('');
+
+    $wrap.html(`
+      <div style="font-size:11px;color:#888;text-align:left;margin:6px 0 10px;font-weight:700;">
+        QR oluşturunca puanın <b>kasada okutulunca</b> düşer. (2 dakika geçerli)
+      </div>
+      ${cards}
+    `);
+
+    // click bind
+    $wrap.off('click.nikiGen').on('click.nikiGen', '.niki-genqr-btn:not([disabled])', function () {
+      const rewardId = $(this).data('reward');
+      const title = $(this).data('title') || 'Ödül';
+      const cost = parseInt($(this).data('cost') || 0, 10) || 0;
+
+      generateRewardQR({ rewardId, title, cost });
+    });
+  }
+
+  function generateRewardQR({ rewardId, title, cost }) {
+    // qr modal varsa onu kullan, yoksa basit popup yap
+    if (!rewardId) return;
+
+    // güvenli: o anda puan snapshot
+    $.get('/api/niki-loyalty/wallet-data', function (data) {
+      const points = parseInt(data?.points || 0, 10) || 0;
+      if (points < cost) {
+        showNikiToast('Yetersiz puan', 'warn');
+        refreshWallet();
+        return;
+      }
+
+      if (!confirm(`${title} için QR oluşturulsun mu? (2 dakika geçerli)`)) return;
+
+      // ✅ Claim = sadece token üret (puan düşmez), okutunca düşer
+      $.post('/api/niki-loyalty/claim', { rewardId, _csrf: config.csrf_token }, function (res) {
+        if (!res || !res.success || !res.token) {
+          showNikiToast(res?.message || 'QR oluşturulamadı', 'err');
+          return;
         }
-    }
 
-    // --- 5. AKTİFLİK SİSTEMİ (HEARTBEAT) ---
-    let activeSeconds = 0;
-    let isUserActive = false;
-    let idleTimer;
-    
-    function resetIdleTimer() {
-        isUserActive = true;
-        clearTimeout(idleTimer);
-        idleTimer = setTimeout(() => { isUserActive = false; }, 30000);
-    }
-    
-    // Kullanıcı hareketlerini dinle
-    $(window).on('mousemove scroll keydown click touchstart', resetIdleTimer);
-
-    // Her saniye kontrol et
-    if (!window.nikiHeartbeatInterval) {
-        window.nikiHeartbeatInterval = setInterval(() => {
-            // Sadece bir konunun içindeysek (ajaxify.data.template.topic) ve sekme açıksa say
-            if (ajaxify.data.template.topic && document.visibilityState === 'visible' && isUserActive) {
-                activeSeconds++;
-            }
-            // 60 saniye dolduysa sunucuya bildir
-            if (activeSeconds >= 60) {
-                sendHeartbeat();
-                activeSeconds = 0;
-            }
-        }, 1000);
+        initialPointsForQR = points;
+        openQRModal({
+          token: res.token,
+          title: title,
+          ttlSeconds: QR_TTL_SECONDS,
+        });
+
+        startPollingForSuccess();
+      }).fail(function () {
+        showNikiToast('Sunucu hatası (claim)', 'err');
+      });
+    });
+  }
+
+  function openQRModal({ token, title, ttlSeconds }) {
+    // Wallet tpl'nin modalını destekle
+    const $modal = $('#modal-qr');
+    const hasTplModal = $modal.length > 0;
+
+    if (!hasTplModal) {
+      // fallback: hızlı modal enjekte
+      injectFallbackQRModal();
     }
 
-    function sendHeartbeat() {
-        $.post('/api/niki-loyalty/heartbeat', { _csrf: config.csrf_token }, function(res) {
-            if (res.earned) {
-                // Global puan değişkenini güncelle
-                currentPoints = res.total;
-                localStorage.setItem('niki_last_points', res.total);
-
-                // Eğer o sırada Konu Animasyonu oynamıyorsa, ekrandaki puanı da güncelle
-                if (!isTopicAnimating) {
-                    $('#niki-val').text(res.total);
-                    
-                    // Ufak bir zıplama efekti
-                    $('#niki-floating-widget').addClass('niki-bounce');
-                    setTimeout(() => $('#niki-floating-widget').removeClass('niki-bounce'), 500);
-                }
-
-                showNikiToast(`+${res.points} Puan Kazandın! ☕`);
-            }
+    // tpl modal elemanları varsa set
+    $('#view-code').show();
+    $('#view-success').hide();
+    $('#ticket-title').text((title || 'ÖDÜL') + ' • KASAYA GÖSTER');
+    $('#ticket-sub').text('QR’ı kasada okut.');
+
+    // QR bas (qrcodejs yoksa token yaz)
+    const qrEl = document.getElementById('qrcode');
+    if (qrEl) {
+      $(qrEl).empty();
+
+      if (typeof QRCode !== 'undefined') {
+        // Büyük, okunaklı QR
+        new QRCode(qrEl, {
+          text: String(token),
+          width: 260,
+          height: 260,
+          colorDark: "#000000",
+          colorLight: "#ffffff",
+          correctLevel: QRCode.CorrectLevel.L
         });
+      } else {
+        $(qrEl).html(`<div style="font-weight:900;word-break:break-all;">${escapeHtml(token)}</div>`);
+      }
     }
 
-    function showNikiToast(msg) {
-        $('.niki-toast').remove();
-        const toast = $(`<div class="niki-toast"><i class="fa fa-paw"></i> ${msg}</div>`);
-        $('body').append(toast);
-        setTimeout(() => { toast.addClass('show'); }, 100);
-        setTimeout(() => { 
-            toast.removeClass('show');
-            setTimeout(() => toast.remove(), 3000);
-        }, 3000);
+    // modal aç
+    $('#modal-qr').fadeIn(200).css('display', 'flex');
+
+    // timer
+    startTimer(ttlSeconds);
+  }
+
+  function startTimer(durationSec) {
+    clearInterval(timerInterval);
+    let timer = durationSec;
+    const total = durationSec;
+
+    $('#time-bar').css('width', '100%');
+    $('#timer-txt').text(formatTime(timer));
+
+    timerInterval = setInterval(function () {
+      // modal kapanırsa dur
+      if (!$('#modal-qr').is(':visible') || $('#view-success').is(':visible')) {
+        clearInterval(timerInterval);
+        timerInterval = null;
+        return;
+      }
+
+      const pct = Math.max(0, (timer / total) * 100);
+      $('#time-bar').css('width', pct + '%');
+      $('#timer-txt').text(formatTime(timer));
+
+      timer -= 1;
+      if (timer < 0) {
+        clearInterval(timerInterval);
+        timerInterval = null;
+        closeQRModal();
+        showNikiToast('Süre doldu, kod geçersiz olabilir.', 'warn');
+      }
+    }, 1000);
+  }
+
+  function startPollingForSuccess() {
+    clearInterval(pollInterval);
+
+    pollInterval = setInterval(() => {
+      // modal açık değilse polling durdur
+      if (!$('#modal-qr').is(':visible')) {
+        clearInterval(pollInterval);
+        pollInterval = null;
+        return;
+      }
+
+      // ✅ Eski gibi: puan düşerse -> kasa okutmuş demektir
+      $.get('/api/niki-loyalty/wallet-data', function (data) {
+        const currentP = parseInt(data?.points || 0, 10) || 0;
+
+        // Puan düşmüşse başarı
+        if (initialPointsForQR != null && currentP < initialPointsForQR) {
+          clearInterval(pollInterval);
+          pollInterval = null;
+
+          showSuccessView();
+          setPointsUI(currentP);
+          // reward list refresh
+          renderWalletFromData(data);
+        }
+      });
+    }, 2000);
+  }
+
+  function showSuccessView() {
+    $('#view-code').hide();
+    $('#view-success').fadeIn(200);
+
+    // confetti varsa patlat
+    try {
+      if (typeof confetti !== 'undefined') {
+        confetti({ particleCount: 140, spread: 70, origin: { y: 0.6 } });
+      }
+    } catch (e) {}
+  }
+
+  // tpl'nin closeQR fonksiyonu varsa onu çağır, yoksa kendin kapat
+  window.closeQR = window.closeQR || function () { closeQRModal(); };
+
+  function closeQRModal() {
+    $('#modal-qr').fadeOut(200);
+    clearInterval(pollInterval);
+    pollInterval = null;
+    clearInterval(timerInterval);
+    timerInterval = null;
+    initialPointsForQR = null;
+
+    // wallet refresh
+    if (isWalletPage()) {
+      setTimeout(refreshWallet, 400);
     }
+  }
 
-    // --- BAŞLATMA ---
-    initNikiWidget();
+  function injectFallbackQRModal() {
+    if ($('#modal-qr').length) return;
 
-    // Sayfa geçişlerinde widget'ı koru
-    $(window).on('action:ajaxify.end', function () {
-        initNikiWidget();
-        setTimeout(fixLogo, 500);
-    });
+    $('body').append(`
+      <div id="modal-qr" class="qr-overlay" style="position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(10,10,10,.92);z-index:10000;">
+        <div class="ticket-card" style="background:#fff;width:320px;border-radius:26px;overflow:hidden;position:relative;">
+          <div class="close-circle" onclick="closeQR()" style="position:absolute;top:12px;right:12px;width:30px;height:30px;border-radius:50%;background:rgba(0,0,0,.08);display:flex;align-items:center;justify-content:center;cursor:pointer;">
+            <i class="fa fa-times"></i>
+          </div>
 
-});
+          <div id="view-code">
+            <div class="ticket-top" id="ticket-title" style="background:#111;padding:22px;color:#C5A065;font-weight:900;letter-spacing:2px;font-size:12px;text-align:center;">
+              KASAYA GÖSTERİNİZ
+            </div>
+            <div class="ticket-body" style="padding:30px 22px;text-align:center;">
+              <div id="qrcode" style="display:flex;justify-content:center;margin-bottom:16px;"></div>
+              <div id="ticket-sub" style="font-size:13px;font-weight:900;color:#111;margin-top:4px;">QR hazır</div>
+              <div class="timer-wrapper" style="width:100%;height:6px;background:#eee;border-radius:10px;overflow:hidden;margin-top:12px;">
+                <div class="timer-bar" id="time-bar" style="height:100%;background:#C5A065;width:100%;"></div>
+              </div>
+              <div class="timer-text" id="timer-txt" style="font-size:12px;color:#777;margin-top:8px;font-weight:800;">2:00</div>
+            </div>
+          </div>
+
+          <div id="view-success" class="success-view" style="display:none;padding:34px 18px;text-align:center;">
+            <div class="success-icon" style="width:92px;height:92px;margin:0 auto 16px;border-radius:50%;background:#2E7D32;color:#fff;display:flex;align-items:center;justify-content:center;font-size:44px;">
+              <i class="fa fa-check"></i>
+            </div>
+            <div style="font-size:20px;font-weight:900;color:#111;">AFİYET OLSUN!</div>
+            <div style="font-size:13px;color:#777;margin-top:6px;">Kasa onayı alındı.</div>
+            <button class="niki-btn" onclick="closeQR()" style="margin-top:16px;background:#111;color:#fff;width:100%;padding:14px;border-radius:16px;border:none;font-weight:900;">
+              TAMAM
+            </button>
+          </div>
+        </div>
+      </div>
+    `);
+  }
+
+  function formatTime(sec) {
+    sec = Math.max(0, parseInt(sec, 10) || 0);
+    const m = Math.floor(sec / 60);
+    const s = sec % 60;
+    return `${m}:${s < 10 ? '0' + s : s}`;
+  }
+
+  function escapeHtml(str) {
+    return String(str || '')
+      .replaceAll('&', '&amp;')
+      .replaceAll('<', '&lt;')
+      .replaceAll('>', '&gt;')
+      .replaceAll('"', '&quot;')
+      .replaceAll("'", '&#39;');
+  }
+  function escapeAttr(str) {
+    return escapeHtml(str).replaceAll(' ', '');
+  }
+
+  // Wallet sayfasına ilk girişte render
+  if (isWalletPage()) {
+    refreshWallet();
+  }
+});