97 lines
3.0 KiB
JavaScript
97 lines
3.0 KiB
JavaScript
(function() {
|
|
"use strict"
|
|
/* global LZString */
|
|
|
|
let lzStringPromise;
|
|
function loadLzString() {
|
|
if (!lzStringPromise) {
|
|
lzStringPromise = new Promise(function (resolve, reject) {
|
|
const script = document.createElement('script')
|
|
script.src = 'https://unpkg.com/lz-string@1.4.4/libs/lz-string.min.js';
|
|
document.head.append(script);
|
|
script.addEventListener('load', resolve);
|
|
script.addEventListener('error', reject);
|
|
});
|
|
}
|
|
return lzStringPromise;
|
|
}
|
|
|
|
function compress(json) {
|
|
return LZString.compressToBase64(JSON.stringify(json))
|
|
.replace(/\+/g, '-')
|
|
.replace(/\//g, '_')
|
|
.replace(/=+$/, '');
|
|
}
|
|
|
|
function fetchResource(resource) {
|
|
return new Promise(function (resolve, reject) {
|
|
const isImage = /\.(png|jpe?g|gif|tiff?|svg|kmz)$/.test(resource);
|
|
if (isImage) {
|
|
resolve ({
|
|
isBinary: true,
|
|
content: new URL(resource, window.location.href).href
|
|
});
|
|
} else {
|
|
const xhr = new XMLHttpRequest();
|
|
xhr.open('GET', resource);
|
|
xhr.responseType = 'text';
|
|
xhr.addEventListener('load', function () {
|
|
resolve ({
|
|
content: xhr.response
|
|
});
|
|
});
|
|
xhr.addEventListener('error', reject);
|
|
xhr.send();
|
|
}
|
|
})
|
|
}
|
|
|
|
const codepenButton = document.getElementById('codepen-button');
|
|
if (codepenButton) {
|
|
const form = document.getElementById('codepen-form');
|
|
codepenButton.href = form.action;
|
|
codepenButton.addEventListener('click', function (event) {
|
|
event.preventDefault();
|
|
const html = document.getElementById('example-html-source').innerText;
|
|
const js = document.getElementById('example-js-source').innerText;
|
|
const workerContainer = document.getElementById('example-worker-source');
|
|
const worker = workerContainer ? workerContainer.innerText : undefined;
|
|
const pkgJson = document.getElementById('example-pkg-source').innerText;
|
|
|
|
const unique = new Set();
|
|
const localResources = (js.match(/'(?:\.\/)?(?:data|resources)\/[^']*'/g) || [])
|
|
.map(function (f) {
|
|
return f.replace(/^'(?:\.\/)?|'$/g, '');
|
|
})
|
|
.filter(function (f) {
|
|
return unique.has(f) ? false : unique.add(f);
|
|
});
|
|
|
|
const promises = localResources.map(function (resource) {
|
|
return fetchResource(resource);
|
|
});
|
|
promises.push(loadLzString());
|
|
|
|
Promise.all(promises).then(
|
|
function (results) {
|
|
const files = {
|
|
'index.html': {content: html},
|
|
'main.js': {content: js},
|
|
'package.json': {content: pkgJson},
|
|
'sandbox.config.json': {content: '{"template": "parcel"}'}
|
|
};
|
|
if (worker) {
|
|
files['worker.js'] = {content: worker}
|
|
}
|
|
for (let i = 0; i < localResources.length; i++) {
|
|
files[localResources[i]] = results[i];
|
|
}
|
|
|
|
form.parameters.value = compress({files: files});
|
|
form.submit();
|
|
}
|
|
);
|
|
});
|
|
}
|
|
})();
|