| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"/> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"/> |
| <title>R8 Configuration Analyzer</title> |
| <link rel="stylesheet" href="style.css"> |
| <script src="https://cdn.jsdelivr.net/npm/protobufjs@7.2.4/dist/protobuf.min.js"></script> |
| </head> |
| <body> |
| <header> |
| <div class="header-top-row"> |
| <div class="flex items-center" style="display: flex; align-items: center"> |
| <div class="header-branding"> |
| <h1 class="header-title" id="report-name">R8 Configuration Analyzer</h1> |
| </div> |
| </div> |
| <div class="header-stats"> |
| <div class="stat-item"> |
| <span class="stat-label">Obfuscation Score</span><span class="stat-value" id="total-obfuscation"></span> |
| </div> |
| <div class="stat-item"> |
| <span class="stat-label">Optimization Score</span><span class="stat-value" id="total-optimization"></span> |
| </div> |
| <div class="stat-item"> |
| <span class="stat-label">Shrinking Score</span><span class="stat-value" id="total-shrinking"></span> |
| </div> |
| </div> |
| </div> |
| <div class="header-toolbar"> |
| <div id="report-view-controls" class="header-toolbar-inner"> |
| <div class="flex-1" style="display: flex; align-items: center; gap: 1rem; justify-content: flex-start"> |
| <div class="filter-icon" title="Filter Options"> |
| <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> |
| <path stroke-linecap="round" stroke-linejoin="round" d="M4 6h16M7 12h10M10 18h4"/> |
| </svg> |
| </div> |
| <div id="filter-chips-container" style="display: flex; align-items: center; gap: 0.5rem"> |
| <div class="relative hidden" id="mod-chip-container"> |
| <button id="mod-filter-btn" class="filter-chip"> |
| <span id="mod-filter-text">Keep Rules: All</span> |
| </button> |
| <div id="mod-dropdown" class="dropdown-menu hidden"></div> |
| </div> |
| <div class="relative hidden" id="cls-chip-container"> |
| <button id="cls-filter-btn" class="filter-chip"> |
| <span id="cls-filter-text">Classes: All</span> |
| </button> |
| <div id="cls-dropdown" class="dropdown-menu hidden"></div> |
| </div> |
| <div class="relative hidden" id="field-chip-container"> |
| <button id="field-filter-btn" class="filter-chip"> |
| <span id="field-filter-text">Fields: All</span> |
| </button> |
| <div id="field-dropdown" class="dropdown-menu hidden"></div> |
| </div> |
| <div class="relative hidden" id="method-chip-container"> |
| <button id="method-filter-btn" class="filter-chip"> |
| <span id="method-filter-text">Methods: All</span> |
| </button> |
| <div id="method-dropdown" class="dropdown-menu hidden"></div> |
| </div> |
| <div class="relative" id="add-filter-container"> |
| <button id="add-filter-btn" class="add-filter-btn"> |
| <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> |
| <path stroke-linecap="round" stroke-linejoin="round" d="M12 4v16m8-8H4"/> |
| </svg> |
| Add filter |
| </button> |
| <div id="add-filter-dropdown" class="dropdown-menu hidden" style="min-width: 10rem"> |
| <div id="add-filter-list"></div> |
| </div> |
| </div> |
| <div class="relative" id="lens-filter-container"> |
| <button id="lens-filter-btn" class="add-filter-btn"> |
| <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> |
| <path stroke-linecap="round" stroke-linejoin="round" d="M12 4v16m8-8H4"/> |
| </svg> |
| Select keep rule lens |
| </button> |
| <div id="lens-filter-dropdown" class="dropdown-menu hidden" style="min-width: 550px"> |
| <div id="lens-filter-list"></div> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="flex-1" style="display: flex; align-items: center; gap: 0.75rem; justify-content: flex-end"> |
| <div class="relative"></div> |
| </div> |
| </div> |
| </div> |
| </header> |
| |
| <div id="report-view" class="container-custom"> |
| <main> |
| <div class="breadcrumb-row" style="margin-bottom: 1rem;"> |
| <div id="flat-breadcrumbs"></div> |
| </div> |
| <div id="stats-container" class="table-container" style="margin-bottom: 2rem; flex: none;"> |
| <table id="stats-table" style="width: 100%; border-collapse: collapse;"> |
| <thead id="stats-table-headers"></thead> |
| <tbody id="stats-table-data"></tbody> |
| </table> |
| </div> |
| <div class="breadcrumb-row" style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem;"> |
| <span class="breadcrumb-text">Project</span> |
| <div class="relative" id="group-by-container"> |
| <button id="group-by-btn" class="dropdown-btn" style="border: none; background: transparent; padding: 0.25rem 0.5rem; display: flex; align-items: center; border-radius: 4px;"> |
| <span style="font-weight: 500; color: var(--text-gray-400)">Group by:</span> |
| <span id="group-by-text" style="font-weight: 600; color: var(--text-gray-500); margin-left: 0.25rem">Keep Rules</span> |
| <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor" style="margin-left: 0.25rem; color: var(--text-gray-500)"> |
| <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/> |
| </svg> |
| </button> |
| <div id="group-by-dropdown" class="dropdown-menu right-0 hidden" style="min-width: 150px"> |
| <div class="dropdown-item" data-value="modules">Keep Rules</div> |
| <div class="dropdown-item" data-value="packages">Keep Rule Files</div> |
| </div> |
| </div> |
| </div> |
| <div class="table-container"> |
| <table id="main-table"> |
| <thead id="table-headers"></thead> |
| <tbody id="table-data"></tbody> |
| </table> |
| </div> |
| </main> |
| </div> |
| |
| <div id="details-view" class="container-custom" style="display: none"> |
| <main> |
| <div class="breadcrumb-row" style="margin-bottom: 1rem;"> |
| <div id="details-breadcrumbs"></div> |
| </div> |
| <div style="flex: 1; display: flex; flex-direction: column; gap: 1.5rem; min-height: 0; overflow-y: auto; padding-right: 0.5rem;"> |
| <div class="table-container" style="flex: none;"> |
| <div style="padding: 1rem; border-bottom: 1px solid var(--border-color); background-color: var(--bg-gray-50);"> |
| <h2 style="font-size: 1rem; font-weight: 700;"> |
| Keep Rule |
| </h2> |
| </div> |
| <table style="width: 100%; border-collapse: collapse;"> |
| <tbody id="details-rule-body"></tbody> |
| </table> |
| </div> |
| |
| <div class="table-container" style="flex: none;"> |
| <div style="padding: 1rem; border-bottom: 1px solid var(--border-color); background-color: var(--bg-gray-50); display: flex; justify-content: space-between; align-items: center;"> |
| <h2 style="font-size: 1rem; font-weight: 700;">Impact</h2> |
| </div> |
| <table style="width: 100%; border-collapse: collapse;"> |
| <thead> |
| <tr> |
| <th class="text-center text-xs font-medium text-gray-500 border-b border-gray-200" style="padding: 0.75rem 0.5rem; text-transform: uppercase;"> |
| Kept Classes |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-b border-gray-200" style="padding: 0.75rem 0.5rem; text-transform: uppercase;"> |
| Kept fields |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-b border-gray-200" style="padding: 0.75rem 0.5rem; text-transform: uppercase;"> |
| Kept methods |
| </th> |
| <th class="text-left text-xs font-medium text-gray-500 border-l border-b border-gray-200" style="padding: 0.75rem 1rem; text-transform: uppercase;"> |
| Steps blocked by rule |
| </th> |
| </tr> |
| </thead> |
| <tbody id="details-impact-body"></tbody> |
| </table> |
| </div> |
| |
| <div class="table-container" style="flex: none;"> |
| <div style="padding: 1rem; border-bottom: 1px solid var(--border-color); background-color: var(--bg-gray-50);"> |
| <h2 id="details-identical-rules-title" style="font-size: 1rem; font-weight: 700;"> |
| Identical Rules |
| </h2> |
| </div> |
| <table style="width: 100%; border-collapse: collapse;"> |
| <thead id="details-identical-rules-header"> |
| <tr> |
| <th rowspan="2" class="text-left bg-gray-50 z-30" style="padding: 1rem; width: 600px; min-width: 600px; border-bottom: 1px solid var(--border-color);"> |
| Rule |
| </th> |
| <th colspan="4" class="text-center border-l border-gray-200 bg-gray-50" style="padding: 0.5rem; border-bottom: 1px solid var(--border-color);"> |
| Kept Items (higher is worse) |
| </th> |
| <th rowspan="2" colspan="3" class="text-center border-l border-gray-200 bg-gray-50" style="padding: 0.5rem; width: 150px; min-width: 150px; border-bottom: 1px solid var(--border-color);"> |
| Steps blocked by rule |
| </th> |
| </tr> |
| <tr> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-gray-200" style="padding: 0.5rem; width: 100px; min-width: 100px; border-bottom: 1px solid var(--border-color);"> |
| Total |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-gray-200" style="padding: 0.5rem; width: 100px; min-width: 100px; border-bottom: 1px solid var(--border-color);"> |
| Classes |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-gray-200" style="padding: 0.5rem; width: 100px; min-width: 100px; border-bottom: 1px solid var(--border-color);"> |
| Fields |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-gray-200" style="padding: 0.5rem; width: 100px; min-width: 100px; border-bottom: 1px solid var(--border-color);"> |
| Methods |
| </th> |
| </tr> |
| </thead> |
| <tbody id="details-identical-rules-body"></tbody> |
| </table> |
| </div> |
| |
| <div class="table-container" style="flex: none;"> |
| <div style="padding: 1rem; border-bottom: 1px solid var(--border-color); background-color: var(--bg-gray-50);"> |
| <h2 id="details-subsumed-by-title" style="font-size: 1rem; font-weight: 700;"> |
| Subsumed By |
| </h2> |
| </div> |
| <table style="width: 100%; border-collapse: collapse;"> |
| <thead id="details-subsumed-by-header"> |
| <tr> |
| <th rowspan="2" class="text-left bg-gray-50 z-30" style="padding: 1rem; width: 600px; min-width: 600px; border-bottom: 1px solid var(--border-color);"> |
| Rule |
| </th> |
| <th colspan="4" class="text-center border-l border-gray-200 bg-gray-50" style="padding: 0.5rem; border-bottom: 1px solid var(--border-color);"> |
| Kept Items (higher is worse) |
| </th> |
| <th rowspan="2" colspan="3" class="text-center border-l border-gray-200 bg-gray-50" style="padding: 0.5rem; width: 150px; min-width: 150px; border-bottom: 1px solid var(--border-color);"> |
| Steps blocked by rule |
| </th> |
| </tr> |
| <tr> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-gray-200" style="padding: 0.5rem; width: 100px; min-width: 100px; border-bottom: 1px solid var(--border-color);"> |
| Total |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-gray-200" style="padding: 0.5rem; width: 100px; min-width: 100px; border-bottom: 1px solid var(--border-color);"> |
| Classes |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-gray-200" style="padding: 0.5rem; width: 100px; min-width: 100px; border-bottom: 1px solid var(--border-color);"> |
| Fields |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-gray-200" style="padding: 0.5rem; width: 100px; min-width: 100px; border-bottom: 1px solid var(--border-color);"> |
| Methods |
| </th> |
| </tr> |
| </thead> |
| <tbody id="details-subsumed-by-body"></tbody> |
| </table> |
| </div> |
| |
| <div style="flex: 1; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1.5rem; min-height: 400px; overflow: hidden;"> |
| <div class="table-container" style="display: flex; flex-direction: column;"> |
| <div style="padding: 1rem; border-bottom: 1px solid var(--border-color); background-color: var(--bg-gray-50);"> |
| <h3 style="font-size: 0.875rem; font-weight: 700;"> |
| Kept Classes |
| </h3> |
| </div> |
| <div id="details-classes-content" style="flex: 1; overflow-y: auto; padding: 0.5rem;"></div> |
| </div> |
| <div class="table-container" style="display: flex; flex-direction: column;"> |
| <div style="padding: 1rem; border-bottom: 1px solid var(--border-color); background-color: var(--bg-gray-50);"> |
| <h3 style="font-size: 0.875rem; font-weight: 700;"> |
| Kept Fields |
| </h3> |
| </div> |
| <div id="details-fields-content" style="flex: 1; overflow-y: auto; padding: 0.5rem;"></div> |
| </div> |
| <div class="table-container" style="display: flex; flex-direction: column;"> |
| <div style="padding: 1rem; border-bottom: 1px solid var(--border-color); background-color: var(--bg-gray-50);"> |
| <h3 style="font-size: 0.875rem; font-weight: 700;"> |
| Kept Methods |
| </h3> |
| </div> |
| <div id="details-methods-content" style="flex: 1; overflow-y: auto; padding: 0.5rem;"></div> |
| </div> |
| </div> |
| </div> |
| </main> |
| </div> |
| |
| <div id="file-details-view" class="container-custom" style="display: none"> |
| <main> |
| <div class="breadcrumb-row" style="margin-bottom: 1rem;"> |
| <div id="file-details-breadcrumbs"></div> |
| </div> |
| <div style="flex: 1; display: flex; flex-direction: column; gap: 1.5rem; min-height: 0; overflow-y: auto; padding-right: 0.5rem;"> |
| <div class="table-container" style="flex: none;"> |
| <div style="padding: 1rem; border-bottom: 1px solid var(--border-color); background-color: var(--bg-gray-50);"> |
| <h2 style="font-size: 1rem; font-weight: 700;">Impact</h2> |
| </div> |
| <table style="width: 100%; border-collapse: collapse;"> |
| <thead> |
| <tr> |
| <th class="text-center text-xs font-medium text-gray-500 border-b border-gray-200" style="padding: 0.75rem 0.5rem; text-transform: uppercase;"> |
| Kept Classes |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-b border-gray-200" style="padding: 0.75rem 0.5rem; text-transform: uppercase;"> |
| Kept fields |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-b border-gray-200" style="padding: 0.75rem 0.5rem; text-transform: uppercase;"> |
| Kept methods |
| </th> |
| </tr> |
| </thead> |
| <tbody id="file-details-impact-body"></tbody> |
| </table> |
| </div> |
| <div class="table-container" style="flex: 1; display: flex; flex-direction: column;"> |
| <div style="padding: 1rem; border-bottom: 1px solid var(--border-color); background-color: var(--bg-gray-50);"> |
| <h2 style="font-size: 1rem; font-weight: 700;">Keep Rules</h2> |
| </div> |
| <div style="flex: 1; overflow-y: auto;"> |
| <table style="width: 100%; border-collapse: collapse;"> |
| <thead id="file-details-rules-header"> |
| <tr> |
| <th rowspan="2" class="text-left bg-gray-50 z-30" style="padding: 1rem; width: 600px; min-width: 600px; border-bottom: 1px solid var(--border-color);"> |
| Rule |
| </th> |
| <th colspan="4" class="text-center border-l border-gray-200 bg-gray-50" style="padding: 0.5rem; border-bottom: 1px solid var(--border-color);"> |
| Kept Items (higher is worse) |
| </th> |
| <th rowspan="2" colspan="3" class="text-center border-l border-gray-200 bg-gray-50" style="padding: 0.5rem; width: 150px; min-width: 150px; border-bottom: 1px solid var(--border-color);"> |
| Steps blocked by rule |
| </th> |
| </tr> |
| <tr> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-gray-200" style="padding: 0.5rem; width: 100px; min-width: 100px; border-bottom: 1px solid var(--border-color);"> |
| Total |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-gray-200" style="padding: 0.5rem; width: 100px; min-width: 100px; border-bottom: 1px solid var(--border-color);"> |
| Classes |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-gray-200" style="padding: 0.5rem; width: 100px; min-width: 100px; border-bottom: 1px solid var(--border-color);"> |
| Fields |
| </th> |
| <th class="text-center text-xs font-medium text-gray-500 border-l border-gray-200" style="padding: 0.5rem; width: 100px; min-width: 100px; border-bottom: 1px solid var(--border-color);"> |
| Methods |
| </th> |
| </tr> |
| </thead> |
| <tbody id="file-details-rules-body"></tbody> |
| </table> |
| </div> |
| </div> |
| </div> |
| </main> |
| </div> |
| <script id="blastradius-proto" type="text/plain"></script> |
| <script id="blastradius-data" type="application/octet-stream"></script> |
| <script src="main.js"></script> |
| <script src="utils.js"></script> |
| </body> |
| </html> |