diff options
| -rw-r--r-- | pointless/viewer/viewer.css | 14 | ||||
| -rw-r--r-- | pointless/viewer/viewer.js | 6 | ||||
| -rw-r--r-- | viewer.html | 22 |
3 files changed, 38 insertions, 4 deletions
diff --git a/pointless/viewer/viewer.css b/pointless/viewer/viewer.css index be4f876..57d95f4 100644 --- a/pointless/viewer/viewer.css +++ b/pointless/viewer/viewer.css | |||
| @@ -13,10 +13,22 @@ html, body { | |||
| 13 | height: 100%; | 13 | height: 100%; |
| 14 | } | 14 | } |
| 15 | 15 | ||
| 16 | #fileInput { | 16 | #welcomeScreen { |
| 17 | display: none; | 17 | display: none; |
| 18 | } | 18 | } |
| 19 | 19 | ||
| 20 | #welcomeScreen table { | ||
| 21 | width: 100%; | ||
| 22 | border-collapse: collapse; | ||
| 23 | } | ||
| 24 | |||
| 25 | #welcomeScreen table td { | ||
| 26 | text-align: center; | ||
| 27 | border: 1px solid white; | ||
| 28 | width: 50%; | ||
| 29 | height: 8rem; | ||
| 30 | } | ||
| 31 | |||
| 20 | .centered { | 32 | .centered { |
| 21 | position: absolute; | 33 | position: absolute; |
| 22 | top: 50%; | 34 | top: 50%; |
diff --git a/pointless/viewer/viewer.js b/pointless/viewer/viewer.js index 78035ee..9e92c2c 100644 --- a/pointless/viewer/viewer.js +++ b/pointless/viewer/viewer.js | |||
| @@ -9,13 +9,15 @@ | |||
| 9 | 9 | ||
| 10 | class Viewer { | 10 | class Viewer { |
| 11 | constructor() { | 11 | constructor() { |
| 12 | this.welcomeScreen = document.getElementById("welcomeScreen"); | ||
| 12 | this.fileInput = document.getElementById("fileInput"); | 13 | this.fileInput = document.getElementById("fileInput"); |
| 13 | this.fileInput.style.display = "block"; | 14 | |
| 15 | this.welcomeScreen.style.display = "block"; | ||
| 14 | this._listenForInput(); | 16 | this._listenForInput(); |
| 15 | } | 17 | } |
| 16 | 18 | ||
| 17 | load(source) { | 19 | load(source) { |
| 18 | this.fileInput.style.display = "none"; | 20 | this.welcomeScreen.style.display = "none"; |
| 19 | pdfjsLib.getDocument(source).then(function(pdf) { | 21 | pdfjsLib.getDocument(source).then(function(pdf) { |
| 20 | var presentation = new Presentation(pdf); | 22 | var presentation = new Presentation(pdf); |
| 21 | }); | 23 | }); |
diff --git a/viewer.html b/viewer.html index df529ca..99accb4 100644 --- a/viewer.html +++ b/viewer.html | |||
| @@ -16,7 +16,27 @@ | |||
| 16 | 16 | ||
| 17 | <body> | 17 | <body> |
| 18 | <canvas id="screen" class="centered"></canvas> | 18 | <canvas id="screen" class="centered"></canvas> |
| 19 | <input id="fileInput" class="centered" type="file" multiple="false"/> | 19 | |
| 20 | <div id="welcomeScreen" class="centered"> | ||
| 21 | <h1>Pointless Viewer</h1> | ||
| 22 | |||
| 23 | <p>This viewer accepts double-width PDF presentations of the following shape:</p> | ||
| 24 | <table> | ||
| 25 | <tr> | ||
| 26 | <td>LEFT<br>(slides)</td> | ||
| 27 | <td>RIGHT<br>(notes)</td> | ||
| 28 | </tr> | ||
| 29 | </table> | ||
| 30 | |||
| 31 | <p> | ||
| 32 | (LaTeX-Beamer users may use | ||
| 33 | <code>\setbeameroption{show notes on second screen=right}</code>) | ||
| 34 | </p> | ||
| 35 | |||
| 36 | <p>Please select a PDF presentation file to open.</p> | ||
| 37 | <input id="fileInput" type="file" multiple="false"/> | ||
| 38 | </div> | ||
| 39 | |||
| 20 | <div id="timer" class="notification"></div> | 40 | <div id="timer" class="notification"></div> |
| 21 | <div id="message" class="notification"></div> | 41 | <div id="message" class="notification"></div> |
| 22 | 42 | ||