From 816cc98658ab390f52a2252f43f699d83e28be4c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel.odegaard@gmail.com>
Date: Fri, 20 Dec 2013 08:37:48 +0100
Subject: [PATCH] working on graphite target editor

---
 src/app/controllers/graphiteTarget.js  | 12 +++++++++---
 src/app/panels/graphite/editor.html    |  5 ++---
 src/vendor/bootstrap/less/grafana.less |  2 ++
 3 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/src/app/controllers/graphiteTarget.js b/src/app/controllers/graphiteTarget.js
index 043013723f6..e45452d1a3b 100644
--- a/src/app/controllers/graphiteTarget.js
+++ b/src/app/controllers/graphiteTarget.js
@@ -14,15 +14,21 @@ function (angular, _) {
         var strSegments = $scope.target.target.split('.');
         _.each(strSegments, function (segment, index) {
           if (segment === '*') {
-            segment = '<i class="icon-asterisk"><i>';
+            $scope.segments[index] = { val: segment, html: '<i class="icon-asterisk"><i>' };
+            return;
           }
 
-          $scope.segments[index] = { val: segment };
+          $scope.segments[index] = { val: segment, html: segment};
         });
       };
 
       $scope.setSegmentStar = function (index) {
-        $scope.segments[index] = {val: '<i class="icon-asterisk"><i>' };
+        $scope.segments[index].val = '*';
+        $scope.segments[index].html = '<i class="icon-asterisk"><i>';
+        $scope.target.target = _.reduce($scope.segments, function(result, segment) {
+            return result ? (result + "." + segment.val) : segment.val;
+          }, null);
+        $scope.targetChanged();
       };
 
       $scope.targetChanged = function() {
diff --git a/src/app/panels/graphite/editor.html b/src/app/panels/graphite/editor.html
index 2a2770409f3..78acd39e92e 100644
--- a/src/app/panels/graphite/editor.html
+++ b/src/app/panels/graphite/editor.html
@@ -15,7 +15,6 @@
     .grafana-segment-list {
       list-style: none;
       margin: 0;
-      margin-left: 5px;
     }
     .grafana-segment-list li {
       float: left;
@@ -42,13 +41,13 @@
 
     <table style="margin: 0; padding: 0;width:100%;">
       <tr class="grafana-target-top">
-        <td style="padding-left: 5px;"><i class="icon-eye-open"></i></td>
+        <td style="padding-left: 10px;"><i class="icon-eye-open"></i></td>
         <td>
           <ul class="grafana-segment-list">
           <li class="dropdown" ng-repeat="segment in segments">
             <a  class="grafana-target-segment dropdown-toggle"
                 data-toggle="dropdown"
-                data-placement="bottom" ng-bind-html-unsafe="segment.val"></a>
+                data-placement="bottom" ng-bind-html-unsafe="segment.html"></a>
             <ul class="dropdown-menu">
               <li>
                 <a ng-click="setSegmentStar($index)">All <i class="icon-star" /></a>
diff --git a/src/vendor/bootstrap/less/grafana.less b/src/vendor/bootstrap/less/grafana.less
index 199afaf33f1..51771d50441 100644
--- a/src/vendor/bootstrap/less/grafana.less
+++ b/src/vendor/bootstrap/less/grafana.less
@@ -80,6 +80,8 @@
   border-top: 1px solid #3e444c;
   padding: 0 10px 10px 10px;
   background: #202328;
+  overflow-y: auto;
+  height: 600px;
 }
 
 .grafana-legend-container {