feat:Setup Prettier for code formatting
This commit is contained in:
NanditaPatil-dotcom
@@ -4,37 +4,39 @@ import { readFileAsArrayBuffer } from '../utils/helpers.js';
|
||||
import { state } from '../state.js';
|
||||
|
||||
export async function wordToPdf() {
|
||||
const file = state.files[0];
|
||||
if (!file) {
|
||||
showAlert('No File', 'Please upload a .docx file first.');
|
||||
return;
|
||||
}
|
||||
const file = state.files[0];
|
||||
if (!file) {
|
||||
showAlert('No File', 'Please upload a .docx file first.');
|
||||
return;
|
||||
}
|
||||
|
||||
showLoader('Preparing preview...');
|
||||
|
||||
try {
|
||||
showLoader('Preparing preview...');
|
||||
|
||||
const mammothOptions = {
|
||||
// @ts-expect-error TS(2304) FIXME: Cannot find name 'mammoth'.
|
||||
convertImage: mammoth.images.inline((element: any) => {
|
||||
return element.read("base64").then((imageBuffer: any) => {
|
||||
return {
|
||||
src: `data:${element.contentType};base64,${imageBuffer}`
|
||||
};
|
||||
});
|
||||
})
|
||||
};
|
||||
const arrayBuffer = await readFileAsArrayBuffer(file);
|
||||
// @ts-expect-error TS(2304) FIXME: Cannot find name 'mammoth'.
|
||||
const { value: html } = await mammoth.convertToHtml({ arrayBuffer }, mammothOptions);
|
||||
|
||||
// Get references to our modal elements from index.html
|
||||
const previewModal = document.getElementById('preview-modal');
|
||||
const previewContent = document.getElementById('preview-content');
|
||||
const downloadBtn = document.getElementById('preview-download-btn');
|
||||
const closeBtn = document.getElementById('preview-close-btn');
|
||||
try {
|
||||
const mammothOptions = {
|
||||
// @ts-expect-error TS(2304) FIXME: Cannot find name 'mammoth'.
|
||||
convertImage: mammoth.images.inline((element: any) => {
|
||||
return element.read('base64').then((imageBuffer: any) => {
|
||||
return {
|
||||
src: `data:${element.contentType};base64,${imageBuffer}`,
|
||||
};
|
||||
});
|
||||
}),
|
||||
};
|
||||
const arrayBuffer = await readFileAsArrayBuffer(file);
|
||||
// @ts-expect-error TS(2304) FIXME: Cannot find name 'mammoth'.
|
||||
const { value: html } = await mammoth.convertToHtml(
|
||||
{ arrayBuffer },
|
||||
mammothOptions
|
||||
);
|
||||
|
||||
const styledHtml = `
|
||||
// Get references to our modal elements from index.html
|
||||
const previewModal = document.getElementById('preview-modal');
|
||||
const previewContent = document.getElementById('preview-content');
|
||||
const downloadBtn = document.getElementById('preview-download-btn');
|
||||
const closeBtn = document.getElementById('preview-close-btn');
|
||||
|
||||
const styledHtml = `
|
||||
<style>
|
||||
#preview-content { font-family: 'Times New Roman', Times, serif; font-size: 12pt; line-height: 1.5; color: black; }
|
||||
#preview-content table { border-collapse: collapse; width: 100%; }
|
||||
@@ -44,88 +46,95 @@ export async function wordToPdf() {
|
||||
</style>
|
||||
${html}
|
||||
`;
|
||||
previewContent.innerHTML = styledHtml;
|
||||
|
||||
const marginDiv = document.createElement('div');
|
||||
marginDiv.style.height = '100px';
|
||||
previewContent.appendChild(marginDiv);
|
||||
previewContent.innerHTML = styledHtml;
|
||||
|
||||
const images = previewContent.querySelectorAll('img');
|
||||
const imagePromises = Array.from(images).map(img => {
|
||||
return new Promise((resolve) => {
|
||||
// @ts-expect-error TS(2794) FIXME: Expected 1 arguments, but got 0. Did you forget to... Remove this comment to see the full error message
|
||||
if (img.complete) resolve();
|
||||
else img.onload = resolve;
|
||||
});
|
||||
});
|
||||
await Promise.all(imagePromises);
|
||||
|
||||
const marginDiv = document.createElement('div');
|
||||
marginDiv.style.height = '100px';
|
||||
previewContent.appendChild(marginDiv);
|
||||
|
||||
previewModal.classList.remove('hidden');
|
||||
hideLoader();
|
||||
const images = previewContent.querySelectorAll('img');
|
||||
const imagePromises = Array.from(images).map((img) => {
|
||||
return new Promise((resolve) => {
|
||||
// @ts-expect-error TS(2794) FIXME: Expected 1 arguments, but got 0. Did you forget to... Remove this comment to see the full error message
|
||||
if (img.complete) resolve();
|
||||
else img.onload = resolve;
|
||||
});
|
||||
});
|
||||
await Promise.all(imagePromises);
|
||||
|
||||
const downloadHandler = async () => {
|
||||
showLoader('Generating High-Quality PDF...');
|
||||
|
||||
// @ts-expect-error TS(2339) FIXME: Property 'jspdf' does not exist on type 'Window & ... Remove this comment to see the full error message
|
||||
const { jsPDF } = window.jspdf;
|
||||
const doc = new jsPDF({
|
||||
orientation: 'p',
|
||||
unit: 'pt',
|
||||
format: 'letter'
|
||||
});
|
||||
previewModal.classList.remove('hidden');
|
||||
hideLoader();
|
||||
|
||||
await doc.html(previewContent, {
|
||||
callback: function (doc: any) {
|
||||
const links = previewContent.querySelectorAll('a');
|
||||
const pageHeight = doc.internal.pageSize.getHeight();
|
||||
const containerRect = previewContent.getBoundingClientRect(); // Get container's position
|
||||
const downloadHandler = async () => {
|
||||
showLoader('Generating High-Quality PDF...');
|
||||
|
||||
links.forEach(link => {
|
||||
if (!link.href) return;
|
||||
|
||||
const linkRect = link.getBoundingClientRect();
|
||||
|
||||
// Calculate position relative to the preview container's top-left
|
||||
const relativeX = linkRect.left - containerRect.left;
|
||||
const relativeY = linkRect.top - containerRect.top;
|
||||
// @ts-expect-error TS(2339) FIXME: Property 'jspdf' does not exist on type 'Window & ... Remove this comment to see the full error message
|
||||
const { jsPDF } = window.jspdf;
|
||||
const doc = new jsPDF({
|
||||
orientation: 'p',
|
||||
unit: 'pt',
|
||||
format: 'letter',
|
||||
});
|
||||
|
||||
const pageNum = Math.floor(relativeY / pageHeight) + 1;
|
||||
const yOnPage = relativeY % pageHeight;
|
||||
await doc.html(previewContent, {
|
||||
callback: function (doc: any) {
|
||||
const links = previewContent.querySelectorAll('a');
|
||||
const pageHeight = doc.internal.pageSize.getHeight();
|
||||
const containerRect = previewContent.getBoundingClientRect(); // Get container's position
|
||||
|
||||
doc.setPage(pageNum);
|
||||
try {
|
||||
doc.link(relativeX + 45, yOnPage + 45, linkRect.width, linkRect.height, { url: link.href });
|
||||
} catch (e) {
|
||||
console.warn("Could not add link:", link.href, e);
|
||||
}
|
||||
});
|
||||
links.forEach((link) => {
|
||||
if (!link.href) return;
|
||||
|
||||
const outputFileName = `${file.name.replace(/\.[^/.]+$/, "")}.pdf`;
|
||||
doc.save(outputFileName);
|
||||
hideLoader();
|
||||
},
|
||||
autoPaging: 'slice',
|
||||
x: 45,
|
||||
y: 45,
|
||||
width: 522,
|
||||
windowWidth: previewContent.scrollWidth
|
||||
});
|
||||
};
|
||||
const linkRect = link.getBoundingClientRect();
|
||||
|
||||
const closeHandler = () => {
|
||||
previewModal.classList.add('hidden');
|
||||
previewContent.innerHTML = '';
|
||||
downloadBtn.removeEventListener('click', downloadHandler);
|
||||
closeBtn.removeEventListener('click', closeHandler);
|
||||
};
|
||||
// Calculate position relative to the preview container's top-left
|
||||
const relativeX = linkRect.left - containerRect.left;
|
||||
const relativeY = linkRect.top - containerRect.top;
|
||||
|
||||
downloadBtn.addEventListener('click', downloadHandler);
|
||||
closeBtn.addEventListener('click', closeHandler);
|
||||
const pageNum = Math.floor(relativeY / pageHeight) + 1;
|
||||
const yOnPage = relativeY % pageHeight;
|
||||
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
hideLoader();
|
||||
showAlert('Preview Error', `Could not generate a preview. The file may be corrupt or contain unsupported features. Error: ${e.message}`);
|
||||
}
|
||||
}
|
||||
doc.setPage(pageNum);
|
||||
try {
|
||||
doc.link(
|
||||
relativeX + 45,
|
||||
yOnPage + 45,
|
||||
linkRect.width,
|
||||
linkRect.height,
|
||||
{ url: link.href }
|
||||
);
|
||||
} catch (e) {
|
||||
console.warn('Could not add link:', link.href, e);
|
||||
}
|
||||
});
|
||||
|
||||
const outputFileName = `${file.name.replace(/\.[^/.]+$/, '')}.pdf`;
|
||||
doc.save(outputFileName);
|
||||
hideLoader();
|
||||
},
|
||||
autoPaging: 'slice',
|
||||
x: 45,
|
||||
y: 45,
|
||||
width: 522,
|
||||
windowWidth: previewContent.scrollWidth,
|
||||
});
|
||||
};
|
||||
|
||||
const closeHandler = () => {
|
||||
previewModal.classList.add('hidden');
|
||||
previewContent.innerHTML = '';
|
||||
downloadBtn.removeEventListener('click', downloadHandler);
|
||||
closeBtn.removeEventListener('click', closeHandler);
|
||||
};
|
||||
|
||||
downloadBtn.addEventListener('click', downloadHandler);
|
||||
closeBtn.addEventListener('click', closeHandler);
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
hideLoader();
|
||||
showAlert(
|
||||
'Preview Error',
|
||||
`Could not generate a preview. The file may be corrupt or contain unsupported features. Error: ${e.message}`
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user