<!-- بداية الكود الكامل والنهائي لصفحة التسجيل --> <!-- 1. HTML: (لا تغيير) --> <div class="signup-container" style="max-width:400px;margin:auto;padding:25px;border-radius:12px;"> <h2 style="text-align:center;">إنشاء حساب جديد</h2> <input type="text" id="fullName" placeholder="الاسم الكامل" required style="width:100%;padding:12px;margin-bottom:15px;border:1px solid var(--border-color,#ccc);border-radius:8px;font-size:15px;background-color:transparent;color:inherit;"> <input type="email" id="email" placeholder="البريد الإلكتروني" required style="width:100%;padding:12px;margin-bottom:15px;border:1px solid var(--border-color,#ccc);border-radius:8px;font-size:15px;background-color:transparent;color:inherit;"> <input type="password" id="password" placeholder="كلمة المرور" required style="width:100%;padding:12px;margin-bottom:15px;border:1px solid var(--border-color,#ccc);border-radius:8px;font-size:15px;background-color:transparent;color:inherit;"> <div id="recaptcha-container" style="display:flex; justify-content:center; margin-bottom:15px;"></div> <button id="signUpBtn" style="width:100%;padding:12px;background:var(--primary-color, #007BFF);color:#fff;border:none;border-radius:8px;font-size:16px;cursor:pointer;">إنشاء حساب</button> <div style="text-align:center;margin-top:15px;"> هل لديك حساب؟ <a href="/p/login.html" style="text-decoration:none;">تسجيل الدخول</a> </div> </div> <div id="successModal" style="display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:9999;align-items:center;justify-content:center;"> <div style="padding:30px;border-radius:12px;text-align:center;max-width:90%;margin:auto;animation:fadeIn 0.5s ease-in-out;background-color:var(--content-bg, #fff); color: var(--text-color, #333);"> <div style="font-size:40px;margin-bottom:15px;">🎉</div> <div style="font-size:20px; font-weight:bold;">مرحبا بك في عالم الأرباح! 🤑</div> <div style="margin-top:8px; font-size:16px;">تم إنشاء حسابك بنجاح، يتم الآن تجهيز لوحتك الخاصة...</div> </div> </div> <div id="alert-modal" class="modal-overlay" style="display:none;"> <div class="alert-content"> <h3 id="alert-title"></h3> <p id="alert-message"></p> <button id="alert-close-btn" onclick="closeAlertModal()">حسنًا</button> </div> </div> <!-- 2. Firebase & reCAPTCHA CDN --> <script src="https://www.gstatic.com/firebasejs/9.6.10/firebase-app-compat.js"></script> <script src="https://www.gstatic.com/firebasejs/9.6.10/firebase-auth-compat.js"></script> <script src="https://www.gstatic.com/firebasejs/9.6.10/firebase-firestore-compat.js"></script> <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit" async defer></script> <script> /* بداية الكود المُعدَّل لـ signup.html */ const firebaseConfig = { apiKey: "AIzaSyAsTkLc7n_T_oxPbn4zyRv68YisrT-jmec", authDomain: "arbahblog-74801.firebaseapp.com", projectId: "arbahblog-74801" }; firebase.initializeApp(firebaseConfig); const auth = firebase.auth(); const db = firebase.firestore(); const IPINFO_TOKEN = "0fac41ba969173"; const signUpBtn = document.getElementById("signUpBtn"); const RECAPTCHA_SITE_KEY = "6Ld_3Y8rAAAAAOdGfYLV8f8HWNs3y7rVcb-6v1vj"; let recaptchaWidgetId; const alertModal = document.getElementById('alert-modal'); const alertContent = alertModal.querySelector('.alert-content'); function showAlert(type, title, message) { alertContent.className = 'alert-content ' + type; document.getElementById('alert-title').textContent = title; document.getElementById('alert-message').textContent = message; alertModal.style.display = 'flex'; } function closeAlertModal() { alertModal.style.display = 'none'; } signUpBtn.disabled = true; var onloadCallback = function() { recaptchaWidgetId = grecaptcha.render('recaptcha-container', { 'sitekey' : RECAPTCHA_SITE_KEY, 'callback' : onCaptchaSuccess }); }; function onCaptchaSuccess() { signUpBtn.disabled = false; } // ---!!! التعديل الوحيد هنا !!!--- function getReferrerId() { // ابحث أولاً في ذاكرة المتصفح const storedRefId = localStorage.getItem('referrerId'); if (storedRefId) { return storedRefId; } // إذا لم تجد شيئًا، ابحث في رابط الصفحة كخطة بديلة const urlParams = new URLSearchParams(window.location.search); return urlParams.get('ref') || null; } // ---!!! نهاية التعديل ---!!! function getDeviceInfo() { const ua = navigator.userAgent; let os = "Unknown"; if (/android/i.test(ua)) { os = "Android"; } else if (/iPad|iPhone|iPod/.test(ua)) { os = "iOS"; } else if (/windows phone/i.test(ua)) { os = "Windows Phone"; } else if (/windows/i.test(ua)) { os = "Windows"; } else if (/macintosh|mac os x/i.test(ua)) { os = "macOS"; } else if (/linux/i.test(ua)) { os = "Linux"; } let deviceType = "Desktop"; if (/(tablet|ipad|playbook|silk)|(android(?!.*mobi))/i.test(ua)) { deviceType = "Tablet"; } else if (/Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/i.test(ua)) { deviceType = "Mobile"; } return { os: os, deviceType: deviceType }; } async function getCountryInfo() { try { const response = await fetch(`https://ipinfo.io/json?token=${IPINFO_TOKEN}`); if (!response.ok) throw new Error('Network response was not ok.'); const data = await response.json(); return data.country || "Unknown"; } catch (error) { console.error("Error fetching country info:", error); return "Unknown"; } } signUpBtn.addEventListener("click", async () => { const fullName = document.getElementById("fullName").value.trim(); const email = document.getElementById("email").value.trim(); const password = document.getElementById("password").value; if (!fullName || !email || !password) { showAlert('error', 'بيانات ناقصة', 'الرجاء ملء جميع الحقول المطلوبة.'); return; } const recaptchaResponse = grecaptcha.getResponse(recaptchaWidgetId); if (!recaptchaResponse) { showAlert('error', 'خطوة أخيرة', 'يرجى تأكيد أنك لست برنامج روبوت.'); return; } signUpBtn.disabled = true; signUpBtn.textContent = "جاري التسجيل..."; const referrerId = getReferrerId(); // استدعاء الدالة الجديدة const deviceInfo = getDeviceInfo(); const country = await getCountryInfo(); auth.createUserWithEmailAndPassword(email, password) .then((userCredential) => { return userCredential.user.updateProfile({ displayName: fullName }) .then(() => { return db.collection("users").doc(userCredential.user.uid).set({ name: fullName, email: email, adsPoints: 0, referralPoints: 0, cpaPoints: 0, shortlinkPoints: 0, taskPoints: 0, ptcPoints: 0, advertiserBalance: 0, pendingWithdrawal: 0, createdAt: firebase.firestore.FieldValue.serverTimestamp(), referrerId: referrerId, referralGiven: false, country: country, os: deviceInfo.os, deviceType: deviceInfo.deviceType }); }); }) .then(() => { // بعد التسجيل الناجح، قم بحذف البصمة لمنع استخدامها مرة أخرى localStorage.removeItem('referrerId'); document.getElementById("successModal").style.display = "flex"; setTimeout(() => { window.location.href = "/p/dashboard.html"; }, 3000); }) .catch((error) => { let errorMessage = "حدث خطأ غير متوقع. يرجى المحاولة مرة أخرى."; if (error.code === 'auth/email-already-in-use') { errorMessage = "هذا البريد الإلكتروني مسجل بالفعل. حاول تسجيل الدخول."; } else if (error.code === 'auth/weak-password') { errorMessage = "كلمة المرور ضعيفة جدًا. يجب أن تتكون من 6 أحرف على الأقل."; } showAlert('error', 'فشلت عملية التسجيل', errorMessage); signUpBtn.disabled = false; signUpBtn.textContent = "إنشاء حساب"; grecaptcha.reset(recaptchaWidgetId); }); }); /* نهاية الكود المُعدَّل */ </script> <!-- 4. CSS --> <style> @keyframes fadeIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } } :root { --success-color: #27ae60; --error-color: #c0392b; --primary-color: #007BFF; } .modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); display: flex; align-items: center; justify-content: center; z-index: 1000; } .alert-content { color: white; padding: 25px; border-radius: 15px; width: 90%; max-width: 400px; text-align: center; animation: fadeIn 0.3s; box-shadow: 0 5px 15px rgba(0,0,0,0.2); } .alert-content.success { background-color: var(--success-color); } .alert-content.error { background-color: var(--error-color); } .alert-content h3 { margin-top: 0; font-size: 22px; color: white !important; } .alert-content p { margin: 10px 0 0; font-size: 16px; opacity: 0.9; } #alert-close-btn { margin-top: 20px; padding: 10px 30px; border: none; border-radius: 8px; background: rgba(255,255,255,0.2); color: white; font-size: 16px; cursor: pointer; transition: background-color 0.2s; } #alert-close-btn:hover { background: rgba(255,255,255,0.3); } </style>