Adding chart support

Author: SimpleMethod

src/main/java/pl/simplemethod/codebin/CodebinApplication.java

@@ -33,4 +33,10 @@ public SrvClient srvClient() {
     public GithubClient githubClient() {
         return new GithubClient("2f5c2010372081b036ff", "29e08d58c97f1448d3bd16f2ac10e5541be53937");
     }
+
+    @Bean
+    public String string()
+    {
+        return "";
+    }
 }

src/main/java/pl/simplemethod/codebin/githubOauth/GithubRestController.java

@@ -1,6 +1,10 @@
 package pl.simplemethod.codebin.githubOauth;
 
 
+import com.mashape.unirest.http.HttpResponse;
+import com.mashape.unirest.http.JsonNode;
+import com.mashape.unirest.http.Unirest;
+import com.mashape.unirest.http.exceptions.UnirestException;
 import org.json.JSONObject;
 import org.json.simple.parser.JSONParser;
 import org.json.simple.parser.ParseException;
@@ -15,6 +19,9 @@
 import pl.simplemethod.codebin.repository.ContainersRepository;
 import pl.simplemethod.codebin.repository.UsersRepository;
 
+import java.util.*;
+import java.util.concurrent.atomic.AtomicInteger;
+
 
 @RestController
 @RequestMapping("github")
@@ -184,9 +191,57 @@ ResponseEntity checkToken(@RequestParam("token") String token) {
         return new ResponseEntity<>(body.toString(), headers, HttpStatus.valueOf(404));
     }
 
+    @GetMapping("/user/language")
+    public @ResponseBody
+    ResponseEntity getLanguageFromRepos(@CookieValue("token") String token) {
+        HttpHeaders headers = new HttpHeaders();
+        headers.setContentType(MediaType.APPLICATION_JSON);
+        List language = new ArrayList();
+        org.json.simple.JSONArray result = new org.json.simple.JSONArray();
+
+                try {
+                    JSONParser parser = new JSONParser();
+                    Object obj;
+                    obj = parser.parse(githubClient.getUserRepos(token));
+                    org.json.simple.JSONArray jsonArray = (org.json.simple.JSONArray) obj;
+                    Integer xd;
+                    jsonArray.forEach(item -> {
+
+                        org.json.simple.JSONObject obj1 = (org.json.simple.JSONObject) item;
+                        try{
+                            language.add(obj1.get("language").toString());
+                        }
+                        catch (NullPointerException e)
+                        {
+                            language.add("Unknown");
+                        }
+                    });
+
+                    Set<String> unique = new HashSet<String>(language);
+                    for (String key : unique) {
+                        org.json.JSONObject body = new org.json.JSONObject();
+                        body.put("language", key);
+                        body.put("count",Collections.frequency(language, key));
+                        result.add(body);
+                    }
+
+                    return new ResponseEntity<>(result.toString(), headers, HttpStatus.valueOf(200));
+                    }
+
+                catch (NullPointerException | ParseException | org.json.JSONException e) {
+                    org.json.JSONObject body = new org.json.JSONObject();
+                    body.put("error", e);
+                    return new ResponseEntity<>(body.toString(), headers, HttpStatus.valueOf(404));
+                }
+
+
+    }
+
+
+
     @GetMapping("/user/repos/public")
     public @ResponseBody
-    ResponseEntity getpublicrepos(@CookieValue("token") String token) {
+    ResponseEntity getPublicRepos(@CookieValue("token") String token) {
         HttpHeaders headers = new HttpHeaders();
         headers.setContentType(MediaType.APPLICATION_JSON);
         JSONParser parser = new JSONParser();

src/main/resources/public/app.js

@@ -292,7 +292,27 @@ app.controller('HomeController', function ($scope, $http, $cookies) {
             $scope.loaded = true;
         },
         function () {
-            $scope.passCheck = false;
+        }
+    );
+
+
+    $http({
+        url: 'https://127.0.0.1/github/user/language',
+        method: 'GET'
+    }).then(
+        function (response) {
+            $scope.trainer = response.data;
+
+            $scope.labels=[];
+            $scope.dataLanguage=[];
+
+            for(var i=0;i<$scope.trainer.length;i++){
+                $scope.labels.push($scope.trainer[i].language);
+                $scope.dataLanguage.push($scope.trainer[i].count);
+            }
+            updateTechnologies($scope.dataLanguage,$scope.labels);
+        },
+        function () {
         }
     );
 });

src/main/resources/public/dashboard/home.html

@@ -1,3 +1,49 @@
+<script>
+    function getRandomColor() {
+        var letters = '0123456789ABCDEF'.split('');
+        var color = '#';
+        for (var i = 0; i < 6; i++) {
+            color += letters[Math.floor(Math.random() * 16)];
+        }
+        return color;
+    }
+
+
+    function updateTechnologies(data, labels) {
+        myChart.data.datasets[0].data = data;
+        myChart.data.labels = labels;
+        myChart.update();
+    }
+
+
+    var ctx = $('#technologies');
+    var myChart = new Chart(ctx, {
+        type: 'pie',
+        data: {
+            labels: [],
+            datasets: [
+                {
+                    backgroundColor: [getRandomColor(), getRandomColor(), getRandomColor(), getRandomColor(), getRandomColor(), getRandomColor(), getRandomColor(), getRandomColor(), getRandomColor(), getRandomColor(), getRandomColor(), getRandomColor(), getRandomColor(), getRandomColor()],
+                    data: []
+                }
+            ]
+
+        },
+        options: {
+            legend: {
+                display: true
+            }
+
+        }
+    });
+
+
+    function updateDatatempChart(dataLanguage) {
+        myChart.data.datasets[0].data[0] = dataLanguage;
+        myChart.update();
+    }
+</script>
+
 <!-- Preloader -->
 <div ng-if="loaded != true" id="preloader">
     <div class="loader"></div>
@@ -96,7 +142,8 @@ <h6 class="m-0">Containers usage</h6>
                 <h6 class="m-0">Your technologies</h6>
             </div>
             <div class="card-body d-flex py-0">
-                <canvas height="220" class="blog-users-by-device m-auto"></canvas>
+                <canvas id="technologies" width="100%" height="50%" class="chartjs-render-monitor"
+                        style="display: block; width: 100%; height: 50%;"></canvas>
             </div>
         </div>
     </div>