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