Update extension.js
This commit is contained in:
ErikrafT
GitHub
parent
9286f21223
commit
b4a2507d43
|
|
@ -1,69 +1,103 @@
|
||||||
const vscode = require('vscode');
|
const vscode = require('vscode');
|
||||||
|
const path = require('path');
|
||||||
|
|
||||||
function activate(context) {
|
function activate(context) {
|
||||||
|
// Registrar o comando para abrir a visualização
|
||||||
let disposable = vscode.commands.registerCommand('erikraftDrop.open', function () {
|
let disposable = vscode.commands.registerCommand('erikraftDrop.open', function () {
|
||||||
const panel = vscode.window.createWebviewPanel(
|
vscode.commands.executeCommand('workbench.view.extension.erikraftDrop');
|
||||||
'erikraftDrop',
|
|
||||||
'ErikrafT Drop',
|
|
||||||
vscode.ViewColumn.One,
|
|
||||||
{
|
|
||||||
enableScripts: true
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
panel.webview.html = getWebviewContent();
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Registrar o provedor de visualização
|
||||||
|
const viewProvider = new ErikrafTDropViewProvider(context.extensionPath);
|
||||||
|
context.subscriptions.push(
|
||||||
|
vscode.window.registerWebviewViewProvider('erikraftDrop.view', viewProvider)
|
||||||
|
);
|
||||||
|
|
||||||
context.subscriptions.push(disposable);
|
context.subscriptions.push(disposable);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
class ErikrafTDropViewProvider {
|
||||||
|
constructor(extensionPath) {
|
||||||
|
this.extensionPath = extensionPath;
|
||||||
|
}
|
||||||
|
|
||||||
|
resolveWebviewView(webviewView) {
|
||||||
|
webviewView.webview.options = {
|
||||||
|
enableScripts: true,
|
||||||
|
localResourceRoots: [
|
||||||
|
vscode.Uri.file(path.join(this.extensionPath, 'images')),
|
||||||
|
vscode.Uri.file(path.join(this.extensionPath, 'media'))
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
webviewView.webview.html = this.getWebviewContent(webviewView.webview);
|
||||||
|
}
|
||||||
|
|
||||||
|
getWebviewContent(webview) {
|
||||||
|
const darkIconPath = webview.asWebviewUri(vscode.Uri.file(
|
||||||
|
path.join(this.extensionPath, 'images', 'ui-icon-dark.svg')
|
||||||
|
));
|
||||||
|
const lightIconPath = webview.asWebviewUri(vscode.Uri.file(
|
||||||
|
path.join(this.extensionPath, 'images', 'ui-icon-light.svg')
|
||||||
|
));
|
||||||
|
|
||||||
|
return `
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="pt-br">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src ${webview.cspSource} https:; style-src ${webview.cspSource}; script-src ${webview.cspSource}; frame-src https://drop.erikraft.com;">
|
||||||
|
<title>ErikrafT Drop</title>
|
||||||
|
<style>
|
||||||
|
html, body {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
background-color: var(--vscode-editor-background);
|
||||||
|
color: var(--vscode-editor-foreground);
|
||||||
|
}
|
||||||
|
iframe {
|
||||||
|
border: none;
|
||||||
|
width: 100%;
|
||||||
|
height: calc(100% - 40px);
|
||||||
|
max-width: 400px;
|
||||||
|
margin: 0 auto;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.icon-container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
.icon-container img {
|
||||||
|
max-width: 80px;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="icon-container">
|
||||||
|
<picture>
|
||||||
|
<source srcset="${darkIconPath}" media="(prefers-color-scheme: dark)" />
|
||||||
|
<img src="${lightIconPath}" alt="ErikrafT Drop Icon" />
|
||||||
|
</picture>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<iframe
|
||||||
|
src="https://drop.erikraft.com/"
|
||||||
|
allow="clipboard-write; camera; microphone; autoplay;"
|
||||||
|
sandbox="allow-same-origin allow-scripts allow-popups allow-forms"
|
||||||
|
></iframe>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
exports.activate = activate;
|
exports.activate = activate;
|
||||||
|
|
||||||
function deactivate() {}
|
function deactivate() {}
|
||||||
|
|
||||||
exports.deactivate = deactivate;
|
exports.deactivate = deactivate;
|
||||||
|
|
||||||
function getWebviewContent() {
|
|
||||||
return `
|
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="pt-br">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<title>ErikrafT Drop</title>
|
|
||||||
<style>
|
|
||||||
html, body {
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
background-color: #fff;
|
|
||||||
}
|
|
||||||
iframe {
|
|
||||||
border: none;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
picture {
|
|
||||||
display: block;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<!-- Ícone para temas claro e escuro -->
|
|
||||||
<picture>
|
|
||||||
<source srcset="images/ui-icon-dark.svg" media="(prefers-color-scheme: dark)" />
|
|
||||||
<img src="images/ui-icon-light.svg" alt="ErikrafT Drop Icon" width="120" />
|
|
||||||
</picture>
|
|
||||||
|
|
||||||
<!-- GIFs para o README.md -->
|
|
||||||
<div style="text-align: center; padding: 20px;">
|
|
||||||
<img src="images/screenshot1.gif" alt="Demo 1" width="300"/>
|
|
||||||
<img src="images/screenshot2.gif" alt="Demo 2" width="300"/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<iframe src="https://drop.erikraft.com/" allow="clipboard-write; camera; microphone; autoplay;"></iframe>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue