drop zone, and remove beta tag from mraid checker
This commit is contained in:
@@ -47,10 +47,15 @@ func PlayworksPage(w http.ResponseWriter, r *http.Request) {
|
||||
<div class="panel-body">
|
||||
<div class="control-group">
|
||||
<div class="control-label">Source HTML (Playworks export)</div>
|
||||
<div class="field-row">
|
||||
<input id="src" type="text" placeholder="Path to Playworks HTML..." readonly style="flex:1;" />
|
||||
<button id="pickSrc" class="secondary">Select File</button>
|
||||
<div id="dropZone" class="drop-zone">
|
||||
<div class="file-row">
|
||||
<button id="pickSrc" class="secondary">Select File</button>
|
||||
<button id="clearSrc" class="secondary">Clear</button>
|
||||
</div>
|
||||
<div class="drop-zone-text">or drop a Playworks HTML file here</div>
|
||||
</div>
|
||||
<input id="src" type="hidden" />
|
||||
<div id="sourceSelection" class="selected-list"></div>
|
||||
</div>
|
||||
|
||||
<div class="control-group">
|
||||
@@ -106,22 +111,59 @@ const convertBtn = document.getElementById('convert');
|
||||
const openOutBtn = document.getElementById('openOut');
|
||||
const statusEl = document.getElementById('status');
|
||||
const resultsEl = document.getElementById('results');
|
||||
const sourceSelectionEl = document.getElementById('sourceSelection');
|
||||
|
||||
function updateConvertBtn() {
|
||||
const hasNet = [...document.querySelectorAll('.net-cb')].some(c => c.checked);
|
||||
convertBtn.disabled = !srcEl.value || !outEl.value || !baseNameEl.value.trim() || !hasNet;
|
||||
}
|
||||
|
||||
function basename(p) {
|
||||
const i = Math.max(p.lastIndexOf('/'), p.lastIndexOf('\\'));
|
||||
return i >= 0 ? p.slice(i + 1) : p;
|
||||
}
|
||||
|
||||
function escapeHtml(s){
|
||||
return String(s).replace(/[&<>"']/g, c => ({'&':'&','<':'<','>':'>','"':'"',"'":'''}[c]));
|
||||
}
|
||||
|
||||
function renderSourceSelection() {
|
||||
if (!srcEl.value) {
|
||||
sourceSelectionEl.innerHTML = '<span class="file-name">(no file selected)</span>';
|
||||
return;
|
||||
}
|
||||
sourceSelectionEl.innerHTML = '<div class="results-panel" style="margin-top:0;"><table class="data-table">' +
|
||||
'<thead><tr><th>Filename</th><th style="width:44px;"></th></tr></thead><tbody>' +
|
||||
'<tr><td class="mono wrap">' + escapeHtml(basename(srcEl.value)) + '</td><td><button id="removeSource" class="remove-selected danger" title="Remove">×</button></td></tr>' +
|
||||
'</tbody></table></div>';
|
||||
document.getElementById('removeSource').addEventListener('click', clearSource);
|
||||
}
|
||||
|
||||
function setSource(path, baseName, dir) {
|
||||
srcEl.value = path || '';
|
||||
baseNameEl.value = baseName || '';
|
||||
if (!outEl.value && dir) { outEl.value = dir.replace(/[\\\/]+$/, '') + '\\\\Output'; outputDir = outEl.value; }
|
||||
renderSourceSelection();
|
||||
updateConvertBtn();
|
||||
}
|
||||
|
||||
function clearSource() {
|
||||
srcEl.value = '';
|
||||
baseNameEl.value = '';
|
||||
statusEl.textContent = '';
|
||||
statusEl.classList.remove('is-busy');
|
||||
renderSourceSelection();
|
||||
updateConvertBtn();
|
||||
}
|
||||
|
||||
document.getElementById('pickSrc').addEventListener('click', async () => {
|
||||
const r = await fetch('/api/playworks/pickSource', { method:'POST' });
|
||||
const j = await r.json();
|
||||
if (j.path) {
|
||||
srcEl.value = j.path;
|
||||
baseNameEl.value = j.baseName || '';
|
||||
if (!outEl.value && j.dir) { outEl.value = j.dir; outputDir = j.dir; }
|
||||
updateConvertBtn();
|
||||
setSource(j.path, j.baseName || '', j.dir || '');
|
||||
}
|
||||
});
|
||||
document.getElementById('clearSrc').addEventListener('click', clearSource);
|
||||
document.getElementById('pickOut').addEventListener('click', async () => {
|
||||
const r = await fetch('/api/playworks/pickOutput', { method:'POST' });
|
||||
const j = await r.json();
|
||||
@@ -146,10 +188,25 @@ function outputDisplayName(file) {
|
||||
const parts = file.split(/[\\\\/]/).filter(Boolean);
|
||||
return parts.slice(-2).join('/');
|
||||
}
|
||||
setupDropZone('dropZone', statusEl, (j) => {
|
||||
const paths = j.paths || [];
|
||||
if (!paths.length) {
|
||||
if (j.skipped) statusEl.textContent = 'Skipped ' + j.skipped + ' non-HTML or unavailable item(s).';
|
||||
return;
|
||||
}
|
||||
const sourcePath = paths[0];
|
||||
const droppedBase = basename(sourcePath).replace(/\\.html?$/i, '').replace(/_(?:un|al|is|fb|gg|ap|mo|vu|mtg|tt)$/i, '');
|
||||
const i = Math.max(sourcePath.lastIndexOf('/'), sourcePath.lastIndexOf('\\\\'));
|
||||
setSource(sourcePath, droppedBase, i >= 0 ? sourcePath.slice(0, i) : '');
|
||||
const skipped = Number(j.skipped || 0) + Math.max(0, paths.length - 1);
|
||||
if (skipped) statusEl.textContent = 'Using first dropped HTML file. Skipped ' + skipped + ' other item(s).';
|
||||
});
|
||||
renderSourceSelection();
|
||||
|
||||
document.getElementById('convert').addEventListener('click', async () => {
|
||||
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.disabled = true;
|
||||
convertBtn.disabled = true;
|
||||
@@ -161,9 +218,10 @@ document.getElementById('convert').addEventListener('click', async () => {
|
||||
const msg = await res.json();
|
||||
convertBtn.disabled = false;
|
||||
updateConvertBtn();
|
||||
if (msg.error) { statusEl.textContent = 'Error: ' + msg.error; return; }
|
||||
if (msg.error) { statusEl.classList.remove('is-busy'); statusEl.textContent = 'Error: ' + msg.error; return; }
|
||||
const results = msg.results || [];
|
||||
const ok = results.filter(r => r.ok).length;
|
||||
statusEl.classList.remove('is-busy');
|
||||
statusEl.textContent = ok + ' of ' + results.length + ' network(s) converted.';
|
||||
if (!results.length) { resultsEl.innerHTML = ''; return; }
|
||||
resultsEl.innerHTML = '<table class="data-table"><thead><tr><th style="width:120px;">Network</th><th style="width:90px;">Status</th><th>Output Path</th><th>Error</th></tr></thead><tbody></tbody></table>';
|
||||
|
||||
Reference in New Issue
Block a user