@adaptabletools/adaptable-plugin-ipushpull 18.0.0-canary.3 → 18.0.0-canary.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable-plugin-ipushpull",
-  "version": "18.0.0-canary.3",
+  "version": "18.0.0-canary.5",
   "description": "",
   "homepage": "http://www.adaptabletools.com/",
   "author": {
@@ -17,8 +17,9 @@
     "rebass": "^3.2.2",
     "redux": "4.0.5",
     "styled-components": "^4.4.1",
+    "tinycolor2": "^1.4.2",
     "tslib": "^2.3.0",
-    "@adaptabletools/adaptable": "18.0.0-canary.3"
+    "@adaptabletools/adaptable": "18.0.0-canary.5"
   },
   "type": "module",
   "module": "src/index.js"

package/src/Utilities/Services/PushPullService.d.ts

@@ -1,4 +1,5 @@
 import { IAdaptable } from '@adaptabletools/adaptable/src/AdaptableInterfaces/IAdaptable';
+import { IPPStyle } from '@adaptabletools/adaptable/src/Utilities/Interface/IPPStyle';
 import { IPushPullService } from './Interface/IPushPullService';
 import { IPushPullDomain } from '@adaptabletools/adaptable/src/PredefinedConfig/SystemState';
 export declare enum ServiceStatus {
@@ -20,4 +21,6 @@ export declare class PushPullService implements IPushPullService {
     unloadPage(page: string): void;
     addNewPage(folderId: number, page: string): Promise<any>;
     pushData(page: string, data: any[]): Promise<void>;
+    getCurrentIPPStyle(): IPPStyle;
+    getDefaultIPPStyle(): IPPStyle;
 }

package/src/Utilities/Services/PushPullService.js

@@ -1,4 +1,5 @@
 import StringExtensions from '@adaptabletools/adaptable/src/Utilities/Extensions/StringExtensions';
+import tinycolor from 'tinycolor2';
 export var ServiceStatus;
 (function (ServiceStatus) {
     ServiceStatus["Unknown"] = "Unknown";
@@ -135,9 +136,7 @@ export class PushPullService {
     pushData(page, data) {
         return new Promise((resolve, reject) => {
             let newData = [];
-            const style = data && data.length > 1
-                ? this.adaptable.getCurrentIPPStyle()
-                : this.adaptable.getDefaultIPPStyle();
+            const style = data && data.length > 1 ? this.getCurrentIPPStyle() : this.getDefaultIPPStyle();
             newData = data.map((row, i) => row.map((cell, y) => {
                 const col = i == 0
                     ? style.Header.Columns.find((x) => x.columnFriendlyName == data[0][y])
@@ -206,4 +205,95 @@ export class PushPullService {
             });
         });
     }
+    getCurrentIPPStyle() {
+        const headerFirstCol = document
+            .querySelectorAll('.ag-header-cell')
+            .item(0);
+        const header = document.querySelector('.ag-header');
+        const headerColStyle = header ? window.getComputedStyle(header, null) : null;
+        const firstRow = document.querySelector('.ag-row-even');
+        const firstRowStyle = firstRow ? window.getComputedStyle(firstRow, null) : null;
+        const secondRow = document.querySelector('.ag-row-odd');
+        const secondRowStyle = secondRow
+            ? window.getComputedStyle(secondRow, null)
+            : {
+                backgroundColor: '#fff',
+            };
+        return {
+            Header: {
+                headerColor: tinycolor(headerColStyle.color).toHexString(),
+                headerBackColor: tinycolor(headerColStyle.backgroundColor).toHexString(),
+                headerFontFamily: headerColStyle.fontFamily,
+                headerFontSize: headerColStyle.fontSize,
+                headerFontStyle: headerColStyle.fontStyle,
+                headerFontWeight: headerColStyle.fontWeight,
+                height: Number(headerColStyle.height.replace('px', '')),
+                Columns: this.adaptable.api.columnApi.getColumns().map((col) => {
+                    const headerColumn = document.querySelector(`.ag-header-cell[col-id='${col.columnId}']`);
+                    const headerColumnStyle = window.getComputedStyle(headerColumn || headerFirstCol, null);
+                    return {
+                        columnFriendlyName: col.friendlyName,
+                        width: Number(headerColumnStyle.width.replace('px', '')),
+                        textAlign: headerColumnStyle.textAlign,
+                    };
+                }),
+            },
+            Row: {
+                color: tinycolor(firstRowStyle.color).toHexString(),
+                backColor: tinycolor(firstRowStyle.backgroundColor).toHexString(),
+                altBackColor: tinycolor(secondRowStyle.backgroundColor).toHexString(),
+                fontFamily: firstRowStyle.fontFamily,
+                fontSize: firstRowStyle.fontSize,
+                fontStyle: firstRowStyle.fontStyle,
+                fontWeight: firstRowStyle.fontWeight,
+                height: Number(firstRowStyle.height.replace('px', '')),
+                Columns: this.adaptable.api.columnApi.getColumns().map((col) => {
+                    const cellElement = document.querySelector(`.ag-cell[col-id='${col.columnId}']`);
+                    const headerColumnStyle = window.getComputedStyle(cellElement || firstRow, null);
+                    return {
+                        columnFriendlyName: col.friendlyName,
+                        width: Number(headerColumnStyle.width.replace('px', '')),
+                        textAlign: headerColumnStyle.textAlign,
+                    };
+                }),
+            },
+        };
+    }
+    getDefaultIPPStyle() {
+        return {
+            Header: {
+                headerColor: '#000000',
+                headerBackColor: '#f5f7f7',
+                headerFontFamily: 'sans-serif',
+                headerFontSize: '12px',
+                headerFontStyle: 'normal',
+                headerFontWeight: '400',
+                height: 65,
+                Columns: this.adaptable.api.columnApi.getColumns().map((col) => {
+                    return {
+                        columnFriendlyName: col.friendlyName,
+                        width: 200,
+                        textAlign: 'start',
+                    };
+                }),
+            },
+            Row: {
+                color: '#000000',
+                backColor: '#ffffff',
+                altBackColor: '#fcfdfe',
+                fontFamily: 'sans-serif',
+                fontSize: '12px',
+                fontStyle: 'normal',
+                fontWeight: '400',
+                height: 30,
+                Columns: this.adaptable.api.columnApi.getColumns().map((col) => {
+                    return {
+                        columnFriendlyName: col.friendlyName,
+                        width: 200,
+                        textAlign: 'start',
+                    };
+                }),
+            },
+        };
+    }
 }