Upload 5 files

app.py

@@ -145,25 +145,49 @@ def scrape():
         return jsonify({"error": str(e)}), 500
 
 
-@app.route('/scrape-batch', methods=['POST'])
-def scrape_batch():
+@app.route('/find-apps', methods=['POST'])
+def find_apps():
     try:
         data = request.json
         query = data.get('query', '').strip()
-        app_count = int(data.get('app_count', 5))
-        count_type = data.get('review_count_type', 'fixed')
-        reviews_per_app = 100000 if count_type == 'all' else int(data.get('reviews_per_app', 100))
+        app_count = int(data.get('app_count', 10))
         
-        # 1. Find apps (Try direct scraping first for reliability)
+        # Using the robust scraper to get IDs
         app_ids = scrape_store_ids(query, n_hits=app_count)
         
-        # If scraper fails, try library search
         if not app_ids:
+            # Fallback to library
             hits = search(query, lang="en", country="us", n_hits=app_count)
             app_ids = [h['appId'] for h in hits if h.get('appId')]
             
+        results = []
+        for aid in app_ids:
+            try:
+                info = app_info(aid, lang='en', country='us')
+                results.append({
+                    "appId": aid,
+                    "title": info['title'],
+                    "icon": info['icon'],
+                    "score": info['score'],
+                    "developer": info.get('developer', 'Unknown'),
+                    "installs": info.get('installs', '0+')
+                })
+            except: continue
+                
+        return jsonify({"results": results})
+    except Exception as e:
+        return jsonify({"error": str(e)}), 500
+
+@app.route('/scrape-batch', methods=['POST'])
+def scrape_batch():
+    try:
+        data = request.json
+        app_ids = data.get('app_ids', [])
+        count_type = data.get('review_count_type', 'fixed')
+        reviews_per_app = 100000 if count_type == 'all' else int(data.get('reviews_per_app', 100))
+        
         if not app_ids:
-            return jsonify({"error": "No apps found for this query"}), 404
+            return jsonify({"error": "No app IDs provided"}), 400
             
         batch_results = []
         all_combined_reviews = []

templates/batch.html

@@ -21,11 +21,22 @@
       --muted2: #94a3b8;
     }
     * { box-sizing: border-box; margin: 0; padding: 0; }
+    
+    /* Modern Scrollbar */
+    ::-webkit-scrollbar { width: 6px; height: 6px; }
+    ::-webkit-scrollbar-track { background: transparent; }
+    ::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 10px; }
+    ::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.2); }
+    * { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.1) transparent; }
+
     body { font-family: 'Inter', sans-serif; background: var(--bg); color: var(--text); height: 100vh; overflow: hidden; display: flex; flex-direction: column; }
 
+    .btn-sm { background: var(--surface2); border: 1px solid var(--border); color: white; padding: 4px 10px; border-radius: 6px; font-size: 10px; cursor: pointer; transition: 0.2s; }
+    .btn-sm:hover { border-color: var(--accent); }
+
     .header { height: 60px; background: var(--surface); border-bottom: 1px solid var(--border); display: flex; align-items: center; padding: 0 20px; gap: 20px; }
     .main { flex: 1; display: flex; overflow: hidden; }
-    .sidebar { width: 320px; background: var(--surface); border-right: 1px solid var(--border); padding: 20px; display: flex; flex-direction: column; gap: 20px; overflow-y: auto; }
+    .sidebar { width: 300px; background: var(--surface); border-right: 1px solid var(--border); padding: 15px; display: flex; flex-direction: column; gap: 15px; overflow-y: auto; }
     .content { flex: 1; background: var(--bg); position: relative; display: flex; flex-direction: column; }
 
     .mode-toggle { display: grid; grid-template-columns: 1fr 1fr; background: var(--bg); padding: 4px; border-radius: 10px; border: 1px solid var(--border); margin-bottom: 5px; }
@@ -33,9 +44,9 @@
     .mode-btn.active { background: var(--surface2); color: white; box-shadow: 0 2px 4px rgba(0,0,0,0.2); }
 
     .logo { font-weight: 800; font-size: 18px; color: var(--accent); display: flex; align-items: center; gap: 8px; text-decoration: none; }
-    .input-group { display: flex; flex-direction: column; gap: 8px; }
-    .label { font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--muted); letter-spacing: 0.5px; }
-    input, select { background: var(--bg); border: 1px solid var(--border); color: white; padding: 12px; border-radius: 8px; font-size: 13px; outline: none; width: 100%; }
+    .input-group { display: flex; flex-direction: column; gap: 6px; }
+    .label { font-size: 10px; font-weight: 700; text-transform: uppercase; color: var(--muted); letter-spacing: 0.5px; }
+    input, select { background: var(--bg); border: 1px solid var(--border); color: white; padding: 10px; border-radius: 8px; font-size: 12px; outline: none; width: 100%; }
     input:focus { border-color: var(--accent); }
 
     .btn-main { background: var(--accent); color: white; border: none; padding: 14px; border-radius: 10px; font-weight: 800; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; transition: 0.2s; width: 100%; border-bottom: 3px solid rgba(0,0,0,0.2); }
@@ -100,22 +111,41 @@
 <div class="main">
   <aside class="sidebar">
     <div class="input-group">
-      <div class="label">Category / Search Query</div>
-      <input type="text" id="query" placeholder="e.g. Multiplayer Games, Fintech..." value="Multiplayer Games">
+      <div class="label">Step 1: Discover Apps</div>
+      <div style="display:flex;gap:8px;">
+        <input type="text" id="query" placeholder="e.g. Multiplayer Games..." value="Multiplayer Games" style="flex:1">
+        <button onclick="findApps()" id="btnFind" style="background:var(--accent); border:none; color:white; padding:0 15px; border-radius:8px; cursor:pointer; font-weight:700;">Find</button>
+      </div>
     </div>
 
     <div class="input-group">
-      <div class="label">App Comparison Count</div>
-      <input type="number" id="app_count" value="5" min="1" max="20">
+      <div class="label">Discovery Limit</div>
+      <input type="number" id="app_count" value="10" min="1" max="50">
+      <div style="font-size:10px; color:var(--muted); margin-top:4px;">How many apps to search for initially.</div>
+    </div>
+
+    <div id="selectionArea" class="hidden" style="background:var(--surface2); border:1px solid var(--border); border-radius:12px; padding:10px; display:flex; flex-direction:column; gap:8px;">
+      <div class="label" style="display:flex; justify-content:space-between; align-items:center;">
+        <span>Select Apps</span>
+        <span id="selectedCount" style="color:var(--accent); font-size:9px;">0 selected</span>
+      </div>
+      <div id="appList" style="max-height:160px; overflow-y:auto; overflow-x:hidden; display:flex; flex-direction:column; gap:4px; padding-right:4px;">
+        <!-- Compact apps list -->
+      </div>
+      <div style="display:flex; gap:5px;">
+        <button onclick="toggleAllApps(true)" class="btn-sm" style="flex:1">All</button>
+        <button onclick="toggleAllApps(false)" class="btn-sm" style="flex:1">None</button>
+      </div>
     </div>
 
     <div class="input-group">
-      <div class="label">Reviews Per App</div>
+      <div class="label">Step 2: Scrape Settings</div>
+      <div class="label" style="font-size:10px; margin-top:10px;">Reviews Per App</div>
       <div class="mode-toggle">
         <div class="mode-btn active" id="btn-fixed" onclick="setMode('fixed')">Custom</div>
         <div class="mode-btn" id="btn-all" onclick="setMode('all')">Fetch All</div>
       </div>
-      <input type="number" id="reviews_per_app" value="100" min="10" step="10">
+      <input type="number" id="reviews_per_app" value="50" min="10" step="10">
     </div>
 
     <div class="input-group">
@@ -206,10 +236,67 @@
     document.querySelectorAll('.star-cb').forEach(cb => cb.checked = check);
   }
 
-  async function runBatch() {
+  let foundApps = [];
+
+  async function findApps() {
     const q = document.getElementById('query').value.trim();
     if (!q) return;
 
+    const btn = document.getElementById('btnFind');
+    btn.disabled = true;
+    btn.innerText = 'Searching...';
+
+    try {
+      const res = await fetch('/find-apps', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ query: q, app_count: document.getElementById('app_count').value })
+      });
+      const data = await res.json();
+      if (!res.ok) throw new Error(data.error || 'Discovery failed');
+
+      foundApps = data.results;
+      renderAppSelection();
+    } catch(e) {
+      alert(e.message);
+    } finally {
+      btn.disabled = false;
+      btn.innerText = 'Find';
+    }
+  }
+
+  function renderAppSelection() {
+    const list = document.getElementById('appList');
+    document.getElementById('selectionArea').classList.remove('hidden');
+    
+    list.innerHTML = foundApps.map(a => `
+      <label style="display:flex; align-items:center; gap:8px; padding:6px; background:var(--bg); border-radius:6px; border:1px solid var(--border); cursor:pointer; min-width:0;">
+        <input type="checkbox" class="app-cb" value="${a.appId}" onchange="updateSelectionCount()" checked style="width:14px; height:14px; margin:0;">
+        <img src="${a.icon}" style="width:20px; height:20px; border-radius:4px; flex-shrink:0;">
+        <div style="flex:1; min-width:0;">
+          <div style="font-size:10px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--text);">${a.title}</div>
+          <div style="font-size:9px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;">${a.developer}</div>
+        </div>
+      </label>
+    `).join('');
+    updateSelectionCount();
+  }
+
+  function toggleAllApps(check) {
+    document.querySelectorAll('.app-cb').forEach(cb => cb.checked = check);
+    updateSelectionCount();
+  }
+
+  function updateSelectionCount() {
+    const count = document.querySelectorAll('.app-cb:checked').length;
+    document.getElementById('selectedCount').innerText = `${count} selected`;
+    document.getElementById('go').disabled = count === 0;
+  }
+
+  async function runBatch() {
+    const selectedAppIds = [...document.querySelectorAll('.app-cb:checked')].map(cb => cb.value);
+    if (!selectedAppIds.length) return alert('Select at least one app');
+
     const stars = [...document.querySelectorAll('.star-cb:checked')].map(cb => parseInt(cb.value));
     if (!stars.length) return alert('Select at least one star rating');
 
@@ -223,8 +310,7 @@
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({
-          query: q,
-          app_count: document.getElementById('app_count').value,
+          app_ids: selectedAppIds,
           review_count_type: currentMode,
           reviews_per_app: document.getElementById('reviews_per_app').value,
           sort_order: document.getElementById('sort').value,

templates/index.html

@@ -21,6 +21,14 @@
       --muted2: #94a3b8;
     }
     * { box-sizing: border-box; margin: 0; padding: 0; }
+    
+    /* Modern Scrollbar */
+    ::-webkit-scrollbar { width: 6px; height: 6px; }
+    ::-webkit-scrollbar-track { background: transparent; }
+    ::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 10px; }
+    ::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.2); }
+    * { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.1) transparent; }
+
     body { font-family: 'Inter', sans-serif; background: var(--bg); color: var(--text); height: 100vh; overflow: hidden; display: flex; flex-direction: column; }
 
     .header { height: 60px; background: var(--surface); border-bottom: 1px solid var(--border); display: flex; align-items: center; padding: 0 20px; gap: 20px; }

templates/landing.html

@@ -17,6 +17,13 @@
     }
 
     * { box-sizing: border-box; margin: 0; padding: 0; }
+    
+    /* Modern Scrollbar */
+    ::-webkit-scrollbar { width: 6px; height: 6px; }
+    ::-webkit-scrollbar-track { background: transparent; }
+    ::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 10px; }
+    ::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.2); }
+    * { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.1) transparent; }
 
     body {
       font-family: 'Inter', sans-serif;