Diskernet/public/index.html

103 lines
3.0 KiB
HTML

<!DOCTYPE html>
<meta charset=utf-8>
<title>Your HTML Library</title>
<link rel=stylesheet href=/style.css>
<header>
<h1><a href=/>22120</a> &mdash; Internet Offline Library</h1>
</header>
<p>
View <a href=/archive_index.html>the index</a>
</p>
<form method=GET action=/search>
<fieldset class=search>
<legend>Search your archive</legend>
<input class=search type=search name=query placeholder="search your library">
<button>Search</button>
</fieldset>
</form>
<form method=POST action=/mode>
<fieldset>
<legend>Save or Serve: Mode Control</legend>
<p>
Control whether pages you browse are <label class=cmd for=save>saved to</label>, or
<label class=cmd for=serve>served from</label> your archive
<br>
<small><em class=caps>Pro-Tip:</em> Serve pages when you're offline, and it will still feel like you're online</small>
<p>
<label>
<input type=radio name=mode value=save id=save>
Save
</label>
<label>
<input type=radio name=mode value=serve id=serve>
Serve
</label>
<label>
<input type=radio name=mode value=select id=select>
Select (<em>Bookmark mode</em>)
</label>
<output name=notification>
<p>
<button>Change mode</button>
<script>
{
const form = document.currentScript.closest('form');
form.notification.value = "Getting current mode...";
setTimeout(showCurrentMode, 300);
async function showCurrentMode() {
const mode = await fetch('/mode').then(r => r.text());
form.notification.value = "";
form.querySelector(`[name="mode"][value="${mode}"]`).checked = true;
}
}
</script>
</fieldset>
</form>
<form method=POST action=/base_path>
<fieldset>
<legend id=new_base_path>File system path of archive</legend>
<p>
Set the path to where your archive folder will go
<br>
<small>The default is your home directory</small>
<p>
<label>
Base path
<input class=long type=text name=base_path placeholder="A folder path...">
</label>
<p>
<button>Change base path</button>
<script>
{
const form = document.currentScript.closest('form');
showCurrentLibraryPath();
form.base_path.onchange = e => {
self.target = e.target;
}
async function showCurrentLibraryPath() {
const base_path = await fetch('/base_path').then(r => r.text());
form.querySelector(`[name="base_path"]`).value = base_path;
}
}
</script>
</fieldset>
</form>
<form disabled method=POST action=/publish>
<fieldset>
<legend>Publish your archive</legend>
<p>
Publish a search engine from your archive
<br>
<small>This will generate a server.zip file that you can unzip and run</small>
<p>
<button disabled>Publish</button>
</fieldset>
</form>
<footer>
<cite>
<a rel=author href=https://github.com/crisdosyago/22120>22120 GitHub</a>
</cite>
</footer>