projects.html: Get related issues states from webservices

The commit adds a method, to get related issues states
from coala Webservices and adds the issue state to a
HashMap which is being used to get issue css class,
when the project pop-ups.

Closes coala#298

partials/tabs/projects.html

@@ -72,7 +72,7 @@
         <div ng-show="currentProject.developers_involved.length>0" class="project-detail-element">
           <div class="small-heading uppercase">Developers Involved</div> <span class="pr-element-detail chip" ng-repeat="developers in currentProject.developers_involved">@{{developers}}</span> </div>
         <div ng-show="currentProject.issues.length>0" class="project-detail-element">
-          <div class="small-heading uppercase">Related issues</div> <span ng-click="redirect(issue)" class="pr-element-detail chip clickable" ng-repeat="issue in currentProject.issues">{{ issue | format_issue }}</span>
+          <div class="small-heading uppercase">Related issues</div> <span ng-click="redirect(issue)" class="pr-element-detail chip clickable" ng-class="lc.getIssueStateClass(issue)" ng-repeat="issue in currentProject.issues">{{ issue | format_issue }}</span>
           <br>
           <br>
           <br>

resources/css/style.css

@@ -1,3 +1,7 @@
+.closed {
+  background-color: #cb2431;
+  color: white
+}
 .hash_value_dup {
   position: 'absolute';
   left: '-9999px';
@@ -32,6 +36,17 @@
 .fa-clipboard:hover .hinttext {
   visibility: visible;
 }
+.merged {
+  background-color: #6f42c1;
+  color: white;
+}
+.no-state {
+  background-color: #e4e4e4;
+}
+.open, .opened {
+  background-color: #2cbe4e;
+  color: white;
+}
 .project-detail-element > .clickable:hover, .clickable:hover .chip:hover {
   cursor: pointer;
   background-color: #f3f5f8;

resources/js/app.js

@@ -100,6 +100,7 @@
                     'in_progress': 2,
                     'completed': 3
                 }
+                self.issueStates = {}
 
                 $scope.sortOrder = function(project) {
                     return mapping[project.status];
@@ -281,6 +282,34 @@
                     $scope.searchText = search_requested
                 }
 
+                self.getIssueStateClass = function(issue){
+                    return self.issueStates[issue]
+                }
+
+                function getIssueState(issue) {
+                    self.issueStates[issue] = 'no-state'
+                    $http({
+                        method: 'GET',
+                        url: 'https://webservices.coala.io/issue/details',
+                        params: { url: issue }
+                    }).then(function (response) {
+                        var issue_data = response.data
+                        self.issueStates[issue] = issue_data.state
+                    })
+                }
+
+                function getAllRelatedIssuesState(){
+                    $http.get('data/projects.liquid')
+                        .then(function (res) {
+                            angular.forEach(res.data, function(project){
+                                angular.forEach(project.issues, function(issue){
+                                    getIssueState(issue)
+                                })
+                            })
+                        })
+                }
+                getAllRelatedIssuesState()
+
             },
             controllerAs: 'lc'
         }