Merge pull request #16 from singerla/feature-modify-table

feat: modify data, row count, col count and size of a pptx table

Author: singerla

src/dev.ts

@@ -6,16 +6,22 @@ const automizer = new Automizer({
 });
 
 const pres = automizer
-  .loadRoot(`RootTemplate.pptx`)
+  .loadRoot(`EmptyTemplate.pptx`)
   .load(`SlideWithTables.pptx`, 'table');
 
-// const data1 = {
-//   body: [
-//     { label: 'item test r1', values: [10, 16, 12] },
-//     { label: 'item test r2', values: [12, 18, 15] },
-//     { label: 'item test r3', values: [14, 12, 11] },
-//   ],
-// };
+const data1 = {
+  body: [
+    { label: 'item test r1', values: ['test1', 10, 16, 12] },
+    { label: 'item test r2', values: ['test2', 12, 18, 15] },
+    { label: 'item test r3', values: ['test3', 14, 12, 11] },
+    // { label: 'item test r4', values: ['test4', 14, 12, 11] },
+    // { label: 'item test r5', values: ['test5', 14, 12, 11] },
+    // { label: 'item test r6', values: ['test6', 999, 12, 11] },
+    // { label: 'item test r6', values: ['test7', 999, 12, 11] },
+    // { label: 'item test r6', values: ['test8', 999, 12, 11] },
+    // { label: 'item test r6', values: ['test9', 999, 12, 11] },
+  ],
+};
 
 const data2 = [
   [10, 16, 12],
@@ -25,7 +31,7 @@ const data2 = [
 
 pres
   .addSlide('table', 1, (slide) => {
-    slide.modifyElement('TableWithHeader', [modify.setTableData(data2)]);
+    slide.modifyElement('TableWithHeader', [modify.setTableData(data1)]);
   })
   .write(`modify-table.test.pptx`)
 

src/helper/modify-table-helper.ts

@@ -1,14 +1,21 @@
 import { XmlHelper } from './xml-helper';
 import { TableData } from '../types/table-types';
+import { ModifyTable } from '../modify/modify-table';
 
 export default class ModifyTableHelper {
   /**
    * @TODO: Set table data of modify table helper
    */
   static setTableData = (data: TableData) => (
-    element: XMLDocument | Document | Element,
+    element: Element,
   ): void => {
-    console.log(data);
-    XmlHelper.dump(element);
+    const modTable = new ModifyTable(element, data);
+
+    modTable
+      .modify()
+      .adjustHeight();
+      
+    // console.log(data);
+    // XmlHelper.dump(element);
   };
 }

src/helper/modify-xml-helper.ts

@@ -5,9 +5,9 @@ import { GeneralHelper } from './general-helper';
 import { XmlHelper } from './xml-helper';
 
 export default class ModifyXmlHelper {
-  root: XMLDocument;
+  root: XMLDocument | Element;
 
-  constructor(root: XMLDocument) {
+  constructor(root: XMLDocument | Element) {
     this.root = root;
   }
 
@@ -40,7 +40,7 @@ export default class ModifyXmlHelper {
     }
   }
 
-  static text = (label: string) => (element: Element): void => {
+  static text = (label: number | string) => (element: Element): void => {
     element.firstChild.textContent = String(label);
   };
 

src/index.ts

@@ -19,7 +19,13 @@ const setChartData = ModifyChartHelper.setChartData;
 const setChartVerticalLines = ModifyChartHelper.setChartVerticalLines;
 const setChartBubbles = ModifyChartHelper.setChartBubbles;
 
-export { Automizer, ModifyHelper, ModifyShapeHelper, ModifyTableHelper, ModifyChartHelper }
+export {
+  Automizer,
+  ModifyHelper,
+  ModifyShapeHelper,
+  ModifyTableHelper,
+  ModifyChartHelper,
+};
 
 export const modify = {
   dump,

src/modify/modify-table.ts

@@ -0,0 +1,104 @@
+
+import { XmlHelper } from '../helper/xml-helper';
+import ModifyXmlHelper from '../helper/modify-xml-helper';
+import { TableData, TableRow } from '../types/table-types';
+import { Modification, ModificationTags } from '../types/modify-types';
+
+export class ModifyTable {
+  data: TableData;
+  table: ModifyXmlHelper;
+  xml: Element;
+
+  constructor(
+    table: Element,
+    data: TableData,
+  ) {
+    this.data = data;
+
+    this.table = new ModifyXmlHelper(table);
+    this.xml = table;
+  }
+
+  modify(): ModifyTable {
+    this.setContents()
+    this.sliceRows()
+
+    return this
+  }
+
+  setContents() {
+    this.data.body.forEach((row: TableRow, r: number) => {
+      row.values.forEach((cell: number | string, c: number) => {
+        this.table.modify(
+          this.row(r, 
+            this.column(c, 
+              this.cell(cell)
+            )
+          )
+        )
+      })
+    })
+  }
+
+  sliceRows() {
+    this.table.modify({
+      'a:tbl': this.slice('a:tr', this.data.body.length)
+    })
+  }
+
+  row = (index: number, children: ModificationTags): ModificationTags => {
+    return {
+      'a:tr': {
+        index: index,
+        children: children
+      }
+    }
+  }
+
+  column = (index: number, children: ModificationTags): ModificationTags => {
+    return {
+      'a:tc': {
+        index: index,
+        children: children
+      }
+    }
+  }
+
+  cell = (value: number | string): ModificationTags => {
+    return {
+      'a:t': {
+        modify: ModifyXmlHelper.text(value),
+      }
+    }
+  }
+
+  slice(tag: string, length: number): Modification {
+    return {
+      children: {
+        [tag]: {
+          collection: (collection: HTMLCollectionOf<Element>) => {
+            XmlHelper.sliceCollection(collection, length);
+          },
+        },
+      },
+    };
+  }
+  
+  adjustHeight() {
+    const tableHeight = Number(this.xml
+      .getElementsByTagName('p:xfrm')[0]
+      .getElementsByTagName('a:ext')[0]
+      .getAttribute('cy'))
+
+    const rowHeight = tableHeight / this.data.body.length
+
+    this.data.body.forEach((row: TableRow, r: number) => {
+      this.table.modify({
+        'a:tr': {
+          index: r,
+          modify: ModifyXmlHelper.attribute('h', Math.round(rowHeight)),
+        }
+      })
+    })
+  }
+}

src/types/table-types.ts

@@ -1,15 +1,12 @@
-export type TableCell = {
-  value: number | string;
-};
+
 
 export type TableRow = {
-  label: string;
-  values: TableCell['value'][] | TableCell[];
+  label?: string;
+  values: (string | number)[];
 };
 
 export type TableData = {
   header?: TableRow | TableRow[];
   body?: TableRow[];
   footer?: TableRow | TableRow[];
-  [index: number]: TableRow['values'];
 };

src/types/types.ts

@@ -3,7 +3,7 @@ import { ElementType } from '../enums/element-type';
 
 export type SlideModificationCallback = (document: Document) => void;
 export type ShapeModificationCallback = (
-  XMLDocument: XMLDocument,
+  XMLDocument: XMLDocument | Element,
   arg1?: Document,
   arg2?: Workbook,
 ) => void;