Widgets "Projectquality" & "My Issues"

src/compare/compare.controller.js

@@ -34,4 +34,5 @@ function editController($scope, $http, sonarApi, sonarEndpoint) {
     });
   }
   $scope.updateProjects();
+
 }

src/issues/edit.html

@@ -0,0 +1,18 @@
+<div class="form-group">
+<form role="form">
+    <div class="form-group">
+        <label for="sample">API-URL</label>
+        <input type="text" class="form-control" id="sample" ng-model="config.apiUrl" placeholder="Sonar-URL">
+    </div>
+</form>
+<form role="form">
+    <div class="form-group">
+        <label for="sample">Sorting</label>
+        <select class="form-control" id="sample" ng-model="config.sorting" placeholder="Test">
+            <option value="" disabled selected>Select your option</option>
+            <option value="sortByEffort">Sorting by Effort</option>
+            <option value="sortBySeverity">Sorting by Severity</option>
+        </select>
+    </div>
+</form>
+</div>

src/issues/issue.controller.js

@@ -0,0 +1,102 @@
+'use strict';
+
+sonarADFWidget.
+        controller('sonarIssueCtrl', sonarIssueCtrl);
+
+function sonarIssueCtrl(data, config) {
+    var vm = this;
+
+    if (data.length != 0) {
+
+        angular.forEach(data, function (issue) {
+
+            // Preparing displaying of issue components
+            if (issue.subProject)
+                issue.subProject = issue.subProject.slice(issue.component.search(":") + 1).replace(":", " ");
+            if (issue.project)
+                issue.project = issue.project.slice(issue.component.search(":") + 1).replace(":", " "); //eig wird noch "parent" abgeschnitten, aber keine Ahnung warum!
+            if (issue.component)
+                issue.component = issue.component.slice(issue.component.lastIndexOf(":") + 1);
+
+            if (issue.type)
+                issue.type = issue.type.replace("_", " ");
+
+            for (var i = 0; i < issue.tags.length; i++) {
+                if (i == 0)
+                    issue.tag = issue.tags[i];
+                else
+                    issue.tag = issue.tag + ", " + issue.tags[i];
+            }
+        });
+
+        // sorting the elements by project, subProject and component
+        // has the structure: projects [project, subProject, component, projectIssues[]]
+        vm.projects = new Array();
+        vm.projects[0] = new Object();
+
+        var counter = 0; //counting the projects
+        var counter2 = 1; //counting the projectIssues per project
+        for (var i = 0; i < data.length; i++) {
+
+            if (data[i].status !== "CLOSED") {
+
+                if (!vm.projects[counter].project) { //first initialisation of an object
+                    vm.projects[counter] = new Object();
+                    vm.projects[counter].project = data[i].project;
+                    vm.projects[counter].subProject = data[i].subProject;
+                    vm.projects[counter].component = data[i].component;
+                    vm.projects[counter].projectIssue = new Array();
+                    vm.projects[counter].projectIssue[0] = data[i];
+                } else { //if there is already an object in vm.projects
+                    if (data[i].project === vm.projects[counter].project
+                            && data[i].subProject === vm.projects[counter].subProject
+                            && data[i].component === vm.projects[counter].component) {
+                        vm.projects[counter].projectIssue[counter2] = data[i];
+                        counter2 = counter2 + 1;
+                    } else {
+                        counter = counter + 1;
+                        counter2 = 1;
+                        vm.projects[counter] = new Object();
+                        vm.projects[counter].project = data[i].project;
+                        vm.projects[counter].subProject = data[i].subProject;
+                        vm.projects[counter].component = data[i].component;
+                        vm.projects[counter].projectIssue = new Array;
+                        vm.projects[counter].projectIssue[0] = data[i];
+                    }
+                }
+            }
+        }
+    }
+
+    vm.sorting = function (issue) {
+        if (config.sorting == "sortBySeverity")
+            return vm.sortBySeverity(issue);
+        else
+            return vm.sortByEffort(issue);
+    };
+
+
+    vm.sortBySeverity = function (issue) {
+        var severity = 0; //4=blocker, 3=critical, 2=major, 1=minor, 0=info
+        for (var i = 0; i < issue.projectIssue.length; i++) {
+            if (issue.projectIssue[i].severity === "BLOCKER")
+                severity = 4;
+            else if (issue.projectIssue[i].severity === "CRITICAL" && severity < 3)
+                severity = 3;
+            else if (issue.projectIssue[i].severity === "MAJOR" && severity < 2)
+                severity = 2;
+            else if (issue.projectIssue[i].severity === "MINOR" && severity < 1)
+                severity = 1;
+        }
+        return -severity;
+    };
+
+    vm.sortByEffort = function (issue) {
+        var effort = 0;
+        for (var i = 0; i < issue.projectIssue.length; i++) {
+            if (issue.projectIssue[i].effort && effort < parseInt(issue.projectIssue[i].effort.slice(0, issue.projectIssue[i].effort.search("m"))))
+                effort = parseInt(issue.projectIssue[i].effort.slice(0, issue.projectIssue[i].effort.search("m")));
+        }
+        return -effort;
+    };
+}

src/issues/view.html

@@ -0,0 +1,64 @@
+<style type="text/css">
+    .content{
+        text-align: left;
+        color: black;
+    }
+    .tagContent{
+        color: grey;
+        text-align: right;
+    }
+    .linesOfCode {
+        background-color:#F0F0F0;
+        margin-bottom: 0.5%;
+        border-radius: 1px;
+    }
+    .heading {
+        color: #1874CD;
+        font-size: small;
+        margin-top:  1%;
+    }
+</style>
+<div ng-if="!vm.projects" class="alert alert-info">
+    You don't have any issues.
+</div>
+<div ng-if="vm.projects">
+
+    <div ng-repeat="project in vm.projects | orderBy: vm.sorting"> <!--(config.sorting?sortBySeverity:sortByEffort)-->
+        <div class="heading">
+            <span ng-if="project.project" class="glyphicon glyphicon-folder-open"></span>
+            {{project.project}}
+            <span ng-if="project.subProject" class="glyphicon glyphicon-folder-open"></span>
+            {{project.subProject}}
+            <span ng-if="project.component" class="glyphicon glyphicon-file"></span>
+            {{project.component}}</br>
+        </div>
+        <div class="content col-md-20">
+            <div class="col-md-20 linesOfCode" ng-repeat="issue in project.projectIssue track by $index">
+
+                <table width="100%">
+                    <tr>
+                        <td width="80%" colspan="4"><b>{{issue.message}}</b></td>
+                        <td ng-if="issue.line">L{{issue.line}}</td> 
+                    </tr>
+                </table><table width="100%">
+                    <tr>
+                        <td width="15%">{{issue.type | lowercase}}</td>
+                        <td width="15%">
+                            <span ng-if="issue.severity == 'MAJOR'" class="glyphicon glyphicon-chevron-up"></span>
+                            <span ng-if="issue.severity == 'MINOR'" class="glyphicon glyphicon-chevron-down"></span>
+                            <span ng-if="issue.severity == 'INFO'" class="glyphicon glyphicon-arrow-down"></span>
+                            <span ng-if="issue.severity == 'CRITICAL'" class="glyphicon glyphicon-arrow-up"></span>
+                            <span ng-if="issue.severity == 'BLOCKER'" class="glyphicon glyphicon-exclamation-sign"></span>
+                            {{issue.severity | lowercase}}
+                        </td>
+                        <td width="15%">{{issue.status | lowercase}}</td>
+                        <td width="15%" ng-if="issue.effort"><span class="glyphicon glyphicon-time"></span> {{issue.effort}} effort</td>
+
+                        <td class="tagContent"><span ng-if="issue.tag" class="glyphicon glyphicon-tags"></span>  {{issue.tag}}</td>
+                    </tr>
+                </table>
+            </div>
+        </div>
+    </div>
+
+</div>

src/projectquality/edit.html

@@ -0,0 +1,17 @@
+<style type="text/css"></style>
+<form role="form">
+    <div class="form-group" ng-controller="editController as vm">
+        <label for="sample">API-URL</label>
+        <p>
+            <input class="form-control" id="sample" ng-model="config.apiUrl" placeholder="Sonar-URL" type="text"
+                   ng-change="updateProjects()">
+        </p>
+        <label for="sample">Project</label>
+        (*Required)
+        <p>
+            <input id="project" name="project" type="text" class="form-control" autocomplete="off"
+                   placeholder="Choose project" ng-model="config.project" required="true"
+                   uib-typeahead="project.name for project in vm.projects | limitTo:10 | filter:$viewValue"/>
+        </p>
+    </div>
+</form>

src/projectquality/quality.controller.js

@@ -0,0 +1,18 @@
+'use strict';
+
+sonarADFWidget.controller('qualityCtrl', qualityCtrl);
+
+function qualityCtrl(data) {
+    var vm = this;
+    vm.name = data.name;
+
+    angular.forEach(data.msr, function (metric) {
+        if (metric.key === "coverage") //going through all entries with if/elseif since there could miss some entries. So there is no special order
+            vm.coverage = metric.frmt_val;
+        else if (metric.key === "blocker_violations")
+            vm.blocker = metric.frmt_val;
+        else if (metric.key === "quality_gate_details") {
+            vm.qualityGateStatus = metric.data.split('"')[3]; //structure of quality_gate_details: "level":"OK",...
+        }
+    });
+}

src/projectquality/view.html

@@ -0,0 +1,97 @@
+<style type="text/css">
+    .content {
+        text-align: right;
+        color: black;
+    }
+
+    .statusQualitygate {
+        border-radius: 8px;
+        margin-bottom: 2%;
+    }
+
+    .codeCoverage {
+        border-radius: 8px;
+        background-color: #f0ad4e;
+        margin-bottom: 2%;
+    }
+
+    .blockerIssues {
+        border-radius: 8px;
+        background-color: #1B7DAA;
+    }
+
+    .glyphiconStyle {
+        float: left;
+        font-size: 3em;
+        margin-top: 25px;
+    }
+
+    .error {
+        background-color: #E43B53;
+    }
+
+    .warning {
+        background-color: #DD7800;
+    }
+
+    .ok {
+        background-color: #B5CA00;
+    }
+
+    .unknown {
+        background-color: #777777;
+    }
+</style>
+
+
+<div class="alert alert-info" ng-if="!vm.name">
+    Please configure the widget
+</div>
+
+<div class="content col-md-12" ng-if="vm.name">
+
+    <div ng-switch on="vm.qualityGateStatus">
+        <div ng-switch-when="OK">
+            <div class="ok col-md-12 statusQualitygate">
+                <span class="glyphicon glyphicon-ok glyphiconStyle"></span>
+                <h1>Passed</h1>
+                <h4>Quality Gate</h4>
+            </div>
+        </div>
+        <div ng-switch-when="ERROR">
+            <div class="error col-md-12 statusQualitygate">
+                <span class="glyphicon glyphicon-remove glyphiconStyle"></span>
+                <h1>Error</h1>
+                <h4>Quality Gate</h4>
+            </div>
+        </div>
+        <div ng-switch-when="WARNING">
+            <div class="warning col-md-12 statusQualitygate">
+                <span class="glyphicon glyphicon-info-sign glyphiconStyle"></span>
+                <h1>Warning</h1>
+                <h4>Quality Gate</h4>
+            </div>
+        </div>
+
+        <div ng-switch-default>
+            <div class="unknown col-md-12 statusQualitygate">
+                <span class="glyphicon glyphicon-question-sign glyphiconStyle"></span>
+                <h1>unknown</h1>
+                <h4>Quality Gate</h4>
+            </div>
+        </div>
+    </div>
+
+    <div class="col-md-12 codeCoverage">
+        <span class="glyphicon glyphicon-tasks glyphiconStyle"></span>
+        <h1>{{vm.coverage||"unknown"}}</h1>
+        <h4>Code Coverage</h4>
+    </div>
+    <div class="col-md-12 blockerIssues">
+        <span class="glyphicon glyphicon-exclamation-sign glyphiconStyle"></span>
+        <h1>{{vm.blocker||"unknown"}}</h1>
+        <h4>Blocker Issues</h4>
+    </div>
+
+</div>
+