openFrame.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. const vscode = require('vscode');
  2. let _context;
  3. let panel;
  4. const previewKey = 'savedPreviewUrl'; // Key to store last opened URL
  5. const previewColumnKey = 'savedPreviewColumn'; // Key to store last panel position
  6. function initFrame(context) {
  7. _context = context;
  8. // Register command to open the preview tab
  9. let disposable = vscode.commands.registerCommand('itk.openPreview', async () => {
  10. const url = await vscode.window.showInputBox({
  11. prompt: 'Enter the URL to preview',
  12. placeHolder: 'https://example.com'
  13. });
  14. if (url) {
  15. runFrame(url);
  16. }
  17. });
  18. context.subscriptions.push(disposable);
  19. // Restore last opened preview on activation
  20. const savedUrl = context.globalState.get(previewKey);
  21. const savedColumn = context.globalState.get(previewColumnKey) || vscode.ViewColumn.One;
  22. if (savedUrl) {
  23. runFrame(savedUrl, savedColumn);
  24. }
  25. }
  26. // Function to open a WebView preview
  27. function runFrame(url, column = vscode.ViewColumn.Active) {
  28. let globalState = _context.globalState;
  29. if (panel) {
  30. // If panel exists, update the content and restore position
  31. panel.webview.html = getWebviewContent(url);
  32. panel.reveal(column);
  33. } else {
  34. // Create a new WebView panel in the last known position
  35. panel = vscode.window.createWebviewPanel(
  36. 'webPreview',
  37. 'Web Preview',
  38. column,
  39. { enableScripts: true }
  40. );
  41. panel.webview.html = getWebviewContent(url);
  42. // Save URL & position for persistence
  43. globalState.update(previewKey, url);
  44. globalState.update(previewColumnKey, column);
  45. // Track panel movement
  46. panel.onDidChangeViewState(e => {
  47. if (panel.visible) {
  48. globalState.update(previewColumnKey, panel.viewColumn);
  49. }
  50. });
  51. // Handle WebView disposal (clear references)
  52. panel.onDidDispose(() => {
  53. panel = null;
  54. globalState.update(previewKey, undefined);
  55. globalState.update(previewColumnKey, undefined);
  56. });
  57. }
  58. global.backupTabs && global.backupTabs();
  59. }
  60. // Generate HTML content with an iframe
  61. function getWebviewContent(url) {
  62. return `<!DOCTYPE html>
  63. <html lang="en">
  64. <head>
  65. <meta charset="UTF-8">
  66. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  67. <title>Web Preview</title>
  68. <style>
  69. body { margin: 0; padding: 0; }
  70. iframe { width: 100vw; height: 100vh; border: none; }
  71. </style>
  72. </head>
  73. <body>
  74. <iframe src="${url}" sandbox="allow-scripts allow-same-origin"></iframe>
  75. </body>
  76. </html>`;
  77. }
  78. function getCurrentPreviewState() {
  79. return {
  80. url: _context.globalState.get(previewKey),
  81. group: _context.globalState.get(previewColumnKey) || vscode.ViewColumn.One
  82. }
  83. }
  84. module.exports = { initFrame, runFrame, getCurrentPreviewState };