v71

api/follow_startup.php

@@ -0,0 +1,45 @@
+<?php
+header('Content-Type: application/json');
+require_once __DIR__ . '/../db/config.php';
+session_start();
+
+$user_id = $_SESSION['user_id'] ?? null;
+if (!$user_id) {
+    echo json_encode(['success' => false, 'error' => 'Not logged in']);
+    exit;
+}
+
+$startup_id = $_POST['startup_id'] ?? null;
+$action = $_POST['action'] ?? 'follow'; // 'follow' or 'unfollow'
+
+if (!$startup_id) {
+    echo json_encode(['success' => false, 'error' => 'Startup ID is required']);
+    exit;
+}
+
+try {
+    if ($action === 'follow') {
+        $stmt = db()->prepare("INSERT IGNORE INTO startup_followers (startup_id, user_id) VALUES (?, ?)");
+        $stmt->execute([$startup_id, $user_id]);
+        
+        // Update denormalized count
+        $stmt = db()->prepare("UPDATE startups SET followers_count = (SELECT COUNT(*) FROM startup_followers WHERE startup_id = ?) WHERE id = ?");
+        $stmt->execute([$startup_id, $startup_id]);
+    } else {
+        $stmt = db()->prepare("DELETE FROM startup_followers WHERE startup_id = ? AND user_id = ?");
+        $stmt->execute([$startup_id, $user_id]);
+        
+        // Update denormalized count
+        $stmt = db()->prepare("UPDATE startups SET followers_count = (SELECT COUNT(*) FROM startup_followers WHERE startup_id = ?) WHERE id = ?");
+        $stmt->execute([$startup_id, $startup_id]);
+    }
+    
+    // Get new count
+    $stmt = db()->prepare("SELECT followers_count FROM startups WHERE id = ?");
+    $stmt->execute([$startup_id]);
+    $new_count = $stmt->fetchColumn();
+    
+    echo json_encode(['success' => true, 'new_count' => $new_count]);
+} catch (Exception $e) {
+    echo json_encode(['success' => false, 'error' => $e->getMessage()]);
+}

discover.php

@@ -17,6 +17,11 @@ if ($user_role === 'founder') {
 }
 $platformName = defined('PLATFORM_NAME') ? PLATFORM_NAME : 'Gatsby';
 
+// Get user's followed startups
+$stmt = db()->prepare("SELECT startup_id FROM startup_followers WHERE user_id = ?");
+$stmt->execute([$user_id]);
+$followedStartups = $stmt->fetchAll(PDO::FETCH_COLUMN);
+
 // Leaderboard: Most Followed
 $stmt = db()->query("
     SELECT s.*, u.full_name as founder_name
@@ -79,13 +84,39 @@ $browseStartups = $stmt->fetchAll();
         @media (max-width: 900px) { .leaderboard-grid { grid-template-columns: 1fr; } }
         .lb-card { background: var(--surface-color); border: 1px solid var(--border-color); border-radius: 16px; padding: 30px; }
         .lb-title { display: flex; align-items: center; gap: 12px; margin-bottom: 25px; font-size: 20px; font-weight: 800; color: var(--text-primary); }
-        .lb-item { display: flex; align-items: center; gap: 15px; padding: 15px; background: var(--elevated-color); border-radius: 12px; border: 1px solid var(--border-color); margin-bottom: 12px; transition: all 0.3s; text-decoration: none; color: inherit; }
+        .lb-item { display: flex; align-items: center; gap: 15px; padding: 15px; background: var(--elevated-color); border-radius: 12px; border: 1px solid var(--border-color); margin-bottom: 12px; transition: all 0.3s; text-decoration: none; color: inherit; position: relative; }
         .lb-item:hover { transform: translateX(8px); border-color: var(--accent-primary); }
         .lb-rank { width: 32px; height: 32px; background: var(--bg-color); border-radius: 8px; display: flex; align-items: center; justify-content: center; font-weight: 800; color: var(--accent-primary); font-size: 14px; border: 1px solid var(--border-color); }
         .rank-1 { background: var(--warning-color); color: #000; border-color: var(--warning-color); }
         .rank-2 { background: var(--text-secondary); color: #000; border-color: var(--text-secondary); }
         .rank-3 { background: #cd7f32; color: #000; border-color: #cd7f32; }
         .startup-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); gap: 25px; }
+        
+        .follow-btn {
+            background: var(--surface-color);
+            border: 1px solid var(--border-color);
+            color: var(--text-primary);
+            padding: 8px 16px;
+            border-radius: 50px;
+            font-size: 12px;
+            font-weight: 700;
+            cursor: pointer;
+            transition: all 0.2s;
+            display: flex;
+            align-items: center;
+            gap: 6px;
+            z-index: 2;
+        }
+        .follow-btn:hover {
+            border-color: var(--accent-primary);
+            color: var(--accent-primary);
+        }
+        .follow-btn.active {
+            background: var(--accent-primary);
+            color: #000;
+            border-color: var(--accent-primary);
+        }
+        .follow-btn i { font-size: 14px; }
     </style>
 </head>
 <body>
@@ -126,15 +157,28 @@ $browseStartups = $stmt->fetchAll();
     <div class="leaderboard-grid">
         <div class="lb-card">
             <div class="lb-title"><i class="fas fa-heart" style="color: var(--error-color);"></i> Top Followed</div>
-            <?php foreach ($mostFollowed as $i => $s): ?>
+            <?php foreach ($mostFollowed as $i => $s): 
-                <a href="startup_details.php?id=<?= $s['id'] ?>" class="lb-item">
+                $isFollowing = in_array($s['id'], $followedStartups);
-                    <div class="lb-rank rank-<?= $i+1 ?>"><?= $i+1 ?></div>
+            ?>
-                    <div style="flex: 1;">
+                <div class="lb-item-wrapper" style="position: relative; margin-bottom: 12px;">
-                        <div style="font-weight: 700; color: var(--text-primary);"><?= htmlspecialchars($s['name']) ?></div>
+                    <a href="startup_details.php?id=<?= $s['id'] ?>" class="lb-item" style="margin-bottom: 0;">
-                        <div style="font-size: 12px; color: var(--text-secondary);">by <?= htmlspecialchars($s['founder_name']) ?></div>
+                        <div class="lb-rank rank-<?= $i+1 ?>"><?= $i+1 ?></div>
-                    </div>
+                        <div style="flex: 1;">
-                    <div style="font-weight: 800; color: var(--accent-primary);"><?= number_format($s['followers_count']) ?></div>
+                            <div style="font-weight: 700; color: var(--text-primary);"><?= htmlspecialchars($s['name']) ?></div>
-                </a>
+                            <div style="font-size: 12px; color: var(--text-secondary);">by <?= htmlspecialchars($s['founder_name']) ?></div>
+                        </div>
+                        <div style="display: flex; align-items: center; gap: 15px;">
+                            <div style="font-weight: 800; color: var(--accent-primary); min-width: 40px; text-align: right;" id="follower-count-<?= $s['id'] ?>"><?= number_format($s['followers_count']) ?></div>
+                        </div>
+                    </a>
+                    <button class="follow-btn <?= $isFollowing ? 'active' : '' ?>" 
+                            data-id="<?= $s['id'] ?>" 
+                            data-action="<?= $isFollowing ? 'unfollow' : 'follow' ?>"
+                            style="position: absolute; right: 80px; top: 50%; transform: translateY(-50%);">
+                        <i class="<?= $isFollowing ? 'fas' : 'far' ?> fa-heart"></i>
+                        <?= $isFollowing ? 'Following' : 'Follow' ?>
+                    </button>
+                </div>
             <?php endforeach; ?>
         </div>
         <div class="lb-card">
@@ -161,16 +205,24 @@ $browseStartups = $stmt->fetchAll();
     </div>
 
     <div class="startup-grid">
-        <?php foreach ($browseStartups as $s): ?>
+        <?php foreach ($browseStartups as $s): 
-            <div class="card" onclick="location.href='startup_details.php?id=<?= $s['id'] ?>'" style="cursor: pointer;">
+            $isFollowing = in_array($s['id'], $followedStartups);
+        ?>
+            <div class="card" onclick="location.href='startup_details.php?id=<?= $s['id'] ?>'" style="cursor: pointer; position: relative;">
                 <div style="display: flex; gap: 20px; align-items: center; margin-bottom: 24px;">
                     <div style="width: 60px; height: 60px; background: var(--accent-primary); border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 24px; font-weight: 900; color: #000;">
                         <?= substr($s['name'], 0, 1) ?>
                     </div>
-                    <div>
+                    <div style="flex: 1;">
                         <div style="font-weight: 800; font-size: 20px; color: var(--text-primary);"><?= htmlspecialchars($s['name']) ?></div>
                         <div style="font-size: 13px; color: var(--text-secondary);">by <?= htmlspecialchars($s['founder_name']) ?></div>
                     </div>
+                    <button class="follow-btn <?= $isFollowing ? 'active' : '' ?>" 
+                            data-id="<?= $s['id'] ?>" 
+                            data-action="<?= $isFollowing ? 'unfollow' : 'follow' ?>"
+                            onclick="event.stopPropagation();">
+                        <i class="<?= $isFollowing ? 'fas' : 'far' ?> fa-heart"></i>
+                    </button>
                 </div>
                 <p style="color: var(--text-secondary); font-size: 14px; margin-bottom: 24px; line-height: 1.6; height: 42px; overflow: hidden;">
                     <?= htmlspecialchars(substr($s['description'], 0, 100)) ?>...
@@ -196,6 +248,54 @@ $browseStartups = $stmt->fetchAll();
     </div>
 </footer>
 
+<script>
+document.querySelectorAll('.follow-btn').forEach(btn => {
+    btn.addEventListener('click', function(e) {
+        e.preventDefault();
+        e.stopPropagation();
+        
+        const startupId = this.dataset.id;
+        const action = this.dataset.action;
+        const formData = new FormData();
+        formData.append('startup_id', startupId);
+        formData.append('action', action);
+        
+        fetch('api/follow_startup.php', {
+            method: 'POST',
+            body: formData
+        })
+        .then(res => res.json())
+        .then(data => {
+            if (data.success) {
+                // Update all buttons for this startup
+                document.querySelectorAll(`.follow-btn[data-id="${startupId}"]`).forEach(b => {
+                    if (action === 'follow') {
+                        b.classList.add('active');
+                        b.dataset.action = 'unfollow';
+                        b.querySelector('i').className = 'fas fa-heart';
+                        if (b.innerText.trim() !== '') {
+                            b.innerHTML = '<i class="fas fa-heart"></i> Following';
+                        }
+                    } else {
+                        b.classList.remove('active');
+                        b.dataset.action = 'follow';
+                        b.querySelector('i').className = 'far fa-heart';
+                        if (b.innerText.trim() !== '') {
+                            b.innerHTML = '<i class="far fa-heart"></i> Follow';
+                        }
+                    }
+                });
+                
+                // Update follower count if exists
+                const countDisplay = document.getElementById(`follower-count-${startupId}`);
+                if (countDisplay) {
+                    countDisplay.innerText = data.new_count.toLocaleString();
+                }
+            }
+        });
+    });
+});
+</script>
 <script src="assets/js/main.js"></script>
 </body>
 </html>