Updated Chart.js and all related graphs

production/chartjs.html

@@ -8,12 +8,9 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
 
-    <title>Gentallela Alela! | </title>
-
-    <!-- Bootstrap core CSS -->
+    <title>Chart JS Graphs Examples | Gentallela Alela! by Colorlib</title>
 
     <link href="css/bootstrap.min.css" rel="stylesheet">
-
     <link href="fonts/css/font-awesome.min.css" rel="stylesheet">
     <link href="css/animate.min.css" rel="stylesheet">
 
@@ -21,18 +18,13 @@
     <link href="css/custom.css" rel="stylesheet">
     <link href="css/icheck/flat/green.css" rel="stylesheet">
 
-
     <script src="js/jquery.min.js"></script>
 
-    <!--[if lt IE 9]>
-        <script src="../assets/js/ie8-responsive-file-warning.js"></script>
-        <![endif]-->
-
     <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
     <!--[if lt IE 9]>
           <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
           <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
-        <![endif]-->
+    <![endif]-->
 
 </head>
 
@@ -426,7 +418,7 @@
                                     <div class="clearfix"></div>
                                 </div>
                                 <div class="x_content">
-                                    <canvas id="canvas_radar"></canvas>
+                                    <canvas id="canvasRadar"></canvas>
                                 </div>
                             </div>
                         </div>
@@ -509,7 +501,7 @@
                                     <div class="clearfix"></div>
                                 </div>
                                 <div class="x_content">
-                                    <canvas id="canvas_area"></canvas>
+                                    <canvas id="polarArea"></canvas>
                                 </div>
                             </div>
                         </div>
@@ -542,110 +534,21 @@
     </div>
 
     <script src="js/bootstrap.min.js"></script>
-
-
     <script src="js/moment/moment.min.js"></script>
-    <!-- chart js -->
     <script src="js/chartjs/chart.js"></script>
-    <!-- bootstrap progress js -->
     <script src="js/progressbar/bootstrap-progressbar.min.js"></script>
     <script src="js/nicescroll/jquery.nicescroll.min.js"></script>
-    <!-- icheck -->
     <script src="js/icheck/icheck.min.js"></script>
-
     <script src="js/custom.js"></script>
-    <!-- pace -->
     <script src="js/pace/pace.min.js"></script>
-    <script>
-
 
+    <script>
 
+    Chart.defaults.global.legend = {
+      enabled: false
+    };
 
-    //     var radarChartData = {
-    //         labels: ["Eating", "Drinking", "Sleeping", "Designing", "Coding", "Cycling", "Running"],
-    //         datasets: [
-    //             {
-    //                 label: "My First dataset",
-    //                 fillColor: "rgba(3, 88, 106, 0.2)",
-    //                 strokeColor: "rgba(3, 88, 106, 0.80)",
-    //                 pointColor: "rgba(3, 88, 106, 0.80)",
-    //                 pointStrokeColor: "#fff",
-    //                 pointHighlightFill: "#fff",
-    //                 pointHighlightStroke: "rgba(220,220,220,1)",
-    //                 data: [65, 59, 90, 81, 56, 55, 40]
-    //         },
-    //             {
-    //                 label: "My Second dataset",
-    //                 fillColor: "rgba(38, 185, 154, 0.2)",
-    //                 strokeColor: "rgba(38, 185, 154, 0.85)",
-    //                 pointColor: "rgba(38, 185, 154, 0.85)",
-    //                 pointStrokeColor: "#fff",
-    //                 pointHighlightFill: "#fff",
-    //                 pointHighlightStroke: "rgba(151,187,205,1)",
-    //                 data: [28, 48, 40, 19, 96, 27, 100]
-    //         }
-    //     ]
-    //     };
-    //
-    //     $(document).ready(function () {
-    //         window.myRadar = new Chart(document.getElementById("canvas_radar").getContext("2d")).Radar(radarChartData, {
-    //             responsive: true,
-    //             tooltipFillColor: "rgba(51, 51, 51, 0.55)"
-    //         });
-    //     });
-    //
-    //     var polarData = [
-    //         {
-    //             value: 300,
-    //             color: "#F7464A",
-    //             highlight: "#FF5A5E",
-    //             label: "Red"
-    //     },
-    //         {
-    //             value: 50,
-    //             color: "#46BFBD",
-    //             highlight: "#5AD3D1",
-    //             label: "Green"
-    //     },
-    //         {
-    //             value: 100,
-    //             color: "#FDB45C",
-    //             highlight: "#FFC870",
-    //             label: "Yellow"
-    //     },
-    //         {
-    //             value: 40,
-    //             color: "#949FB1",
-    //             highlight: "#A8B3C5",
-    //             label: "Grey"
-    //     },
-    //         {
-    //             value: 120,
-    //             color: "#4D5360",
-    //             highlight: "#616774",
-    //             label: "Dark Grey"
-    //     }
-    //
-    // ];
-    //
-    //     $(document).ready(function () {
-    //         window.myPolarArea = new Chart(document.getElementById("canvas_area").getContext("2d")).PolarArea(sharePiePolorDoughnutData, {
-    //             responsive: true,
-    //             tooltipFillColor: "rgba(51, 51, 51, 0.55)"
-    //         });
-    //     });
-    //
-    //
-    //     $(document).ready(function () {
-    //         window.myDoughnut = new Chart(document.getElementById("canvas_doughnut").getContext("2d")).Doughnut(sharePiePolorDoughnutData, {
-    //             responsive: true,
-    //             tooltipFillColor: "rgba(51, 51, 51, 0.55)"
-    //         });
-    //     });
-    </script>
-
-
-    <script>
+    // Bar chart
     var ctx = document.getElementById("mybarChart");
     var mybarChart = new Chart(ctx, {
         type: 'bar',
@@ -675,6 +578,8 @@
         }
     });
 
+
+    // Line chart
     var ctx = document.getElementById("lineChart");
     var lineChart = new Chart(ctx, {
       type: 'line',
@@ -706,7 +611,8 @@
         },
       });
 
-
+      // Doughnut chart
+      var ctx = document.getElementById("canvasDoughnut");
       var data = {
         labels: [
           "Dark Grey",
@@ -736,30 +642,110 @@
           }]
       };
 
-      var options = {
-        tooltipFillColor: "rgba(51, 51, 51, 0.55)"
-      }
-
-      var ctx = document.getElementById("canvasDoughnut");
       var canvasDoughnut = new Chart(ctx, {
         type:'doughnut',
-        data: data,
-        options: options
+        tooltipFillColor: "rgba(51, 51, 51, 0.55)",
+        data: data
       });
 
 
+      // Radar chart
+      var ctx = document.getElementById("canvasRadar");
+      var data = {
+        labels: ["Eating", "Drinking", "Sleeping", "Designing", "Coding", "Cycling", "Running"],
+        datasets: [
+          {
+            label: "My First dataset",
+            backgroundColor: "rgba(3, 88, 106, 0.2)",
+            borderColor: "rgba(3, 88, 106, 0.80)",
+            pointBorderColor: "rgba(3, 88, 106, 0.80)",
+            pointBackgroundColor: "rgba(3, 88, 106, 0.80)",
+            pointHoverBackgroundColor: "#fff",
+            pointHoverBorderColor: "rgba(220,220,220,1)",
+            data: [65, 59, 90, 81, 56, 55, 40]
+          },
+          {
+            label: "My Second dataset",
+            backgroundColor: "rgba(38, 185, 154, 0.2)",
+            borderColor: "rgba(38, 185, 154, 0.85)",
+            pointColor: "rgba(38, 185, 154, 0.85)",
+            pointStrokeColor: "#fff",
+            pointHighlightFill: "#fff",
+            pointHighlightStroke: "rgba(151,187,205,1)",
+            data: [28, 48, 40, 19, 96, 27, 100]
+          }
+        ]
+      };
+
+      var canvasRadar = new Chart(ctx, {
+        type:'radar',
+        data: data,
+        options: {
+        }
+      });
+
 
+      // PolarArea chart
+      var ctx = document.getElementById("polarArea");
+      var data = {
+        datasets: [{
+          data: [120, 50, 140, 180, 100],
+          backgroundColor: [
+            "#455C73",
+            "#9B59B6",
+            "#BDC3C7",
+            "#26B99A",
+            "#3498DB"
+          ],
+          label: 'My dataset' // for legend
+        }],
+        labels: [
+          "Dark Gray",
+          "Purple",
+          "Gray",
+          "Green",
+          "Blue"
+        ]
+      };
 
+      var polarArea = new Chart(ctx, {
+        data: data,
+        type: 'polarArea'
+      });
 
+      // PolarArea chart
+      var ctx = document.getElementById("myDoughnutChart");
+      var data = {
+        datasets: [{
+          data: [120, 50, 140, 180, 100],
+          backgroundColor: [
+            "#455C73",
+            "#9B59B6",
+            "#BDC3C7",
+            "#26B99A",
+            "#3498DB"
+          ],
+          label: 'My dataset' // for legend
+        }],
+        labels: [
+          "Dark Gray",
+          "Purple",
+          "Gray",
+          "Green",
+          "Blue"
+        ]
+      };
 
-      // $(document).ready(function () {
-      //     window.myPie = new Chart(document.getElementById("canvas_pie").getContext("2d")).Pie(sharePiePolorDoughnutData, {
-      //         responsive: true,
-      //         tooltipFillColor: "rgba(51, 51, 51, 0.55)"
-      //     });
-      // });
+      var polarArea = new Chart(ctx, {
+        data: data,
+        type: 'pie',
+        otpions: {
+          legend: false
+        }
+      });
 
     </script>
+
 </body>
 
 </html>

production/chartjs2.html

@@ -8,31 +8,20 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
 
-    <title>Gentellela Alela! | </title>
-
-    <!-- Bootstrap core CSS -->
+    <title>Chart JS Graph Examples Part 2 | Gentallela Alela! by Colorlib</title>
 
     <link href="css/bootstrap.min.css" rel="stylesheet">
-
     <link href="fonts/css/font-awesome.min.css" rel="stylesheet">
     <link href="css/animate.min.css" rel="stylesheet">
-
-    <!-- Custom styling plus plugins -->
     <link href="css/custom.css" rel="stylesheet">
     <link href="css/icheck/flat/green.css" rel="stylesheet">
-
-
     <script src="js/jquery.min.js"></script>
 
-    <!--[if lt IE 9]>
-        <script src="../assets/js/ie8-responsive-file-warning.js"></script>
-        <![endif]-->
-
     <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
     <!--[if lt IE 9]>
           <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
           <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
-        <![endif]-->
+    <![endif]-->
 
 </head>
 
@@ -252,7 +241,7 @@
                                             <span class="time">3 mins ago</span>
                                             </span>
                                             <span class="message">
-                                        Film festivals used to be do-or-die moments for movie makers. They were where... 
+                                        Film festivals used to be do-or-die moments for movie makers. They were where...
                                     </span>
                                         </a>
                                     </li>
@@ -266,7 +255,7 @@
                                             <span class="time">3 mins ago</span>
                                             </span>
                                             <span class="message">
-                                        Film festivals used to be do-or-die moments for movie makers. They were where... 
+                                        Film festivals used to be do-or-die moments for movie makers. They were where...
                                     </span>
                                         </a>
                                     </li>
@@ -280,7 +269,7 @@
                                             <span class="time">3 mins ago</span>
                                             </span>
                                             <span class="message">
-                                        Film festivals used to be do-or-die moments for movie makers. They were where... 
+                                        Film festivals used to be do-or-die moments for movie makers. They were where...
                                     </span>
                                         </a>
                                     </li>
@@ -294,7 +283,7 @@
                                             <span class="time">3 mins ago</span>
                                             </span>
                                             <span class="message">
-                                        Film festivals used to be do-or-die moments for movie makers. They were where... 
+                                        Film festivals used to be do-or-die moments for movie makers. They were where...
                                     </span>
                                         </a>
                                     </li>
@@ -745,4 +734,4 @@
     </script>
 </body>
 
-</html>
+</html>

production/contacts.html

@@ -8,31 +8,20 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
 
-    <title>Gentallela Alela! | </title>
-
-    <!-- Bootstrap core CSS -->
+    <title>Contact Form | Gentallela Alela! by Colorlib</title>
 
     <link href="css/bootstrap.min.css" rel="stylesheet">
-
     <link href="fonts/css/font-awesome.min.css" rel="stylesheet">
     <link href="css/animate.min.css" rel="stylesheet">
-
-    <!-- Custom styling plus plugins -->
     <link href="css/custom.css" rel="stylesheet">
     <link href="css/icheck/flat/green.css" rel="stylesheet">
-
-
     <script src="js/jquery.min.js"></script>
 
-    <!--[if lt IE 9]>
-        <script src="../assets/js/ie8-responsive-file-warning.js"></script>
-        <![endif]-->
-
     <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
     <!--[if lt IE 9]>
           <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
           <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
-        <![endif]-->
+    <![endif]-->
 
 </head>
 
@@ -252,7 +241,7 @@
                                             <span class="time">3 mins ago</span>
                                             </span>
                                             <span class="message">
-                                        Film festivals used to be do-or-die moments for movie makers. They were where... 
+                                        Film festivals used to be do-or-die moments for movie makers. They were where...
                                     </span>
                                         </a>
                                     </li>
@@ -266,7 +255,7 @@
                                             <span class="time">3 mins ago</span>
                                             </span>
                                             <span class="message">
-                                        Film festivals used to be do-or-die moments for movie makers. They were where... 
+                                        Film festivals used to be do-or-die moments for movie makers. They were where...
                                     </span>
                                         </a>
                                     </li>
@@ -280,7 +269,7 @@
                                             <span class="time">3 mins ago</span>
                                             </span>
                                             <span class="message">
-                                        Film festivals used to be do-or-die moments for movie makers. They were where... 
+                                        Film festivals used to be do-or-die moments for movie makers. They were where...
                                     </span>
                                         </a>
                                     </li>
@@ -294,7 +283,7 @@
                                             <span class="time">3 mins ago</span>
                                             </span>
                                             <span class="message">
-                                        Film festivals used to be do-or-die moments for movie makers. They were where... 
+                                        Film festivals used to be do-or-die moments for movie makers. They were where...
                                     </span>
                                         </a>
                                     </li>
@@ -759,4 +748,4 @@
     <script src="js/pace/pace.min.js"></script>
 </body>
 
-</html>
+</html>

production/js/chartjs/charts/Chart.Bar.js

@@ -1,11 +0,0 @@
-"use strict";
-
-module.exports = function(Chart) {
-
-	Chart.Bar = function(context, config) {
-		config.type = 'bar';
-
-		return new Chart(context, config);
-	};
-
-};

production/js/chartjs/charts/Chart.Bubble.js

@@ -1,10 +0,0 @@
-"use strict";
-
-module.exports = function(Chart) {
-
-	Chart.Bubble = function(context, config) {
-		config.type = 'bubble';
-		return new Chart(context, config);
-	};
-
-};

production/js/chartjs/charts/Chart.Doughnut.js

@@ -1,11 +0,0 @@
-"use strict";
-
-module.exports = function(Chart) {
-
-	Chart.Doughnut = function(context, config) {
-		config.type = 'doughnut';
-
-		return new Chart(context, config);
-	};
-
-};

production/js/chartjs/charts/Chart.Line.js

@@ -1,11 +0,0 @@
-"use strict";
-
-module.exports = function(Chart) {
-
-	Chart.Line = function(context, config) {
-		config.type = 'line';
-
-		return new Chart(context, config);
-	};
-
-};

production/js/chartjs/charts/Chart.PolarArea.js

@@ -1,11 +0,0 @@
-"use strict";
-
-module.exports = function(Chart) {
-
-	Chart.PolarArea = function(context, config) {
-		config.type = 'polarArea';
-
-		return new Chart(context, config);
-	};
-
-};

production/js/chartjs/charts/Chart.Radar.js

@@ -1,18 +0,0 @@
-"use strict";
-
-module.exports = function(Chart) {
-
-	var helpers = Chart.helpers;
-
-	var defaultConfig = {
-		aspectRatio: 1
-	};
-
-	Chart.Radar = function(context, config) {
-		config.options = helpers.configMerge(defaultConfig, config.options);
-		config.type = 'radar';
-
-		return new Chart(context, config);
-	};
-
-};