extension.js

const vscode = require('vscode');

let panel = null;
let sessionDocUri = null;
let statusItem = null;
let debounceTimer = null;
let statusResetTimer = null;
let replReady = false;

function getConfig() {
  return vscode.workspace.getConfiguration('strudel');
}

function postToRepl(payload) {
  if (!panel) {
    vscode.window.showWarningMessage('Strudel: no active session. Run "Strudel: Start Session" first.');
    return false;
  }
  panel.webview.postMessage(payload);
  return true;
}

function getSessionDocument() {
  if (!sessionDocUri) {
    return undefined;
  }
  return vscode.workspace.textDocuments.find((d) => d.uri.toString() === sessionDocUri.toString());
}

function setStatus(text, transient = false) {
  if (!statusItem) {
    return;
  }
  statusItem.text = text;
  statusItem.show();
  if (statusResetTimer) {
    clearTimeout(statusResetTimer);
    statusResetTimer = null;
  }
  if (transient) {
    statusResetTimer = setTimeout(() => setStatus('$(music) Strudel'), 2000);
  }
}

function webviewHtml(webview, extensionUri) {
  const engineUri = webview.asWebviewUri(vscode.Uri.joinPath(extensionUri, 'media', 'strudel', 'index.js'));
  const mainUri = webview.asWebviewUri(vscode.Uri.joinPath(extensionUri, 'media', 'main.js'));
  // 'unsafe-eval' is required: strudel transpiles pattern code at runtime.
  // https: covers the sample CDNs (strudel.b-cdn.net, raw.githubusercontent.com)
  const csp = [
    "default-src 'none'",
    `script-src ${webview.cspSource} 'unsafe-eval'`,
    `style-src ${webview.cspSource} 'unsafe-inline'`,
    'connect-src https:',
    'media-src https: blob: data:',
    'worker-src blob: data:',
    `img-src ${webview.cspSource} https: data:`,
    'font-src https: data:',
  ].join('; ');
  return `<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta http-equiv="Content-Security-Policy" content="${csp}" />
  <style>
    body {
      font-family: var(--vscode-font-family, sans-serif);
      color: var(--vscode-foreground, #ccc);
      background: var(--vscode-editor-background, #1e1e1e);
      display: flex; flex-direction: column; align-items: center;
      justify-content: center; height: 95vh; gap: 1.2rem; text-align: center;
    }
    h1 { font-size: 1.3rem; margin: 0; }
    button {
      font-size: 1.4rem; padding: 0.5rem 2.2rem; cursor: pointer; border-radius: 6px;
      border: 1px solid var(--vscode-button-border, transparent);
      background: var(--vscode-button-background, #0e639c);
      color: var(--vscode-button-foreground, #fff);
    }
    button:disabled { opacity: 0.4; cursor: default; }
    #status { opacity: 0.8; }
    #error {
      display: none; max-width: 90%; white-space: pre-wrap; padding: 0.6rem 1rem;
      border-radius: 6px; color: var(--vscode-errorForeground, #f48771);
      border: 1px solid var(--vscode-errorForeground, #f48771);
      font-family: var(--vscode-editor-font-family, monospace); font-size: 0.85rem;
    }
    .hint { font-size: 0.8rem; opacity: 0.6; max-width: 80%; }
  </style>
</head>
<body>
  <h1>♪ Strudel</h1>
  <div id="status">démarrage…</div>
  <div>
    <button id="play" disabled>▶</button>
    <button id="stop" style="display:none">■</button>
  </div>
  <div id="error"></div>
  <div class="hint">Édite ton fichier dans VSCode : les changements s'appliquent à la fin du cycle en cours.
    Ctrl+Enter = mise à jour immédiate · Ctrl+. = stop</div>
  <script src="${engineUri}"></script>
  <script src="${mainUri}"></script>
</body>
</html>`;
}

function sendCurrentCode(type) {
  const doc = getSessionDocument() || vscode.window.activeTextEditor?.document;
  if (!doc) {
    return;
  }
  postToRepl({ type, code: doc.getText() });
}

function startSession(context) {
  const editor = vscode.window.activeTextEditor;
  if (!editor) {
    vscode.window.showWarningMessage('Strudel: open the pattern file you want to play first.');
    return;
  }
  sessionDocUri = editor.document.uri;

  if (panel) {
    panel.reveal(vscode.ViewColumn.Beside, true);
    if (replReady) {
      sendCurrentCode('strudel-set-code');
    }
  } else {
    replReady = false;
    panel = vscode.window.createWebviewPanel('strudelRepl', 'Strudel', vscode.ViewColumn.Beside, {
      enableScripts: true,
      // keep the page (and the audio) alive when the panel is hidden
      retainContextWhenHidden: true,
      localResourceRoots: [vscode.Uri.joinPath(context.extensionUri, 'media')],
    });
    panel.webview.html = webviewHtml(panel.webview, context.extensionUri);
    panel.webview.onDidReceiveMessage((msg) => {
      if (msg?.from !== 'strudel') {
        return;
      }
      switch (msg.event) {
        case 'ready':
          replReady = true;
          postToRepl({ type: 'strudel-set-auto-update', value: getConfig().get('endOfCycleUpdate') });
          sendCurrentCode('strudel-set-code');
          setStatus('$(music) Strudel: ready — press ▶ in the panel', true);
          break;
        case 'started':
          setStatus('$(play) Strudel: playing');
          break;
        case 'stopped':
          setStatus('$(music) Strudel');
          break;
        case 'evaluated':
          setStatus('$(check) Strudel: updated', true);
          break;
        case 'error':
          setStatus('$(error) Strudel: eval error', true);
          break;
      }
    });
    panel.onDidDispose(() => {
      panel = null;
      sessionDocUri = null;
      replReady = false;
      vscode.commands.executeCommand('setContext', 'strudel.sessionActive', false);
      setStatus('$(music) Strudel: session closed', true);
    });
  }

  vscode.commands.executeCommand('setContext', 'strudel.sessionActive', true);
  setStatus('$(music) Strudel: loading engine…');
}

function activate(context) {
  statusItem = vscode.window.createStatusBarItem(vscode.StatusBarAlignment.Right, 100);
  statusItem.command = 'strudel.togglePlay';
  statusItem.tooltip = 'Strudel: toggle play/stop';

  context.subscriptions.push(
    statusItem,
    vscode.commands.registerCommand('strudel.startSession', () => startSession(context)),
    vscode.commands.registerCommand('strudel.evaluate', () => sendCurrentCode('strudel-evaluate')),
    vscode.commands.registerCommand('strudel.stop', () => {
      postToRepl({ type: 'strudel-stop' });
    }),
    vscode.commands.registerCommand('strudel.togglePlay', () => {
      postToRepl({ type: 'strudel-toggle-play' });
    }),
    vscode.commands.registerCommand('strudel.toggleAutoSync', async () => {
      const config = getConfig();
      const next = !config.get('autoSync');
      await config.update('autoSync', next, vscode.ConfigurationTarget.Global);
      setStatus(next ? '$(sync) Strudel: auto-sync on' : '$(sync-ignored) Strudel: auto-sync off', true);
    }),
    vscode.workspace.onDidChangeTextDocument((e) => {
      if (!panel || !replReady || !sessionDocUri || e.document.uri.toString() !== sessionDocUri.toString()) {
        return;
      }
      if (!getConfig().get('autoSync') || e.contentChanges.length === 0) {
        return;
      }
      if (debounceTimer) {
        clearTimeout(debounceTimer);
      }
      debounceTimer = setTimeout(() => {
        debounceTimer = null;
        // the webview applies it at the end of the current cycle (endOfCycleUpdate)
        postToRepl({ type: 'strudel-set-code', code: e.document.getText() });
      }, getConfig().get('autoSyncDelay'));
    }),
  );
}

function deactivate() {
  if (debounceTimer) {
    clearTimeout(debounceTimer);
  }
  if (statusResetTimer) {
    clearTimeout(statusResetTimer);
  }
}

module.exports = { activate, deactivate };