Extension to manage multi paramters.

fcorti · Jan 22, 2018 · 253c2f0 · 253c2f0
1 parent 915d538
commit 253c2f0
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 11 deletions.
diff --git a/src/app/app.component.html b/src/app/app.component.html
@@ -39,7 +39,7 @@ <h1>
     id = "dashboard2"
     pentahoPath = "/public/sample2.wcdf"
     [params] = "['param2']"
-    masterHtmlElementId = "externalHtmlElementId">
+    [masterHtmlElementIds] = "['externalHtmlElementId']">
   </pentaho-dashboard>
 </div>
 

diff --git a/src/app/pentaho-dashboard/package.json b/src/app/pentaho-dashboard/package.json
@@ -1,6 +1,6 @@
 {
   "name": "pentaho-dashboard",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Pentaho dashboards library for Angular.",
   "main": "index.js",
   "scripts": {

diff --git a/src/app/pentaho-dashboard/src/app/pentaho-dashboard/pentaho-dashboard.component.ts b/src/app/pentaho-dashboard/src/app/pentaho-dashboard/pentaho-dashboard.component.ts
@@ -24,8 +24,8 @@ export class PentahoDashboardComponent implements AfterViewInit {
   @Input('masterDashboardParams')
   private masterDashboardParams : string[] = [];
 
-  @Input('masterHtmlElementId')
-  private masterHtmlElementId : string = null;
+  @Input('masterHtmlElementIds')
+  private masterHtmlElementIds : string[] = [];
 
   constructor(private pentahoDashboardService: PentahoDashboardService) {
   }
@@ -39,8 +39,8 @@ export class PentahoDashboardComponent implements AfterViewInit {
       if (this.masterDashboardId != null) {
         this.pentahoDashboardService.renderDashboardDependingOnDashboard(this.pentahoPath, this.id, this.params, this.masterDashboardId, this.masterDashboardParams);
       }
-      else if (this.masterHtmlElementId != null) {
-        this.pentahoDashboardService.renderDashboardDependingOnHtmlElement(this.pentahoPath, this.id, this.params, this.masterHtmlElementId);
+      else if (this.masterHtmlElementIds != []) {
+        this.pentahoDashboardService.renderDashboardDependingOnHtmlElement(this.pentahoPath, this.id, this.params, this.masterHtmlElementIds);
       }
       else {
         this.pentahoDashboardService.renderDashboard(this.pentahoPath, this.id);        

diff --git a/src/app/pentaho-dashboard/src/app/shared/pentaho-dashboard.service.ts b/src/app/pentaho-dashboard/src/app/shared/pentaho-dashboard.service.ts
@@ -130,13 +130,13 @@ export class PentahoDashboardService {
     path: string,
     htmlId:string,
     params: string[],
-    masterHtmlElementId: string) {
+    masterHtmlElementIds: string[]) {
 
     var dashboardScriptElement = this.createDashboardScriptElement();
 
     var jsCode = "";
     jsCode += this.getJsCodeRequireStart(path);
-    jsCode += this.getJsCodeForDashboardDependingOnHtmlElement(htmlId, params, masterHtmlElementId);
+    jsCode += this.getJsCodeForDashboardDependingOnHtmlElement(htmlId, params, masterHtmlElementIds);
     jsCode += this.getJsCodeRequireEnd();
 
     dashboardScriptElement.innerHTML = jsCode;
@@ -183,13 +183,15 @@ export class PentahoDashboardService {
   private getJsCodeForDashboardDependingOnHtmlElement(
     htmlId:string,
     params: string[],
-    masterHtmlElementId:string):string {
+    masterHtmlElementIds: string[]):string {
 
     var jsCode = ", function(Dashboard) { ";
     jsCode += "var currentDashboard = new Dashboard(\"" + htmlId + "\"); ";
     jsCode += "currentDashboard.render(); ";
-    jsCode += "var htmlElement = document.getElementById(\"" + masterHtmlElementId + "\"); ";
-    jsCode += "htmlElement.addEventListener(\"change\", function() { currentDashboard.fireChange(\"" + params[0] + "\", this.value); }); ";
+    for (let i in masterHtmlElementIds) {
+      jsCode += "var htmlElement" + i + " = document.getElementById(\"" + masterHtmlElementIds[i] + "\"); ";
+      jsCode += "htmlElement" + i + ".addEventListener(\"change\", function() { currentDashboard.fireChange(\"" + params[i] + "\", this.value); }); ";
+    }
     jsCode += "} ";
 
     return jsCode;