Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Complexity greater than authorized in AngularJS Controller (SonarLint issue)

I use SonarLint with Eclipse, and I'm codding an application using AngularJS. I had a problem with a controller so I was trying to clean it a bit to see clearer, and then SonarLint popped me up an issue :

Function has a complexity of 11 which is greater than 10 authorized.

And here's the code of my controller :

app.controller('LauncherCtrl', function ($scope, $http) {

    $scope.genStatus = "stopped";

    $scope.startgenerator = function() {
        $http.get('/start').success(function () {
            $scope.updateStatus();
        });
    };

    $scope.resumegenerator = function() {
        $http.get('/resume').success(function () {
            $scope.updateStatus();
        });
    };

    $scope.suspendgenerator = function() {
        $http.get('/suspend').success(function () {
            $scope.updateStatus();
        });
    };

    $scope.stopgenerator = function() {
        $http.get('/stop').success(function () {
            $scope.updateStatus();
        });
    };

    $scope.updateStatus = function() {              
        $http.get('/status').success(function (response) {
              $scope.genStatus = response.data;
        });
    };

    $scope.updateStatus();
});

Is there something wrong with it ? I assume this issue would be about too much nested loops/functions, but as far as I can see it's not (apart from the functions start/stop/resume/pause which are calling update, but it isn't complexity 11, is it ?). + I double checked the brackets/parenthesis, I don't think the problem comes from there.

like image 716
Krihox Avatar asked Apr 08 '26 23:04

Krihox


1 Answers

If you want to remove complexity you can make one function :

    $scope.startgenerator = function() {
        $http.get('/start').success(function () {
            $scope.updateStatus();
        });
    };

    $scope.resumegenerator = function() {
        $http.get('/resume').success(function () {
            $scope.updateStatus();
        });
    };

    $scope.suspendgenerator = function() {
        $http.get('/suspend').success(function () {
            $scope.updateStatus();
        });
    };

    $scope.stopgenerator = function() {
        $http.get('/stop').success(function () {
            $scope.updateStatus();
        });
    };

to

$scope.generatorAction = function(action) {
    $http.get('/' + action).success(function () {
        $scope.updateStatus();
    });
};

and then use it like this:

$scope.generatorAction('stop');

Or use a service that handle your http request, It's a better practice.

Edit:

I'm using this styleguide for my angular applications : https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md

Creating a simple service for your http request :

(function() {
  'use strict';

  angular
    .module('yourModuleName')
    .factory('generator', generatorFactory);

  function generatorFactory($http) {

     var service = {
        start: start,
        resume: resume,
        suspend: suspend,
        stop: stop
     }

     return service;

     function start() {
        return $http.get('/start');
     }

     function resume() {
        return $http.get('/start');
     }

     function suspend() {
        return $http.get('/suspend');
     }

     function stop() {
        return $http.get('/stop');
     }
  }

})();

And then in your controller:

app.controller('LauncherCtrl', function ($scope, generator, $http) {

    $scope.genStatus = "stopped";

    $scope.startgenerator = function() {
        generator.start().then(function () {
            $scope.updateStatus();
        });
    };

    $scope.resumegenerator = function() {
        generator.resume().then(function () {
            $scope.updateStatus();
        });
    };

    $scope.suspendgenerator = function() {
        generator.suspend().then(function () {
            $scope.updateStatus();
        });
    };

    $scope.stopgenerator = function() {
        generator.stop().then(function () {
            $scope.updateStatus();
        });
    };

    $scope.updateStatus = function() {              
        $http.get('/status').success(function (response) {
              $scope.genStatus = response.data;
        });
    };

    $scope.updateStatus();
});

First it seems to take more code and more complexity to your app, but if you need to stop your generator in an other page or in a component/directive, you just have to inject your 'generator' service and do generator.stop(); and by doing this, if one day your endpoint url changed, you only have to change them in your service.

like image 172
Gatsbill Avatar answered Apr 11 '26 13:04

Gatsbill



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!