Upload 3 files

app.py

@@ -0,0 +1,243 @@
+import os
+import urllib.request
+import tarfile
+import shutil
+from flask import Flask, render_template, request, jsonify, url_for
+from werkzeug.utils import secure_filename
+
+import matplotlib
+matplotlib.use('Agg') 
+
+import scAnalysis.sc_io as io
+import scAnalysis.preprocessing as pp
+import scAnalysis.quality_control as qc
+import scAnalysis.cell_cycle as cc
+import scAnalysis.batch_correction as bc
+import scAnalysis.dimensionality as dim
+import scAnalysis.clustering as cl
+import scAnalysis.trajectory as traj
+import scAnalysis.differential as diff
+import scAnalysis.enrichment as enrich
+import scAnalysis.visualization as vis
+import scAnalysis.interactive_viz as iviz
+
+app = Flask(__name__)
+app.config['UPLOAD_FOLDER'] = './static/uploads'
+app.config['RESULTS_FOLDER'] = './static/results'
+os.makedirs(app.config['UPLOAD_FOLDER'], exist_ok=True)
+os.makedirs(app.config['RESULTS_FOLDER'], exist_ok=True)
+
+DATASETS = {
+    "pbmc3k": "https://cf.10xgenomics.com/samples/cell-exp/1.1.0/pbmc3k/pbmc3k_filtered_gene_bc_matrices.tar.gz",
+    "pbmc5k": "https://cf.10xgenomics.com/samples/cell-exp/3.0.2/5k_pbmc_v3/5k_pbmc_v3_filtered_feature_bc_matrix.tar.gz",
+    "heart_atlas": "https://cf.10xgenomics.com/samples/cell-exp/3.0.0/heart_10k_v3/heart_10k_v3_filtered_feature_bc_matrix.tar.gz",
+    "mouse_brain": "https://cf.10xgenomics.com/samples/cell-exp/3.0.0/neuron_10k_v3/neuron_10k_v3_filtered_feature_bc_matrix.tar.gz",
+    "lung_tumor": "https://cf.10xgenomics.com/samples/cell-exp/3.0.0/nsclc_10k_v3/nsclc_10k_v3_filtered_feature_bc_matrix.tar.gz"
+}
+
+def download_and_extract(dataset_name):
+    url = DATASETS[dataset_name]
+    filepath = os.path.join(app.config['UPLOAD_FOLDER'], f"{dataset_name}.tar.gz")
+    extract_path = os.path.join(app.config['UPLOAD_FOLDER'], dataset_name)
+    
+    if not os.path.exists(extract_path):
+        req = urllib.request.Request(url, headers={"User-Agent": "Mozilla/5.0"})
+        with urllib.request.urlopen(req) as response, open(filepath, "wb") as out_file:
+            shutil.copyfileobj(response, out_file)
+        with tarfile.open(filepath, "r:gz") as tar:
+            tar.extractall(path=extract_path)
+    
+    for root, dirs, files in os.walk(extract_path):
+        if 'matrix.mtx' in files or 'matrix.mtx.gz' in files:
+            return root
+    return extract_path
+
+@app.route('/')
+def index():
+    return render_template('index.html', datasets=DATASETS.keys())
+
+@app.route('/run_pipeline', methods=['POST'])
+def run_pipeline():
+    try:
+        dataset_choice = request.form.get('dataset')
+        if dataset_choice == 'custom':
+            file = request.files['custom_file']
+            filename = secure_filename(file.filename)
+            file_path = os.path.join(app.config['UPLOAD_FOLDER'], filename)
+            file.save(file_path)
+            data = io.read_h5ad(file_path) if filename.endswith('.h5ad') else io.read_csv(file_path)
+        else:
+            data_path = download_and_extract(dataset_choice)
+            data = io.read_10x_mtx(data_path)
+
+        data.var.index = io._make_unique(data.var.index.values)
+        res_dir = app.config['RESULTS_FOLDER']
+        outputs = []
+
+        pp.calculate_qc_metrics(data, qc_vars=["MT-"])
+        
+        try:
+            qc_path = os.path.join(res_dir, 'qc_violin.png')
+            vis.plot_qc_violin(data, save=qc_path)
+            outputs.append({'type': 'image', 'url': url_for('static', filename='results/qc_violin.png'), 'title': 'QC Metrics'})
+        except Exception as e: print("QC Plot failed:", e)
+
+        if request.form.get('run_scrublet') == 'true':
+            db_rate = float(request.form.get('doublet_rate', 0.06))
+            qc.scrublet(data, expected_doublet_rate=db_rate)
+            data = data[~data.obs['predicted_doublet'].astype(bool), :]
+            
+        data = pp.filter_cells(
+            data, 
+            min_genes=int(request.form.get('min_genes', 200)), 
+            max_genes=int(request.form.get('max_genes', 2500)),
+            max_pct_mito=float(request.form.get('max_mito', 5.0))
+        )
+        data = pp.filter_genes(data, min_cells=int(request.form.get('min_cells', 3)))
+
+        norm_method = request.form.get('norm_method', 'total')
+        if norm_method == 'total':
+            pp.normalize_total(data, target_sum=1e4)
+            pp.log1p(data)
+        elif norm_method == 'scran':
+            pp.normalize_scran_pooling(data, target_sum=1e4)
+            pp.log1p(data)
+        elif norm_method == 'sctransform':
+            pp.normalize_sctransform(data)
+
+        organism = request.form.get('organism', 'human')
+        cc.score_cell_cycle(data, organism=organism)
+
+        n_hvg = int(request.form.get('n_hvg', 2000))
+        pp.highly_variable_genes(data, n_top_genes=n_hvg)
+        
+        try:
+            hvg_path = os.path.join(res_dir, 'highest_expr_genes.png')
+            vis.plot_highest_expr_genes(data, save=hvg_path)
+            outputs.append({'type': 'image', 'url': url_for('static', filename='results/highest_expr_genes.png'), 'title': 'Highest Expressed'})
+        except: pass
+
+        data.raw = data.copy()
+        pp.scale(data, max_value=10)
+
+        n_pcs = int(request.form.get('n_pcs', 50))
+        n_neighbors = int(request.form.get('n_neighbors', 15))
+        
+        dim.run_pca(data, n_components=n_pcs)
+        dim.neighbors(data, n_neighbors=n_neighbors, n_pcs=min(40, n_pcs))
+
+        batch_key = request.form.get('batch_key', '')
+        if request.form.get('run_batch') == 'true' and batch_key in data.obs.columns:
+            b_algo = request.form.get('batch_algo', 'harmony')
+            if b_algo == 'harmony': bc.harmony_integrate(data, batch_key=batch_key)
+            elif b_algo == 'combat': bc.combat(data, batch_key=batch_key)
+        
+        if request.form.get('run_umap') == 'true':
+            dim.run_umap(data, min_dist=float(request.form.get('umap_min_dist', 0.5)))
+        if request.form.get('run_tsne') == 'true':
+            dim.run_tsne(data, perplexity=float(request.form.get('tsne_perplex', 30.0)))
+        if request.form.get('run_phate') == 'true':
+            try: dim.run_phate(data)
+            except: pass
+
+        clust_algo = request.form.get('clustering', 'leiden')
+        res_k = float(request.form.get('resolution', 1.0))
+        
+        if clust_algo == 'leiden': cl.cluster_leiden(data, resolution=res_k, key_added="cluster")
+        elif clust_algo == 'louvain': cl.cluster_louvain(data, resolution=res_k, key_added="cluster")
+        elif clust_algo == 'kmeans': cl.cluster_kmeans(data, n_clusters=int(res_k*10), key_added="cluster")
+        elif clust_algo == 'hierarchical': cl.cluster_hierarchical(data, n_clusters=int(res_k*10), key_added="cluster")
+        elif clust_algo == 'spectral': cl.cluster_spectral(data, n_clusters=int(res_k*10), key_added="cluster")
+
+        dim.run_diffmap(data)
+        first_cluster = data.obs['cluster'].unique()[0]
+        root_strat = request.form.get('root_strategy', 'extreme')
+        root_idx = traj.select_root_cell(data, cluster_key='cluster', root_cluster=first_cluster, strategy=root_strat)
+        traj.diffusion_pseudotime(data, root_cell=root_idx, n_branchings=int(request.form.get('branches', 0)))
+        
+        diff_method = request.form.get('diff_method', 't-test')
+        diff.rank_genes_groups(data, groupby='cluster', method=diff_method, use_raw=True)
+
+        if 'X_umap' in data.obsm:
+            umap_path = os.path.join(res_dir, 'umap_clusters.png')
+            vis.plot_umap(data, color="cluster", title="UMAP (Clusters)", save=umap_path)
+            outputs.append({'type': 'image', 'url': url_for('static', filename='results/umap_clusters.png'), 'title': 'UMAP Clustering'})
+            
+            phase_path = os.path.join(res_dir, 'umap_phase.png')
+            vis.plot_umap(data, color="phase", title="Cell Cycle Phase", save=phase_path)
+            outputs.append({'type': 'image', 'url': url_for('static', filename='results/umap_phase.png'), 'title': 'UMAP Cell Cycle'})
+
+        if 'X_tsne' in data.obsm:
+            tsne_path = os.path.join(res_dir, 'tsne_clusters.png')
+            vis.plot_tsne(data, color="cluster", title="t-SNE", save=tsne_path)
+            outputs.append({'type': 'image', 'url': url_for('static', filename='results/tsne_clusters.png'), 'title': 't-SNE Clustering'})
+
+        try:
+            volcano_path = os.path.join(res_dir, 'volcano_plot.png')
+            vis.volcano_plot(data, group=first_cluster, save=volcano_path)
+            outputs.append({'type': 'image', 'url': url_for('static', filename='results/volcano_plot.png'), 'title': f'Volcano (Cluster {first_cluster})'})
+        except: pass
+
+        canonical_markers = ["CD3D", "CD14", "CD19", "MS4A1", "GNLY", "LYZ", "FCER1A", "CST3", "CD8A"]
+        valid_markers = [g for g in canonical_markers if g in data.var.index]
+        if valid_markers:
+            try:
+                dot_path = os.path.join(res_dir, 'dotplot.png')
+                vis.plot_dotplot(data, var_names=valid_markers, groupby='cluster', save=dot_path)
+                outputs.append({'type': 'image', 'url': url_for('static', filename='results/dotplot.png'), 'title': 'Marker Dotplot'})
+                
+                heat_path = os.path.join(res_dir, 'heatmap.png')
+                vis.plot_heatmap(data, var_names=valid_markers, groupby='cluster', save=heat_path)
+                outputs.append({'type': 'image', 'url': url_for('static', filename='results/heatmap.png'), 'title': 'Marker Heatmap'})
+            except: pass
+
+        hover_data_cols = ['phase', 'total_counts', 'dpt_pseudotime']
+        
+        if request.form.get('int_umap') == 'true' and 'X_umap' in data.obsm:
+            try:
+                html_umap = os.path.join(res_dir, 'interactive_umap.html')
+                iviz.interactive_embedding(data, basis='X_umap', color='cluster', hover_data=hover_data_cols, title="Interactive UMAP", save_html=html_umap)
+                outputs.append({'type': 'html', 'url': url_for('static', filename='results/interactive_umap.html'), 'title': 'Interactive UMAP'})
+            except Exception as e: print("Interactive UMAP failed:", e)
+
+        if request.form.get('int_3d_pca') == 'true' and 'X_pca' in data.obsm:
+            try:
+                html_pca = os.path.join(res_dir, 'interactive_3d_pca.html')
+                iviz.interactive_3d_embedding(data, basis='X_pca', color='cluster', dimensions=[0, 1, 2], save_html=html_pca)
+                outputs.append({'type': 'html', 'url': url_for('static', filename='results/interactive_3d_pca.html'), 'title': '3D PCA'})
+            except Exception as e: print("Interactive PCA failed:", e)
+
+        if request.form.get('int_tsne') == 'true' and 'X_tsne' in data.obsm:
+            try:
+                html_tsne = os.path.join(res_dir, 'interactive_tsne.html')
+                iviz.interactive_embedding(data, basis='X_tsne', color='cluster', hover_data=hover_data_cols, title="Interactive t-SNE", save_html=html_tsne)
+                outputs.append({'type': 'html', 'url': url_for('static', filename='results/interactive_tsne.html'), 'title': 'Interactive t-SNE'})
+            except Exception as e: print("Interactive t-SNE failed:", e)
+
+        if request.form.get('int_violin') == 'true':
+            try:
+                html_violin = os.path.join(res_dir, 'interactive_violin.html')
+                iviz.interactive_violin(data, keys=['n_genes_by_counts', 'total_counts'], groupby='cluster', save_html=html_violin)
+                outputs.append({'type': 'html', 'url': url_for('static', filename='results/interactive_violin.html'), 'title': 'Interactive QC Violins'})
+            except Exception as e: print("Interactive Violin failed:", e)
+
+        if request.form.get('int_heatmap') == 'true':
+            try:
+                if valid_markers:
+                    html_heat = os.path.join(res_dir, 'interactive_heatmap.html')
+                    iviz.interactive_heatmap(data, var_names=valid_markers, groupby='cluster', save_html=html_heat)
+                    outputs.append({'type': 'html', 'url': url_for('static', filename='results/interactive_heatmap.html'), 'title': 'Interactive Heatmap'})
+            except Exception as e: print("Interactive Heatmap failed:", e)
+
+        output_h5ad = os.path.join(res_dir, 'processed_data.h5ad')
+        io.write_h5ad(data, output_h5ad)
+
+        return jsonify({"status": "success", "outputs": outputs, "download": url_for('static', filename='results/processed_data.h5ad')})
+
+    except Exception as e:
+        import traceback
+        traceback.print_exc()
+        return jsonify({"status": "error", "message": str(e)})
+
+if __name__ == '__main__':
+    app.run(debug=True, port=5000)

requirements.txt

@@ -0,0 +1,13 @@
+Flask
+werkzeug
+plotly
+gunicorn
+numpy
+pandas
+scipy
+scikit-learn
+matplotlib
+seaborn
+h5py
+umap-learn
+scAnalysis

templates/index.html

@@ -0,0 +1,275 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>scAnalyzer Studio</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
+</head>
+<body class="bg-gray-900 text-gray-100 font-sans min-h-screen pb-12">
+    
+    <div class="max-w-7xl mx-auto py-12 px-6">
+        <div class="text-center mb-12">
+            <h1 class="text-5xl font-extrabold text-transparent bg-clip-text bg-gradient-to-r from-teal-400 to-indigo-500 mb-4">
+                <i class="fas fa-network-wired mr-2 text-teal-400"></i> scAnalysis Studio
+            </h1>
+            <p class="text-gray-400 text-lg">Full single-cell RNA-seq pipeline.</p>
+        </div>
+
+        <form id="pipelineForm" class="space-y-6">
+            <div class="bg-gray-800 p-6 rounded-xl shadow-lg border border-gray-700">
+                <h2 class="text-xl font-semibold mb-4 text-teal-300"><i class="fas fa-database mr-2"></i> 1. Dataset</h2>
+                <div class="grid grid-cols-2 md:grid-cols-4 gap-3 mb-4">
+                    {% for ds in datasets %}
+                    <label class="flex items-center space-x-2 p-3 border border-gray-600 rounded cursor-pointer hover:bg-gray-700 transition">
+                        <input type="radio" name="dataset" value="{{ ds }}" class="form-radio text-teal-500 h-4 w-4" required>
+                        <span class="text-gray-200 text-sm capitalize">{{ ds | replace('_', ' ') }}</span>
+                    </label>
+                    {% endfor %}
+                    <label class="flex items-center space-x-2 p-3 border border-teal-600 rounded cursor-pointer bg-teal-900 bg-opacity-20 hover:bg-opacity-40 transition">
+                        <input type="radio" name="dataset" value="custom" id="customRadio" class="form-radio text-teal-500 h-4 w-4">
+                        <span class="text-teal-300 text-sm font-bold">Custom Upload</span>
+                    </label>
+                </div>
+                <input type="file" name="custom_file" id="customFile" class="hidden w-full text-sm text-gray-400 file:mr-4 file:py-2 file:px-4 file:rounded file:border-0 file:bg-teal-600 file:text-white hover:file:bg-teal-700"/>
+            </div>
+
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
+                
+                <div class="bg-gray-800 p-5 rounded-xl shadow-lg border border-gray-700">
+                    <h2 class="text-lg font-semibold mb-3 text-purple-300"><i class="fas fa-filter mr-2"></i> Quality Control</h2>
+                    <label class="block text-xs text-gray-400 mb-1">Min Genes & Max Genes</label>
+                    <div class="flex space-x-2 mb-3">
+                        <input type="number" name="min_genes" value="200" class="w-1/2 bg-gray-700 border border-gray-600 rounded px-2 py-1 text-sm focus:border-purple-500">
+                        <input type="number" name="max_genes" value="2500" class="w-1/2 bg-gray-700 border border-gray-600 rounded px-2 py-1 text-sm focus:border-purple-500">
+                    </div>
+                    <label class="block text-xs text-gray-400 mb-1">Max Mito % & Min Cells</label>
+                    <div class="flex space-x-2 mb-3">
+                        <input type="number" step="0.1" name="max_mito" value="5.0" class="w-1/2 bg-gray-700 border border-gray-600 rounded px-2 py-1 text-sm focus:border-purple-500">
+                        <input type="number" name="min_cells" value="3" class="w-1/2 bg-gray-700 border border-gray-600 rounded px-2 py-1 text-sm focus:border-purple-500">
+                    </div>
+                    <label class="flex items-center space-x-2 mt-4">
+                        <input type="checkbox" name="run_scrublet" value="true" checked class="form-checkbox text-purple-500">
+                        <span class="text-sm text-gray-300">Run Scrublet</span>
+                    </label>
+                    <input type="number" step="0.01" name="doublet_rate" value="0.06" placeholder="Rate (0.06)" class="mt-1 w-full bg-gray-700 border border-gray-600 rounded px-2 py-1 text-sm">
+                </div>
+
+                <div class="bg-gray-800 p-5 rounded-xl shadow-lg border border-gray-700">
+                    <h2 class="text-lg font-semibold mb-3 text-yellow-300"><i class="fas fa-layer-group mr-2"></i> Norm & Batch</h2>
+                    <label class="block text-xs text-gray-400 mb-1">Normalization</label>
+                    <select name="norm_method" class="w-full bg-gray-700 border border-gray-600 rounded px-2 py-1 mb-3 text-sm">
+                        <option value="total">Total Count (Log1p)</option>
+                        <option value="scran">Scran Pooling</option>
+                        <option value="sctransform">SCTransform</option>
+                    </select>
+                    
+                    <label class="block text-xs text-gray-400 mb-1">Cell Cycle Organism</label>
+                    <select name="organism" class="w-full bg-gray-700 border border-gray-600 rounded px-2 py-1 mb-3 text-sm">
+                        <option value="human">Human</option>
+                        <option value="mouse">Mouse</option>
+                    </select>
+
+                    <label class="flex items-center space-x-2 mb-1">
+                        <input type="checkbox" name="run_batch" value="true" class="form-checkbox text-yellow-500">
+                        <span class="text-sm text-gray-300">Batch Correction</span>
+                    </label>
+                    <div class="flex space-x-2">
+                        <select name="batch_algo" class="w-1/2 bg-gray-700 border border-gray-600 rounded px-2 py-1 text-xs">
+                            <option value="harmony">Harmony</option>
+                            <option value="combat">ComBat</option>
+                        </select>
+                        <input type="text" name="batch_key" placeholder="Col Name" class="w-1/2 bg-gray-700 border border-gray-600 rounded px-2 py-1 text-xs">
+                    </div>
+                </div>
+
+                <div class="bg-gray-800 p-5 rounded-xl shadow-lg border border-gray-700">
+                    <h2 class="text-lg font-semibold mb-3 text-blue-300"><i class="fas fa-project-diagram mr-2"></i> Dimensionality</h2>
+                    
+                    <div class="grid grid-cols-2 gap-2 mb-3">
+                        <div>
+                            <label class="block text-xs text-gray-400 mb-1">PCA Comps</label>
+                            <input type="number" name="n_pcs" value="50" class="w-full bg-gray-700 border border-gray-600 rounded px-2 py-1 text-sm">
+                        </div>
+                        <div>
+                            <label class="block text-xs text-gray-400 mb-1">Neighbors (K)</label>
+                            <input type="number" name="n_neighbors" value="15" class="w-full bg-gray-700 border border-gray-600 rounded px-2 py-1 text-sm">
+                        </div>
+                    </div>
+
+                    <div class="space-y-2 mt-4">
+                        <label class="flex items-center justify-between">
+                            <div class="flex items-center space-x-2">
+                                <input type="checkbox" name="run_umap" value="true" checked class="form-checkbox text-blue-500">
+                                <span class="text-sm text-gray-300">UMAP</span>
+                            </div>
+                            <input type="number" step="0.1" name="umap_min_dist" value="0.5" class="w-16 bg-gray-700 border border-gray-600 rounded px-1 py-0.5 text-xs text-center" title="Min Dist">
+                        </label>
+                        <label class="flex items-center justify-between">
+                            <div class="flex items-center space-x-2">
+                                <input type="checkbox" name="run_tsne" value="true" class="form-checkbox text-blue-500">
+                                <span class="text-sm text-gray-300">t-SNE</span>
+                            </div>
+                            <input type="number" step="0.1" name="tsne_perplex" value="30" class="w-16 bg-gray-700 border border-gray-600 rounded px-1 py-0.5 text-xs text-center" title="Perplexity">
+                        </label>
+                        <label class="flex items-center space-x-2">
+                            <input type="checkbox" name="run_phate" value="true" class="form-checkbox text-blue-500">
+                            <span class="text-sm text-gray-300">PHATE</span>
+                        </label>
+                    </div>
+                </div>
+
+                <div class="bg-gray-800 p-5 rounded-xl shadow-lg border border-gray-700">
+                    <h2 class="text-lg font-semibold mb-3 text-pink-300"><i class="fas fa-chart-pie mr-2"></i> Analytics</h2>
+                    
+                    <label class="block text-xs text-gray-400 mb-1">Clustering & Res/K</label>
+                    <div class="flex space-x-2 mb-3">
+                        <select name="clustering" class="w-2/3 bg-gray-700 border border-gray-600 rounded px-2 py-1 text-xs">
+                            <option value="leiden">Leiden</option>
+                            <option value="louvain">Louvain</option>
+                            <option value="kmeans">K-Means</option>
+                            <option value="hierarchical">Hierarchical</option>
+                            <option value="spectral">Spectral</option>
+                        </select>
+                        <input type="number" step="0.1" name="resolution" value="1.0" class="w-1/3 bg-gray-700 border border-gray-600 rounded px-2 py-1 text-sm text-center">
+                    </div>
+
+                    <label class="block text-xs text-gray-400 mb-1">Differential Method</label>
+                    <select name="diff_method" class="w-full bg-gray-700 border border-gray-600 rounded px-2 py-1 mb-3 text-xs">
+                        <option value="t-test">T-Test</option>
+                        <option value="wilcoxon">Wilcoxon Rank-Sum</option>
+                    </select>
+
+                    <label class="block text-xs text-gray-400 mb-1">Trajectory (Root & Branches)</label>
+                    <div class="flex space-x-2 mb-3">
+                        <select name="root_strategy" class="w-1/2 bg-gray-700 border border-gray-600 rounded px-2 py-1 text-xs">
+                            <option value="extreme">Extreme</option>
+                            <option value="medoid">Medoid</option>
+                        </select>
+                        <input type="number" name="branches" value="0" placeholder="Branches" class="w-1/2 bg-gray-700 border border-gray-600 rounded px-2 py-1 text-xs">
+                    </div>
+
+                    <hr class="border-gray-700 my-3">
+                    <label class="block mb-2 text-sm text-gray-300 font-bold">Interactive HTML Plots:</label>
+                    <div class="space-y-1">
+                        <label class="flex items-center space-x-2">
+                            <input type="checkbox" name="int_umap" value="true" checked class="form-checkbox text-pink-500 h-4 w-4">
+                            <span class="text-xs text-gray-300">Interactive UMAP</span>
+                        </label>
+                        <label class="flex items-center space-x-2">
+                            <input type="checkbox" name="int_3d_pca" value="true" checked class="form-checkbox text-pink-500 h-4 w-4">
+                            <span class="text-xs text-gray-300">3D Interactive PCA</span>
+                        </label>
+                        <label class="flex items-center space-x-2">
+                            <input type="checkbox" name="int_tsne" value="true" class="form-checkbox text-pink-500 h-4 w-4">
+                            <span class="text-xs text-gray-300">Interactive t-SNE</span>
+                        </label>
+                        <label class="flex items-center space-x-2">
+                            <input type="checkbox" name="int_violin" value="true" checked class="form-checkbox text-pink-500 h-4 w-4">
+                            <span class="text-xs text-gray-300">QC Violins</span>
+                        </label>
+                        <label class="flex items-center space-x-2">
+                            <input type="checkbox" name="int_heatmap" value="true" checked class="form-checkbox text-pink-500 h-4 w-4">
+                            <span class="text-xs text-gray-300">Marker Heatmap</span>
+                        </label>
+                    </div>
+                </div>
+            </div>
+
+            <button type="submit" class="w-full bg-gradient-to-r from-teal-600 to-indigo-600 hover:from-teal-500 hover:to-indigo-500 text-white font-bold py-4 rounded-xl shadow-lg transform transition hover:scale-[1.01] text-xl">
+                <i class="fas fa-play mr-2"></i> Execute Analysis
+            </button>
+        </form>
+
+        <div id="statusArea" class="hidden mt-10 bg-gray-800 p-8 rounded-xl shadow-lg border border-gray-700">
+            <div id="loader" class="text-center py-8">
+                <i class="fas fa-circle-notch fa-spin text-5xl text-teal-500 mb-4"></i>
+                <p class="text-xl text-gray-200 font-semibold blink">Processing single-cell pipeline...</p>
+                <p class="text-gray-400 mt-2 text-sm">Keep an eye on your terminal. Large datasets will take time.</p>
+            </div>
+
+            <div id="results" class="hidden">
+                <div class="flex justify-between items-center mb-6 border-b border-gray-700 pb-4">
+                    <h2 class="text-2xl font-bold text-green-400"><i class="fas fa-check-circle mr-2"></i> Success</h2>
+                    <a id="downloadBtn" href="#" class="bg-green-600 hover:bg-green-500 text-white font-bold py-2 px-4 rounded shadow">
+                        <i class="fas fa-download mr-2"></i> Download .h5ad
+                    </a>
+                </div>
+                
+                <div id="interactiveContainer" class="flex flex-wrap gap-3 mb-6"></div>
+                <div id="plotContainer" class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"></div>
+            </div>
+        </div>
+    </div>
+
+    <script>
+        document.getElementById('customRadio').addEventListener('change', function() {
+            document.getElementById('customFile').classList.remove('hidden');
+        });
+        document.querySelectorAll('input[name="dataset"]:not(#customRadio)').forEach(el => {
+            el.addEventListener('change', () => document.getElementById('customFile').classList.add('hidden'));
+        });
+
+        document.getElementById('pipelineForm').addEventListener('submit', async (e) => {
+            e.preventDefault();
+            
+            document.getElementById('statusArea').classList.remove('hidden');
+            document.getElementById('loader').classList.remove('hidden');
+            document.getElementById('results').classList.add('hidden');
+            document.getElementById('plotContainer').innerHTML = '';
+            document.getElementById('interactiveContainer').innerHTML = '';
+
+            const formData = new FormData(e.target);
+            
+            try {
+                const response = await fetch('/run_pipeline', { method: 'POST', body: formData });
+                
+                if (!response.ok) {
+                    const errText = await response.text();
+                    document.getElementById('loader').classList.add('hidden');
+                    alert("SERVER ERROR 500: Check the terminal running Python. Something crashed inside scAnalysis.");
+                    return;
+                }
+
+                const data = await response.json();
+                document.getElementById('loader').classList.add('hidden');
+                
+                if (data.status === 'success') {
+                    document.getElementById('results').classList.remove('hidden');
+                    document.getElementById('downloadBtn').href = data.download;
+                    
+                    data.outputs.forEach(out => {
+                        if (out.type === 'image') {
+                            document.getElementById('plotContainer').innerHTML += `
+                                <div class="bg-gray-900 rounded p-3 border border-gray-700 flex flex-col items-center">
+                                    <h3 class="text-gray-300 text-sm font-semibold mb-2">${out.title}</h3>
+                                    <a href="${out.url}" target="_blank">
+                                        <img src="${out.url}?t=${new Date().getTime()}" class="rounded hover:opacity-80 transition object-contain max-h-56">
+                                    </a>
+                                </div>
+                            `;
+                        } else if (out.type === 'html') {
+                            document.getElementById('interactiveContainer').innerHTML += `
+                                <a href="${out.url}" target="_blank" class="flex-1 bg-gray-700 hover:bg-gray-600 text-teal-300 text-sm font-medium py-2 px-3 rounded shadow border border-gray-600 text-center transition">
+                                    <i class="fas fa-mouse-pointer mr-2"></i> ${out.title}
+                                </a>
+                            `;
+                        }
+                    });
+                } else {
+                    alert("Pipeline Error: " + data.message);
+                }
+            } catch (err) {
+                document.getElementById('loader').classList.add('hidden');
+                alert("Request completely failed. Ensure the Flask server is still running.");
+                console.error(err);
+            }
+        });
+    </script>
+    <style>
+        .blink { animation: blinker 1.5s linear infinite; }
+        @keyframes blinker { 50% { opacity: 0.5; } }
+    </style>
+</body>
+</html>