Fixed parameters folder

index.js

 import core from './src/core';
-import './src/PDFEngine.css';
+// import './src/PDFEngine.css';
 
-(() =>
+// (() =>
+// {    
+//     core();
+// })()
+
+
+const PDFEngine = () =>
 {    
     core();
-})()
+}
+
+export default PDFEngine;

package-lock.json

         "supports-color": "^8.0.0"
       }
     },
+    "jquery": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.6.0.tgz",
+      "integrity": "sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw==",
+      "dev": true
+    },
     "json-parse-better-errors": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz",
         "p-locate": "^4.1.0"
       }
     },
+    "lodash": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
+      "dev": true
+    },
     "lru-cache": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
       "dev": true
     },
     "nanoid": {
-      "version": "3.1.28",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.28.tgz",
-      "integrity": "sha512-gSu9VZ2HtmoKYe/lmyPFES5nknFrHa+/DT9muUFWFMi6Jh9E1I7bkvlQ8xxf1Kos9pi9o8lBnIOkatMhKX/YUw==",
+      "version": "3.1.29",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.29.tgz",
+      "integrity": "sha512-dW2pUSGZ8ZnCFIlBIA31SV8huOGCHb6OwzVCc7A69rb/a+SgPBwfmLvK5TKQ3INPbRkcI8a/Owo0XbiTNH19wg==",
       "dev": true
     },
     "neo-async": {
       "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
       "dev": true
     },
+    "picocolors": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz",
+      "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==",
+      "dev": true
+    },
     "pkg-dir": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz",
       }
     },
     "postcss": {
-      "version": "8.3.8",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.8.tgz",
-      "integrity": "sha512-GT5bTjjZnwDifajzczOC+r3FI3Cu+PgPvrsjhQdRqa2kTJ4968/X9CUce9xttIB0xOs5c6xf0TCWZo/y9lF6bA==",
+      "version": "8.3.9",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.9.tgz",
+      "integrity": "sha512-f/ZFyAKh9Dnqytx5X62jgjhhzttjZS7hMsohcI7HEI5tjELX/HxCy3EFhsRxyzGvrzFF+82XPvCS8T9TFleVJw==",
       "dev": true,
       "requires": {
-        "nanocolors": "^0.2.2",
-        "nanoid": "^3.1.25",
+        "nanoid": "^3.1.28",
+        "picocolors": "^0.2.1",
         "source-map-js": "^0.6.2"
-      },
-      "dependencies": {
-        "nanocolors": {
-          "version": "0.2.12",
-          "resolved": "https://registry.npmjs.org/nanocolors/-/nanocolors-0.2.12.tgz",
-          "integrity": "sha512-SFNdALvzW+rVlzqexid6epYdt8H9Zol7xDoQarioEFcFN0JHo4CYNztAxmtfgGTVRCmFlEOqqhBpoFGKqSAMug==",
-          "dev": true
-        }
       }
     },
     "postcss-modules-extract-imports": {

package.json

   "license": "ISC",
   "devDependencies": {
     "css-loader": "^6.3.0",
+    "jquery": "^3.6.0",
+    "lodash": "^4.17.21",
     "style-loader": "^3.3.0",
     "webpack": "^5.55.0",
     "webpack-cli": "^4.8.0"
   },
-  "dependencies": {
-    "jquery": "^3.6.0"
-  }
+  "dependencies": {}
 }

src/PDFEngine.css

     {
         display: none;
     }
-    h4{
-        color:purple;
-    }
+    
  }

src/core.js

 import {TransformsFactory} from "./transforms-factory";
-import {HideTransform} from './transformations/hide-transform';
+import { HideParam } from "./parameters/hide-parameter";
+import parameters from "./parameters/parameters";
 
 function core(){
 
     // scrape parametara
-    const param1 = {
-        code: "br-hide",
-        selector: "table"
-    };
-    const param2 = {
-        code: "br-color",
-        selector: "h4"
-    };
-    const param3 = {
-        code: "br-size", // br-size-100 br-size-50 ...
-        selector: "table",
-        size: ""
-    };
-
-    const parametars = [param1];
+    
+    const parametars = parameters();
+    // Izvlacenje targets iz DOM strane
     // for(let i = 0; i < parametars.length; i++){
     //     const param = parametars[i];
     //     param.targets = $(param.code);
     // }
 
     // atribute parameters
-    // 2 atributa:  (za vise naknadno istraziti)
-    //  code
-    //  selector
-    const elementsByAttrs = [];
+    // 1 atribut:  
+    //  code = '    '
+
     // css class parameters
 
     // inicijalizacija transformacija
             const transform = transformFactory.produce(param.code, param.selector);
             transforms.push(transform);
         });
-    // const hideT = new HideTransform("table");
-    // const hideT = new HideTransform("table");
-    // const hideT1 = new HideTransform("table1");
-    // const hideT2 = new HideTransform("table1");
-    // const hideT3 = new HideTransform("table1");
 
     // perform transform
     //const transforms = [hideT]; //, hideT1, hideT2, hideT3];

src/parameters/border-color-parameter.js

+import { Param } from "./parameter";
+export class BorderColorParam extends Param 
+{
+    constructor(){
+        super();
+        this.code = "br-bordercolor";
+        this.selectors = ["table","div"];
+    }
+}
+

src/parameters/color-parameter.js

+import { Param } from "./parameter";
+
+export class ColorParam extends Param {
+    constructor() {
+        super();
+        this.code = "br-color",
+        this.selectors = ["h1", "h4", "p"];
+    }
+}

src/parameters/hide-parameter.js

+import { Param } from "./parameter";
+export class HideParam extends Param 
+{
+    constructor(){
+        super();
+        this.code = "br-hide";
+        this.selectors = ["table","p","h4"];
+    }
+}

src/parameters/parameter.js

+
+export class Param 
+{
+    constructor()
+    {
+        this.code = "";
+        this.selectors = [];
+        this.targets = [];
+        this.value = null;
+    }
+    // Check for selector exists in array of selectors
+    // If exists return true, else return false
+    checkSelector = selector => {
+        return (this.selectors.indexOf(selector) > -1);
+    };
+}

src/parameters/parameters.js

+import { BorderColorParam } from "./border-color-parameter";
+import { ColorParam } from "./color-parameter";
+import { HideParam } from "./hide-parameter";
+import { RemoveColumnParam } from "./remove-column-parameter";
+import { RemoveHeaderParam } from "./remove-header-parameter";
+import { RemoveRowParam } from "./remove-row-parameter";
+import { ShowNumberRowsParam } from "./show-number-rows-parameters";
+import { SizeParam } from "./size-parameter";
+
+const parameters = () =>
+{
+    return [
+        new BorderColorParam(),
+        new ColorParam(),
+        new HideParam(),
+        new RemoveColumnParam(),
+        new RemoveHeaderParam(),
+        new RemoveRowParam(),
+        new ShowNumberRowsParam(),
+        new SizeParam()
+    ];
+}
+
+export default parameters;

src/parameters/remove-column-parameter.js

+import { Param } from "./parameter";
+export class RemoveColumnParam extends Param 
+{
+    constructor(){
+        super();
+        this.code = "br-removecolumn-1";
+        this.selectors = ["table"];
+        this.value = +(this.code.split('-')[2]);        
+    }
+}

src/parameters/remove-header-parameter.js

+import { Param } from "./parameter";
+export class RemoveHeaderParam extends Param 
+{
+    constructor(){
+        super();
+        this.code = "br-removeheader";
+        this.selectors = ["table"];
+    }
+}

src/parameters/remove-row-parameter.js

+import { Param } from "./parameter";
+export class RemoveRowParam extends Param 
+{
+    constructor(){
+        super();
+        this.code = "br-removerow-1";
+        this.selectors = ["table"];
+        this.value = +(this.code.split('-')[2]);
+    }
+}

src/parameters/show-number-rows-parameters.js

+import { Param } from "./parameter";
+export class ShowNumberRowsParam extends Param 
+{
+    constructor(){
+        super();
+        this.code = "br-shownumberrows-4";
+        this.selectors = ["table"];
+        this.value = +(this.code.split('-')[2]);
+    }
+}

src/parameters/size-parameter.js

+import { Param } from "./parameter";
+export class SizeParam extends Param 
+{
+    constructor(){
+        super();
+        this.code = "br-size-15";
+        this.selectors = ["p","span"];
+        this.value = +(this.code.split('-')[2]);
+    }
+}

src/transformations/border-color-transformation/border-color-transformation.css

+@media print{
+    .border-red{
+        border-color: red;
+    }
+}

src/transformations/border-color-transformation/border-color-transformation.js

+import './border-color-transformation.css';
+import {Transform} from "../transform";
+import $ from "jquery";
+
+export class BorderColorTransform extends Transform {
+    constructor(selector){
+        super();
+        this.selector = selector;
+    }
+
+    execute(){
+        $(this.selector).addClass("border-red");
+    }
+
+    rolback(){
+        $(this.selector).removeClass("border-red");
+    }
+}

src/transformations/color-transformation/color-transforamtion.js

 
 export class ColorTransform extends Transform {
     constructor(selector){
+        super();
         this.selector = selector;
     }
 
     execute(){
-        $(this.selector).addClass(".color-transform");
+        $(this.selector).addClass("color-transform");
     }
 
     rolback(){
-        $(this.selector).removeClass(".color-transform");
+        $(this.selector).removeClass("color-transform");
     }
 }

src/transformations/color-transformation/color-transformation.css

-@media print {
+/* @media print { */
     .color-transform{
         color: blue;
     }
-}
+/* } */

src/transformations/hide-transform.js

 import $ from "jquery";
 
 export class HideTransform extends Transform {
-    constructor(selector){
+    constructor(object){
         super();
-        this.selector = selector;
+        this.object = object;
     }
 
     execute(){
-        $(this.selector).hide();
-        var $div = $('<p> '+this.selector+' </p>').appendTo('body');
+        // Zbog !important u CSS React app morali smo odraditi na ovaj nacin
+        // $(this.object).attr("style", "display: none !important");
+        $(this.object).hide();
     }
 
     rolback(){
-        $(this.selector).show();
+        $(this.object).show();
     }
 }

src/transformations/number-rows-transform.js

+import { Transform } from "./transform";
+import  _  from "lodash";
+export class NumberRowsTransform extends Transform
+{
+    constructor(array,number){
+        super();
+        this.array = array;
+        this.number = number;
+    }
+
+    execute()
+    {
+        return _(this.array).take(this.number).value();
+    }
+    rolback()
+    {
+        return this.array;
+    }
+}

src/transformations/remove-table-column-transform.js

+import { Transform } from "./transform";
+import $ from 'jquery';
+
+export class RemoveTableColumnTransform extends Transform
+{
+    constructor(selector,column)
+    {
+        super();
+        this.selector = selector;
+        this.column = column;
+    }
+    execute(){
+        const column = this.column;
+        $(`${this.selector} > tbody > tr`).each(function () {
+            $(this).find('td').eq(column).remove();
+        });
+        $(`${this.selector} > thead > tr`).each(function () {
+            $(this).find('th').eq(column).remove();
+        });
+    };
+    rolback(){
+        // TODO IMPLEMENT ROLBACK
+        // HINT: SAVE LAST CELLS IN PROPERTIES
+        // const column = this.column;
+        // $(`${this.selector} > tbody > tr`).each(function () {
+        //     $(this).find('td').eq(column).show();
+        // });
+        // $(`${this.selector} > thead > tr`).each(function () {
+        //     $(this).find('th').eq(column).show();
+        // });
+    };
+}

src/transformations/remove-table-row-transform.js

+import { Transform } from "./transform";
+import $ from 'jquery';
+
+export class RemoveTableRowTransform extends Transform
+{
+    constructor(selector,row)
+    {
+        super();
+        this.selector = selector;
+        this.row = row;
+    }
+    execute(){
+        const row = this.row;
+        $(`${this.selector}`).each(function () {
+            $(this).find('tr').eq(row).remove();
+        });
+    };
+    rolback(){
+        // TODO IMPLEMENT ROLBACK
+        // HINT: SAVE LAST ROW IN PROPERTIES
+        // const row = this.row;
+        // $(`${this.selector} > tbody > tr`).each(function () {
+        //     $(this).find('td').eq(row).show();
+        // });
+    };
+}

src/transformations/show-number-rows-transformation.js

+import { Transform } from "./transform";
+import $ from 'jquery';
+
+export class ShowNumberRowsTransformation extends Transform
+{
+    constructor(selector,rows)
+    {
+        super();
+        this.selector = selector;
+        this.rows = rows;
+    }
+    execute(){
+        const rows = this.rows;
+        const count = $(`${this.selector} > tbody`).children('tr').length;
+        $(`${this.selector} > tbody`).each(function () {
+            for(let i=rows;i<count;i++)
+            {
+                $(this).find('tr').eq(i).hide();
+            }
+        });
+    };
+    rolback(){
+        const rows = this.rows;
+        const count = $(`${this.selector} > tbody`).children('tr').length;
+        $(`${this.selector} > tbody`).each(function () {
+            for(let i=rows;i<count;i++)
+            {
+                $(this).find('tr').eq(i).show();
+            }
+        });
+    };
+}

src/transformations/transform.js

 export class Transform{
     execute(){};
+    rolback(){};
 }

src/transforms-factory.js

 import { HideTransform } from "./transformations/hide-transform";
 import { Transform } from "./transformations/transform";
 import { ColorTransform } from "./transformations/color-transformation/color-transforamtion";
+import { RemoveTableColumnTransform } from "./transformations/remove-table-column-transform";
+import { RemoveTableRowTransform } from "./transformations/remove-table-row-transform";
+import { ShowNumberRowsTransformation } from "./transformations/show-number-rows-transformation";
+import { BorderColorTransform } from "./transformations/border-color-transformation/border-color-transformation";
 
 export class TransformsFactory{
-    produce(code,selector)
+    produce(code,object)
     {
+        const arrayCode = code.split('-');
+        code = `${arrayCode[0]}-${arrayCode[1]}`;
         if(code == null){
             return null;
          }		
          if(code === ("br-hide")){
-            return new HideTransform(selector);
-            
+            // Ovo ne sme nikako preko atributa
+            return new HideTransform(object);
          } else if(code === ("br-color")){
-            return new ColorTransform(selector);
-
+            return new ColorTransform(object);
+         } else if(code === ("br-removecolumn")){
+            return new RemoveTableColumnTransform(object,arrayCode[2]);
+         } else if(code === ("br-removerow")){
+            return new RemoveTableRowTransform(`${object} > tbody`,arrayCode[2]);
+         } else if(code === ("br-removeheader")){
+            return new RemoveTableRowTransform(`${object} > thead`,0);
+         } else if(code === ("br-shownumberrows")){
+            return new ShowNumberRowsTransformation(object,arrayCode[2]);
+         } else if(code === ("br-bordercolor")){
+            return new BorderColorTransform(object);
         }
         return null;
     }