feature(slide): Remove existing charts, images or shapes from added slide

Author: singerla

README.md

@@ -114,6 +114,17 @@ pres.addSlide('charts', 2, (slide) => {
   ])
 })
 
+// Remove existing charts, images or shapes from added slide.
+pres
+  .addSlide('charts', 2, (slide) => {
+    slide.removeElement('ColumnChart');
+})
+  .addSlide('images', 2, (slide) => {
+    slide.removeElement('imageJPG');
+    slide.removeElement('Textfeld 5');
+    slide.addElement('images', 2, 'imageJPG');
+})
+
 // Finally, we want to write the output file.
 pres.write(`myPresentation.pptx`).then(summary => {
   console.log(summary)

__tests__/remove-existing-elements.test.ts

@@ -0,0 +1,26 @@
+import Automizer from '../src/automizer';
+
+test('create presentation, add slides, remove elements and add one.', async () => {
+  const automizer = new Automizer({
+    templateDir: `${__dirname}/pptx-templates`,
+    outputDir: `${__dirname}/pptx-output`,
+  });
+
+  const pres = automizer
+    .loadRoot(`RootTemplate.pptx`)
+    .load(`SlideWithCharts.pptx`, 'charts')
+    .load(`SlideWithImages.pptx`, 'images');
+
+  const result = await pres
+    .addSlide('charts', 2, (slide) => {
+      slide.removeElement('ColumnChart');
+    })
+    .addSlide('images', 2, (slide) => {
+      slide.removeElement('imageJPG');
+      slide.removeElement('Textfeld 5');
+      slide.addElement('images', 2, 'imageJPG');
+    })
+    .write(`remove-existing-elements.test.pptx`);
+
+  expect(result.slides).toBe(3);
+});

src/classes/shape.ts

@@ -94,9 +94,20 @@ export class Shape {
   }
 
   async replaceIntoSlideTree(): Promise<void> {
+    await this.modifySlideTree(true);
+  }
+
+  async removeFromSlideTree(): Promise<void> {
+    await this.modifySlideTree(false);
+  }
+
+  async modifySlideTree(insertBefore?: boolean): Promise<void> {
+    const archive = this.targetArchive;
+    const slideFile = this.targetSlideFile;
+
     const targetSlideXml = await XmlHelper.getXmlFromArchive(
-      this.targetArchive,
-      this.targetSlideFile,
+      archive,
+      slideFile,
     );
 
     const findMethod = this.hasCreationId ? 'findByCreationId' : 'findByName';
@@ -106,19 +117,18 @@ export class Shape {
       this.name,
     );
 
-    sourceElementOnTargetSlide.parentNode.insertBefore(
-      this.targetElement,
-      sourceElementOnTargetSlide,
-    );
+    if (insertBefore === true) {
+      sourceElementOnTargetSlide.parentNode.insertBefore(
+        this.targetElement,
+        sourceElementOnTargetSlide,
+      );
+    }
+
     sourceElementOnTargetSlide.parentNode.removeChild(
       sourceElementOnTargetSlide,
     );
 
-    await XmlHelper.writeXmlToArchive(
-      this.targetArchive,
-      this.targetSlideFile,
-      targetSlideXml,
-    );
+    await XmlHelper.writeXmlToArchive(archive, slideFile, targetSlideXml);
   }
 
   async updateElementsRelId(): Promise<void> {

src/classes/slide.ts

@@ -266,6 +266,26 @@ export class Slide implements ISlide {
     );
   }
 
+  /**
+   * Remove a single element from slide.
+   * @param {string} presName - Filename or alias name of the template presentation.
+   * Must have been importet with Automizer.load().
+   * @param {number} slideNumber - Slide number within the specified template to search for the required element.
+   * @param {ShapeModificationCallback | ShapeModificationCallback[]} callback - One or more callback functions to apply.
+   * Depending on the shape type (e.g. chart or table), different arguments will be passed to the callback.
+   */
+  removeElement(selector: string): this {
+    const presName = this.sourceTemplate.name;
+    const slideNumber = this.sourceNumber;
+
+    return this.addElementToModificationsList(
+      presName,
+      slideNumber,
+      selector,
+      'remove',
+    );
+  }
+
   /**
    * Adds element to modifications list
    * @internal

src/dev.ts

@@ -9,15 +9,20 @@ const automizer = new Automizer({
 
 const run = async () => {
   const pres = automizer
-    .loadRoot(`bug/RootTemplate.pptx`)
-    .load(`bug/Slides.pptx`, 'slides')
-    .load(`bug/Library - Icons.pptx`, 'image');
+    .loadRoot(`RootTemplate.pptx`)
+    .load(`SlideWithCharts.pptx`, 'charts')
+    .load(`SlideWithImages.pptx`, 'images');
 
   const result = await pres
-    .addSlide('slides', 6, (slide) => {
-      slide.addElement('image', 1, 'Tschechien');
+    .addSlide('charts', 2, (slide) => {
+      slide.removeElement('ColumnChart');
     })
-    .write(`add-image-bug.test.pptx`);
+    .addSlide('images', 2, (slide) => {
+      slide.removeElement('imageJPG');
+      slide.removeElement('Textfeld 5');
+      slide.addElement('images', 2, 'imageJPG');
+    })
+    .write(`remove-element.test.pptx`);
 };
 
 run().catch((error) => {

src/shapes/chart.ts

@@ -65,6 +65,16 @@ export class Chart extends Shape implements IChart {
     return this;
   }
 
+  async remove(
+    targetTemplate: RootPresTemplate,
+    targetSlideNumber: number,
+  ): Promise<Chart> {
+    await this.prepare(targetTemplate, targetSlideNumber);
+    await this.removeFromSlideTree();
+
+    return this;
+  }
+
   async modifyOnAddedSlide(
     targetTemplate: RootPresTemplate,
     targetSlideNumber: number,

src/shapes/generic.ts

@@ -27,6 +27,16 @@ export class GenericShape extends Shape {
     return this;
   }
 
+  async remove(
+    targetTemplate: RootPresTemplate,
+    targetSlideNumber: number,
+  ): Promise<GenericShape> {
+    await this.prepare(targetTemplate, targetSlideNumber);
+    await this.removeFromSlideTree();
+
+    return this;
+  }
+
   async prepare(
     targetTemplate: RootPresTemplate,
     targetSlideNumber: number,

src/shapes/image.ts

@@ -84,6 +84,16 @@ export class Image extends Shape implements IImage {
     return this;
   }
 
+  async remove(
+    targetTemplate: RootPresTemplate,
+    targetSlideNumber: number,
+  ): Promise<Image> {
+    await this.prepare(targetTemplate, targetSlideNumber);
+    await this.removeFromSlideTree();
+
+    return this;
+  }
+
   async prepare(
     targetTemplate: RootPresTemplate,
     targetSlideNumber: number,