experiments in a post-browser web
burrito.space
1<!DOCTYPE html>
2<html>
3<head>
4 <meta charset="UTF-8">
5 <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';">
6 <title>Example Extension</title>
7</head>
8<body>
9<script type="module">
10 import extension from './background.js';
11
12 // Feature detection - check if Peek API is available
13 const hasPeekAPI = typeof window.app !== 'undefined';
14 const api = hasPeekAPI ? window.app : null;
15 const extId = extension.id;
16
17 console.log(`[ext:${extId}] background.html loaded`);
18 console.log(`[ext:${extId}] Peek API available:`, hasPeekAPI);
19
20 if (hasPeekAPI) {
21 // Running as a Peek extension - full functionality
22
23 // Signal ready to main process
24 api.publish('ext:ready', {
25 id: extId,
26 manifest: {
27 id: extension.id,
28 labels: extension.labels,
29 version: '1.0.0'
30 }
31 }, api.scopes.SYSTEM);
32
33 // Initialize extension
34 if (extension.init) {
35 console.log(`[ext:${extId}] calling init()`);
36 extension.init();
37 }
38
39 // Handle shutdown request from main process
40 api.subscribe('app:shutdown', () => {
41 console.log(`[ext:${extId}] received shutdown`);
42 if (extension.uninit) {
43 extension.uninit();
44 }
45 }, api.scopes.SYSTEM);
46
47 // Handle extension-specific shutdown
48 api.subscribe(`ext:${extId}:shutdown`, () => {
49 console.log(`[ext:${extId}] received extension shutdown`);
50 if (extension.uninit) {
51 extension.uninit();
52 }
53 }, api.scopes.SYSTEM);
54
55 } else {
56 // Running as a regular website - limited functionality
57 console.log(`[ext:${extId}] Running in standalone mode (no Peek API)`);
58
59 // Initialize with limited functionality
60 if (extension.init) {
61 extension.init();
62 }
63
64 // Show a message indicating standalone mode
65 document.body.innerHTML = `
66 <div style="font-family: system-ui; padding: 20px; max-width: 600px; margin: 0 auto;">
67 <h1>Example Extension</h1>
68 <p>Running in standalone mode (Peek API not available).</p>
69 <p>When running inside Peek, this extension provides:</p>
70 <ul>
71 <li>Command palette integration</li>
72 <li>Global shortcuts (Option+G for gallery)</li>
73 <li>Persistent image storage</li>
74 </ul>
75 <p><a href="./gallery.html">Open Gallery →</a></p>
76 </div>
77 `;
78 }
79</script>
80</body>
81</html>