<!DOCTYPE html>
<html lang="tr">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
  <title>HeySen</title>
  <style>
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html, body {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  overflow: hidden;
}

body {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}

.loading-screen {
  width: 100%;
  max-width: 420px;
  height: 100vh;
  height: 100dvh;
  background: rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.25);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 30px;
  position: relative;
  overflow: hidden;
}

/* Floating circles */
.circle {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  animation: float 6s ease-in-out infinite;
}

.circle-1 {
  width: 120px;
  height: 120px;
  top: -30px;
  right: -30px;
}

.circle-2 {
  width: 80px;
  height: 80px;
  bottom: 15%;
  left: -20px;
  animation-delay: 2s;
}

.circle-3 {
  width: 60px;
  height: 60px;
  top: 40%;
  right: -15px;
  animation-delay: 4s;
}

@keyframes float {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-15px) scale(1.05); }
}

/* Logo */
.logo {
  margin-bottom: 30px;
  z-index: 2;
  animation: fadeIn 0.5s ease;
}

.logo img {
  height: 42px;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* GIF */
.gif-container {
  width: 100%;
  max-width: 320px;
  margin-bottom: 30px;
  z-index: 2;
  animation: fadeIn 0.6s ease 0.1s both;
}

.gif-container img {
  width: 100%;
  height: auto;
}

/* Content */
.content {
  text-align: center;
  z-index: 2;
  animation: fadeIn 0.7s ease 0.2s both;
}

.title {
  font-size: 28px;
  font-weight: 800;
  color: white;
  margin-bottom: 8px;
  line-height: 1.2;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.15);
}

.title .emoji {
  display: inline-block;
  animation: heartBeat 1.5s ease-in-out infinite;
}

@keyframes heartBeat {
  0%, 100% { transform: scale(1); }
  15% { transform: scale(1.2); }
  30% { transform: scale(1); }
  45% { transform: scale(1.15); }
  60% { transform: scale(1); }
}

.subtitle {
  font-size: 15px;
  color: rgba(255, 255, 255, 0.95);
  font-weight: 500;
  margin-bottom: 35px;
  line-height: 1.6;
}

.highlight {
  background: linear-gradient(90deg, #FFD700, #FFA500);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 700;
}

/* Loading */
.loading-box {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 16px;
  padding: 20px 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
  backdrop-filter: blur(5px);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.spinner {
  width: 40px;
  height: 40px;
  border: 3px solid rgba(255, 255, 255, 0.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.loading-text {
  color: white;
  font-size: 14px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 8px;
}

.loading-text .icon {
  font-size: 16px;
  animation: pulse 1.5s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.7; transform: scale(1.1); }
}

.dots {
  display: flex;
  gap: 6px;
  margin-top: 5px;
}

.dot {
  width: 8px;
  height: 8px;
  background: white;
  border-radius: 50%;
  animation: dotPulse 1.4s ease-in-out infinite;
}

.dot:nth-child(1) { animation-delay: 0s; }
.dot:nth-child(2) { animation-delay: 0.2s; }
.dot:nth-child(3) { animation-delay: 0.4s; }

@keyframes dotPulse {
  0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
  40% { transform: scale(1); opacity: 1; }
}

/* Stats badge */
.stats-row {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 25px;
}

.stat-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: white;
  padding: 6px 12px;
  border-radius: 18px;
  font-size: 11px;
  font-weight: 700;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
  animation: bounceIn 0.6s ease backwards;
}

.stat-badge:nth-child(1) { animation-delay: 0.6s; }
.stat-badge:nth-child(2) { animation-delay: 0.7s; }

@keyframes bounceIn {
  0% { opacity: 0; transform: scale(0.3); }
  50% { transform: scale(1.05); }
  100% { opacity: 1; transform: scale(1); }
}

.stat-badge.free {
  background: linear-gradient(135deg, #f0fff4, #e6fffa);
  color: #10b981;
}

.stat-badge.online {
  background: linear-gradient(135deg, #ebf8ff, #e9f5ff);
  color: #667eea;
}

.stat-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  animation: statPulse 2s ease-in-out infinite;
}

@keyframes statPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.3); opacity: 0.8; }
}

.stat-badge.free .stat-dot {
  background: #10b981;
}

.stat-badge.online .stat-dot {
  background: #667eea;
}

/* Responsive */
@media (max-height: 650px) {
  .logo img { height: 36px; }
  .gif-container { max-width: 260px; margin-bottom: 20px; }
  .title { font-size: 24px; }
  .subtitle { font-size: 14px; margin-bottom: 25px; }
  .loading-box { padding: 15px 25px; }
}

@media (min-width: 768px) {
  .loading-screen {
    border-radius: 28px;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.2);
    height: auto;
    min-height: 580px;
    max-height: 90vh;
  }
}
  </style>
</head>
<body>

<div class="loading-screen">
  <!-- Floating circles -->
  <div class="circle circle-1"></div>
  <div class="circle circle-2"></div>
  <div class="circle circle-3"></div>
  
  <!-- Logo -->
  <div class="logo">
    <img src="https://app.heysen.net/assets/img/logo.png" alt="HeySen">
  </div>

  <!-- GIF -->
  <div class="gif-container">
    <img src="https://app.heysen.net/assets/img/location-loading.gif" alt="">
  </div>

  <!-- Content -->
  <div class="content">
    <h1 class="title">Hoş Geldin! <span class="emoji">💕</span></h1>
    <p class="subtitle">
      <span class="highlight">Yakınındaki binlerce kişiyi</span><br>
      senin için buluyoruz...
    </p>
    
    <!-- Loading Box -->
    <div class="loading-box">
      <div class="spinner"></div>
      <div class="loading-text">
        <span class="icon">🔍</span>
        <span id="loadingText">Yakınındakiler aranıyor</span>
      </div>
      <div class="dots">
        <div class="dot"></div>
        <div class="dot"></div>
        <div class="dot"></div>
      </div>
    </div>
    
    <!-- Stats -->
    <div class="stats-row">
      <div class="stat-badge free">
        <span class="stat-dot"></span>
        <span><span id="onlineCount"></span> Çevrimiçi</span>
      </div>
      <div class="stat-badge online">
        <span class="stat-dot"></span>
        <span>%100 Ücretsiz Üyelik</span>
      </div>
    </div>
  </div>
</div>

<script>
// Random çevrimiçi sayısı (2000-3000)
var online = Math.floor(Math.random() * 1001) + 2000;
document.getElementById('onlineCount').textContent = online.toLocaleString('tr-TR');

var messages = [
  {icon: '🔍', text: 'Yakınındakiler aranıyor'},
  {icon: '👥', text: 'Profiller yükleniyor'},
  {icon: '💕', text: 'Eşleşmeler bulunuyor'},
  {icon: '✨', text: 'Hazırlanıyor'},
  {icon: '🚀', text: 'Neredeyse hazır'}
];

var i = 0;
var el = document.getElementById('loadingText');
var iconEl = el.previousElementSibling;

setInterval(function() {
  i = (i + 1) % messages.length;
  el.style.opacity = '0';
  iconEl.style.opacity = '0';
  setTimeout(function() {
    el.textContent = messages[i].text;
    iconEl.textContent = messages[i].icon;
    el.style.opacity = '1';
    iconEl.style.opacity = '1';
  }, 150);
}, 1800);
</script>

<?php
// PHP işlemleri
include 'config.php';

$player_id = isset($_GET['userId']) ? $_GET['userId'] : '';
$user_token = isset($_COOKIE['user_token']) ? $_COOKIE['user_token'] : '';
$ip = $_SERVER['REMOTE_ADDR'];
$useragent = $_SERVER['HTTP_USER_AGENT'];
$suan = time();

if (!empty($player_id)) {
    setcookie("user_onesignal", $player_id, time() + (365 * 60 * 60 * 24));
} else {
    die();
}

if (!empty($user_token)) {
    $userCheck = $db->query("SELECT COUNT(*) FROM kullanicilar where user_token = '{$user_token}'")->fetchColumn();

    if ($userCheck != 0) {
        $tekBak = $db->query("SELECT * FROM kullanicilar WHERE user_token = '{$user_token}'")->fetch(PDO::FETCH_ASSOC);

        $query = $db->prepare("UPDATE kullanicilar SET
            user_songiris = :bir,
            user_agent = :dort,
            user_ip = :uc
            WHERE user_token = :iki"
        );

        if (stripos($tekBak['user_onesignal'], "##_##_") === false) {
            $query = $db->prepare("UPDATE kullanicilar SET
                user_onesignal = :bes,
                user_songiris = :bir,
                user_agent = :dort,
                user_ip = :uc
                WHERE user_token = :iki"
            );
            $query->bindParam(':bes', $player_id, PDO::PARAM_STR);
        }

        $query->bindParam(':bir', $suan, PDO::PARAM_INT);
        $query->bindParam(':dort', $useragent, PDO::PARAM_STR);
        $query->bindParam(':uc', $ip, PDO::PARAM_STR);
        $query->bindParam(':iki', $user_token, PDO::PARAM_STR);
        $query->execute();

        header("Location: welcome.php");
        exit;
    } else {
        header("Location: welcome.php");
        exit;
    }
} else {
    $coPlayer2 = $db->query("SELECT * FROM not_registered WHERE player_id = '{$player_id}'")->fetch(PDO::FETCH_ASSOC);

    if (!$coPlayer2) {
        $query = $db->prepare("INSERT INTO not_registered SET player_id = ?, songiris = ?");
        $query->execute(array($player_id, $suan));
    }
    
    header("Location: welcome.php");
    exit;
}
?>

</body>
</html>
