Yaz Hobooti
Increase PDF resolution: DPI from 300 to 600, scaling factors improved for better OCR and barcode detection
e7a28e8
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>PDF Comparison Tool</title> | |
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"> | |
| <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet"> | |
| <link href="{{ url_for('static', filename='css/style.css') }}" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <div class="container-fluid"> | |
| <div class="row"> | |
| <!-- Header --> | |
| <div class="col-12"> | |
| <nav class="navbar navbar-expand-lg navbar-dark bg-primary"> | |
| <div class="container"> | |
| <a class="navbar-brand" href="#"> | |
| <i class="fas fa-file-pdf me-2"></i> | |
| PDF Comparison Tool | |
| </a> | |
| </div> | |
| </nav> | |
| </div> | |
| </div> | |
| <div class="row mt-4"> | |
| <div class="col-12"> | |
| <div class="container"> | |
| <!-- Upload Section --> | |
| <div class="card shadow-sm"> | |
| <div class="card-header bg-light"> | |
| <h5 class="mb-0"> | |
| <i class="fas fa-upload me-2"></i> | |
| Upload PDF Files for Comparison | |
| </h5> | |
| </div> | |
| <div class="card-body"> | |
| <form id="uploadForm" enctype="multipart/form-data"> | |
| <div class="row"> | |
| <div class="col-md-6"> | |
| <div class="mb-3"> | |
| <label for="pdf1" class="form-label">First PDF File</label> | |
| <input type="file" class="form-control" id="pdf1" name="pdf1" accept=".pdf" required> | |
| <div class="form-text">Select a PDF file for comparison</div> | |
| </div> | |
| </div> | |
| <div class="col-md-6"> | |
| <div class="mb-3"> | |
| <label for="pdf2" class="form-label">Second PDF File</label> | |
| <input type="file" class="form-control" id="pdf2" name="pdf2" accept=".pdf" required> | |
| <div class="form-text">Select a PDF file for comparison</div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="d-grid"> | |
| <button type="submit" class="btn btn-primary btn-lg"> | |
| <i class="fas fa-search me-2"></i> | |
| Compare PDFs | |
| </button> | |
| </div> | |
| </form> | |
| </div> | |
| </div> | |
| <!-- Loading Section --> | |
| <div id="loadingSection" class="card shadow-sm mt-4" style="display: none;"> | |
| <div class="card-body text-center"> | |
| <div class="spinner-border text-primary" role="status"> | |
| <span class="visually-hidden">Loading...</span> | |
| </div> | |
| <p class="mt-3">Processing PDFs... This may take a few minutes.</p> | |
| <div class="progress mt-3"> | |
| <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" style="width: 100%"></div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Results Section --> | |
| <div id="resultsSection" class="mt-4" style="display: none;"> | |
| <!-- Comparison Results Tabs --> | |
| <div class="card shadow-sm"> | |
| <div class="card-header"> | |
| <ul class="nav nav-tabs card-header-tabs" id="resultsTabs" role="tablist"> | |
| <li class="nav-item" role="presentation"> | |
| <button class="nav-link active" id="visual-tab" data-bs-toggle="tab" data-bs-target="#visual" type="button" role="tab"> | |
| <i class="fas fa-eye me-2"></i>Visual Comparison | |
| </button> | |
| </li> | |
| <li class="nav-item" role="presentation"> | |
| <button class="nav-link" id="spelling-tab" data-bs-toggle="tab" data-bs-target="#spelling" type="button" role="tab"> | |
| <i class="fas fa-spell-check me-2"></i>Spelling Issues | |
| </button> | |
| </li> | |
| <li class="nav-item" role="presentation"> | |
| <button class="nav-link" id="barcodes-tab" data-bs-toggle="tab" data-bs-target="#barcodes" type="button" role="tab"> | |
| <i class="fas fa-barcode me-2"></i>Barcodes & QR Codes | |
| </button> | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="card-body"> | |
| <div class="tab-content" id="resultsTabContent"> | |
| <!-- Visual Comparison Tab --> | |
| <div class="tab-pane fade show active" id="visual" role="tabpanel"> | |
| <div id="visualComparisonContent"> | |
| <!-- Content will be populated by JavaScript --> | |
| </div> | |
| </div> | |
| <!-- Spelling Issues Tab --> | |
| <div class="tab-pane fade" id="spelling" role="tabpanel"> | |
| <div id="spellingIssuesContent"> | |
| <!-- Content will be populated by JavaScript --> | |
| </div> | |
| </div> | |
| <!-- Barcodes Tab --> | |
| <div class="tab-pane fade" id="barcodes" role="tabpanel"> | |
| <div id="barcodesContent"> | |
| <!-- Content will be populated by JavaScript --> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Error Section --> | |
| <div id="errorSection" class="alert alert-danger mt-4" style="display: none;"> | |
| <i class="fas fa-exclamation-triangle me-2"></i> | |
| <span id="errorMessage"></span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script> | |
| <script src="{{ url_for('static', filename='js/script.js') }}"></script> | |
| </body> | |
| </html> | |