aboutsummaryrefslogtreecommitdiff
path: root/index.html
blob: 58bb56167f53d4a236b667394837ab1b2a6e7e22 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<!doctype html>

<!--
 * Beamer Viewer, a web-based PDF presentation viewer
 * Copyright 2018-2024 Euxane TRAN-GIRARD
 * SPDX-License-Identifier: EUPL-1.2
-->

<html>

<head>
  <meta charset="utf-8">
  <link rel="icon" href="favicon.ico">
  <link rel="stylesheet" type="text/css" href="beamer/viewer/viewer.css">

  <noscript>
    <style type="text/css">
      #fileSelect {
        display: none;
      }
    </style>
  </noscript>

  <title>Beamer Viewer</title>
</head>

<body>
  <canvas id="screen" class="centered"></canvas>

  <div id="welcomeScreen" class="centered">
    <header>
      <h1>Beamer Viewer</h1>
      <span id="offlineCapable">(available offline too)</span>
    </header>

    <div>
      <p>
        This web app displays notes and slides in separate windows,
        keeping both synchronised.
        It accepts double-width or double-height PDF presentations:
      </p>

      <table class="examples-container">
        <th>
          <tr>
            <td>Shape</td>
            <td>L<sup>A</sup>T<sub>E</sub>X-Beamer</td>
          </tr>
        </th>
        <tr>
          <td>
            <table class="layout-example">
              <tr>
                <td>SLIDES</td>
                <td>NOTES</td>
              </tr>
            </table>
          </td>
          <td>
            <code>\setbeameroption{show notes on second screen=right}</code>
          </td>
        </tr>
        <tr>
          <td>
            <table class="layout-example">
              <tr>
                <td>SLIDES</td>
              </tr>
              <tr>
                <td>NOTES</td>
              </tr>
            </table>
          </td>
          <td>
            <code>\setbeameroption{show notes on second screen=bottom}</code>
          </td>
        </tr>
      </table>

      <br />

      <p id="warning" class="warning">
        <noscript>A web browser with JavaScript support is required to use this application.</noscript>
      </p>

      <div id="fileSelect">
        <p>
          Select a PDF file to open,
          or try with
          <a href="#file=sample/demo.pdf">demo slides</a>.
        </p>

        <input id="fileInput" type="file" multiple="false" accept="application/pdf" disabled />
        <br />
        <br />
        <input id="startButton" type="button" value="Start presentation" disabled />
      </div>
    </div>

    <div>
      <ul class="bottom-links">
        <li><a href="https://euxane.net">&copy; 2024 Euxane</a></li>
        <li><a href="https://cgit.euxane.net/beamer-viewer">Source code (EUPL)</a></li>
        <li><a href="https://www.paypal.com/paypalme/pacien/15">Donate</a></li>
        <li><a href="https://mozilla.github.io/pdf.js/">Powered by PDF.js</a></li>
      </ul>
    </div>
  </div>

  <div id="timer" class="notification hidden">
    <span id="timer-pause" class="timer-action" title="Pause/resume timer">⏱︎</span>
    <span id="timer-value"></span>
    <span id="timer-reset" class="timer-action" title="Reset timer">↺</span>
  </div>

  <div id="message" class="notification"></div>

  <script type="text/javascript" src="beamer/pdfjs/pdf.js"></script>
  <script type="text/javascript" src="beamer/pdfjs/pdf.worker.js"></script>
  <script type="text/javascript" src="beamer/viewer/screen/timer.js"></script>
  <script type="text/javascript" src="beamer/viewer/screen/screen.js"></script>
  <script type="text/javascript" src="beamer/viewer/stage/actions.js"></script>
  <script type="text/javascript" src="beamer/viewer/stage/stage.js"></script>
  <script type="text/javascript" src="beamer/viewer/presentation.js"></script>
  <script type="text/javascript" src="beamer/viewer/viewer.js"></script>
  <script type="text/javascript" src="beamer/viewer/init.js"></script>
</body>

</html>