drop zone, and remove beta tag from mraid checker
This commit is contained in:
@@ -1,15 +1,18 @@
|
||||
import * as vscode from 'vscode';
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
|
||||
const BETA_TOOLS_ENABLED_KEY = 'hplToolbox.betaTools.enabled';
|
||||
|
||||
interface ToolDefinition {
|
||||
id?: string;
|
||||
command: string;
|
||||
title: string;
|
||||
description: string;
|
||||
beta?: boolean;
|
||||
}
|
||||
|
||||
const TOOLS: ToolDefinition[] = [
|
||||
const FALLBACK_TOOLS: ToolDefinition[] = [
|
||||
{
|
||||
command: 'hplToolbox.openPlecUpload',
|
||||
title: 'PLEC Upload',
|
||||
@@ -25,17 +28,16 @@ const TOOLS: ToolDefinition[] = [
|
||||
title: 'Base64 Scanner',
|
||||
description: 'Find non-base64 assets in HTML',
|
||||
},
|
||||
{
|
||||
command: 'hplToolbox.openMraidChecker',
|
||||
title: 'MRAID Checker',
|
||||
description: 'Check MRAID requirements and best practices',
|
||||
beta: true,
|
||||
},
|
||||
{
|
||||
command: 'hplToolbox.openSendToMobile',
|
||||
title: 'Send To Mobile',
|
||||
description: 'Share HTML to a phone via LAN + QR',
|
||||
},
|
||||
{
|
||||
command: 'hplToolbox.openMraidChecker',
|
||||
title: 'MRAID Checker',
|
||||
description: 'Check MRAID requirements and best practices',
|
||||
},
|
||||
{
|
||||
command: 'hplToolbox.openPlayworksConverter',
|
||||
title: 'Playworks Converter',
|
||||
@@ -50,8 +52,9 @@ export class LauncherViewProvider implements vscode.WebviewViewProvider {
|
||||
resolveWebviewView(view: vscode.WebviewView) {
|
||||
view.webview.options = { enableScripts: true };
|
||||
const version = this.context.extension.packageJSON.version as string;
|
||||
const tools = loadToolDefinitions(this.context.extensionPath);
|
||||
const betaToolsEnabled = this.context.globalState.get<boolean>(BETA_TOOLS_ENABLED_KEY, false);
|
||||
view.webview.html = getHtml(version, betaToolsEnabled);
|
||||
view.webview.html = getHtml(version, betaToolsEnabled, tools);
|
||||
view.webview.onDidReceiveMessage(async (msg) => {
|
||||
if (msg?.type === 'open' && typeof msg.command === 'string') {
|
||||
vscode.commands.executeCommand(msg.command);
|
||||
@@ -59,14 +62,34 @@ export class LauncherViewProvider implements vscode.WebviewViewProvider {
|
||||
vscode.commands.executeCommand('hplToolbox.openChangelog');
|
||||
} else if (msg?.type === 'setBetaToolsEnabled' && typeof msg.enabled === 'boolean') {
|
||||
await this.context.globalState.update(BETA_TOOLS_ENABLED_KEY, msg.enabled);
|
||||
view.webview.html = getHtml(version, msg.enabled);
|
||||
view.webview.html = getHtml(version, msg.enabled, tools);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function getHtml(version: string, betaToolsEnabled: boolean): string {
|
||||
const visibleTools = sortToolsForDisplay(TOOLS.filter(tool => betaToolsEnabled || !tool.beta));
|
||||
function loadToolDefinitions(extensionPath: string): ToolDefinition[] {
|
||||
const toolsPath = path.join(extensionPath, 'tools.json');
|
||||
try {
|
||||
const raw = JSON.parse(fs.readFileSync(toolsPath, 'utf8'));
|
||||
if (!Array.isArray(raw)) return FALLBACK_TOOLS;
|
||||
const tools = raw
|
||||
.filter((tool: any) => tool && typeof tool.command === 'string' && typeof tool.title === 'string')
|
||||
.map((tool: any) => ({
|
||||
id: typeof tool.id === 'string' ? tool.id : undefined,
|
||||
command: tool.command,
|
||||
title: tool.title,
|
||||
description: typeof tool.description === 'string' ? tool.description : '',
|
||||
beta: Boolean(tool.beta),
|
||||
}));
|
||||
return tools.length ? tools : FALLBACK_TOOLS;
|
||||
} catch {
|
||||
return FALLBACK_TOOLS;
|
||||
}
|
||||
}
|
||||
|
||||
function getHtml(version: string, betaToolsEnabled: boolean, tools: ToolDefinition[]): string {
|
||||
const visibleTools = sortToolsForDisplay(tools.filter(tool => betaToolsEnabled || !tool.beta));
|
||||
const toolButtons = visibleTools.map(renderToolButton).join('\n');
|
||||
return `<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
@@ -460,6 +460,7 @@ ${getToolWebviewStyles()}
|
||||
|
||||
uploadBtn.addEventListener('click', () => {
|
||||
statusEl.textContent = '';
|
||||
statusEl.classList.remove('is-busy');
|
||||
resultsEl.innerHTML = '';
|
||||
outputPanel.classList.add('is-hidden');
|
||||
if (!selectedPaths.length) {
|
||||
@@ -467,6 +468,8 @@ ${getToolWebviewStyles()}
|
||||
return;
|
||||
}
|
||||
uploadBtn.disabled = true;
|
||||
statusEl.textContent = 'Uploading...';
|
||||
statusEl.classList.add('is-busy');
|
||||
resultItems = [];
|
||||
saveAllBtn.disabled = true;
|
||||
regenAllBtn.disabled = true;
|
||||
@@ -504,8 +507,9 @@ ${getToolWebviewStyles()}
|
||||
regenAllBtn.disabled = true;
|
||||
} else if (m.type === 'status') {
|
||||
statusEl.textContent = m.message;
|
||||
statusEl.className = 'status-panel';
|
||||
statusEl.className = 'status-panel is-busy';
|
||||
} else if (m.type === 'error') {
|
||||
statusEl.classList.remove('is-busy');
|
||||
const div = document.createElement('div');
|
||||
div.className = 'err';
|
||||
div.textContent = m.message;
|
||||
@@ -558,6 +562,7 @@ ${getToolWebviewStyles()}
|
||||
saveAllBtn.disabled = resultItems.length === 0;
|
||||
regenAllBtn.disabled = resultItems.length === 0;
|
||||
} else if (m.type === 'done') {
|
||||
statusEl.classList.remove('is-busy');
|
||||
statusEl.innerHTML = '<span class="ok">Done.</span>';
|
||||
uploadBtn.disabled = false;
|
||||
}
|
||||
|
||||
@@ -279,11 +279,13 @@ ${getToolWebviewStyles()}
|
||||
selectedPage = 0;
|
||||
renderSelection();
|
||||
statusEl.textContent = '';
|
||||
statusEl.classList.remove('is-busy');
|
||||
resultsEl.innerHTML = '';
|
||||
outputPanel.classList.add('is-hidden');
|
||||
});
|
||||
document.getElementById('scan').addEventListener('click', () => {
|
||||
statusEl.textContent = 'Scanning...';
|
||||
statusEl.classList.add('is-busy');
|
||||
resultsEl.innerHTML = '';
|
||||
outputPanel.classList.add('is-hidden');
|
||||
if (pickedFiles.length) {
|
||||
@@ -312,11 +314,13 @@ ${getToolWebviewStyles()}
|
||||
renderSelection();
|
||||
} else if (msg.type === 'results') {
|
||||
if (msg.error) {
|
||||
statusEl.classList.remove('is-busy');
|
||||
statusEl.textContent = 'Error: ' + msg.error;
|
||||
outputPanel.classList.add('is-hidden');
|
||||
return;
|
||||
}
|
||||
const total = msg.results.length;
|
||||
statusEl.classList.remove('is-busy');
|
||||
const flagged = msg.results.filter(r => !r.ok).length;
|
||||
statusEl.textContent = 'Scanned ' + total + ' HTML file(s). ' + flagged + ' contain non-base64 assets.';
|
||||
if (!total) {
|
||||
|
||||
@@ -796,11 +796,13 @@ ${getToolWebviewStyles()}
|
||||
selectedPage = 0;
|
||||
renderSelection();
|
||||
statusEl.textContent = '';
|
||||
statusEl.classList.remove('is-busy');
|
||||
resultsEl.innerHTML = '';
|
||||
outputPanel.classList.add('is-hidden');
|
||||
});
|
||||
document.getElementById('scan').addEventListener('click', () => {
|
||||
statusEl.textContent = 'Scanning...';
|
||||
statusEl.classList.add('is-busy');
|
||||
resultsEl.innerHTML = '';
|
||||
outputPanel.classList.add('is-hidden');
|
||||
if (pickedFiles.length) {
|
||||
@@ -829,11 +831,13 @@ ${getToolWebviewStyles()}
|
||||
renderSelection();
|
||||
} else if (msg.type === 'results') {
|
||||
if (msg.error) {
|
||||
statusEl.classList.remove('is-busy');
|
||||
statusEl.textContent = 'Error: ' + msg.error;
|
||||
outputPanel.classList.add('is-hidden');
|
||||
return;
|
||||
}
|
||||
const total = msg.results.length;
|
||||
statusEl.classList.remove('is-busy');
|
||||
const withIssues = msg.results.filter(r => !r.ok).length;
|
||||
const skipped = Number(msg.skipped || 0);
|
||||
const skippedReason = msg.skippedReason || 'file(s).';
|
||||
|
||||
@@ -569,6 +569,7 @@ ${getToolWebviewStyles()}
|
||||
const networks = [...document.querySelectorAll('.net-cb')]
|
||||
.filter(c => c.checked).map(c => c.dataset.tag);
|
||||
statusEl.textContent = 'Converting...';
|
||||
statusEl.classList.add('is-busy');
|
||||
resultsEl.innerHTML = '';
|
||||
openOutBtn.style.display = 'none';
|
||||
outputPanel.classList.add('is-hidden');
|
||||
@@ -603,11 +604,13 @@ ${getToolWebviewStyles()}
|
||||
convertBtn.disabled = false;
|
||||
updateConvertBtn();
|
||||
if (msg.error) {
|
||||
statusEl.classList.remove('is-busy');
|
||||
statusEl.textContent = 'Error: ' + msg.error;
|
||||
outputPanel.classList.add('is-hidden');
|
||||
return;
|
||||
}
|
||||
const results = msg.results || [];
|
||||
statusEl.classList.remove('is-busy');
|
||||
const ok = results.filter(r => r.ok).length;
|
||||
statusEl.textContent = ok + ' of ' + results.length + ' network(s) converted.';
|
||||
if (!results.length) {
|
||||
|
||||
@@ -392,11 +392,14 @@ ${getToolWebviewStyles()}
|
||||
document.getElementById('upload').addEventListener('click', () => {
|
||||
clearErrors();
|
||||
statusEl.textContent = '';
|
||||
statusEl.classList.remove('is-busy');
|
||||
setPreview('');
|
||||
if (rows.length === 0) {
|
||||
statusEl.innerHTML = '<span class="err">Select at least one file.</span>';
|
||||
return;
|
||||
}
|
||||
statusEl.textContent = 'Uploading...';
|
||||
statusEl.classList.add('is-busy');
|
||||
vscode.postMessage({ type: 'upload', rows });
|
||||
});
|
||||
openResultBtn.addEventListener('click', () => {
|
||||
@@ -417,19 +420,22 @@ ${getToolWebviewStyles()}
|
||||
addFiles(m.files || []);
|
||||
} else if (m.type === 'status') {
|
||||
statusEl.textContent = m.message;
|
||||
statusEl.className = 'status-panel';
|
||||
statusEl.className = 'status-panel is-busy';
|
||||
} else if (m.type === 'error') {
|
||||
statusEl.classList.remove('is-busy');
|
||||
statusEl.innerHTML = '';
|
||||
const div = document.createElement('div');
|
||||
div.className = 'err';
|
||||
div.textContent = m.message;
|
||||
statusEl.appendChild(div);
|
||||
} else if (m.type === 'rowError') {
|
||||
statusEl.classList.remove('is-busy');
|
||||
const row = rows.find(r => r.id === m.rowId);
|
||||
if (row) row.error = m.message;
|
||||
renderRows();
|
||||
statusEl.innerHTML = '<span class="err">Fix row errors and retry.</span>';
|
||||
} else if (m.type === 'result') {
|
||||
statusEl.classList.remove('is-busy');
|
||||
statusEl.innerHTML = '<span class="ok">Upload complete.</span>';
|
||||
setPreview(m.preview);
|
||||
}
|
||||
|
||||
@@ -421,6 +421,7 @@ ${getToolWebviewStyles()}
|
||||
selectedPage = 0;
|
||||
renderSelection();
|
||||
statusEl.textContent = '';
|
||||
statusEl.classList.remove('is-busy');
|
||||
});
|
||||
|
||||
startBtn.addEventListener('click', () => {
|
||||
@@ -432,6 +433,7 @@ ${getToolWebviewStyles()}
|
||||
}
|
||||
startBtn.disabled = true;
|
||||
statusEl.textContent = 'Starting server...';
|
||||
statusEl.classList.add('is-busy');
|
||||
vscode.postMessage({ type: 'startShare', paths: selectedPaths });
|
||||
});
|
||||
|
||||
@@ -548,6 +550,7 @@ ${getToolWebviewStyles()}
|
||||
selectedPage = 0;
|
||||
renderSelection();
|
||||
} else if (m.type === 'sharing') {
|
||||
statusEl.classList.remove('is-busy');
|
||||
currentUrls = m.urls;
|
||||
selectedIdx = 0;
|
||||
statusEl.innerHTML = '<span class="ok">Sharing: ' + m.filename + '</span>';
|
||||
@@ -558,6 +561,7 @@ ${getToolWebviewStyles()}
|
||||
startBtn.disabled = true;
|
||||
stopBtn.disabled = false;
|
||||
} else if (m.type === 'stopped') {
|
||||
statusEl.classList.remove('is-busy');
|
||||
statusEl.textContent = 'Stopped.';
|
||||
shareInfo.style.display = 'none';
|
||||
ifaceWrap.style.display = 'none';
|
||||
@@ -566,6 +570,7 @@ ${getToolWebviewStyles()}
|
||||
startBtn.disabled = false;
|
||||
stopBtn.disabled = true;
|
||||
} else if (m.type === 'error') {
|
||||
statusEl.classList.remove('is-busy');
|
||||
statusEl.innerHTML = '<span class="err">' + (m.message || 'Error').replace(/</g, '<') + '</span>';
|
||||
startBtn.disabled = false;
|
||||
}
|
||||
|
||||
@@ -207,6 +207,24 @@ export function getToolWebviewStyles(): string {
|
||||
padding: 8px 10px;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
.status-panel.is-busy {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
.status-panel.is-busy::before {
|
||||
content: "";
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
flex: 0 0 auto;
|
||||
border: 2px solid color-mix(in srgb, var(--vscode-descriptionForeground) 45%, transparent);
|
||||
border-top-color: var(--vscode-foreground);
|
||||
border-radius: 50%;
|
||||
animation: status-spin 800ms linear infinite;
|
||||
}
|
||||
@keyframes status-spin {
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
.status-panel:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user