everything/src/pdf/index.html at main · HeyPuter/everything · GitHub

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
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
    <meta name="theme-color" content="#bf3f3f" />
    <link rel="icon" href="%BASE_URL%favicon.ico" sizes="any" />
    <link rel="icon" type="image/png" sizes="32x32" href="%BASE_URL%favicon-32x32.png" />
    <link rel="icon" type="image/png" sizes="16x16" href="%BASE_URL%favicon-16x16.png" />
    <link rel="apple-touch-icon" sizes="180x180" href="%BASE_URL%apple-touch-icon.png" />
    <link rel="manifest" href="%BASE_URL%manifest.json" />
    <meta
      name="description"
      content="Open, annotate, fill, and organize PDFs. A private PDF workspace with files in your own Puter cloud."
    />
    <title>PDF Editor</title>
    <link rel="canonical" href="https://pdf.puter.com/" />
    <script>
      try {
        const t = localStorage.getItem('pdf-editor:theme');
        if (t === 'light' || t === 'dark') document.documentElement.dataset.theme = t;
      } catch {}
      // The SDK forwards desktop commands into DOM actions. Other windows (including a
      // website that opened this tab) must not be able to operate the editor this way.
      const desktopMessages = new Set([
        'click',
        'focus',
        'drag',
        'drop',
        'itemsOpened',
        'windowWillClose',
        'pictureInPictureClosed',
      ]);
      window.addEventListener(
        'message',
        (event) => {
          if (
            desktopMessages.has(event.data?.msg) &&
            !(
              globalThis.puter?.env === 'app' &&
              window.parent !== window &&
              event.source === window.parent
            )
          )
            event.stopImmediatePropagation();
        },
        true,
      );
    </script>
    <script src="https://js.puter.com/v2/" async></script>
  </head>
  <body>
    <a class="skip-link" href="#main">Skip to content</a>
    <!-- Glass fills for the command icons (src/glass-icons.css, copied from the Spreadsheet app): top-lit gradients whose stops are the
         --ico-* tokens, so every theme retints them. Not display:none, which would disable the gradients. -->
    <svg class="ico-defs" width="0" height="0" aria-hidden="true" focusable="false" style="position:absolute;width:0;height:0;overflow:hidden">
      <defs>
        <linearGradient id="ico-g-paper" x1="0" y1="0" x2="0" y2="1"><stop offset="0.25" style="stop-color:var(--ico-paper-top)"/><stop offset="1" style="stop-color:var(--ico-paper)"/></linearGradient>
        <linearGradient id="ico-g-blue-soft" x1="0" y1="0" x2="0" y2="1"><stop offset="0" style="stop-color:var(--ico-glass-rim)"/><stop offset="0.3" style="stop-color:var(--ico-blue-soft-top)"/><stop offset="1" style="stop-color:var(--ico-blue-soft)"/></linearGradient>
        <linearGradient id="ico-g-blue-solid" x1="0" y1="0" x2="0" y2="1"><stop offset="0" style="stop-color:var(--ico-blue-top)"/><stop offset="1" style="stop-color:var(--ico-blue-deep)"/></linearGradient>
        <linearGradient id="ico-g-green-soft" x1="0" y1="0" x2="0" y2="1"><stop offset="0" style="stop-color:var(--ico-glass-rim)"/><stop offset="0.3" style="stop-color:var(--ico-green-soft-top)"/><stop offset="1" style="stop-color:var(--ico-green-soft)"/></linearGradient>
        <linearGradient id="ico-g-green-solid" x1="0" y1="0" x2="0" y2="1"><stop offset="0" style="stop-color:var(--ico-green-top)"/><stop offset="1" style="stop-color:var(--ico-green-deep)"/></linearGradient>
        <linearGradient id="ico-g-red-soft" x1="0" y1="0" x2="0" y2="1"><stop offset="0" style="stop-color:var(--ico-glass-rim)"/><stop offset="0.3" style="stop-color:var(--ico-red-soft-top)"/><stop offset="1" style="stop-color:var(--ico-red-soft)"/></linearGradient>
        <linearGradient id="ico-g-red-solid" x1="0" y1="0" x2="0" y2="1"><stop offset="0" style="stop-color:var(--ico-red-top)"/><stop offset="1" style="stop-color:var(--ico-red-deep)"/></linearGradient>
        <linearGradient id="ico-g-yellow-soft" x1="0" y1="0" x2="0" y2="1"><stop offset="0" style="stop-color:var(--ico-glass-rim)"/><stop offset="0.3" style="stop-color:var(--ico-yellow-soft-top)"/><stop offset="1" style="stop-color:var(--ico-yellow-soft)"/></linearGradient>
        <linearGradient id="ico-g-yellow-solid" x1="0" y1="0" x2="0" y2="1"><stop offset="0" style="stop-color:var(--ico-yellow-top)"/><stop offset="1" style="stop-color:var(--ico-yellow-deep)"/></linearGradient>
        <linearGradient id="ico-g-amber-soft" x1="0" y1="0" x2="0" y2="1"><stop offset="0" style="stop-color:var(--ico-glass-rim)"/><stop offset="0.3" style="stop-color:var(--ico-amber-soft-top)"/><stop offset="1" style="stop-color:var(--ico-amber-soft)"/></linearGradient>
        <linearGradient id="ico-g-amber-solid" x1="0" y1="0" x2="0" y2="1"><stop offset="0" style="stop-color:var(--ico-amber-top)"/><stop offset="1" style="stop-color:var(--ico-amber-deep)"/></linearGradient>
        <linearGradient id="ico-g-purple-soft" x1="0" y1="0" x2="0" y2="1"><stop offset="0" style="stop-color:var(--ico-glass-rim)"/><stop offset="0.3" style="stop-color:var(--ico-purple-soft-top)"/><stop offset="1" style="stop-color:var(--ico-purple-soft)"/></linearGradient>
        <linearGradient id="ico-g-purple-solid" x1="0" y1="0" x2="0" y2="1"><stop offset="0" style="stop-color:var(--ico-purple-top)"/><stop offset="1" style="stop-color:var(--ico-purple-deep)"/></linearGradient>
      </defs>
    </svg>
    <div id="app"></div>
    <div id="announcer" class="sr-only" role="status" aria-live="polite"></div>
    <div id="toast" role="status" hidden></div>
    <script type="module" src="/src/main.js"></script>
  </body>
</html>