<?php
header('Content-Type: text/html; charset=UTF-8');
session_start();
include 'db.php';

// Pagination
$limit = 5;
$page = max(1, intval($_GET['page'] ?? 1));
$offset = ($page - 1) * $limit;

// Total companies
$totalStmt = $pdo->query("SELECT COUNT(*) FROM companies");
$totalCompanies = $totalStmt->fetchColumn();
$totalPages = ceil($totalCompanies / $limit);










$searchTerm = trim($_GET['search'] ?? '');

if ($searchTerm !== '') {
    // Search query
    $stmt = $pdo->prepare("
        SELECT c.id, c.name, c.website, c.image, cat.name AS category,
            COUNT(r.id) AS review_count,
            ROUND(AVG(r.rating),1) AS avg_rating,
            MAX(r.rating) AS highest_rating
        FROM companies c
        LEFT JOIN categories cat ON c.category_id = cat.id
        LEFT JOIN reviews r ON c.id = r.company_id
        WHERE c.name LIKE :search
        GROUP BY c.id
        ORDER BY c.name
    ");
    $stmt->execute(['search' => '%' . $searchTerm . '%']);
    $companies = $stmt->fetchAll();
    $totalCompanies = count($companies); // For display in hero
    $totalPages = 1; // Disable pagination for search
} else {
    // Original fetch (with pagination)
    $stmt = $pdo->prepare("
        SELECT c.id, c.name, c.website, c.image, cat.name AS category,
            COUNT(r.id) AS review_count,
            ROUND(AVG(r.rating),1) AS avg_rating,
            MAX(r.rating) AS highest_rating
        FROM companies c
        LEFT JOIN categories cat ON c.category_id = cat.id
        LEFT JOIN reviews r ON c.id = r.company_id
        GROUP BY c.id
        ORDER BY c.name
        LIMIT ? OFFSET ?
    ");
    $stmt->bindValue(1, $limit, PDO::PARAM_INT);
    $stmt->bindValue(2, $offset, PDO::PARAM_INT);
    $stmt->execute();
    $companies = $stmt->fetchAll();
}










// Fetch companies
$stmt = $pdo->prepare("
  SELECT c.id, c.name, c.website, c.image, cat.name AS category,
    COUNT(r.id) AS review_count,
    ROUND(AVG(r.rating),1) AS avg_rating,
    MAX(r.rating) AS highest_rating
  FROM companies c
  LEFT JOIN categories cat ON c.category_id = cat.id
  LEFT JOIN reviews r ON c.id = r.company_id
  GROUP BY c.id
  ORDER BY c.name
  LIMIT ? OFFSET ?
");
$stmt->bindValue(1, $limit, PDO::PARAM_INT);
$stmt->bindValue(2, $offset, PDO::PARAM_INT);
$stmt->execute();
$companies = $stmt->fetchAll();

// Latest reviews
$latestReviews = $pdo->query("
  SELECT r.comment, r.rating, u.username, c.name AS company_name
  FROM reviews r
  JOIN users u ON r.user_id = u.id
  JOIN companies c ON r.company_id = c.id
  ORDER BY r.id DESC
  LIMIT 5
")->fetchAll();

// Top rated companies
$topCompanies = $pdo->query("
  SELECT c.id, c.name, c.image, ROUND(AVG(r.rating),1) AS avg_rating
  FROM companies c
  JOIN reviews r ON c.id = r.company_id
  GROUP BY c.id
  HAVING COUNT(r.id) >= 1
  ORDER BY avg_rating DESC
  LIMIT 5
")->fetchAll();

// Featured companies
$featuredCompanies = $pdo->query("
  SELECT id, name, image, website
  FROM companies
  ORDER BY RAND()
  LIMIT 3
")->fetchAll();

// Latest blog posts (limit 5 for sidebar)
$latestBlogs = $pdo->query("
  SELECT id, title 
  FROM blogs
  ORDER BY created_at DESC 
  LIMIT 5
")->fetchAll();

// Blog news block (limit 4)
$blogNews = $pdo->query("
  SELECT id, title, content, image 
  FROM blogs 
  ORDER BY created_at DESC 
  LIMIT 4
")->fetchAll();
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Trusted Reviews of Crypto, Forex & Blockchain Companies | ReviewStream 2025</title>
<meta name="description" content="Explore real customer feedback on crypto exchanges, mining platforms, forex brokers, trading tools & blockchain projects. Reviews updated daily.">
  <meta name="keywords" content="crypto reviews, forex brokers, mining platforms, trading platforms, blockchain protocols, ReviewStream">
  <meta name="author" content="ReviewStream Team">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
<!-- Sans-serif fonts -->
<link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Open+Sans&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Raleway&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Noto+Serif&display=swap" rel="stylesheet">

<!-- Favicon -->
<link rel="icon" href="/favicon.png" type="image/png" />



<style>

body { 
margin:0; 
 font-family: 'Roboto', sans-serif;
 line-height: 1.6;
padding-bottom: 260px;
}



  .container { max-width:1200px; margin:20px auto; padding:0 10px; }
  .content-layout { display: flex; gap: 20px; flex-wrap: wrap; }
  .main-content { flex: 3; min-width: 250px; }
  
  
  
  
  
 
 .sidebar { flex: 1; min-width: 200px; display: flex; flex-direction: column; gap: 20px; }
  .sidebar-card {
    background: white;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.07);
    transition: box-shadow 0.3s ease;
  }
  
  .sidebar-card p{
	  font-family:'Poppins', sans-serif !important;	  
  }
  
  
  .sidebar-card:hover { box-shadow: 0 6px 14px rgba(0,0,0,0.12); }
  .pagination { display: flex; justify-content: center; gap: 10px; margin: 20px 0; }
  .pagination a { background: #007BFF; color: white; padding: 5px 10px; border-radius: 4px; text-decoration: none; }
  .pagination a:hover { background: #0056b3; }
  .star-box { display: inline-block; width: 20px; height: 20px; margin-right: 2px; text-align: center; line-height: 20px; border-radius: 3px; }
  .star-box.filled { background: #00b67a; color: white; }
  .star-box.empty { background: #d3d3d3; color: white; }
  .btn-primary {
    display:inline-block; padding:5px 10px;
    background:#007BFF; color:white; 
    border-radius:4px; text-decoration:none; margin-top:5px;
  }
  .btn-primary:hover { background:#008e5a; }
  

  .review-box {
    background: white;
    padding: 10px;
    border-radius: 8px;
    margin-bottom: 15px;	
  }
  .review-box p{
	  font-family: 'Poppins', sans-serif;
	  line-height: 8px !important;
	  font-size: 13px !important;
  }
  .header-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
  }
  .header-row img {
    width: 50px;
    height: 50px;
    object-fit: contain;
    border-radius: 50%;
  }
  .header-row h3 {
    margin: 0;
    font-size: 18px;
  }
  .hero {
    background: linear-gradient(90deg, #007BFF, #00b67a);
    color: white;
    text-align: center;
    padding: 40px 20px;
    border-radius: 12px;
    margin-bottom: 30px;
    box-shadow: 0 6px 14px rgba(0,0,0,0.15);
  }
  .hero h2 {
    margin: 0;
    font-size: 28px;
  }
  /* Featured companies */
  .featured-section {
    margin-bottom: 30px;
    text-align: center;
  }
  .featured-grid {
    display: flex;
    gap: 15px;
    justify-content: center;
    flex-wrap: wrap;
  }
  .featured-card {
    background: white;
    padding: 15px;
    border-radius: 12px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.07);
    width: 180px;
    transition: transform 0.3s ease;
  }
  .featured-card:hover { transform: translateY(-4px); }
  .featured-card img {
    width: 100%;
    height: 100px;
    object-fit: contain;
    margin-bottom: 8px;
  }
  .featured-card h4 {
    margin: 0 0 5px;
    font-size: 16px;
  }
  /* Responsive tweaks */
  @media (max-width: 768px) {
    .featured-grid { flex-direction: column; align-items: center; }
    .featured-card { width: 90%; max-width: 300px; }
    .topbar { flex-direction: column; gap: 10px; }
    .menu { display: flex; flex-wrap: wrap; justify-content: center; }
  }






/* Extra quick CSS just for the blog cards */
.blog-news { margin-top:30px; }
.blog-card {
  background: white;
  padding: 15px;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.07);
  margin-bottom: 15px;
  display: flex; 
  gap: 10px;
}
.blog-card img {
  width: 100px; height: 80px; object-fit:cover; border-radius:8px;
}
.blog-card h4 { margin:0; font-size:16px; }

.blog-news-row {
  display: flex;
  gap: 15px;
  overflow-x: auto;
  padding-bottom: 10px;
}
.blog-card-horizontal {
  flex: 0 0 220px;
  background: white;
  padding: 10px;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.07);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.blog-card-horizontal img {
  width: 100%;
  height: 120px;
  object-fit: cover;
  border-radius: 8px;
}
.blog-card-horizontal h4 {
  margin: 0;
  font-size: 16px;
}
.blog-card-horizontal p {
  margin: 0;
  font-size: 13px;
  color: #555;
}
.blog-card-horizontal a {
  text-decoration: none;
  color: #007BFF;
}
.blog-card-horizontal a:hover {
  text-decoration: underline;
}

    .fixed-footer {
      position: fixed;
      left: 0;
      bottom: 0;
      width: 100%;
      background: #222;
      text-align: center;
      padding: 10px 0;
      color: #fff;
      z-index: 1000;
    }

   .fixed-footer p{
		font-family: 'Poppins', sans-serif !important;
		font-size: 13px !important;
	}

    .footer-menu a {
      margin: 0 10px;
      text-decoration: none;
      color: #fff;
	  font-family: 'Poppins', sans-serif !important;
	  font-size: 13px !important;
    }

    .footer-menu a:hover {
      text-decoration: underline;
    }
	
	
	
.topbar {
  background-color: #007BFF; /* Blue */
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 15px;
  position: relative;
}

.logo {
  display: flex;
  align-items: center;
  font-weight: bold;
  font-size: 18px;
}

.logo-icon {
  background: linear-gradient(135deg, #a2d4f5, #fefb72);
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 8px;
}

.menu-toggle {
  font-size: 1.5em;
  color: #fff;
  cursor: pointer;
  display: none;
}

.menu {
  display: flex;
  gap: 15px;
}

.menu a, .menu button {
  color: #fff;
  text-decoration: none;
  background: none;
  border: none;
  cursor: pointer;
}

/* Mobile styles */
@media (max-width: 768px) {
  .menu-toggle {
    display: block;
  }

  .menu {
    flex-direction: column;
    background-color: #007BFF;
    position: absolute;
    top: 60px;
    left: 0;
    right: 0;
    display: none;
    padding: 10px 0;
    z-index: 1000;
  }

  .menu.active {
    display: flex;
  }

  .menu a, .menu button {
    padding: 10px 15px;
  }
}

#suggestions{
  position: absolute;
  background: #fff;
  border: 1px solid #ccc;
  max-height: 180px;
  overflow-y: auto;
  width: 250px;
  display: none;
  z-index: 9999;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  color: #333;
  line-height: 10px !important;
  text-align:left !important;
}
</style>
</head>
<body>
<div class="topbar">
  <div class="logo">
    <div class="logo-icon">
      <i class="fas fa-shield-alt" style="color:#4A90E2; font-size: 25px; box-shadow: 0 1px 3px rgba(0,0,0,0.2); margin-left: 8px"></i>
    </div>
    REVIEW STREAM
  </div>

  <div class="menu-toggle" onclick="toggleMenu()">
    <i class="fas fa-bars"></i>
  </div>

  <div class="menu" id="topMenu">
    <a href="index.php">Home</a>
    <a href="companies.php">Companies</a>
    <a href="blog.php">Newsroom</a>
    
    <?php if(isset($_SESSION['user_id'])): ?>
      <a href="user-settings.php">My Settings</a>
      <a href="logout.php">Logout</a>
    <?php else: ?>
      <a href="login.php">Login</a>
    <?php endif; ?>
    
    <button class="dark-mode-toggle" onclick="document.body.classList.toggle('dark-mode')">🌓</button>
  </div>
</div>





<div class="container">
  <div class="hero">
    <h2>All Reviewed Companies (We currently track <?= htmlspecialchars($totalCompanies) ?> companies)</h2>	
	
	<form method="GET" action="index.php" style="margin-top: 20px;">
    <div style="position: relative; display: inline-block;">
    <input type="text" id="searchBox" name="search" placeholder="Search companies..." autocomplete="off"
      style="padding: 8px; width: 250px; border-radius: 4px; border: none;">
    <div id="suggestions"></div>
     </div>
     <button type="submit" style="padding: 8px 12px; background: #fff; color: #007BFF; border-radius: 4px; border: none; cursor: pointer;">
    Search
    </button>
   </form>


  </div>

  <!-- Featured Companies -->
  <div class="featured-section">
    <h3>📰 Featured Companies</h3>
    <div class="featured-grid">
      <?php foreach($featuredCompanies as $feat): ?>
        <div class="featured-card">
          <img src="images/companies/<?= htmlspecialchars($feat['image']) ?>" alt="<?= htmlspecialchars($feat['name']) ?>">
          <h4><?= htmlspecialchars($feat['name']) ?></h4>
          <a href="<?= htmlspecialchars($feat['website']) ?>" target="_blank">Visit Website</a>
          <a href="review.php?id=<?= $feat['id'] ?>" class="btn-primary">View & Review</a>
        </div>
      <?php endforeach; ?>
    </div>
  </div>

  <div class="content-layout">
    <div class="main-content">
      <div class="card">
        <?php foreach($companies as $company): ?>
          <div class="review-box">
            <div class="header-row">
              <img src="images/companies/<?= htmlspecialchars($company['image']) ?>" alt="<?= htmlspecialchars($company['name']) ?>">
              <h3><?= htmlspecialchars($company['name']) ?></h3>
            </div>
			<div class="body-row" style="border: 1px solid #; margin-left: 59px">
            <p><a href="<?= htmlspecialchars($company['website']) ?>" target="_blank"><?= htmlspecialchars($company['website']) ?></a></p>
            <p><?= htmlspecialchars($company['category']) ?></p>
            <p><?= $company['review_count'] ?> Reviews â€¢ Avg: <?= $company['avg_rating'] ?: 0 ?>/5</p>
            <p><?php for($i=1;$i<=5;$i++): ?>
                <span class="star-box <?= $i <= $company['highest_rating'] ? 'filled' : 'empty' ?>">★</span>
              <?php endfor; ?>
              (<?= $company['highest_rating'] ?: 0 ?>/5)
            </p>
            <a href="review.php?id=<?= $company['id'] ?>" class="btn-primary">View & Review</a>
            </div>			
          </div>
        <?php endforeach; ?>
        <div class="pagination">
          <?php for($p=1;$p<=$totalPages;$p++): ?>
            <a href="?page=<?= $p ?>"><?= $p ?></a>
          <?php endfor; ?>
        </div>
      </div>

      <!-- Blog News Block (horizontal cards) -->
<div class="blog-news">
  <h3>ðŸ“° Latest News</h3>
  <div class="blog-news-row">
    <?php foreach($blogNews as $post): ?>
      <div class="blog-card-horizontal">
        <img src="uploads/<?= htmlspecialchars($post['image']) ?>" alt="<?= htmlspecialchars($post['title']) ?>">
        <div>
          <h4><a href="blog_details.php?id=<?= $post['id'] ?>"><?= htmlspecialchars($post['title']) ?></a></h4>
          <p><?= htmlspecialchars(substr(strip_tags($post['content']),0,80)) ?>...</p>
        </div>
      </div>
    <?php endforeach; ?>
  </div>
</div>

	  
	  
    </div>

    <div class="sidebar">
      <div class="sidebar-card">
        <h4>Latest Reviews</h4>
        <?php foreach($latestReviews as $rev): ?>
          <p><strong><?= htmlspecialchars($rev['username']) ?></strong> on <?= htmlspecialchars($rev['company_name']) ?>:</p>
		  <p style="margin-top:2px;"><em><?= htmlspecialchars(substr($rev['comment'],0,50)) ?>...</em></p>
          <div>
            <?php for($i=1;$i<=5;$i++): ?>
              <span class="star-box <?= $i<=$rev['rating'] ? 'filled' : 'empty' ?>">★</span>
            <?php endfor; ?>
            (<?= $rev['rating'] ?>/5)
          </div>
          
          <hr>
        <?php endforeach; ?>
      </div>

      <div class="sidebar-card">
        <h4>Top Rated Companies</h4>
        <?php foreach($topCompanies as $top): ?>
          <div style="display:flex;align-items:center;gap:8px;margin-bottom:5px;">
            <img src="images/companies/<?= htmlspecialchars($top['image']) ?>" alt="<?= htmlspecialchars($top['name']) ?>" style="width:30px;height:30px;object-fit:contain;">
            <span style="font-family:'Poppins', sans-serif !important;"><?= htmlspecialchars($top['name']) ?> (<?= $top['avg_rating'] ?>/5)</span>
          </div>
        <?php endforeach; ?>
      </div>

      <div class="sidebar-card">
        <h4>Latest Blog Posts</h4>
        <?php foreach($latestBlogs as $blog): ?>
          <p><a href="blog.php?id=<?= $blog['id'] ?>"><?= htmlspecialchars($blog['title']) ?></a></p>
        <?php endforeach; ?>
      </div>
    </div>
	
	
	
	
  </div>
</div>



<?php include 'footer.php'; ?>







<script>
  function toggleMenu() {
    document.getElementById('topMenu').classList.toggle('active');
  }
</script>



<script>
const searchBox = document.getElementById('searchBox');
const suggestionsBox = document.getElementById('suggestions');

searchBox.addEventListener('input', function () {
  const query = this.value;

  if (query.length < 2) {
    suggestionsBox.style.display = 'none';
    return;
  }

  fetch('search_suggest.php?term=' + encodeURIComponent(query))
    .then(res => res.json())
    .then(data => {
      suggestionsBox.innerHTML = '';
      if (data.length === 0) {
        suggestionsBox.style.display = 'none';
        return;
      }

      data.forEach(name => {
        const item = document.createElement('div');
        item.textContent = name;
        item.style.padding = '8px';
        item.style.cursor = 'pointer';
        item.addEventListener('click', () => {
          searchBox.value = name;
          suggestionsBox.style.display = 'none';
        });
        suggestionsBox.appendChild(item);
      });

      suggestionsBox.style.display = 'block';
    });
});

document.addEventListener('click', (e) => {
  if (!suggestionsBox.contains(e.target) && e.target !== searchBox) {
    suggestionsBox.style.display = 'none';
  }
});
</script>

</body>
</html>

