From 0b1308f41195f839da9a3e0a2adc01b2d69b5171 Mon Sep 17 00:00:00 2001
From: Chris Houseknecht <chouse@ansible.com>
Date: Wed, 2 Jul 2014 10:04:14 -0400
Subject: [PATCH] Dashboard Fixed boarder around job widget. Cleaned up JS lint
 issues.

---
 awx/ui/static/js/controllers/Home.js        |   2 +-
 awx/ui/static/js/widgets/DashboardCounts.js | 163 ++++++++++----------
 awx/ui/static/js/widgets/DashboardJobs.js   |   2 +
 awx/ui/static/js/widgets/HostGraph.js       |  12 +-
 awx/ui/static/js/widgets/JobStatusGraph.js  |   9 +-
 awx/ui/static/less/new-dashboard.less       |  11 +-
 awx/ui/templates/ui/index.html              |   2 +-
 7 files changed, 100 insertions(+), 101 deletions(-)

diff --git a/awx/ui/static/js/controllers/Home.js b/awx/ui/static/js/controllers/Home.js
index 84ac94b994..f48967bbaf 100644
--- a/awx/ui/static/js/controllers/Home.js
+++ b/awx/ui/static/js/controllers/Home.js
@@ -81,7 +81,7 @@ function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, Dashb
             target: 'container2',
             dashboard: data
         });
-         HostGraph({
+        HostGraph({
             scope: $scope,
             target: 'container3',
             dashboard: data
diff --git a/awx/ui/static/js/widgets/DashboardCounts.js b/awx/ui/static/js/widgets/DashboardCounts.js
index 8682293d2c..282b0ebcfa 100644
--- a/awx/ui/static/js/widgets/DashboardCounts.js
+++ b/awx/ui/static/js/widgets/DashboardCounts.js
@@ -17,58 +17,56 @@ angular.module('DashboardCountsWidget', ['RestServices', 'Utilities'])
                 var scope = params.scope,
                     target = params.target,
                     dashboard = params.dashboard,
-
                     html, element;
 
-                    function createHTML(html){
-                        var docw = $(window).width();
-                        if(docw<768){
+                function createHTML(html){
+                    var docw = $(window).width();
+                    if (docw<768){
+                        html = "<div id=\"dash-count-carousel\" class=\"carousel slide\" data-interval=\"1000\" data-ride=\"carousel\">\n" ;
+                        // html += " <!-- Indicators -->\n";
+                        html += "<ol class=\"carousel-indicators\">\n";
+                        html += "<li data-target=\"#dash-count-carousel\" data-slide-to=\"0\" class=\"active\"></li>\n";
+                        html += "<li data-target=\"#dash-count-carousel\" data-slide-to=\"1\"></li>\n";
+                        html += "<li data-target=\"#dash-count-carousel\" data-slide-to=\"2\"></li>\n";
+                        html += "</ol>\n";
 
-                                html = "<div id=\"dash-count-carousel\" class=\"carousel slide\" data-interval=\"1000\" data-ride=\"carousel\">\n" ;
-                                // html += " <!-- Indicators -->\n";
-                                html += "<ol class=\"carousel-indicators\">\n";
-                                html += "<li data-target=\"#dash-count-carousel\" data-slide-to=\"0\" class=\"active\"></li>\n";
-                                html += "<li data-target=\"#dash-count-carousel\" data-slide-to=\"1\"></li>\n";
-                                html += "<li data-target=\"#dash-count-carousel\" data-slide-to=\"2\"></li>\n";
-                                html += "</ol>\n";
+                        //<!-- Wrapper for slides -->
+                        //html += "<div class=\"carousel-inner\">\n" ;
+                        html += "<div class=\"carousel-inner\">\n" ;
+                        html += "<div class=\"item active\">\n" ;
+                        html += "<img src=\"http://placehold.it/1200x480\" alt=\"\" />\n" ;
+                        html += "<div class=\"carousel-caption\">\n" ;
+                        html += "<p>Caption text here</p>\n" ;
+                        html += "</div>\n" ;
+                        html += "</div>\n" ;
+                        html += "<div class=\"item\">\n" ;
+                        html += "<img src=\"http://placehold.it/1200x480\" alt=\"\" />\n" ;
+                        html += "<div class=\"carousel-caption\">\n" ;
+                        html += "<p>Caption text here</p>\n" ;
+                        html += "</div>\n" ;
+                        html += "</div>\n" ;
+                        html += "<div class=\"item\">\n" ;
+                        html += "<img src=\"http://placehold.it/1200x480\" alt=\"\" />\n" ;
+                        html += "<div class=\"carousel-caption\">\n" ;
+                        html += "<p>Caption text here</p>\n" ;
+                        html += "</div>\n" ;
+                        html += "</div>\n" ;
+                        html += "<div class=\"item\">\n" ;
+                        html += "<img src=\"http://placehold.it/1200x480\" alt=\"\" />\n" ;
+                        html += "<div class=\"carousel-caption\">\n" ;
+                        html += "<p>Caption text here</p>\n" ;
+                        html += "</div>\n" ;
+                        html += "</div>\n" ;
+                        html += "</div>\n" ;
 
-                                //<!-- Wrapper for slides -->
-                                //html += "<div class=\"carousel-inner\">\n" ;
-                                html += "<div class=\"carousel-inner\">\n" ;
-                                html += "<div class=\"item active\">\n" ;
-                                html += "<img src=\"http://placehold.it/1200x480\" alt=\"\" />\n" ;
-                                html += "<div class=\"carousel-caption\">\n" ;
-                                html += "<p>Caption text here</p>\n" ;
-                                html += "</div>\n" ;
-                                html += "</div>\n" ;
-                                html += "<div class=\"item\">\n" ;
-                                html += "<img src=\"http://placehold.it/1200x480\" alt=\"\" />\n" ;
-                                html += "<div class=\"carousel-caption\">\n" ;
-                                html += "<p>Caption text here</p>\n" ;
-                                html += "</div>\n" ;
-                                html += "</div>\n" ;
-                                html += "<div class=\"item\">\n" ;
-                                html += "<img src=\"http://placehold.it/1200x480\" alt=\"\" />\n" ;
-                                html += "<div class=\"carousel-caption\">\n" ;
-                                html += "<p>Caption text here</p>\n" ;
-                                html += "</div>\n" ;
-                                html += "</div>\n" ;
-                                html += "<div class=\"item\">\n" ;
-                                html += "<img src=\"http://placehold.it/1200x480\" alt=\"\" />\n" ;
-                                html += "<div class=\"carousel-caption\">\n" ;
-                                html += "<p>Caption text here</p>\n" ;
-                                html += "</div>\n" ;
-                                html += "</div>\n" ;
-                                html += "</div>\n" ;
-
-                               // html += \"<!-- Controls -->\n" ;
-                                html += "<a class=\" carousel-control left\"  href=\"#dash-count-carousel\" role=\"button\" data-slide=\"prev\">\n" ;
-                                html += "<span class=\"icon-prev\" onclick=\"javascript:$(\'.carousel\'').carousel(\'prev\'')\"></span>\n" ;
-                                html += "</a>\n" ;
-                                html += "<a class=\"carousel-control right\"  href=\"#dash-count-carousel\" role=\"button\" data-slide=\"next\">\n" ;
-                                html += "<span class=\"icon-next\"></span>\n" ;
-                                html += "</a>\n" ;
-                                html += "</div>\n" ;
+                        // html += \"<!-- Controls -->\n" ;
+                        html += "<a class=\" carousel-control left\"  href=\"#dash-count-carousel\" role=\"button\" data-slide=\"prev\">\n" ;
+                        html += "<span class=\"icon-prev\" onclick=\"javascript:$(\'.carousel\'').carousel(\'prev\'')\"></span>\n" ;
+                        html += "</a>\n" ;
+                        html += "<a class=\"carousel-control right\"  href=\"#dash-count-carousel\" role=\"button\" data-slide=\"next\">\n" ;
+                        html += "<span class=\"icon-next\"></span>\n" ;
+                        html += "</a>\n" ;
+                        html += "</div>\n" ;
 // <!-- Controls -->
 //   <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
 //     <span class="glyphicon glyphicon-chevron-left"></span>
@@ -77,43 +75,40 @@ angular.module('DashboardCountsWidget', ['RestServices', 'Utilities'])
 //     <span class="glyphicon glyphicon-chevron-right"></span>
 //   </a>
 // </div>
-                                // $('.carousel').carousel({
-                                //   interval: 2000
-                                // })
+                            // $('.carousel').carousel({
+                            //   interval: 2000
+                            // })
 
 
-                        }
-                        else{
-                            html = "<div id=\"count-container\" class=\"panel-body\" style=\"borderBottom:thick solid #0000FF\">\n";
-                            html += "<table class=\"table-bordered\">\n";
-                            html += "<tr>\n";
-                            html += "<td class=\"h2 col-lg-1 text-center\"><a href=/#/home/hosts>" + dashboard.hosts.total+"</a></td>\n";
-                            html += "<td class=\"h2 col-lg-1-1 text-center\"><a href=/#/home/hosts>"+dashboard.hosts.failed+"</a></td>\n";
-                            html += "<td class=\"h2 col-lg-1-1 text-center\"><a href=/#/inventories>"+dashboard.inventories.total+"</a></td>\n";
-                            html += "<td class=\"h2 col-lg-1 text-center\" id=\"sync-failure\"><a href=/#/inventories/?inventory_sources_with_failures>"+dashboard.inventories.inventory_failed+"</a></td>\n";
-                            html += "<td class=\"h2 col-lg-1 text-center\"><a href=/#/projects>"+dashboard.projects.total+"</a></td>\n";
-                            html += "<td class=\"h2 col-lg-1 text-center\"><a href=/#/projects>"+dashboard.projects.failed+"</a></td>\n";
-                            html += "<td class=\"h2 col-lg-1 text-center\"><a href=/#/users>"+dashboard.users.total+"</a></td>\n";
-                            html += "</tr>\n";
-
-                            html += "<tr>\n";
-                            html += "<td class=\"h6 col-lg-1 text-center\">Hosts</td>\n";
-                            html += "<td class=\"h6 col-lg-1 text-center\">Failed Hosts</td>\n";
-                            html += "<td class=\"h6 col-lg-1 text-center\">Inventories</td>\n";
-                            html += "<td class=\"h6 col-lg-1 text-center\">Inventory Sync Failures</td>\n";
-                            html += "<td class=\"h6 col-lg-1 text-center\">Projects</td>\n";
-                            html += "<td class=\"h6 col-lg-1 text-center\">Project Sync Failures</td>\n";
-                            html += "<td class=\"h6 col-lg-1 text-center\">Users</td>\n";
-                            html += "</tr>\n";
-                            html += "</table>\n";
-                            html += "</div>\n";
-                            // html += "<hr>\n";
-
-                        }
-
-
-                        return html;
                     }
+                    else{
+                        html = "<div id=\"count-container\" class=\"panel-body\" style=\"borderBottom:thick solid #0000FF\">\n";
+                        html += "<table class=\"table-bordered\">\n";
+                        html += "<tr>\n";
+                        html += "<td class=\"h2 col-lg-1 text-center\"><a href=/#/home/hosts>" + dashboard.hosts.total+"</a></td>\n";
+                        html += "<td class=\"h2 col-lg-1-1 text-center\"><a href=/#/home/hosts>"+dashboard.hosts.failed+"</a></td>\n";
+                        html += "<td class=\"h2 col-lg-1-1 text-center\"><a href=/#/inventories>"+dashboard.inventories.total+"</a></td>\n";
+                        html += "<td class=\"h2 col-lg-1 text-center\" id=\"sync-failure\"><a href=/#/inventories/?inventory_sources_with_failures>"+dashboard.inventories.inventory_failed+"</a></td>\n";
+                        html += "<td class=\"h2 col-lg-1 text-center\"><a href=/#/projects>"+dashboard.projects.total+"</a></td>\n";
+                        html += "<td class=\"h2 col-lg-1 text-center\"><a href=/#/projects>"+dashboard.projects.failed+"</a></td>\n";
+                        html += "<td class=\"h2 col-lg-1 text-center\"><a href=/#/users>"+dashboard.users.total+"</a></td>\n";
+                        html += "</tr>\n";
+
+                        html += "<tr>\n";
+                        html += "<td class=\"h6 col-lg-1 text-center\">Hosts</td>\n";
+                        html += "<td class=\"h6 col-lg-1 text-center\">Failed Hosts</td>\n";
+                        html += "<td class=\"h6 col-lg-1 text-center\">Inventories</td>\n";
+                        html += "<td class=\"h6 col-lg-1 text-center\">Inventory Sync Failures</td>\n";
+                        html += "<td class=\"h6 col-lg-1 text-center\">Projects</td>\n";
+                        html += "<td class=\"h6 col-lg-1 text-center\">Project Sync Failures</td>\n";
+                        html += "<td class=\"h6 col-lg-1 text-center\">Users</td>\n";
+                        html += "</tr>\n";
+                        html += "</table>\n";
+                        html += "</div>\n";
+                        // html += "<hr>\n";
+                    }
+                    return html;
+                }
 
 
 
@@ -180,13 +175,13 @@ angular.module('DashboardCountsWidget', ['RestServices', 'Utilities'])
 
                 //window.onresize = scaleForSmallDevices;
 
-                function scaleForSmallDevices(){
+                /*function scaleForSmallDevices(){
                     var docw = $(window).width();
                     if(docw<600){
                         alert('success');
                     }
 
-                };
+                };*/
 
             };
         }
diff --git a/awx/ui/static/js/widgets/DashboardJobs.js b/awx/ui/static/js/widgets/DashboardJobs.js
index 9e284354a9..eef3478ff0 100644
--- a/awx/ui/static/js/widgets/DashboardJobs.js
+++ b/awx/ui/static/js/widgets/DashboardJobs.js
@@ -23,6 +23,7 @@ angular.module('DashboardJobsWidget', ['RestServices', 'Utilities'])
             html, e;
 
         html = '';
+        html += "<div class=\"dashboard-jobs-list-container\">\n";
         html += "<ul id=\"job_status_tabs\" class=\"nav nav-tabs\">\n";
         html += "<li class=\"active\"><a id=\"active_jobs_link\" ng-click=\"toggleTab($event, 'active_jobs_link', 'job_status_tabs')\"\n";
         html += " href=\"#active-jobs-tab\" data-toggle=\"tab\">Jobs</a></li>\n";
@@ -39,6 +40,7 @@ angular.module('DashboardJobsWidget', ['RestServices', 'Utilities'])
         html += "</div>\n"; //list
         html += "</div>\n"; //active-jobs-tab
         html += "<div class=\"tab-pane\" id=\"scheduled-jobs-tab\"></div>\n";
+        html += "</div>\n"; // jobs-list-container
         html += "</div>\n";
 
         e = angular.element(document.getElementById(target));
diff --git a/awx/ui/static/js/widgets/HostGraph.js b/awx/ui/static/js/widgets/HostGraph.js
index 526b82ff70..37cd684578 100644
--- a/awx/ui/static/js/widgets/HostGraph.js
+++ b/awx/ui/static/js/widgets/HostGraph.js
@@ -68,11 +68,11 @@ angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
                                     });
 
                                     chart.yAxis     //Chart y-axis settings
-                                  .axisLabel('Hosts')
-                                  .tickFormat(d3.format('.f'));
+                                    .axisLabel('Hosts')
+                                    .tickFormat(d3.format('.f'));
 
                                     d3.select('.host-count-graph svg')
-                                  .datum(data).transition()
+                                    .datum(data).transition()
                                         .attr('width', width)
                                         .attr('height', height)
                                         .duration(500)
@@ -86,9 +86,9 @@ angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
                                             "src": "url(/static/fonts/OpenSans-Regular.ttf)"
                                         });
 
-                                        d3.selectAll(".nv-line").on("click", function () {
-                                            alert("clicked");
-                                        });
+                                    d3.selectAll(".nv-line").on("click", function () {
+                                        alert("clicked");
+                                    });
 
                                     nv.utils.windowResize(chart.update);
                                     return chart;
diff --git a/awx/ui/static/js/widgets/JobStatusGraph.js b/awx/ui/static/js/widgets/JobStatusGraph.js
index cb2aecca6e..9090844665 100644
--- a/awx/ui/static/js/widgets/JobStatusGraph.js
+++ b/awx/ui/static/js/widgets/JobStatusGraph.js
@@ -101,7 +101,7 @@ angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
                     });
                 }
 
-                function makeHostCountGraph(){
+                /*function makeHostCountGraph(){
                     d3.json("static/js/hostcount.json",function(error,data) {
 
                         data.map(function(series) {
@@ -149,9 +149,9 @@ angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
                                             "src": "url(/static/fonts/OpenSans-Regular.ttf)"
                                         });
 
-                                        d3.selectAll(".nv-line").on("click", function () {
-                                            alert("clicked");
-                                        });
+                                    d3.selectAll(".nv-line").on("click", function () {
+                                        alert("clicked");
+                                    });
 
                                     nv.utils.windowResize(chart.update);
                                     return chart;
@@ -160,6 +160,7 @@ angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
                         });
                     });
                 }
+                */
 
                 element = angular.element(document.getElementById(target));
                 element.html(html);
diff --git a/awx/ui/static/less/new-dashboard.less b/awx/ui/static/less/new-dashboard.less
index b4d6ca21e5..fd87a7cfdb 100644
--- a/awx/ui/static/less/new-dashboard.less
+++ b/awx/ui/static/less/new-dashboard.less
@@ -27,11 +27,12 @@
   stroke: steelblue;
   stroke-width: 1.5px;
 }
-.jobs-list-container {
-        border: 1px solid @grey;
-        border-radius: 4px;
-        padding: 5px;
-    }
+
+.dashboard-jobs-list-container {
+    border: 1px solid @grey;
+    border-radius: 4px;
+    padding: 5px;
+}
 
 .carousel-control.left, .carousel-control.right {
     background-image: none
diff --git a/awx/ui/templates/ui/index.html b/awx/ui/templates/ui/index.html
index 0dab0915ab..28ffc3f860 100644
--- a/awx/ui/templates/ui/index.html
+++ b/awx/ui/templates/ui/index.html
@@ -201,7 +201,7 @@
                       <span class="icon-bar"></span>
                       <span class="icon-bar"></span>
                     </button>
-                    <a class="navbar-brand" href="http://www.ansible.com" target="_blank"><img id="ansible-brand-logo" src="{{ STATIC_URL }}img/tower_console_bug_black.png" /></a>
+                    <a class="navbar-brand" href="#home"><img id="ansible-brand-logo" src="{{ STATIC_URL }}img/tower_console_bug_black.png" /></a>
                 </div>
                 <div class="navbar-collapse collapse" id="main-navbar-collapse">
                     <ul class="nav navbar-nav" id="ansible-main-menu">