experiments in a post-browser web
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>Editor 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 if (hasPeekAPI) {
18 // Running as a Peek extension - full functionality
19
20 // Initialize extension BEFORE signaling ready
21 // (lazy loading waits for ext:ready, so handlers must be registered first)
22 if (extension.init) {
23 await extension.init();
24 }
25
26 // Collect registered command topics for assertion verification
27 const registeredTopics = Object.keys(window._cmdHandlers || {})
28 .map(name => `cmd:execute:${name}`);
29
30 // Signal ready to main process
31 api.publish('ext:ready', {
32 id: extId,
33 registeredTopics,
34 manifest: {
35 id: extension.id,
36 labels: extension.labels,
37 version: '1.0.0'
38 }
39 }, api.scopes.SYSTEM);
40
41 // Handle shutdown request from main process
42 api.subscribe('app:shutdown', () => {
43 if (extension.uninit) {
44 extension.uninit();
45 }
46 }, api.scopes.SYSTEM);
47
48 // Handle extension-specific shutdown
49 api.subscribe(`ext:${extId}: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 if (extension.init) {
58 extension.init();
59 }
60
61 document.body.innerHTML = `
62 <div style="font-family: system-ui; padding: 20px; max-width: 600px; margin: 0 auto;">
63 <h1>Editor Extension</h1>
64 <p>Running in standalone mode (Peek API not available).</p>
65 <p>When running inside Peek, this extension provides:</p>
66 <ul>
67 <li>View, add, and edit saved items</li>
68 <li>Global shortcut (Option+E to open)</li>
69 <li>Type filtering and search</li>
70 </ul>
71 <p><a href="./home.html">Open Editor</a></p>
72 </div>
73 `;
74 }
75</script>
76</body>
77</html>