graphite: minor changes

public/app/core/components/form_dropdown/form_dropdown.ts

@@ -1,5 +1,3 @@
-///<reference path="../../../headers/common.d.ts" />
-
 import _ from 'lodash';
 import $ from 'jquery';
 import coreModule from '../../core_module';
@@ -201,9 +199,9 @@ export class FormDropdownCtrl {
   }
 
   open() {
-    this.inputElement.show();
-
     this.inputElement.css('width', (Math.max(this.linkElement.width(), 80) + 16) + 'px');
+
+    this.inputElement.show();
     this.inputElement.focus();
 
     this.linkElement.hide();

public/app/core/services/segment_srv.js

@@ -103,7 +103,7 @@ function (angular, _, coreModule) {
     };
 
     this.newPlusButton = function() {
-      return new MetricSegment({fake: true, html: '<i class="fa fa-plus "></i>', type: 'plus-button' });
+      return new MetricSegment({fake: true, html: '<i class="fa fa-plus "></i>', type: 'plus-button', cssClass: 'query-part' });
     };
 
     this.newSelectTagValue = function() {

public/app/plugins/datasource/graphite/graphite_query.ts

@@ -25,6 +25,7 @@ export default class GraphiteQuery {
   parseTarget() {
     this.functions = [];
     this.segments = [];
+    this.tags = [];
     this.error = null;
 
     if (this.target.textEditor) {

public/app/plugins/datasource/graphite/partials/query.editor.html

@@ -7,7 +7,7 @@
   <div ng-hide="ctrl.target.textEditor">
     <div class="gf-form-inline">
       <div class="gf-form">
-        <label class="gf-form-label width-6 query-keyword">Metrics</label>
+        <label class="gf-form-label width-6 query-keyword">Series</label>
       </div>
 
       <div ng-repeat="tag in ctrl.queryModel.tags" class="gf-form">
@@ -17,13 +17,14 @@
         </gf-form-dropdown>
         <gf-form-dropdown model="tag.operator" lookup-text="false" allow-custom="false" label-mode="true" css-class="query-segment-operator"
           get-options="ctrl.getTagOperators()"
-          on-change="ctrl.tagChanged(tag, $index)">
+          on-change="ctrl.tagChanged(tag, $index)"
+					min-input-width="30">
         </gf-form-dropdown>
         <gf-form-dropdown model="tag.value" lookup-text="false" allow-custom="false" label-mode="true" css-class="query-segment-value"
           get-options="ctrl.getTagValues(tag, $index, $query)"
           on-change="ctrl.tagChanged(tag, $index)">
         </gf-form-dropdown>
-        <label class="gf-form-label query-keyword" ng-if="ctrl.showDelimiter($index)">,</label>
+        <label class="gf-form-label query-keyword" ng-if="ctrl.showDelimiter($index)">AND</label>
       </div>
 
       <div ng-repeat="segment in ctrl.segments" role="menuitem" class="gf-form">
@@ -31,9 +32,7 @@
       </div>
 
       <div ng-if="ctrl.queryModel.seriesByTagUsed" ng-repeat="segment in ctrl.addTagSegments" role="menuitem" class="gf-form">
-        <metric-segment segment="segment"
-          get-options="ctrl.getTagsAsSegments()"
-          on-change="ctrl.addNewTag(segment)">
+        <metric-segment segment="segment" get-options="ctrl.getTagsAsSegments()" on-change="ctrl.addNewTag(segment)">
         </metric-segment>
       </div>
 

public/app/plugins/datasource/graphite/query_ctrl.ts

@@ -47,6 +47,7 @@ export class GraphiteQueryCtrl extends QueryCtrl {
     this.segments = _.map(this.queryModel.segments, segment => {
       return this.uiSegmentSrv.newSegment(segment);
     });
+
     let checkOtherSegmentsIndex = this.queryModel.checkOtherSegmentsIndex || 0;
     this.checkOtherSegments(checkOtherSegmentsIndex);