share/nitweb/javascripts/metrics.js

   1 /*
   2  * Copyright 2016 Alexandre Terrasa <alexandre@moz-code.org>.
   3  *
   4  * Licensed under the Apache License, Version 2.0 (the "License");
   5  * you may not use this file except in compliance with the License.
   6  * You may obtain a copy of the License at
   7  *
   8  *     http://www.apache.org/licenses/LICENSE-2.0
   9  *
  10  * Unless required by applicable law or agreed to in writing, software
  11  * distributed under the License is distributed on an "AS IS" BASIS,
  12  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13  * See the License for the specific language governing permissions and
  14  * limitations under the License.
  15  */
  16
  17 (function() {
  18         angular
  19                 .module('metrics', ['model'])
  20
  21                 .directive('metricsList', function() {
  22                         return {
  23                                 restrict: 'E',
  24                                 scope: {
  25                                         listId: '@',
  26                                         listTitle: '@',
  27                                         listMetrics: '=',
  28                                         listMetricsNames: '=',
  29                                         listMetricsDefault: '='
  30                                 },
  31                                 templateUrl: '/directives/metrics/metrics_list.html'
  32                         };
  33                 })
  34
  35                 .directive('chartModuleDefinitionsKind', function() {
  36                         return {
  37                                 restrict: 'E',
  38                                 scope: {
  39                                         chartId: '@',
  40                                         chartMetrics: '='
  41                                 },
  42                                 templateUrl: '/directives/metrics/chart_properties.html',
  43                                 link: function ($scope, element, attrs) {
  44                                         $scope.loadChart = function() {
  45                                                 if($scope.chart) { return; }
  46                                                 $scope.chart = new d3pie($scope.chartId, {
  47                                                         "header": {
  48                                                                 "title": {
  49                                                                         "fontSize": 24,
  50                                                                         "font": "open sans"
  51                                                                 },
  52                                                                 "subtitle": {
  53                                                                         "color": "#999999",
  54                                                                         "fontSize": 12,
  55                                                                         "font": "open sans"
  56                                                                 },
  57                                                                 "titleSubtitlePadding": 9
  58                                                         },
  59                                                         "size": {
  60                                                                 "canvasHeight": 200,
  61                                                                 "canvasWidth": 350,
  62                                                                 "pieOuterRadius": "80%"
  63                                                         },
  64                                                         "data": {
  65                                                                 "sortOrder": "value-asc",
  66                                                                 "content": [
  67                                                                         {
  68                                                                                 "label": "Concrete classes",
  69                                                                                 "value": $scope.chartMetrics.mnbcc.avg,
  70                                                                                 "color": "#228835"
  71                                                                         },
  72                                                                         {
  73                                                                                 "label": "Abstract classes",
  74                                                                                 "value": $scope.chartMetrics.mnbac.avg,
  75                                                                                 "color": "#103EB8"
  76                                                                         },
  77                                                                         {
  78                                                                                 "label": "Interfaces",
  79                                                                                 "value": $scope.chartMetrics.mnbic.avg,
  80                                                                                 "color": "#e65314"
  81                                                                         }
  82                                                                 ]
  83                                                         },
  84                                                         "labels": {
  85                                                                 "outer": {
  86                                                                         "format": "label-value2",
  87                                                                         "pieDistance": 20
  88                                                                 },
  89                                                                 "inner": {
  90                                                                         "hideWhenLessThanPercentage": 3
  91                                                                 },
  92                                                                 "mainLabel": {
  93                                                                         "fontSize": 11
  94                                                                 },
  95                                                                 "percentage": {
  96                                                                         "color": "#ffffff",
  97                                                                         "decimalPlaces": 0
  98                                                                 },
  99                                                                 "value": {
 100                                                                         "color": "#adadad",
 101                                                                         "fontSize": 11
 102                                                                 },
 103                                                                 "lines": {
 104                                                                         "enabled": true,
 105                                                                         "style": "straight"
 106                                                                 },
 107                                                                 "truncation": {
 108                                                                         "enabled": true
 109                                                                 }
 110                                                         }
 111                                                 });
 112                                         };
 113
 114                                         $scope.$watch('chartMetrics', function(nv, ov) {
 115                                                 if(nv) {
 116                                                         setTimeout($scope.loadChart, 100);
 117                                                 }
 118                                         });
 119                                 }
 120                         };
 121                 })
 122
 123                 .directive('chartModuleDefinitionsInh', function() {
 124                         return {
 125                                 restrict: 'E',
 126                                 scope: {
 127                                         chartId: '@',
 128                                         chartMetrics: '='
 129                                 },
 130                                 templateUrl: '/directives/metrics/chart_properties.html',
 131                                 link: function ($scope, element, attrs) {
 132                                         $scope.loadChart = function() {
 133                                                 if($scope.chart) { return; }
 134                                                 $scope.chart = new d3pie($scope.chartId, {
 135                                                         "header": {
 136                                                                 "title": {
 137                                                                         "fontSize": 24,
 138                                                                         "font": "open sans"
 139                                                                 },
 140                                                                 "subtitle": {
 141                                                                         "color": "#999999",
 142                                                                         "fontSize": 12,
 143                                                                         "font": "open sans"
 144                                                                 },
 145                                                                 "titleSubtitlePadding": 9
 146                                                         },
 147                                                         "size": {
 148                                                                 "canvasHeight": 200,
 149                                                                 "canvasWidth": 350,
 150                                                                 "pieOuterRadius": "80%"
 151                                                         },
 152                                                         "data": {
 153                                                                 "sortOrder": "value-asc",
 154                                                                 "content": [
 155                                                                         {
 156                                                                                 "label": "Inherited",
 157                                                                                 "value": $scope.chartMetrics.mnbd.avg - $scope.chartMetrics.mnbr.avg - $scope.chartMetrics.mnbi.avg,
 158                                                                                 "color": "#999999"
 159                                                                         },
 160                                                                         {
 161                                                                                 "label": "Introduced",
 162                                                                                 "value": $scope.chartMetrics.mnbi.avg,
 163                                                                                 "color": "#228835"
 164                                                                         },
 165                                                                         {
 166                                                                                 "label": "Redefined",
 167                                                                                 "value": $scope.chartMetrics.mnbr.avg,
 168                                                                                 "color": "#e65314"
 169                                                                         }
 170                                                                 ]
 171                                                         },
 172                                                         "labels": {
 173                                                                 "outer": {
 174                                                                         "format": "label-value2",
 175                                                                         "pieDistance": 20
 176                                                                 },
 177                                                                 "inner": {
 178                                                                         "hideWhenLessThanPercentage": 3
 179                                                                 },
 180                                                                 "mainLabel": {
 181                                                                         "fontSize": 11
 182                                                                 },
 183                                                                 "percentage": {
 184                                                                         "color": "#ffffff",
 185                                                                         "decimalPlaces": 0
 186                                                                 },
 187                                                                 "value": {
 188                                                                         "color": "#adadad",
 189                                                                         "fontSize": 11
 190                                                                 },
 191                                                                 "lines": {
 192                                                                         "enabled": true,
 193                                                                         "style": "straight"
 194                                                                 },
 195                                                                 "truncation": {
 196                                                                         "enabled": true
 197                                                                 }
 198                                                         }
 199                                                 });
 200                                         };
 201
 202                                         $scope.$watch('chartMetrics', function(nv, ov) {
 203                                                 if(nv) {
 204                                                         setTimeout($scope.loadChart, 100);
 205                                                 }
 206                                         });
 207                                 }
 208                         };
 209                 })
 210
 211                 .directive('chartClassPropertiesInh', function() {
 212                         return {
 213                                 restrict: 'E',
 214                                 scope: {
 215                                         chartId: '@',
 216                                         chartMetrics: '='
 217                                 },
 218                                 templateUrl: '/directives/metrics/chart_properties.html',
 219                                 link: function ($scope, element, attrs) {
 220                                         $scope.loadChart = function() {
 221                                                 if($scope.chart) { return; }
 222                                                 $scope.chart = new d3pie($scope.chartId, {
 223                                                         "header": {
 224                                                                 "title": {
 225                                                                         "fontSize": 24,
 226                                                                         "font": "open sans"
 227                                                                 },
 228                                                                 "subtitle": {
 229                                                                         "color": "#999999",
 230                                                                         "fontSize": 12,
 231                                                                         "font": "open sans"
 232                                                                 },
 233                                                                 "titleSubtitlePadding": 9
 234                                                         },
 235                                                         "size": {
 236                                                                 "canvasHeight": 200,
 237                                                                 "canvasWidth": 350,
 238                                                                 "pieOuterRadius": "80%"
 239                                                         },
 240                                                         "data": {
 241                                                                 "sortOrder": "value-asc",
 242                                                                 "content": [
 243                                                                         {
 244                                                                                 "label": "Inherited",
 245                                                                                 "value": $scope.chartMetrics.cnbhp.avg - $scope.chartMetrics.cnbrp.avg,
 246                                                                                 "color": "#999999"
 247                                                                         },
 248                                                                         {
 249                                                                                 "label": "Introduced",
 250                                                                                 "value": $scope.chartMetrics.cnbip.avg,
 251                                                                                 "color": "#228835"
 252                                                                         },
 253                                                                         {
 254                                                                                 "label": "Redefined",
 255                                                                                 "value": $scope.chartMetrics.cnbrp.avg,
 256                                                                                 "color": "#e65314"
 257                                                                         }
 258                                                                 ]
 259                                                         },
 260                                                         "labels": {
 261                                                                 "outer": {
 262                                                                         "format": "label-value2",
 263                                                                         "pieDistance": 20
 264                                                                 },
 265                                                                 "inner": {
 266                                                                         "hideWhenLessThanPercentage": 3
 267                                                                 },
 268                                                                 "mainLabel": {
 269                                                                         "fontSize": 11
 270                                                                 },
 271                                                                 "percentage": {
 272                                                                         "color": "#ffffff",
 273                                                                         "decimalPlaces": 0
 274                                                                 },
 275                                                                 "value": {
 276                                                                         "color": "#adadad",
 277                                                                         "fontSize": 11
 278                                                                 },
 279                                                                 "lines": {
 280                                                                         "enabled": true,
 281                                                                         "style": "straight"
 282                                                                 },
 283                                                                 "truncation": {
 284                                                                         "enabled": true
 285                                                                 }
 286                                                         }
 287                                                 });
 288                                         };
 289
 290                                         $scope.$watch('chartMetrics', function(nv, ov) {
 291                                                 if(nv) {
 292                                                         setTimeout($scope.loadChart, 100);
 293                                                 }
 294                                         });
 295                                 }
 296                         };
 297                 })
 298
 299                 .directive('chartClassPropertiesKind', function() {
 300                         return {
 301                                 restrict: 'E',
 302                                 scope: {
 303                                         chartId: '@',
 304                                         chartMetrics: '='
 305                                 },
 306                                 templateUrl: '/directives/metrics/chart_properties.html',
 307                                 link: function ($scope, element, attrs) {
 308                                         $scope.loadChart = function() {
 309                                                 if($scope.chart) { return; }
 310                                                 $scope.chart = new d3pie($scope.chartId, {
 311                                                         "header": {
 312                                                                 "title": {
 313                                                                         "fontSize": 24,
 314                                                                         "font": "open sans"
 315                                                                 },
 316                                                                 "subtitle": {
 317                                                                         "color": "#999999",
 318                                                                         "fontSize": 12,
 319                                                                         "font": "open sans"
 320                                                                 },
 321                                                                 "titleSubtitlePadding": 9
 322                                                         },
 323                                                         "size": {
 324                                                                 "canvasHeight": 200,
 325                                                                 "canvasWidth": 350,
 326                                                                 "pieOuterRadius": "80%"
 327                                                         },
 328                                                         "data": {
 329                                                                 "sortOrder": "value-asc",
 330                                                                 "content": [
 331                                                                         {
 332                                                                                 "label": "Attributes",
 333                                                                                 "value": $scope.chartMetrics.cnba.avg,
 334                                                                                 "color": "#228835"
 335                                                                         },
 336                                                                         {
 337                                                                                 "label": "Methods",
 338                                                                                 "value": $scope.chartMetrics.cnbm.avg - $scope.chartMetrics.cnbi.avg,
 339                                                                                 "color": "#999999"
 340                                                                         },
 341                                                                         {
 342                                                                                 "label": "Constructors",
 343                                                                                 "value": $scope.chartMetrics.cnbi.avg,
 344                                                                                 "color": "#e65314"
 345                                                                         },
 346                                                                         {
 347                                                                                 "label": "Virtual Types",
 348                                                                                 "value": $scope.chartMetrics.cnbv.avg,
 349                                                                                 "color": "#103EB8"
 350                                                                         }
 351                                                                 ]
 352                                                         },
 353                                                         "labels": {
 354                                                                 "outer": {
 355                                                                         "format": "label-value2",
 356                                                                         "pieDistance": 20
 357                                                                 },
 358                                                                 "inner": {
 359                                                                         "hideWhenLessThanPercentage": 3
 360                                                                 },
 361                                                                 "mainLabel": {
 362                                                                         "fontSize": 11
 363                                                                 },
 364                                                                 "percentage": {
 365                                                                         "color": "#ffffff",
 366                                                                         "decimalPlaces": 0
 367                                                                 },
 368                                                                 "value": {
 369                                                                         "color": "#adadad",
 370                                                                         "fontSize": 11
 371                                                                 },
 372                                                                 "lines": {
 373                                                                         "enabled": true,
 374                                                                         "style": "straight"
 375                                                                 },
 376                                                                 "truncation": {
 377                                                                         "enabled": true
 378                                                                 }
 379                                                         }
 380                                                 });
 381                                         };
 382
 383                                         $scope.$watch('chartMetrics', function(nv, ov) {
 384                                                 if(nv) {
 385                                                         setTimeout($scope.loadChart, 100);
 386                                                 }
 387                                         });
 388                                 }
 389                         };
 390                 })
 391
 392                 .directive('chartClassInheritanceKind', function() {
 393                         return {
 394                                 restrict: 'E',
 395                                 scope: {
 396                                         chartId: '@',
 397                                         chartMetrics: '='
 398                                 },
 399                                 templateUrl: '/directives/metrics/chart_properties.html',
 400                                 link: function ($scope, element, attrs) {
 401                                         $scope.loadChart = function() {
 402                                                 if($scope.chart) { return; }
 403                                                 $scope.chart = new d3pie($scope.chartId, {
 404                                                         "header": {
 405                                                                 "title": {
 406                                                                         "fontSize": 24,
 407                                                                         "font": "open sans"
 408                                                                 },
 409                                                                 "subtitle": {
 410                                                                         "color": "#999999",
 411                                                                         "fontSize": 12,
 412                                                                         "font": "open sans"
 413                                                                 },
 414                                                                 "titleSubtitlePadding": 9
 415                                                         },
 416                                                         "size": {
 417                                                                 "canvasHeight": 200,
 418                                                                 "canvasWidth": 350,
 419                                                                 "pieOuterRadius": "80%"
 420                                                         },
 421                                                         "data": {
 422                                                                 "sortOrder": "value-asc",
 423                                                                 "content": [
 424                                                                         {
 425                                                                                 "label": "Interfaces",
 426                                                                                 "value": $scope.chartMetrics.cnoai.avg,
 427                                                                                 "color": "#228835"
 428                                                                         },
 429                                                                         {
 430                                                                                 "label": "Abstract classes",
 431                                                                                 "value": $scope.chartMetrics.cnoaa.avg,
 432                                                                                 "color": "#103EB8"
 433                                                                         },
 434                                                                         {
 435                                                                                 "label": "Concrete classes",
 436                                                                                 "value": $scope.chartMetrics.cnoac.avg - $scope.chartMetrics.cnoaa.avg,
 437                                                                                 "color": "#e65314"
 438                                                                         }
 439                                                                 ]
 440                                                         },
 441                                                         "labels": {
 442                                                                 "outer": {
 443                                                                         "format": "label-value2",
 444                                                                         "pieDistance": 20
 445                                                                 },
 446                                                                 "inner": {
 447                                                                         "hideWhenLessThanPercentage": 3
 448                                                                 },
 449                                                                 "mainLabel": {
 450                                                                         "fontSize": 11
 451                                                                 },
 452                                                                 "percentage": {
 453                                                                         "color": "#ffffff",
 454                                                                         "decimalPlaces": 0
 455                                                                 },
 456                                                                 "value": {
 457                                                                         "color": "#adadad",
 458                                                                         "fontSize": 11
 459                                                                 },
 460                                                                 "lines": {
 461                                                                         "enabled": true,
 462                                                                         "style": "straight"
 463                                                                 },
 464                                                                 "truncation": {
 465                                                                         "enabled": true
 466                                                                 }
 467                                                         }
 468                                                 });
 469                                         };
 470
 471                                         $scope.$watch('chartMetrics', function(nv, ov) {
 472                                                 if(nv) {
 473                                                         setTimeout($scope.loadChart, 100);
 474                                                 }
 475                                         });
 476                                 }
 477                         };
 478                 })
 479 })();