| <!doctype html> |
| <html lang="en" dir="ltr"> |
| <head> |
| <meta charset="utf-8"> |
| <title>Quota Internals</title> |
| <meta name="viewport" content="width=device-width"> |
| <link rel="stylesheet" href="chrome://resources/css/text_defaults.css"> |
| <link rel="stylesheet" href="quota_internals.css"> |
| <script type="module" src="quota_internals.js" defer></script> |
| </head> |
| <body> |
| <cr-tab-box> |
| <div id="summary-tab" slot="tab">Summary</div> |
| <div id="usage-tab" slot="tab">Usage & Quota</div> |
| <div id="summary-tabpanel" slot="panel"> |
| <!-- Summary --> |
| <h2>Summary</h2> |
| <h3>Disk Availability</h3> |
| <table class="disk-availability-table"> |
| <thead> |
| <th>Total Space</th> |
| <th>Available Space</th> |
| <th>Total Storage Usage</th> |
| <th>Temp Pool Size</th> |
| </thead> |
| <tbody id="listeners-tbody"></tbody> |
| </table> |
| |
| <h3>Eviction Statistics</h3> |
| <table class="eviction-statistics-table"> |
| <thead class="eviction-statistics-header"> |
| <th>Errors on Getting Usage and Quota</th> |
| <th>Evicted Buckets</th> |
| <th>Eviction Rounds</th> |
| <th>Skipped Eviction Rounds</th> |
| </thead> |
| <tbody id="eviction-tbody"></tbody> |
| </table> |
| |
| <h2 class="test-storage-pressure-header"> |
| Test Storage Pressure Behavior</h2> |
| <h3 id="simulate-storage-pressure-activation-message" hidden> |
| Simulate storage pressure is deactivated in Incognito.</h3> |
| <form> |
| <label>Origin to test: </label> |
| <input type="url" name="origin-to-test" id="origin-to-test" |
| placeholder="https://example.com" pattern="https://.*" |
| size="30" required> |
| <button name="trigger-notification" id="trigger-notification" |
| type="submit"> |
| Trigger Storage Pressure Notification |
| </button> |
| </form> |
| </div> |
| |
| <div id="usage-tabpanel" slot="panel"> |
| <!-- Usage and Quota --> |
| <h2>Bucket Usage Data</h2> |
| <table> |
| <thead> |
| <th>Storage Key</th> |
| <th>Bucket</th> |
| <th>Usage (B)</th> |
| <th>Use Count</th> |
| <th>Last Accessed</th> |
| <th>Last Modified</th> |
| </thead> |
| <tbody id="usage-and-quota-tbody"></tbody> |
| </table> |
| </div> |
| </cr-tab-box> |
| |
| <template id="listener-row"> |
| <tr> |
| <td class="total-space"></td> |
| <td class="available-space"></td> |
| <td class="global-and-unlimited-usage"></td> |
| <td class="temp-pool-size"></td> |
| </tr> |
| </template> |
| <template id="eviction-row"> |
| <tr class="eviction-tr"> |
| <td class="errors-on-getting-usage-and-quota"></td> |
| <td class="evicted-buckets"></td> |
| <td class="eviction-rounds"></td> |
| <td class="skipped-eviction-rounds"></td> |
| </tr> |
| </template> |
| <template id="usage-and-quota-row"> |
| <tr class="usage-and-quota-template-row"> |
| <td class="storage-key"></td> |
| <td class="bucket"></td> |
| <td class="usage"></td> |
| <td class="use-count"></td> |
| <td class="last-accessed"></td> |
| <td class="last-modified"></td> |
| </tr> |
| </template> |
| </body> |
| </html> |