From 1e64c7cc70398513e37db56475e269d51ea49041 Mon Sep 17 00:00:00 2001
From: Chris Cowan <chris@chriscowan.us>
Date: Tue, 17 Jan 2017 14:57:13 -0700
Subject: [PATCH] adding index pattern option to series

---
 .../components/vis_editor/aggs/calculation.js |  4 +--
 .../vis_editor/aggs/cumulative_sum.js         |  4 +--
 .../components/vis_editor/aggs/derivative.js  |  4 +--
 .../vis_editor/aggs/field_select.js           | 12 +++++--
 .../vis_editor/aggs/moving_average.js         |  4 +--
 .../components/vis_editor/aggs/percentile.js  |  6 ++--
 .../components/vis_editor/aggs/series_agg.js  |  4 +--
 .../components/vis_editor/aggs/std_agg.js     |  7 ++--
 .../vis_editor/aggs/std_deviation.js          |  7 ++--
 .../components/vis_editor/aggs/std_sibling.js |  4 +--
 .../components/vis_editor/index_pattern.js    | 35 +++++++++++++------
 .../public/components/vis_editor/series.js    |  6 ++--
 .../vis_editor/series/gauge/series.js         |  6 ++--
 .../vis_editor/series/markdown/series.js      |  6 ++--
 .../vis_editor/series/metric/series.js        |  6 ++--
 .../vis_editor/series/timeseries/config.js    | 21 ++++++++---
 .../vis_editor/series/timeseries/series.js    |  6 ++--
 .../vis_editor/series/top_n/series.js         |  7 ++--
 .../components/vis_editor/series_editor.js    |  2 +-
 .../public/components/vis_editor/split.js     |  4 ++-
 .../components/vis_editor/vis_config/gauge.js |  8 ++---
 .../vis_editor/vis_config/markdown.js         |  6 ++--
 .../vis_editor/vis_config/metric.js           |  8 ++---
 .../vis_editor/vis_config/timeseries.js       |  8 ++---
 .../components/vis_editor/vis_config/top_n.js |  8 ++---
 .../metrics/public/lib/fetch_fields.js        |  5 ++-
 .../metrics/public/vis/editor_controller.js   | 12 +++++--
 .../metrics/server/lib/bucket_transform.js    |  2 +-
 28 files changed, 137 insertions(+), 75 deletions(-)

diff --git a/src/core_plugins/metrics/public/components/vis_editor/aggs/calculation.js b/src/core_plugins/metrics/public/components/vis_editor/aggs/calculation.js
index 9a5c6140bafa94..bc2d1a18a624c6 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/aggs/calculation.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/aggs/calculation.js
@@ -21,7 +21,7 @@ export default React.createClass({
   },
 
   render() {
-    const { model, panelType, siblings } = this.props;
+    const { model, panel, siblings } = this.props;
     const handleChange = createChangeHandler(this.props.onChange, model);
     const handleSelectChange = createSelectHandler(handleChange);
     const handleTextChange = createTextHandler(handleChange, this.refs);
@@ -33,7 +33,7 @@ export default React.createClass({
             <div className="vis_editor__label">Aggregation</div>
             <AggSelect
               siblings={this.props.siblings}
-              panelType={panelType}
+              panelType={panel.type}
               value={model.type}
               onChange={handleSelectChange('type')}/>
             <div className="vis_editor__row_item" style={{ margin: '10px 0' }}>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/aggs/cumulative_sum.js b/src/core_plugins/metrics/public/components/vis_editor/aggs/cumulative_sum.js
index 35b171fe66c3a5..6760cd2cea4a41 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/aggs/cumulative_sum.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/aggs/cumulative_sum.js
@@ -6,7 +6,7 @@ import createChangeHandler from '../lib/create_change_handler';
 import createSelectHandler from '../../../lib/create_select_handler';
 export default React.createClass({
   render() {
-    const { model, panelType, siblings } = this.props;
+    const { model, panel, siblings } = this.props;
     const handleChange = createChangeHandler(this.props.onChange, model);
     const handleSelectChange = createSelectHandler(handleChange);
     return (
@@ -15,7 +15,7 @@ export default React.createClass({
           <div className="vis_editor__label">Aggregation</div>
           <AggSelect
             siblings={this.props.siblings}
-            panelType={panelType}
+            panelType={panel.type}
             value={model.type}
             onChange={handleSelectChange('type')}/>
         </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/aggs/derivative.js b/src/core_plugins/metrics/public/components/vis_editor/aggs/derivative.js
index 87c1880878038d..53c30c1e3c398c 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/aggs/derivative.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/aggs/derivative.js
@@ -9,7 +9,7 @@ import createTextHandler from '../../../lib/create_text_handler';
 export default React.createClass({
 
   render() {
-    const { model, siblings, panelType } = this.props;
+    const { model, siblings, panel } = this.props;
 
     const handleChange = createChangeHandler(this.props.onChange, model);
     const handleSelectChange = createSelectHandler(handleChange);
@@ -21,7 +21,7 @@ export default React.createClass({
           <div className="vis_editor__label">Aggregation</div>
           <AggSelect
             siblings={this.props.siblings}
-            panelType={panelType}
+            panelType={panel.type}
             value={model.type}
             onChange={handleSelectChange('type')}/>
         </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/aggs/field_select.js b/src/core_plugins/metrics/public/components/vis_editor/aggs/field_select.js
index 7767e38d4dba9e..0eb8c3f672bd7c 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/aggs/field_select.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/aggs/field_select.js
@@ -7,15 +7,20 @@ import generateByTypeFilter from '../../../lib/generate_by_type_filter';
 export default React.createClass({
 
   getDefaultProps() {
-    return { restrict: 'none', style: {} };
+    return {
+      indexPattern: '*',
+      disabled: false,
+      restrict: 'none',
+      style: {}
+    };
   },
 
   render() {
-    const { type, fields } = this.props;
+    const { type, fields, indexPattern } = this.props;
     if (type === 'count') {
       return (<div style={{ display: 'none' }}/>);
     }
-    const options = fields
+    const options = (fields[indexPattern] || [])
     .filter(generateByTypeFilter(this.props.restrict))
     .map(field => {
       return { label: field.name, value: field.name };
@@ -24,6 +29,7 @@ export default React.createClass({
     return (
       <Select
         placeholder="Select field..."
+        disabled={this.props.disabled}
         options={options}
         value={this.props.value}
         onChange={this.props.onChange}/>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/aggs/moving_average.js b/src/core_plugins/metrics/public/components/vis_editor/aggs/moving_average.js
index 68300a0778139e..991d0b4f57408f 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/aggs/moving_average.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/aggs/moving_average.js
@@ -9,7 +9,7 @@ import createTextHandler from '../../../lib/create_text_handler';
 import createNumberHandler from '../../../lib/create_number_handler';
 export default React.createClass({
   render() {
-    const { model, panelType, siblings } = this.props;
+    const { model, panel, siblings } = this.props;
     const handleChange = createChangeHandler(this.props.onChange, model);
     const handleSelectChange = createSelectHandler(handleChange);
     const handleTextChange = createTextHandler(handleChange, this.refs);
@@ -33,7 +33,7 @@ export default React.createClass({
               <div className="vis_editor__label">Aggregation</div>
               <AggSelect
                 siblings={this.props.siblings}
-                panelType={panelType}
+                panelType={panel.type}
                 value={model.type}
                 onChange={handleSelectChange('type')}/>
             </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/aggs/percentile.js b/src/core_plugins/metrics/public/components/vis_editor/aggs/percentile.js
index 24fff852da20e0..56b59c9c919420 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/aggs/percentile.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/aggs/percentile.js
@@ -114,11 +114,12 @@ export default React.createClass({
   },
 
   render() {
-    const { model, panelType, fields } = this.props;
+    const { model, panel, fields } = this.props;
 
     const handleChange = createChangeHandler(this.props.onChange, model);
     const handleSelectChange = createSelectHandler(handleChange);
     const handleNumberChange = createNumberHandler(handleChange);
+    const indexPattern = model.override_index_pattern && model.series_index_pattern || panel.index_pattern;
 
     return (
       <AggRow {...this.props}>
@@ -128,7 +129,7 @@ export default React.createClass({
               <div className="vis_editor__label">Aggregation</div>
               <AggSelect
                 siblings={this.props.siblings}
-                panelType={panelType}
+                panelType={panel.type}
                 value={model.type}
                 onChange={handleSelectChange('type')}/>
             </div>
@@ -138,6 +139,7 @@ export default React.createClass({
                 fields={fields}
                 type={model.type}
                 restrict="numeric"
+                indexPattern={indexPattern}
                 value={model.field}
                 onChange={handleSelectChange('field')}/>
             </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/aggs/series_agg.js b/src/core_plugins/metrics/public/components/vis_editor/aggs/series_agg.js
index 6a69e8a91076d6..d4ab93b25fc83d 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/aggs/series_agg.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/aggs/series_agg.js
@@ -8,7 +8,7 @@ import createSelectHandler from '../../../lib/create_select_handler';
 export default React.createClass({
 
   render() {
-    const { model, panelType, fields } = this.props;
+    const { model, panel, fields } = this.props;
 
     const handleChange = createChangeHandler(this.props.onChange, model);
     const handleSelectChange = createSelectHandler(handleChange);
@@ -31,7 +31,7 @@ export default React.createClass({
           <div className="vis_editor__label">Aggregation</div>
           <AggSelect
             siblings={this.props.siblings}
-            panelType={panelType}
+            panelType={panel.type}
             value={model.type}
             onChange={handleSelectChange('type')}/>
         </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/aggs/std_agg.js b/src/core_plugins/metrics/public/components/vis_editor/aggs/std_agg.js
index 1ee75212830dd2..5ceaf98b238c1f 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/aggs/std_agg.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/aggs/std_agg.js
@@ -8,7 +8,7 @@ import createSelectHandler from '../../../lib/create_select_handler';
 export default React.createClass({
 
   render() {
-    const { model, panelType, fields } = this.props;
+    const { model, panel, fields } = this.props;
 
     const handleChange = createChangeHandler(this.props.onChange, model);
     const handleSelectChange = createSelectHandler(handleChange);
@@ -17,13 +17,15 @@ export default React.createClass({
       restrict = 'string';
     }
 
+    const indexPattern = model.override_index_pattern || model.series_index_pattern || panel.index_pattern;
+
     return (
       <AggRow {...this.props}>
         <div className="vis_editor__item">
           <div className="vis_editor__label">Aggregation</div>
           <AggSelect
             siblings={this.props.siblings}
-            panelType={panelType}
+            panelType={panel.type}
             value={model.type}
             onChange={handleSelectChange('type')}/>
         </div>
@@ -33,6 +35,7 @@ export default React.createClass({
             fields={fields}
             type={model.type}
             restrict={restrict}
+            indexPattern={indexPattern}
             value={model.field}
             onChange={handleSelectChange('field')}/>
         </div>) : (<div style={{ display: 'none' }}/>) }
diff --git a/src/core_plugins/metrics/public/components/vis_editor/aggs/std_deviation.js b/src/core_plugins/metrics/public/components/vis_editor/aggs/std_deviation.js
index bb0b80839ea61b..b301cb4ba18570 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/aggs/std_deviation.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/aggs/std_deviation.js
@@ -11,7 +11,7 @@ import createTextHandler from '../../../lib/create_text_handler';
 export default React.createClass({
 
   render() {
-    const { model, panelType, fields } = this.props;
+    const { model, panel, fields } = this.props;
 
     const modeOptions = [
       { label: 'Raw', value: 'raw' },
@@ -24,13 +24,15 @@ export default React.createClass({
     const handleSelectChange = createSelectHandler(handleChange);
     const handleTextChange = createTextHandler(handleChange, this.refs);
 
+    const indexPattern = model.override_index_pattern && model.series_index_pattern || panel.index_pattern;
+
     return (
       <AggRow {...this.props}>
         <div className="vis_editor__row_item">
           <div className="vis_editor__label">Aggregation</div>
           <AggSelect
             siblings={this.props.siblings}
-            panelType={panelType}
+            panelType={panel.type}
             value={model.type}
             onChange={handleSelectChange('type')}/>
         </div>
@@ -40,6 +42,7 @@ export default React.createClass({
             fields={fields}
             type={model.type}
             restrict="numeric"
+            indexPattern={indexPattern}
             value={model.field}
             onChange={handleSelectChange('field')}/>
         </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/aggs/std_sibling.js b/src/core_plugins/metrics/public/components/vis_editor/aggs/std_sibling.js
index a59290704fe5c0..18fb2062b54cd2 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/aggs/std_sibling.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/aggs/std_sibling.js
@@ -11,7 +11,7 @@ import createTextHandler from '../../../lib/create_text_handler';
 
 export default React.createClass({
   render() {
-    const { model, siblings, panelType } = this.props;
+    const { model, siblings, panel } = this.props;
 
     const handleChange = createChangeHandler(this.props.onChange, model);
     const handleSelectChange = createSelectHandler(handleChange);
@@ -54,7 +54,7 @@ export default React.createClass({
           <div className="vis_editor__label">Aggregation</div>
           <AggSelect
             siblings={this.props.siblings}
-            panelType={panelType}
+            panelType={panel.type}
             value={model.type}
             onChange={handleSelectChange('type')}/>
         </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/index_pattern.js b/src/core_plugins/metrics/public/components/vis_editor/index_pattern.js
index 13a6f769af3dcb..fdd024747f7cbb 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/index_pattern.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/index_pattern.js
@@ -5,32 +5,47 @@ import createSelectHandler from '../../lib/create_select_handler';
 import createTextHandler from '../../lib/create_text_handler';
 export default React.createClass({
 
+  getDefaultProps() {
+    return {
+      prefix: '',
+      disabled: false,
+      className: 'vis_editor__row'
+    };
+  },
+
   render() {
-    const { model, fields } = this.props;
+    const { model, fields, prefix } = this.props;
     const handleSelectChange = createSelectHandler(this.props.onChange);
     const handleTextChange = createTextHandler(this.props.onChange, this.refs);
+    const timeFieldName = `${prefix}time_field`;
+    const indexPatternName = `${prefix}index_pattern`;
+    const intervalName = `${prefix}interval`;
     return (
-      <div className="vis_editor__row">
+      <div className={this.props.className}>
         <div className="vis_editor__label">Index Pattern</div>
         <input
           className="vis_editor__input"
-          ref="index_pattern"
-          onChange={handleTextChange('index_pattern', '*')}
-          defaultValue={model.index_pattern || '*'}/>
+          ref={indexPatternName}
+          disabled={this.props.disabled}
+          onChange={handleTextChange(indexPatternName, '*')}
+          defaultValue={model[indexPatternName] || '*'}/>
         <div className="vis_editor__label">Time Field</div>
         <div className="vis_editor__index_pattern-fields">
           <FieldSelect
             restrict="date"
-            value={model.time_field}
-            onChange={handleSelectChange('time_field')}
+            value={model[timeFieldName]}
+            disabled={this.props.disabled}
+            onChange={handleSelectChange(timeFieldName)}
+            indexPattern={model[indexPatternName]}
             fields={fields}/>
         </div>
         <div className="vis_editor__label">Interval (auto, 1m, 1d, 1w, 1y)</div>
         <input
           className="vis_editor__input"
-          ref="interval"
-          onChange={handleTextChange('interval', 'auto')}
-          defaultValue={model.interval || 'auto'}/>
+          ref={intervalName}
+          disabled={this.props.disabled}
+          onChange={handleTextChange(intervalName, 'auto')}
+          defaultValue={model[intervalName] || 'auto'}/>
       </div>
     );
   }
diff --git a/src/core_plugins/metrics/public/components/vis_editor/series.js b/src/core_plugins/metrics/public/components/vis_editor/series.js
index 24db69fb1d52e4..88e34cb3de60b3 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/series.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/series.js
@@ -47,8 +47,8 @@ export default sortable(React.createClass({
   },
 
   render() {
-    const { panelType } = this.props;
-    const Component = lookup[panelType];
+    const { panel } = this.props;
+    const Component = lookup[panel.type];
     if (Component) {
       const params = {
         switchTab: this.switchTab,
@@ -59,6 +59,6 @@ export default sortable(React.createClass({
       };
       return (<Component {...params}/>);
     }
-    return (<div>Missing Series component for panel type: {panelType}</div>);
+    return (<div>Missing Series component for panel type: {panel.type}</div>);
   }
 }));
diff --git a/src/core_plugins/metrics/public/components/vis_editor/series/gauge/series.js b/src/core_plugins/metrics/public/components/vis_editor/series/gauge/series.js
index b4c6e2ca0771ce..8564b99ac126f3 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/series/gauge/series.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/series/gauge/series.js
@@ -18,12 +18,12 @@ export default React.createClass({
 
   renderRow(row, index, items) {
     const { props } = this;
-    const { model, fields } = props;
+    const { panel, model, fields } = props;
     return (
       <Agg
         key={row.id}
         sortData={row.id}
-        panelType={model.type}
+        panel={panel}
         siblings={items}
         model={row}
         onAdd={handleAdd.bind(null, props, newMetricAggFn)}
@@ -36,6 +36,7 @@ export default React.createClass({
 
   render() {
     const {
+      panel,
       model,
       fields,
       onAdd,
@@ -86,6 +87,7 @@ export default React.createClass({
                 <Split
                   onChange={this.props.handleChange}
                   fields={fields}
+                  panel={panel}
                   model={model}/>
               </div>
             </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/series/markdown/series.js b/src/core_plugins/metrics/public/components/vis_editor/series/markdown/series.js
index 421f65bf9d4254..5b645f164e46f2 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/series/markdown/series.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/series/markdown/series.js
@@ -19,12 +19,12 @@ export default React.createClass({
 
   renderRow(row, index, items) {
     const { props } = this;
-    const { model, fields } = props;
+    const { panel, model, fields } = props;
     return (
       <Agg
         key={row.id}
         sortData={row.id}
-        panelType={model.type}
+        panel={panel}
         siblings={items}
         model={row}
         onAdd={handleAdd.bind(null, props, newMetricAggFn)}
@@ -37,6 +37,7 @@ export default React.createClass({
 
   render() {
     const {
+      panel,
       model,
       fields,
       onAdd,
@@ -87,6 +88,7 @@ export default React.createClass({
                 <Split
                   onChange={this.props.handleChange}
                   fields={fields}
+                  panel={panel}
                   model={model}/>
               </div>
             </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/series/metric/series.js b/src/core_plugins/metrics/public/components/vis_editor/series/metric/series.js
index 3ac94e90668a25..bb1ae3b89b8e0f 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/series/metric/series.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/series/metric/series.js
@@ -18,12 +18,12 @@ export default React.createClass({
 
   renderRow(row, index, items) {
     const { props } = this;
-    const { model, fields } = props;
+    const { panel, model, fields } = props;
     return (
       <Agg
         key={row.id}
         sortData={row.id}
-        panelType={model.type}
+        panel={panel}
         siblings={items}
         model={row}
         onAdd={handleAdd.bind(null, props, newMetricAggFn)}
@@ -37,6 +37,7 @@ export default React.createClass({
   render() {
     const {
       model,
+      panel,
       fields,
       onAdd,
       onDelete,
@@ -86,6 +87,7 @@ export default React.createClass({
                 <Split
                   onChange={this.props.handleChange}
                   fields={fields}
+                  panel={panel}
                   model={model}/>
               </div>
             </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/series/timeseries/config.js b/src/core_plugins/metrics/public/components/vis_editor/series/timeseries/config.js
index 1a3dae407f63a0..f41770091fd992 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/series/timeseries/config.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/series/timeseries/config.js
@@ -4,6 +4,7 @@ import DataFormatPicker from 'plugins/metrics/components/vis_editor/data_format_
 import createSelectHandler from 'plugins/metrics/lib/create_select_handler';
 import YesNo from 'plugins/metrics/components/yes_no';
 import createTextHandler from 'plugins/metrics/lib/create_text_handler';
+import IndexPattern from 'plugins/metrics/components/vis_editor/index_pattern';
 
 export default React.createClass({
   render() {
@@ -135,7 +136,8 @@ export default React.createClass({
                 value={model.hide_in_legend}
                 name="hide_in_legend"
                 onChange={this.props.onChange}/>
-              <div className="vis_editor__label">Axis Max</div>
+          </div>
+          <div className="vis_editor__series_config-row">
               <div className="vis_editor__label">Separate Axis</div>
               <YesNo
                 value={model.seperate_axis}
@@ -167,10 +169,19 @@ export default React.createClass({
                   onChange={handleSelectChange('axis_position')}/>
               </div>
           </div>
-          { model.seperate_axis ? (
-            <div className="vis_editor__row" style={{ fontSize: 12 }}>
-            </div>
-          ) : (<div style={{ display:'none' }}/>) }
+          <div className="vis_editor__series_config-row">
+            <div className="vis_editor__label">Override Index Pattern</div>
+            <YesNo
+              value={model.override_index_pattern}
+              name="override_index_pattern"
+              onChange={this.props.onChange}/>
+            <IndexPattern
+              {...this.props}
+              prefix="series_"
+              className="vis_editor__row_item vis_editor__row"
+              disabled={!model.override_index_pattern}
+              with-interval={true} />
+          </div>
         </div>
       </div>
     );
diff --git a/src/core_plugins/metrics/public/components/vis_editor/series/timeseries/series.js b/src/core_plugins/metrics/public/components/vis_editor/series/timeseries/series.js
index d3ac25bc809c51..1f9c0f633d6df7 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/series/timeseries/series.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/series/timeseries/series.js
@@ -18,12 +18,12 @@ export default React.createClass({
 
   renderRow(row, index, items) {
     const { props } = this;
-    const { model, fields } = props;
+    const { model, panel, fields } = props;
     return (
       <Agg
         key={row.id}
         sortData={row.id}
-        panelType={model.type}
+        panel={panel}
         siblings={items}
         model={row}
         onAdd={handleAdd.bind(null, props, newMetricAggFn)}
@@ -37,6 +37,7 @@ export default React.createClass({
   render() {
     const {
       model,
+      panel,
       fields,
       onAdd,
       onDelete,
@@ -87,6 +88,7 @@ export default React.createClass({
                 <Split
                   onChange={this.props.handleChange}
                   fields={fields}
+                  panel={panel}
                   model={model}/>
               </div>
             </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/series/top_n/series.js b/src/core_plugins/metrics/public/components/vis_editor/series/top_n/series.js
index 5d167dee5d0ee1..c7efc4ca6f7989 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/series/top_n/series.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/series/top_n/series.js
@@ -7,7 +7,6 @@ import AddDeleteButtons from 'plugins/metrics/components/add_delete_buttons';
 import SeriesConfig from './config';
 import Sortable from 'react-anything-sortable';
 import Tooltip from 'plugins/metrics/components/tooltip';
-import FieldSelect from 'plugins/metrics/components/vis_editor/aggs/field_select';
 import MetricSelect from 'plugins/metrics/components/vis_editor/aggs/metric_select';
 import createSelectHandler from 'plugins/metrics/lib/create_select_handler';
 import createTextHandler from 'plugins/metrics/lib/create_text_handler';
@@ -24,12 +23,12 @@ export default React.createClass({
 
   renderRow(row, index, items) {
     const { props } = this;
-    const { model, fields } = props;
+    const { panel, model, fields } = props;
     return (
       <Agg
         key={row.id}
         sortData={row.id}
-        panelType={model.type}
+        panel={panel}
         siblings={items}
         model={row}
         onAdd={handleAdd.bind(null, props, newMetricAggFn)}
@@ -42,6 +41,7 @@ export default React.createClass({
 
   render() {
     const {
+      panel,
       model,
       fields,
       onAdd,
@@ -88,6 +88,7 @@ export default React.createClass({
                 <Split
                   onChange={this.props.handleChange}
                   fields={fields}
+                  panel={panel}
                   model={model}/>
               </div>
             </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/series_editor.js b/src/core_plugins/metrics/public/components/vis_editor/series_editor.js
index b06f296df47609..266e61222a2a28 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/series_editor.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/series_editor.js
@@ -47,7 +47,7 @@ export default React.createClass({
         key={row.id}
         sortData={row.id}
         model={row}
-        panelType={model.type}
+        panel={model}
         onClone={() => this.handleClone(row)}
         onAdd={handleAdd.bind(null, props, newSeriesFn)}
         onDelete={handleDelete.bind(null, props, row)}
diff --git a/src/core_plugins/metrics/public/components/vis_editor/split.js b/src/core_plugins/metrics/public/components/vis_editor/split.js
index 9c24af8a21c0e1..b21b6ed3479119 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/split.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/split.js
@@ -24,12 +24,13 @@ export default React.createClass({
   },
 
   render() {
-    const { model } = this.props;
+    const { model, panel } = this.props;
     const modeOptions = [
       { label: 'Everything', value: 'everything' },
       { label: 'Filter', value: 'filter' },
       { label: 'Terms', value: 'terms' }
     ];
+    const indexPattern = model.override_index_pattern && model.series_index_pattern || panel.index_pattern;
     const modeSelect = (
       <div className="vis_editor__split-selects">
         <Select
@@ -64,6 +65,7 @@ export default React.createClass({
           <div className="vis_editor__item">
             <FieldSelect
               restrict="string"
+              IndexPattern={indexPattern}
               onChange={this.handleSelectChange('terms_field')}
               value={model.terms_field}
               fields={this.props.fields} />
diff --git a/src/core_plugins/metrics/public/components/vis_editor/vis_config/gauge.js b/src/core_plugins/metrics/public/components/vis_editor/vis_config/gauge.js
index 480f60bb7ad50a..8b7a05476fc758 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/vis_config/gauge.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/vis_config/gauge.js
@@ -26,7 +26,7 @@ export default React.createClass({
   },
 
   getInitialState() {
-    return { selectedTab: 'series' };
+    return { selectedTab: 'data' };
   },
 
   switchTab(selectedTab) {
@@ -48,7 +48,7 @@ export default React.createClass({
       { label: 'Half Circle', value: 'half' }
     ];
     let view;
-    if (selectedTab === 'series') {
+    if (selectedTab === 'data') {
       view = (<SeriesEditor limit={1} colorPicker={true} {...this.props}/>);
     } else {
       view = (
@@ -131,8 +131,8 @@ export default React.createClass({
     return (
       <div>
         <div className="kbnTabs">
-          <div className={`kbnTabs__tab${selectedTab === 'series' && '-active' || ''}`}
-            onClick={e => this.switchTab('series')}>Series</div>
+          <div className={`kbnTabs__tab${selectedTab === 'data' && '-active' || ''}`}
+            onClick={e => this.switchTab('data')}>Data</div>
           <div className={`kbnTabs__tab${selectedTab === 'options' && '-active' || ''}`}
             onClick={e => this.switchTab('options')}>Panel Options</div>
         </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/vis_config/markdown.js b/src/core_plugins/metrics/public/components/vis_editor/vis_config/markdown.js
index b2333cebf61ef7..f50564a48d1bb5 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/vis_config/markdown.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/vis_config/markdown.js
@@ -60,7 +60,7 @@ export default React.createClass({
     let view;
     if (selectedTab === 'markdown') {
       view = (<MarkdownEditor {...this.props}/>);
-    } else if (selectedTab === 'series') {
+    } else if (selectedTab === 'data') {
       view = (<SeriesEditor {...this.props}/>);
     } else {
       view = (
@@ -120,8 +120,8 @@ export default React.createClass({
         <div className="kbnTabs">
           <div className={`kbnTabs__tab${selectedTab === 'markdown' && '-active' || ''}`}
             onClick={e => this.switchTab('markdown')}>Markdown</div>
-          <div className={`kbnTabs__tab${selectedTab === 'series' && '-active' || ''}`}
-            onClick={e => this.switchTab('series')}>Variables</div>
+          <div className={`kbnTabs__tab${selectedTab === 'data' && '-active' || ''}`}
+            onClick={e => this.switchTab('data')}>Data</div>
           <div className={`kbnTabs__tab${selectedTab === 'options' && '-active' || ''}`}
             onClick={e => this.switchTab('options')}>Panel Options</div>
         </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/vis_config/metric.js b/src/core_plugins/metrics/public/components/vis_editor/vis_config/metric.js
index bb9939ecd16b1f..1abf24688b88d8 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/vis_config/metric.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/vis_config/metric.js
@@ -20,7 +20,7 @@ export default React.createClass({
   },
 
   getInitialState() {
-    return { selectedTab: 'series' };
+    return { selectedTab: 'data' };
   },
 
   switchTab(selectedTab) {
@@ -37,7 +37,7 @@ export default React.createClass({
       { label: 'Left', value: 'left' }
     ];
     let view;
-    if (selectedTab === 'series') {
+    if (selectedTab === 'data') {
       view = (<SeriesEditor limit={2} colorPicker={false} {...this.props}/>);
     } else {
       view = (
@@ -70,8 +70,8 @@ export default React.createClass({
     return (
       <div>
         <div className="kbnTabs">
-          <div className={`kbnTabs__tab${selectedTab === 'series' && '-active' || ''}`}
-            onClick={e => this.switchTab('series')}>Series</div>
+          <div className={`kbnTabs__tab${selectedTab === 'data' && '-active' || ''}`}
+            onClick={e => this.switchTab('data')}>Data</div>
           <div className={`kbnTabs__tab${selectedTab === 'options' && '-active' || ''}`}
             onClick={e => this.switchTab('options')}>Panel Options</div>
         </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/vis_config/timeseries.js b/src/core_plugins/metrics/public/components/vis_editor/vis_config/timeseries.js
index 4ae533b0aa5479..d03497c6d6323c 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/vis_config/timeseries.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/vis_config/timeseries.js
@@ -9,7 +9,7 @@ import ColorPicker from '../color_picker';
 import YesNo from 'plugins/metrics/components/yes_no';
 export default React.createClass({
   getInitialState() {
-    return { selectedTab: 'series' };
+    return { selectedTab: 'data' };
   },
 
   switchTab(selectedTab) {
@@ -31,7 +31,7 @@ export default React.createClass({
       { label: 'Bottom', value: 'bottom' }
     ];
     let view;
-    if (selectedTab === 'series') {
+    if (selectedTab === 'data') {
       view = (<SeriesEditor {...this.props}/>);
     } else {
       view = (
@@ -102,8 +102,8 @@ export default React.createClass({
     return (
       <div>
         <div className="kbnTabs">
-          <div className={`kbnTabs__tab${selectedTab === 'series' && '-active' || ''}`}
-            onClick={e => this.switchTab('series')}>Series</div>
+          <div className={`kbnTabs__tab${selectedTab === 'data' && '-active' || ''}`}
+            onClick={e => this.switchTab('data')}>Data</div>
           <div className={`kbnTabs__tab${selectedTab === 'options' && '-active' || ''}`}
             onClick={e => this.switchTab('options')}>Panel Options</div>
         </div>
diff --git a/src/core_plugins/metrics/public/components/vis_editor/vis_config/top_n.js b/src/core_plugins/metrics/public/components/vis_editor/vis_config/top_n.js
index 629da1dd1590de..93461b39c6fea2 100644
--- a/src/core_plugins/metrics/public/components/vis_editor/vis_config/top_n.js
+++ b/src/core_plugins/metrics/public/components/vis_editor/vis_config/top_n.js
@@ -25,7 +25,7 @@ export default React.createClass({
   },
 
   getInitialState() {
-    return { selectedTab: 'series' };
+    return { selectedTab: 'data' };
   },
 
   switchTab(selectedTab) {
@@ -42,7 +42,7 @@ export default React.createClass({
       { label: 'Left', value: 'left' }
     ];
     let view;
-    if (selectedTab === 'series') {
+    if (selectedTab === 'data') {
       view = (<SeriesEditor limit={1} colorPicker={false} {...this.props}/>);
     } else {
       view = (
@@ -92,8 +92,8 @@ export default React.createClass({
     return (
       <div>
         <div className="kbnTabs">
-          <div className={`kbnTabs__tab${selectedTab === 'series' && '-active' || ''}`}
-            onClick={e => this.switchTab('series')}>Series</div>
+          <div className={`kbnTabs__tab${selectedTab === 'data' && '-active' || ''}`}
+            onClick={e => this.switchTab('data')}>Data</div>
           <div className={`kbnTabs__tab${selectedTab === 'options' && '-active' || ''}`}
             onClick={e => this.switchTab('options')}>Panel Options</div>
         </div>
diff --git a/src/core_plugins/metrics/public/lib/fetch_fields.js b/src/core_plugins/metrics/public/lib/fetch_fields.js
index ace916964b5684..3c002f2fb061e2 100644
--- a/src/core_plugins/metrics/public/lib/fetch_fields.js
+++ b/src/core_plugins/metrics/public/lib/fetch_fields.js
@@ -6,7 +6,10 @@ export default (
   return $scope => (indexPattern = '*') => {
     $http.get(`../api/metrics/fields?index=${indexPattern}`)
       .success(resp => {
-        $scope.fields = resp;
+        if (!$scope.fields) $scope.fields = {};
+        if (resp.length && indexPattern) {
+          $scope.fields[indexPattern] = resp;
+        }
       })
       .error(resp => {
         $scope.visData = {};
diff --git a/src/core_plugins/metrics/public/vis/editor_controller.js b/src/core_plugins/metrics/public/vis/editor_controller.js
index 3daa6b993029ca..b4365277fb09b2 100644
--- a/src/core_plugins/metrics/public/vis/editor_controller.js
+++ b/src/core_plugins/metrics/public/vis/editor_controller.js
@@ -36,7 +36,7 @@ app.controller('MetricsEditorController', (
     trailing: true
   });
 
-  const debouncedFetchFields = _.debounce(() => fetchFields($scope)($scope.model.index_pattern), 300, {
+  const debouncedFetchFields = _.debounce(fetchFields($scope), 300, {
     leading: false,
     trailing: true
   });
@@ -51,7 +51,15 @@ app.controller('MetricsEditorController', (
     const visAppScope = angular.element($('visualize-app')).scope();
     visAppScope.stageEditableVis();
     debouncedFetch();
-    if (newValue.index_pattern !== oldValue.index_pattern) debouncedFetchFields();
+
+    // Fetch any missing index patterns
+    if (!$scope.fields[newValue.index_pattern]) debouncedFetchFields(newValue.index_pattern);
+    newValue.series.forEach(series => {
+      if (series.override_index_pattern &&
+        !$scope.fields[series.series_index_pattern]) {
+        debouncedFetchFields(series.series_index_pattern);
+      }
+    });
   });
 
   // If the model doesn't exist we need to either intialize it with a copy from
diff --git a/src/core_plugins/metrics/server/lib/bucket_transform.js b/src/core_plugins/metrics/server/lib/bucket_transform.js
index a707a7baf0685d..381219fe6a18d5 100644
--- a/src/core_plugins/metrics/server/lib/bucket_transform.js
+++ b/src/core_plugins/metrics/server/lib/bucket_transform.js
@@ -93,7 +93,7 @@ module.exports = {
       }
     };
     if (bucket.gap_policy) body.derivative.gap_policy = bucket.gap_policy;
-    if (bucket.unit) body.derivative.unit = /\d+\w/.test(bucket.unit) ? bucket.unit : bucketSize;
+    if (bucket.unit) body.derivative.unit = /^([\d]+)([shmdwMy]|ms)$/.test(bucket.unit) ? bucket.unit : bucketSize;
     return body;
   },