fix(rendering and logging): remove extensive console chattiness, remove content memory leak when rerendering
This commit is contained in:
parent
dbca81987c
commit
db9b53462d
@ -1,5 +1,10 @@
|
|||||||
# Changelog
|
# Changelog
|
||||||
|
|
||||||
|
## 2024-12-07 - 1.6.8 - fix(rendering and logging)
|
||||||
|
Removed debug logging from document rendering process.
|
||||||
|
|
||||||
|
- Removed console logs from content invoice, document rendering, page scaling, and overflow checking.
|
||||||
|
|
||||||
## 2024-12-07 - 1.6.7 - fix(document rendering)
|
## 2024-12-07 - 1.6.7 - fix(document rendering)
|
||||||
Fixed overflow issues in document and page elements
|
Fixed overflow issues in document and page elements
|
||||||
|
|
||||||
|
@ -3,6 +3,6 @@
|
|||||||
*/
|
*/
|
||||||
export const commitinfo = {
|
export const commitinfo = {
|
||||||
name: '@design.estate/dees-document',
|
name: '@design.estate/dees-document',
|
||||||
version: '1.6.7',
|
version: '1.6.8',
|
||||||
description: 'A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.'
|
description: 'A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.'
|
||||||
}
|
}
|
||||||
|
@ -3,6 +3,6 @@
|
|||||||
*/
|
*/
|
||||||
export const commitinfo = {
|
export const commitinfo = {
|
||||||
name: '@design.estate/dees-document',
|
name: '@design.estate/dees-document',
|
||||||
version: '1.6.7',
|
version: '1.6.8',
|
||||||
description: 'A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.'
|
description: 'A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.'
|
||||||
}
|
}
|
||||||
|
@ -175,7 +175,6 @@ export class DeContentInvoice extends DeesElement {
|
|||||||
(await this.getContentNodes()).trimmedContent.append(
|
(await this.getContentNodes()).trimmedContent.append(
|
||||||
(await this.getContentNodes()).currentContent.children.item(0)
|
(await this.getContentNodes()).currentContent.children.item(0)
|
||||||
);
|
);
|
||||||
console.log('hey' + this.shadowRoot.children.length);
|
|
||||||
}
|
}
|
||||||
if (
|
if (
|
||||||
(await this.getContentNodes()).currentContent.children
|
(await this.getContentNodes()).currentContent.children
|
||||||
@ -396,7 +395,6 @@ ${this.letterData.content.invoiceData.id}
|
|||||||
EPC QR Code`,
|
EPC QR Code`,
|
||||||
(error) => {
|
(error) => {
|
||||||
if (error) console.error(error);
|
if (error) console.error(error);
|
||||||
console.log('success!');
|
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
contentNodes.currentContent.querySelector('.paymentCode').append(canvas);
|
contentNodes.currentContent.querySelector('.paymentCode').append(canvas);
|
||||||
|
@ -161,6 +161,7 @@ export class DeDocument extends DeesElement {
|
|||||||
|
|
||||||
public latestDocumentSettings: plugins.shared.interfaces.IDocumentSettings = null;
|
public latestDocumentSettings: plugins.shared.interfaces.IDocumentSettings = null;
|
||||||
public latestRenderedLetterData: plugins.tsclass.business.ILetter = null;
|
public latestRenderedLetterData: plugins.tsclass.business.ILetter = null;
|
||||||
|
public cleanupStore: any[] = [];
|
||||||
|
|
||||||
|
|
||||||
public async renderDocument() {
|
public async renderDocument() {
|
||||||
@ -168,11 +169,12 @@ export class DeDocument extends DeesElement {
|
|||||||
this.latestDocumentSettings = this.documentSettings;
|
this.latestDocumentSettings = this.documentSettings;
|
||||||
this.latestRenderedLetterData = this.letterData;
|
this.latestRenderedLetterData = this.letterData;
|
||||||
|
|
||||||
console.log(`rendering with settings:`);
|
const cleanUpStoreCurrentRender = [];
|
||||||
console.log(this.latestDocumentSettings);
|
const cleanUpStoreNextRender = [];
|
||||||
|
|
||||||
const domtools = await this.domtoolsPromise;
|
const domtools = await this.domtoolsPromise;
|
||||||
const documentBuildContainer = document.createElement('div');
|
const documentBuildContainer = document.createElement('div');
|
||||||
|
cleanUpStoreCurrentRender.push(documentBuildContainer);
|
||||||
document.body.appendChild(documentBuildContainer);
|
document.body.appendChild(documentBuildContainer);
|
||||||
|
|
||||||
let pages: DePage[] = [];
|
let pages: DePage[] = [];
|
||||||
@ -181,6 +183,7 @@ export class DeDocument extends DeesElement {
|
|||||||
|
|
||||||
// lets append the content
|
// lets append the content
|
||||||
const content: DeContentInvoice = new DeContentInvoice();
|
const content: DeContentInvoice = new DeContentInvoice();
|
||||||
|
cleanUpStoreCurrentRender.push(content);
|
||||||
content.letterData = this.letterData;
|
content.letterData = this.letterData;
|
||||||
content.documentSettings = this.documentSettings;
|
content.documentSettings = this.documentSettings;
|
||||||
document.body.appendChild(content);
|
document.body.appendChild(content);
|
||||||
@ -192,6 +195,7 @@ export class DeDocument extends DeesElement {
|
|||||||
while (!complete) {
|
while (!complete) {
|
||||||
pageCounter++;
|
pageCounter++;
|
||||||
const currentContent = content.cloneNode(true) as DeContentInvoice;
|
const currentContent = content.cloneNode(true) as DeContentInvoice;
|
||||||
|
cleanUpStoreNextRender.push(currentContent);
|
||||||
const newPage = new DePage();
|
const newPage = new DePage();
|
||||||
newPage.printMode = this.printMode;
|
newPage.printMode = this.printMode;
|
||||||
newPage.letterData = this.letterData;
|
newPage.letterData = this.letterData;
|
||||||
@ -200,6 +204,9 @@ export class DeDocument extends DeesElement {
|
|||||||
newPage.pageNumber = pageCounter;
|
newPage.pageNumber = pageCounter;
|
||||||
newPage.append(currentContent);
|
newPage.append(currentContent);
|
||||||
newPage.pageTotalNumber = pageCounter;
|
newPage.pageTotalNumber = pageCounter;
|
||||||
|
|
||||||
|
// store current page
|
||||||
|
cleanUpStoreNextRender.push(newPage);
|
||||||
documentBuildContainer.append(newPage);
|
documentBuildContainer.append(newPage);
|
||||||
|
|
||||||
await currentContent.elementDomReady;
|
await currentContent.elementDomReady;
|
||||||
@ -216,16 +223,24 @@ export class DeDocument extends DeesElement {
|
|||||||
if (trimmed === 0) {
|
if (trimmed === 0) {
|
||||||
complete = true;
|
complete = true;
|
||||||
}
|
}
|
||||||
// complete = true;
|
|
||||||
console.log(currentContentOffset);
|
|
||||||
}
|
}
|
||||||
document.body.removeChild(content);
|
|
||||||
document.body.removeChild(documentBuildContainer);
|
for (const cleanUp of this.cleanupStore) {
|
||||||
|
cleanUp.remove();
|
||||||
|
}
|
||||||
|
this.cleanupStore = cleanUpStoreNextRender
|
||||||
|
|
||||||
|
cleanUpStoreCurrentRender.forEach((cleanUp) => {
|
||||||
|
cleanUp.remove();
|
||||||
|
});
|
||||||
|
|
||||||
const documentContainer = this.shadowRoot.querySelector('.documentContainer');
|
const documentContainer = this.shadowRoot.querySelector('.documentContainer');
|
||||||
if (documentContainer) {
|
if (documentContainer) {
|
||||||
const children = Array.from(documentContainer.children);
|
const children = Array.from(documentContainer.children);
|
||||||
children.forEach((child) => documentContainer.removeChild(child));
|
children.forEach((child) => {
|
||||||
|
documentContainer.removeChild(child);
|
||||||
|
child.remove();
|
||||||
|
});
|
||||||
}
|
}
|
||||||
for (const page of pages) {
|
for (const page of pages) {
|
||||||
page.pageTotalNumber = pageCounter;
|
page.pageTotalNumber = pageCounter;
|
||||||
@ -269,7 +284,6 @@ export class DeDocument extends DeesElement {
|
|||||||
}
|
}
|
||||||
if (this.viewWidth) {
|
if (this.viewWidth) {
|
||||||
page.viewWidth = this.viewWidth;
|
page.viewWidth = this.viewWidth;
|
||||||
console.log('setting viewWidth: ', this.viewWidth);
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -196,7 +196,6 @@ export class DePage extends DeesElement {
|
|||||||
}
|
}
|
||||||
|
|
||||||
private adjustScaling() {
|
private adjustScaling() {
|
||||||
console.log('page scale adjustment triggered.');
|
|
||||||
const scaleWrapper: HTMLDivElement = this.shadowRoot.querySelector('#scaleWrapper');
|
const scaleWrapper: HTMLDivElement = this.shadowRoot.querySelector('#scaleWrapper');
|
||||||
|
|
||||||
if (!scaleWrapper) return;
|
if (!scaleWrapper) return;
|
||||||
@ -207,7 +206,6 @@ export class DePage extends DeesElement {
|
|||||||
} else if (this.viewWidth) {
|
} else if (this.viewWidth) {
|
||||||
scale = this.viewWidth / plugins.shared.a4Width;
|
scale = this.viewWidth / plugins.shared.a4Width;
|
||||||
}
|
}
|
||||||
console.log(`new scale is ${scale}`);
|
|
||||||
scaleWrapper.style.transform = `scale(${scale})`;
|
scaleWrapper.style.transform = `scale(${scale})`;
|
||||||
|
|
||||||
// Adjust the outer dimensions so they match the scaled content
|
// Adjust the outer dimensions so they match the scaled content
|
||||||
|
@ -138,10 +138,8 @@ export class DePageContent extends DeesElement {
|
|||||||
await this.elementDomReady;
|
await this.elementDomReady;
|
||||||
const contentContainer = this.shadowRoot.querySelector('.content');
|
const contentContainer = this.shadowRoot.querySelector('.content');
|
||||||
if (contentContainer.scrollHeight > contentContainer.clientHeight) {
|
if (contentContainer.scrollHeight > contentContainer.clientHeight) {
|
||||||
console.log('overflows');
|
|
||||||
return true;
|
return true;
|
||||||
} else {
|
} else {
|
||||||
console.log('does not overflow!');
|
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user