initial commitHEADmaster

1 files changed, 82 insertions, 0 deletions

diff --git a/test/link-tester.html b/test/link-tester.html
new file mode 100644
index 0000000..0e94abc
--- /dev/null
+++ b/test/link-tester.html
@@ -0,0 +1,82 @@
+<!DOCTYPE html>
+<head><!--
+   This file is intended to be loaded from a fossil
+   repository, either using:
+
+   fossil ui --extpage test/link-tester.html
+
+   or by adding test/link-tester.* to uv and then:
+
+   fossil ui -page uv/link-tester.html
+--></head>
+<style>
+  body {
+      width: 100%;
+      height: 100%;
+      margin: 0;
+      padding: 0;
+      display: flex;
+      flex-direction: column;
+  }
+  header {
+      margin: 0.5em 0 0 0;
+      padding: 0 1em 0 1em;
+      z-index: 1;
+  }
+  #controlWrapper {
+      display: flex;
+      flex-direction: row;
+      border-bottom: 2px dotted;
+      padding-bottom: 0.5em;
+  }
+  #controlWrapper > button {
+      flex-grow: 1;
+      margin: 0.5em;
+  }
+  #selectWrapper {
+      display: flex;
+      flex-direction: column;
+      flex-grow: 8;
+  }
+  #selectPage {
+      flex-grow: 1;
+      margin: 1em;
+      padding: 1em;
+  }
+  #currentUrl {
+      font-family: monospace;
+      text-align: center;
+  }
+  #iframe {
+      flex-grow: 1; border: none; margin: 0; padding: 0;
+      display: block;
+      /* Absolute positioning is apparently the only way to get
+         the iframe to stretch to fill the page, but we have to
+         set its Y coordinate to something a bit below #controls. */
+      width: 100%;
+      height: calc(100% - 5em);
+      position: absolute;
+      top: 4em;
+  }
+</style>
+<body>
+  <header>
+    Fossil link test app. Select links from the list below to load
+    them. Use the arrow keys to cycle through the list. The links are
+    loaded within an iframe, so navigation within it will stay within
+    that frame.
+  </header>
+  <header id='controlWrapper'>
+    <button id='btn-prev'>&larr;</button>
+    <div id='selectWrapper'>
+      <select id='selectPage'>
+        <option>/timeline</option>
+        <option>/dir</option>
+      </select>
+      <a target='_blank' id='currentUrl'></a>
+    </div>
+    <button id='btn-next'>&rarr;</button>
+  </header>
+  <iframe id='iframe'><!--populated via the UI--></iframe>
+  <script src='link-tester.js'></script>
+<body>