8fa1464346be58b9d4bbfb79dc26bde4d72c73c2
[portal/sdk.git] /
1 appDS2.controller('reportChartController', function ($scope, $rootScope, $timeout, $window, $http, $routeParams,modalService) {
2         $scope.showLoader = true;
3     $scope.commonOptionOpen = false;
4     $scope.additionalOptionOpen = false;
5     $scope.barChartOptionOpen = false;
6     $scope.timeSeriesChartOptionOpen = false;
7         $scope.selectedChartType = {value:""};
8     $scope.chartTypeOptions = [
9         {value: 'BarChart3D', text: 'Bar Chart'},
10         {value: 'TimeSeriesChart', text: 'Time Series/Area Chart'},
11         {value: 'PieChart', text: 'Pie Chart'},         
12         {value: 'AnnotationChart', text: 'Annotation Chart'},
13         {value: 'FlexTimeChart', text: 'Flexible Time Chart'}    
14     ];
15         
16         $scope.populateChrtWzdFields = function() {
17                 $scope.reportRunJson = {};
18                 $http.get("raptor.htm?action=chart.json&c_master="+$routeParams.reportId).then(function (response) {
19                         $scope.reportRunJson = response.data;
20                           //Set chart type
21                         $scope.reportRunJson.commonChartOptions.animateAnimatedChart = $scope.reportRunJson.commonChartOptions.animateAnimatedChart+"";
22                         $scope.reportRunJson.commonChartOptions.hideLegend = $scope.reportRunJson.commonChartOptions.hideLegend + "";
23                         $scope.reportRunJson.showTitle = $scope.reportRunJson.showTitle + "";
24                         
25                         // if barChartOptions is not null
26                         if ($scope.reportRunJson.barChartOptions) {
27                                 $scope.reportRunJson.barChartOptions.displayBarControls = $scope.reportRunJson.barChartOptions.displayBarControls+"";
28                                 $scope.reportRunJson.barChartOptions.minimizeXAxisTickers = $scope.reportRunJson.barChartOptions.minimizeXAxisTickers+"";
29                                 $scope.reportRunJson.barChartOptions.stackedChart = $scope.reportRunJson.barChartOptions.stackedChart+"";
30                                 $scope.reportRunJson.barChartOptions.timeAxis =$scope.reportRunJson.barChartOptions.timeAxis+""; 
31                                 $scope.reportRunJson.barChartOptions.verticalOrientation = $scope.reportRunJson.barChartOptions.verticalOrientation +"";
32                                 $scope.reportRunJson.barChartOptions.xAxisDateType = $scope.reportRunJson.barChartOptions.xAxisDateType +"";
33                                 }                       
34                         
35                           if ($scope.reportRunJson.chartTypeJSON) {
36                                   var chrtTypeValue = $scope.reportRunJson.chartType;
37                                          for(var i = 0; i < $scope.chartTypes.length; i++) {
38                                                     if ($scope.chartTypes[i].value==chrtTypeValue) {
39                                                         $scope.reportRunJson.chartTypeJSON.index=$scope.chartTypes[i].index;                                                    
40                                                         $scope.reportRunJson.chartTypeJSON.value=$scope.chartTypes[i].value;
41                                                         $scope.reportRunJson.chartTypeJSON.title=$scope.chartTypes[i].title;
42                                                     }
43         
44                                         }
45                           }      
46                                  
47                                 //Set Domain Axis
48                                  if ($scope.reportRunJson.domainAxisJSON) {
49                                           var domaninAxisValue = $scope.reportRunJson.domainAxisJSON.value;
50                                                  for(var i = 0; i < $scope.reportRunJson.chartColumnJSONList.length; i++) {
51                                                            if ($scope.reportRunJson.chartColumnJSONList[i].value==domaninAxisValue) {
52                                                                 $scope.reportRunJson.domainAxisJSON.index=$scope.reportRunJson.chartColumnJSONList[i].index;
53                                                                 $scope.reportRunJson.domainAxisJSON.title=$scope.reportRunJson.chartColumnJSONList[i].title;
54                                                             }
55                 
56                                                 }
57                                   }
58                                  
59                                 //Set Category
60                                  if ($scope.reportRunJson.categoryAxisJSON) {
61                                           var categoryAxisValue = $scope.reportRunJson.categoryAxisJSON.value;
62                                                  for(var i = 0; i < $scope.reportRunJson.chartColumnJSONList.length; i++) {
63                                                            if ($scope.reportRunJson.chartColumnJSONList[i].value==categoryAxisValue) {
64                                                                 $scope.reportRunJson.categoryAxisJSON.index=$scope.reportRunJson.chartColumnJSONList[i].index;
65                                                                 $scope.reportRunJson.categoryAxisJSON.title=$scope.reportRunJson.chartColumnJSONList[i].title;
66                                                             }
67                                                 }
68                                   }
69                                  
70                                 //Set range axis label
71                 if ($scope.reportRunJson.rangeAxisList) {
72                         for(var j = 0; j < $scope.reportRunJson.rangeAxisList.length; j++) { 
73                                  
74                                  if ($scope.reportRunJson.rangeAxisList[j].rangeAxisLabelJSON) {
75                                           var rangeAxisLabelValue = $scope.reportRunJson.rangeAxisList[j].rangeAxisLabelJSON.value;
76                                                  for(var i = 0; i < $scope.reportRunJson.chartColumnJSONList.length; i++) {
77                                                            if ($scope.reportRunJson.chartColumnJSONList[i].value==rangeAxisLabelValue) {
78                                                                 $scope.reportRunJson.rangeAxisList[j].rangeAxisLabelJSON.index=$scope.reportRunJson.chartColumnJSONList[i].index;
79                                                                 $scope.reportRunJson.rangeAxisList[j].rangeAxisLabelJSON.title=$scope.reportRunJson.chartColumnJSONList[i].title;
80                                                             }
81                                                 }
82                                   }
83                         }
84                 }
85                                 
86                                 
87                                 //set range linetype
88                                 if ($scope.reportRunJson.rangeAxisList) {
89                                         for(var j = 0; j < $scope.reportRunJson.rangeAxisList.length; j++) { 
90                                                  if ($scope.reportRunJson.rangeAxisList[j].rangeLineTypeJSON != null && $scope.reportRunJson.rangeAxisList[j].rangeLineTypeJSON.value != ""
91                                                          && $scope.reportRunJson.rangeAxisList[j].rangeLineTypeJSON.value != null) {
92                                                          var lineTypeValue = $scope.reportRunJson.rangeAxisList[j].rangeLineTypeJSON.value;
93                                                          for(var i = 0; i < $scope.lineTypes.length; i++) {
94                                                                     if ($scope.lineTypes[i].value==lineTypeValue) {
95                                                                         $scope.reportRunJson.rangeAxisList[j].rangeLineTypeJSON.index=$scope.lineTypes[i].index;
96                                                                         $scope.reportRunJson.rangeAxisList[j].rangeLineTypeJSON.title=$scope.lineTypes[i].title;
97                                                                     }
98                                                         }
99                                                 } else {
100                                                         $scope.reportRunJson.rangeAxisList[j].rangeLineTypeJSON = null;
101                                                 }  
102                                         }
103                                 }
104                                 //set range color
105                                 if ($scope.reportRunJson.rangeAxisList) {
106                                         for(var j = 0; j < $scope.reportRunJson.rangeAxisList.length; j++) { 
107                                                  if ($scope.reportRunJson.rangeAxisList[j].rangeColorJSON != null && $scope.reportRunJson.rangeAxisList[j].rangeColorJSON.value != ""
108                                                          && $scope.reportRunJson.rangeAxisList[j].rangeColorJSON.value != null) {
109                                                          var colorValue = $scope.reportRunJson.rangeAxisList[j].rangeColorJSON.value; 
110                                                          for(var i = 0; i < $scope.rangeColors.length; i++) {
111                                                                  if ($scope.rangeColors[i].value==colorValue) {
112                                                                          $scope.reportRunJson.rangeAxisList[j].rangeColorJSON.index=$scope.rangeColors[i].index;
113                                                                          $scope.reportRunJson.rangeAxisList[j].rangeColorJSON.title=$scope.rangeColors[i].title;
114                                                                  }
115                                                          }
116                                                  }else {
117                                                          $scope.reportRunJson.rangeAxisList[j].rangeColorJSON = null; 
118                                                  }
119                                         }
120                                 }
121                                 $scope.showLoader = false;                              
122                   });
123                 
124                 $scope.legend = "true";
125         }
126         
127         $scope.saveChartData = function() {
128                 $scope.showLoader = true;
129
130                 $scope.reportRunJson.commonChartOptions.animateAnimatedChart = ($scope.reportRunJson.commonChartOptions.animateAnimatedChart=="true")
131                 $scope.reportRunJson.commonChartOptions.hideLegend = ($scope.reportRunJson.commonChartOptions.hideLegend=="true");
132                 $scope.reportRunJson.showTitle = ($scope.reportRunJson.showTitle=="true");
133                 
134                 $scope.reportRunJson.chartTypeJSON = {
135                                 'index':0,'title':'','value':''};
136                 
137                 
138                 if (($scope.reportRunJson.chartType == "BarChart3D")&&($scope.reportRunJson.barChartOptions)) {
139                         $scope.reportRunJson.barChartOptions.displayBarControls = ($scope.reportRunJson.barChartOptions.displayBarControls=="true") ;
140                         $scope.reportRunJson.barChartOptions.minimizeXAxisTickers = ($scope.reportRunJson.barChartOptions.minimizeXAxisTickers=="true") ;
141                         $scope.reportRunJson.barChartOptions.stackedChart = ($scope.reportRunJson.barChartOptions.stackedChart=="true") ;
142                         $scope.reportRunJson.barChartOptions.timeAxis= ($scope.reportRunJson.barChartOptions.timeAxi=="true") ;
143                         $scope.reportRunJson.barChartOptions.verticalOrientation = ($scope.reportRunJson.barChartOptions.verticalOrientation=="true") ;
144                         $scope.reportRunJson.barChartOptions.xAxisDateType = ($scope.reportRunJson.barChartOptions.xAxisDateType=="true") ;
145                 }
146                 
147                 for (var i=0;i<$scope.chartTypes.length;i++) {
148                         if ($scope.reportRunJson.chartType==$scope.chartTypes[i].value) {
149                                 $scope.reportRunJson.chartTypeJSON = {
150                                                 'index':$scope.chartTypes[i].index,
151                                                 'title':$scope.chartTypes[i].title,
152                                                 'value':$scope.chartTypes[i].value                                      
153                                 }                               
154                         }
155                 }
156                 
157                 $scope.reportRunJson.domainAxisJSON = {
158                                 "index":0,"value":$scope.reportRunJson.domainAxis,"title": $scope.reportRunJson.domainAxis
159                         };
160                 $scope.reportRunJson.categoryAxisJSON = {
161                                 "index":0,"value":$scope.reportRunJson.categoryAxis,"title": $scope.reportRunJson.categoryAxis
162                         };
163                 
164                 // Specifically for DS2 for color 
165                 for (var i=0; i<$scope.reportRunJson.rangeAxisList.length; i ++) {
166                         $scope.reportRunJson.rangeAxisList[i].rangeColorJSON = 
167                         {"index":0, "value": $scope.reportRunJson.rangeAxisList[i].rangeColor, "title": ""};
168                         
169                         $scope.reportRunJson.rangeAxisList[i].rangeLineTypeJSON =                               
170                         {"index":0, "value": "", "title": ""};
171                         for (var j=0;j<$scope.lineTypes.length;j++) {
172                                 if ($scope.reportRunJson.rangeAxisList[i].rangeLineType ==$scope.lineTypes[j].value) {
173                                         $scope.reportRunJson.rangeAxisList[i].rangeLineTypeJSON =                               
174                                         {"index":$scope.lineTypes[j].index, "value": $scope.lineTypes[j].value, "title": $scope.lineTypes[j].title};
175                                 }
176                         }
177                         
178                 }
179                 
180                 //Converting string variables to numbers
181                 $scope.reportRunJson.commonChartOptions.rightMargin = Number($scope.reportRunJson.commonChartOptions.rightMargin);
182                 $scope.reportRunJson.commonChartOptions.topMargin = Number($scope.reportRunJson.commonChartOptions.topMargin);
183                 $scope.reportRunJson.commonChartOptions.bottomMargin = Number($scope.reportRunJson.commonChartOptions.bottomMargin);
184                 $scope.reportRunJson.commonChartOptions.leftMargin = Number($scope.reportRunJson.commonChartOptions.leftMargin);
185          
186                 if ($scope.reportRunJson.categoryAxisJSON == "") { 
187                         $scope.reportRunJson.categoryAxisJSON = {}; 
188                         $scope.reportRunJson.categoryAxisJSON.value = -1; 
189                 }
190                 //add the remove list to the json
191                 $scope.reportRunJson.rangeAxisRemoveList= $scope.rangeAxisRemoveList;
192                 $http.post("save_chart", JSON.stringify($scope.reportRunJson)).success(function(data, status) {
193                          $scope.successSubmit=true;  
194                         $scope.showLoader = false;
195                         $scope.reportRunJson.commonChartOptions.animateAnimatedChart = $scope.reportRunJson.commonChartOptions.animateAnimatedChart+"";
196                         $scope.reportRunJson.commonChartOptions.hideLegend = $scope.reportRunJson.commonChartOptions.hideLegend + "";
197                         $scope.reportRunJson.showTitle = $scope.reportRunJson.showTitle + "";                   
198                         if ($scope.reportRunJson.chartType == "BarChart3D") {
199                                 $scope.reportRunJson.barChartOptions.displayBarControls = $scope.reportRunJson.barChartOptions.displayBarControls+"";
200                                 $scope.reportRunJson.barChartOptions.minimizeXAxisTickers = $scope.reportRunJson.barChartOptions.minimizeXAxisTickers+"";
201                                 $scope.reportRunJson.barChartOptions.stackedChart = $scope.reportRunJson.barChartOptions.stackedChart+"";
202                                 $scope.reportRunJson.barChartOptions.timeAxis =$scope.reportRunJson.barChartOptions.timeAxis+""; 
203                                 $scope.reportRunJson.barChartOptions.verticalOrientation = $scope.reportRunJson.barChartOptions.verticalOrientation +"";
204                                 $scope.reportRunJson.barChartOptions.xAxisDateType = $scope.reportRunJson.barChartOptions.xAxisDateType +"";
205                         }       
206                         $scope.populateChrtWzdFields();
207                 })
208         }
209         
210         
211         $scope.addRangeAxisRow = function (rangeaxisitem) {
212                 $scope.reportRunJson.rangeAxisList.push({
213               });       
214         };
215
216         $scope.rangeAxisRemoveList= [];
217         $scope.removeRangeAxisRow = function (index) {  
218                 $scope.rangeAxisRemoveList.push($scope.reportRunJson.rangeAxisList[index]);
219                 $scope.reportRunJson.rangeAxisList[index].removed="true";
220         };
221         
222         
223         $scope.init = function () {
224                 if ($scope) { 
225                         $scope.populateChrtWzdFields();
226                         $scope.reportRunJson.rangeAxisRemoveList= [];
227                 }
228         };
229         
230         
231         
232         $scope.domainItems = [{title:"Domain Axis1", content:"Test1", open: false},{title:"Domain Axis2", content:"Test2", open: false}];
233         
234         $scope.chartTypes = [        
235                              {index: 0, value: 'BarChart3D', title: 'Bar Chart'},
236                              {index: 1, value: 'TimeSeriesChart', title: 'Time Series/Area Chart'},
237                              {index: 2, value: 'PieChart', title: 'Pie Chart'},
238                              {index: 3, value: 'AnnotationChart', title: 'Annotation Chart'},
239                              {index: 4, value: 'FlexTimeChart', title: 'Flexible Time Chart'}
240          ];
241          
242          $scope.categories = [        
243                                      {index: 0, value: 'scenario_name', title: 'scenario_name'},
244                                      {index: 1, value: 'total_traffic_in_PB', title: 'Total Traffic in PB'},
245                                      {index: 2, value: 'Avg Utilization Day', title: 'Avg Utilization Day'}      
246                  ];
247          
248          $scope.rangeColors = [                                      
249                                      {index: 0, value: "#1f77b4",title: "Dodger Blue"},                                                 
250                                                          {index: 1, value: "#ff7f0e",title: "Vivid orange"},                                                    
251                                                          {index: 2, value: "#2ca02c",title: "Forest Green"},                                                    
252                                                          {index: 3, value: "#8c864b",title: "Greenish Red"},                                                    
253                                                          {index: 4, value: "#9467bd",title: "Desaturated violet"},                                      
254                                                          {index: 5, value: "#8c564b",title: "Dark moderate red"},                                       
255                                                          {index: 6, value: "#e377c2",title: "Soft pink"},                                                       
256                                                          {index: 7, value: "#7f7f7f",title: "Dark gray"},                                                       
257                                                          {index: 8, value: "#bcbd22",title: "Strong yellow"},                                           
258                                                          {index: 9, value: "#17becf",title: "Strong cyan"},                                                     
259                                                          {index: 10, value: "#dc143c",title: "Vivid red"},                                                      
260                                                          {index: 11, value: "#800080",title: "Dark magenta"},                                                   
261                                                          {index: 12, value: "#0000FF",title: "Blue"},                                                                   
262                                                          {index: 13, value: "#008000",title: "Dark lime green"},                                                
263                                                          {index: 14, value: "#D2691E",title: "Reddish Orange"},                                 
264                                                          {index: 15, value: "#FF0000",title: "Red"},                                                            
265                                                          {index: 16, value: "#000000",title: "Black"},                                                          
266                                                          {index: 17, value: "#DB7093",title: "Pink"},                                                           
267                                                          {index: 18, value: "#FF00FF",title: "Pure Magenta"},                                           
268                                                          {index: 19, value: "#7B68EE",title: "Soft blue"},                                                      
269                                                          {index: 20, value: "#1f77b6",title: "Strong blue"},                                            
270                                                          {index: 21, value: "#9edae5",title: "Very soft cyan"},                                         
271                                                          {index: 22, value: "#393b79",title: "Dark Blue"},                                                      
272                                                          {index: 23, value: "#5254a3",title: "Dark moderate Blue"},                                     
273                                                          {index: 24, value: "#6b6ecf",title: "Slightly desaturated blue"},                      
274                                                          {index: 25, value: "#9c9ede",title: "Very soft blue"},                 
275                                                          {index: 26, value: "#637939",title: "Dark Green"},                                                     
276                                                          {index: 27, value: "#8ca252",title: "Dark moderate green"},                            
277                                                          {index: 28, value: "#b5cf6b",title: "Slightly desaturated green"},                     
278                                                          {index: 29, value: "#cedb9c",title: "Desaturated Green"},      
279      
280                                                          /* Old Colors  */
281                                                          {index: 30, value: "#00FFFF",title: "Aqua"},
282                                                          {index: 31, value: "#000000",title: "Black"},
283                                                          {index: 32, value: "#0000FF",title: "Blue"},
284                                                          {index: 33, value: "#FF00FF",title: "Fuchsia"},
285                                                          {index: 34, value: "#808080",title: "Gray"},
286                                                          {index: 35, value: "#008000",title: "Green"},
287                                                          {index: 36, value: "#00FF00",title: "Lime"},
288                                                          {index: 37, value: "#800000",title: "Maroon"},
289                                                          {index: 38, value: "#000080",title: "Navy"},
290                                                          {index: 39, value: "#808000",title: "Olive"},
291                                                          {index: 40, value: "#FF9900",title: "Orange"},
292                                                          {index: 41, value: "#800080",title: "Purple"},
293                                                          {index: 42, value: "#FF0000",title: "Red"},
294                                                          {index: 43, value: "#C0C0C0",title: "Silver"},
295                                                          {index: 44, value: "#008080",title: "Teal"},
296                                                          {index: 45, value: "#FFFFFF",title: "White"},
297                                                          {index: 46, value: "#FFFF00",title: "Yellow"}
298                                                 ];      
299     
300     
301          $scope.lineTypes = [        
302                              {index: 0, value: 'default', title: 'Default'},
303                              {index: 1, value: 'dotted_lines', title: 'Dotted Lines'},
304                              {index: 2, value: 'dashed_lines', title: 'Dashed Lines'}       
305          ]; 
306          
307          $scope.hardCodeReport= {
308                    "reportID":"3356",
309                    "reportName":"Test: Line Chart",
310                    "reportDescr":"",
311                    "reportTitle":"",
312                    "reportSubTitle":"",
313                    "formFieldList":[
314                    ],
315                    "chartColumnJSONList":[
316                       {
317                          "index":0,
318                          "value":"tr0",
319                          "title":"traffic_date",
320                          "$$hashKey":"056"
321                       },
322                       {
323                          "index":1,
324                          "value":"ut1",
325                          "title":"util_perc",
326                          "$$hashKey":"057"
327                       }
328                    ],
329                    "formfield_comments":null,
330                    "totalRows":0,
331                    "chartSqlWhole":"SELECT traffic_date tr0, traffic_date tr0_1,util_perc ut1, 1 FROM portal.demo_util_chart   ORDER BY 1",
332                    "chartAvailable":true,
333                    "chartType":{"index": "", "value": "Bar Chart", "title": ""},
334                    "width":"700",
335                    "height":"420",
336                    "animation":false,
337                    "rotateLabels":"90",
338                    "staggerLabels":false,
339                    "showTitle":"false",
340                    "domainAxis":{
341                               "index":0,
342                               "value":"tr0",
343                               "title":"traffic_date",
344                               "$$hashKey":"11H"
345                            },
346
347                            "categoryAxis":{
348                                       "index":1,
349                                       "value":"ut1",
350                                       "title":"util_perc",
351                                       "$$hashKey":"11I"
352                                    },
353
354                    "hasCategoryAxis":false,
355                    "rangeAxisList":[
356                       {
357                          
358                          "rangeColor":{
359                                 "index":"",
360                             "value":"#bcbd22",
361                             "title":""
362                          },
363                          
364                          "rangeLineType":{
365                             "index":"",
366                             "value":"dotted_lines",
367                             "title":""
368                          },                      
369                          "rangeAxisLabel":{
370                             "index":0,
371                             "value":"tr0",
372                             "title":"traffic_date",
373                             "$$hashKey":"056"
374                          },
375                          "YAxis":"10",
376                          "chartTitle":"test"
377                       },
378                       {      
379                                  "rangeColor":{
380                                         "index":"",
381                                     "value":"#2ca02c",
382                                     "title":""
383                                  },
384                                  
385                                  "rangeLineType":{
386                                     "index":"",
387                                     "value":"dashed_lines",
388                                     "title":""
389                                     
390                                     
391                                  },
392                                  
393                                  "rangeAxisLabel":{
394                                     "index":0,
395                                     "value":"tr0",
396                                     "title":"traffic_date",
397                                     "$$hashKey":"056"
398                                  },
399                                  "YAxis":"10",
400                                  "chartTitle":"test"
401                               }
402                       
403                      
404                    ],
405                   
406                    "primaryAxisLabel":"testlabel",
407                    "secondaryAxisLabel":"testseclabel",
408                    "minRange":"10",
409                    "maxRange":"20",
410                    "topMargin":"6",
411                    "bottomMargin":"5",
412                    "leftMargin":"4",
413                    "rightMargin":"3"
414                 };
415          
416          var colorValue = $scope.hardCodeReport.rangeAxisList[0].rangeColor.value;
417                  
418                 $timeout(function() {
419                         $rootScope.isViewRendering = false;
420                         });
421
422
423 });
424
425 appDS2.directive('onlyDigits', function () {
426
427     return {
428         restrict: 'A',
429         require: '?ngModel',
430         link: function (scope, element, attrs, ngModel) {
431             if (!ngModel) return;
432             ngModel.$parsers.unshift(function (inputValue) {
433                 var digits = inputValue.split('').filter(function (s) { return (!isNaN(s) && s != ' '); }).join('');
434                 ngModel.$viewValue = digits;
435                 ngModel.$render();
436                 return digits;
437             });
438         }
439     };
440 });
441
442 appDS2.directive('onlyCharacters', function () {
443     return {
444         restrict: 'A',
445         require: '?ngModel',
446         link: function (scope, element, attrs, ngModel) {
447             if (!ngModel) return;
448             ngModel.$parsers.unshift(function (inputValue) {
449                 var digits = inputValue.split('').filter(function (s) { return (isNaN(s) && s != ' '); }).join('');
450                 ngModel.$viewValue = digits;
451                 ngModel.$render();
452                 return digits;
453             });
454         }
455     };
456 });
457
458
459