82 lines
2.6 KiB
JavaScript
82 lines
2.6 KiB
JavaScript
function readSpecsForm() {
|
|
let specs = {};
|
|
for (let field of document.forms['wizard'].elements) {
|
|
specs[field.name] = field.value;
|
|
}
|
|
return specs;
|
|
}
|
|
|
|
function writeSpecsToForm(specs) {
|
|
for (let [k, v] of Object.entries(specs)) {
|
|
document.forms['wizard'].elements[k].value = v;
|
|
}
|
|
}
|
|
|
|
async function encodeSpecs(specs) {
|
|
let byteArray = new TextEncoder().encode(JSON.stringify(specs));
|
|
let cs = new CompressionStream('deflate-raw');
|
|
let writer = cs.writable.getWriter();
|
|
writer.write(byteArray);
|
|
writer.close();
|
|
let response = new Response(cs.readable);
|
|
let respBuffer = await response.arrayBuffer();
|
|
let b64str = btoa(String.fromCharCode.apply(null, new Uint8Array(respBuffer)));
|
|
return b64str.replaceAll('=', '');
|
|
}
|
|
|
|
async function decodeSpecs(str) {
|
|
const byteArray = Uint8Array.from(atob(str), c => c.charCodeAt(0));
|
|
let ds = new DecompressionStream('deflate-raw');
|
|
let writer = ds.writable.getWriter();
|
|
writer.write(byteArray);
|
|
writer.close();
|
|
let response = new Response(ds.readable);
|
|
let respText = await response.text();
|
|
return JSON.parse(respText);
|
|
}
|
|
|
|
function displayUrl(url) {
|
|
let link = document.getElementById('ready_url_link');
|
|
link.href = url;
|
|
link.style.visibility = 'visible';
|
|
let readyUrlInput = document.getElementById('url_input');
|
|
readyUrlInput.value = url;
|
|
readyUrlInput.focus();
|
|
readyUrlInput.select();
|
|
document.getElementById('cont_url_len').innerText = `len=${url.length}`;
|
|
}
|
|
|
|
function baseUrl() {
|
|
return document.location.origin + '/api/v1';
|
|
}
|
|
|
|
async function genUrl() {
|
|
let specs = readSpecsForm();
|
|
let encodedSpecs = await encodeSpecs(specs);
|
|
let url = baseUrl() + '/render/' + encodedSpecs;
|
|
displayUrl(url);
|
|
}
|
|
|
|
async function editUrl() {
|
|
let url = document.getElementById('url_input').value;
|
|
let specs = await decodeSpecs(url.replace(baseUrl() + '/render/', ''));
|
|
writeSpecsToForm(specs);
|
|
displayUrl(url);
|
|
}
|
|
|
|
function onUrlInput() {
|
|
let url = document.forms['wizard'].elements['url'].value;
|
|
if (url.trim().length > 0) {
|
|
document.getElementById('page_screenshot_link').style.visibility = 'visible';
|
|
document.getElementById('page_screenshot_link').href = `${baseUrl()}/screenshot?url=${url}`;
|
|
} else {
|
|
document.getElementById('page_screenshot_link').style.visibility = 'hidden';
|
|
}
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', ev => {
|
|
document.getElementById('btn_gen_url').addEventListener('click', genUrl);
|
|
document.getElementById('btn_edit').addEventListener('click', editUrl);
|
|
document.getElementById('w_url').addEventListener('input', onUrlInput);
|
|
});
|