');
} catch (e) {
console.log(e)
}
});
}
// tested
function extractSvgToImg($htmlObject) {
let serializer = new XMLSerializer();
$htmlObject.find('svg').each(function (index, elem) {
// add width & height because the result image was too big
let bbox = elem.getBoundingClientRect()
let newWidth = bbox.width
let newHeight = bbox.height
let svgXml = serializer.serializeToString(elem);
let imgSrc = 'data:image/svg+xml;base64,' + window.btoa(svgXml);
$(elem).replaceWith('' + tmp.innerHTML + '
';
return parseHTML(tmpHtml);
} catch (e) {
console.log('Error:', e);
return htmlContent;
}
}
/////
function getSelectedNodes() {
// if (document.selection) {
// return document.selection.createRange().parentElement();
// return document.selection.createRange();
// }
let selection = window.getSelection();
let docfrag = [];
for (let i = 0; i < selection.rangeCount; i++) {
docfrag.push(selection.getRangeAt(i).cloneContents());
}
return docfrag;
}
/////
function extractCss(includeStyle, appliedStyles) {
if (includeStyle) {
$('body').find('*').each((i, pre) => {
let $pre = $(pre);
if (allowedTags.indexOf(pre.tagName.toLowerCase()) < 0) return;
if (mathMLTags.indexOf(pre.tagName.toLowerCase()) > -1) return;
if (!$pre.is(':visible')) {
$pre.replaceWith('');
} else {
if (pre.tagName.toLowerCase() === 'svg') return;
let classNames = pre.getAttribute('class');
if (!classNames) {
classNames = pre.getAttribute('id');
if (!classNames) {
classNames = pre.tagName + '-' + generateRandomNumber();
}
}
let tmpName = cssClassesToTmpIds[classNames];
let tmpNewCss = tmpIdsToNewCss[tmpName];
if (!tmpName) {
// TODO - collision between class names when multiple pages
tmpName = generateRandomTag(2) + i
cssClassesToTmpIds[classNames] = tmpName;
}
if (!tmpNewCss) {
tmpNewCss = {};
for (let cssTagName of supportedCss) {
let cssValue = $pre.css(cssTagName);
if (cssValue && cssValue.length > 0) {
tmpNewCss[cssTagName] = cssValue;
}
}
// Reuse CSS - if the same css code was generated for another element, reuse it's class name
let tcss = JSON.stringify(tmpNewCss)
let found = false
if (Object.keys(tmpIdsToNewCssSTRING).length === 0) {
tmpIdsToNewCssSTRING[tmpName] = tcss;
tmpIdsToNewCss[tmpName] = tmpNewCss;
} else {
for (const key in tmpIdsToNewCssSTRING) {
if (tmpIdsToNewCssSTRING[key] === tcss) {
tmpName = key
found = true
break
}
}
if (!found) {
tmpIdsToNewCssSTRING[tmpName] = tcss;
tmpIdsToNewCss[tmpName] = tmpNewCss;
}
}
}
pre.setAttribute('data-class', tmpName);
}
});
return jsonToCss(tmpIdsToNewCss);
} else {
// remove hidden elements when style is not included
$('body').find('*').each((i, pre) => {
let $pre = $(pre)
if (!$pre.is(':visible')) {
$pre.replaceWith('')
}
})
let mergedCss = '';
if (appliedStyles && appliedStyles.length > 0) {
for (let i = 0; i < appliedStyles.length; i++) {
mergedCss += appliedStyles[i].style;
}
return mergedCss;
}
}
return null
}
/////
function deferredAddZip(url, filename) {
let deferred = $.Deferred();
JSZipUtils.getBinaryContent(url, function(err, data) {
if (err) {
// deferred.reject(err); TODO
console.log('Error:', err);
deferred.resolve();
} else {
// TODO - move to utils.js
if (filename.endsWith("TODO-EXTRACT")) {
let oldFilename = filename
let arr = (new Uint8Array(data)).subarray(0, 4);
let header = "";
for(let i = 0; i < arr.length; i++) {
header += arr[i].toString(16);
}
if (header.startsWith("89504e47")) {
filename = filename.replace("TODO-EXTRACT", "png")
} else if (header.startsWith("47494638")) {
filename = filename.replace("TODO-EXTRACT", "gif")
} else if (header.startsWith("ffd8ff")) {
filename = filename.replace("TODO-EXTRACT", "jpg")
} else {
// ERROR
console.log("Error! Unable to extract the image type!");
deferred.resolve();
}
tmpGlobalContent = tmpGlobalContent.replace(oldFilename, filename)
}
extractedImages.push({
filename: filename,
// TODO - must be JSON serializable
data: base64ArrayBuffer(data)
});
deferred.resolve();
}
});
return deferred;
}
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
let imgsPromises = [];
let result = {};
let pageSrc = '';
let tmpContent = '';
let styleFile = null;
extractIFrames()
if (request.type === 'extract-page') {
styleFile = extractCss(request.includeStyle, request.appliedStyles)
pageSrc = document.getElementsByTagName('body')[0];
tmpContent = getContent(pageSrc);
} else if (request.type === 'extract-selection') {
styleFile = extractCss(request.includeStyle, request.appliedStyles)
pageSrc = getSelectedNodes();
pageSrc.forEach((page) => {
tmpContent += getContent(page);
});
}
tmpGlobalContent = tmpContent
allImages.forEach((tmpImg) => {
imgsPromises.push(deferredAddZip(tmpImg.originalUrl, tmpImg.filename));
});
$.when.apply($, imgsPromises).done(() => {
let tmpTitle = getPageTitle(document.title);
result = {
url: getPageUrl(tmpTitle),
title: tmpTitle,
baseUrl: getCurrentUrl(),
styleFileContent: styleFile,
styleFileName: 'style' + generateRandomNumber() + '.css',
images: extractedImages,
content: tmpGlobalContent
};
sendResponse(result);
}).fail((e) => {
console.log('Error:', e);
sendResponse(null)
});
return true;
});