<!doctype html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Offline Internals</title>
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="chrome://resources/css/text_defaults.css">
<link rel="stylesheet" href="offline_internals.css">
<script type="module" src="offline_internals.js"></script>
</head>
<body>
<h1>Offline Internals</h1>
<div>
<span id="current-status"></span>
<button id="refresh">Refresh page</button>
<button id="dump">Dump</button>
</div>
<dialog id="dump-modal">
<textarea id="dump-box" name="json-box" rows="10" cols="40" readonly>
</textarea>
<button id="copy-to-clipboard">Copy</button>
<button id="close-dump">Close</button>
<span id="dump-info"></span>
</dialog>
<h2>Event Logs</h2>
<div>
<button id="refresh-logs">Refresh Logs</button>
<div>
<input type="checkbox" id="model-checkbox">Page Model Log</input>
</div>
<div>
<input type="checkbox" id="request-checkbox">Request Queue Log</input>
</div>
<div>
<input type="checkbox" id="prefetch-checkbox">Prefetching Log</input>
</div>
<ul id="logs"></ul>
</div>
<h2>Stored Pages</h2>
<div>
<button id="delete-selected-pages">Delete selected</button>
</div>
<table class="stored-pages-table">
<thead>
<tr>
<th>#</th>
<th><input type="checkbox" id="toggle-all-stored"></th>
<th>URL</th>
<th>Namespace</th>
<th>Size (Kb)</th>
</tr>
</thead>
<tbody id="stored-pages"> </tbody>
</table>
<template id="stored-pages-table-row">
<tr>
<td></td>
<td><input type="checkbox" name="stored"></td>
<td><a></a></td>
<td></td>
<td></td>
</tr>
</template>
<div id="page-actions-info" class="dump"></div>
<h2>Request Queue</h2>
<div>
<button id="delete-selected-requests">Delete selected</button>
</div>
<table class="request-queue-table">
<thead>
<tr>
<th><input type="checkbox" id="toggle-all-requests"></th>
<th>URL</th>
<th>Created Timestamp</th>
<th>Status</th>
<th>Request Origin</th>
</tr>
</thead>
<tbody id="request-queue"> </tbody>
</table>
<template id="request-queue-table-row">
<tr>
<td><input type="checkbox" name="requests"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</template>
<div id="request-queue-actions-info" class="dump"></div>
<input id="url" type="url"
placeholder="http://www.url1.com, http://www.url2.com, ...">
<button id="add-to-queue">Load in background</button>
<div id="save-url-state"></div>
<h2>Prefetching</h2>
<div>
<div>
<button id="schedule-nwake">Schedule NWake</button>
<button id="cancel-nwake">Cancel NWake</button>
</div>
<div>
<input id="generate-urls" type="text"
placeholder="http://www.url1.com, http://www.url2.com, ...">
<button id="generate-page-bundle">Generate Page Bundle</button>
</div>
<div>
<input id="operation-name" type="text"
placeholder="operations/1234-5678">
<button id="get-operation">Get Operation</button>
</div>
<div>
<input id="download-name" type="text" placeholder="us/page/1234-5678">
<button id="download-archive">Download</button>
</div>
</div>
<div>
<input type="checkbox" id="limitless-prefetching-checkbox">
Enable limitless prefetching
</input>
</div>
<div>
<form id="testing-header-form">
<fieldset id="testing-header-fieldset">
<legend>Testing header value:</legend>
<label>
<input type="radio" id="testing-header-default"
name="testing-header" value="">
Default
</label>
<label>
<input type="radio" id="testing-header-enable" name="testing-header"
value="ForceEnable">
Force enable
</label>
<label>
<input type="radio" id="testing-header-disable"
name="testing-header" value="ForceDisable">
Force disable
</label>
</fieldset>
</form>
</div>
<div id="prefetch-actions-info" class="dump"></div>
</body>
</html>