Refactor Visualize Wizard to use explicit controller names, instead o…

…f defining them dynamically.

src/core_plugins/kibana/public/visualize/wizard/step_1.html

@@ -1,33 +1,35 @@
-<div class="visualizeWizardBreadcrumbs">
-  <bread-crumbs></bread-crumbs>
-</div>
-<div class="wizard">
-  <div class="wizard-column">
-    <h3 class="wizard-sub-title">Create New Visualization</h3>
-    <div class="wizard-row">
-      <a
-        class="wizard-type"
-        ng-repeat="type in visTypes.inTitleOrder"
-        ng-href="{{ visTypeUrl(type) }}"
-      >
-        <div class="wizard-type-heading">
-          <i
-            aria-hidden="true"
-            class="wizard-type-heading-icon fa fa-fw"
-            ng-class="type.icon"
-          ></i>
-          <h4 class="wizard-type-heading-text">{{type.title}}</h4>
-        </div>
-        <p class="wizard-type-description">{{type.description}}</p>
-      </a>
-    </div>
+<div class="container-fluid vis-wizard">
+  <div class="visualizeWizardBreadcrumbs">
+    <bread-crumbs></bread-crumbs>
   </div>
-  <div class="wizard-column">
-    <h3 class="wizard-sub-title">Or, Open a Saved Visualization</h3>
-    <saved-object-finder
-      title="Saved Visualizations"
-      type="visualizations"
-      class="wizard-row"
-    ></saved-object-finder>
+  <div class="wizard">
+    <div class="wizard-column">
+      <h3 class="wizard-sub-title">Create New Visualization</h3>
+      <div class="wizard-row">
+        <a
+          class="wizard-type"
+          ng-repeat="type in visTypes.inTitleOrder"
+          ng-href="{{ visTypeUrl(type) }}"
+        >
+          <div class="wizard-type-heading">
+            <i
+              aria-hidden="true"
+              class="wizard-type-heading-icon fa fa-fw"
+              ng-class="type.icon"
+            ></i>
+            <h4 class="wizard-type-heading-text">{{type.title}}</h4>
+          </div>
+          <p class="wizard-type-description">{{type.description}}</p>
+        </a>
+      </div>
+    </div>
+    <div class="wizard-column">
+      <h3 class="wizard-sub-title">Or, Open a Saved Visualization</h3>
+      <saved-object-finder
+        title="Saved Visualizations"
+        type="visualizations"
+        class="wizard-row"
+      ></saved-object-finder>
+    </div>
   </div>
 </div>

src/core_plugins/kibana/public/visualize/wizard/step_2.html

@@ -1,24 +1,26 @@
-<div class="visualizeWizardBreadcrumbs">
-  <bread-crumbs></bread-crumbs>
-</div>
-<div class="wizard">
-  <div class="wizard-column wizard-column--small">
-    <h3 class="wizard-sub-title">From a New Search, Select Index</h3>
-    <paginated-selectable-list
-      per-page="20"
-      list="indexPattern.list"
-      user-make-url="makeUrl"
-      class="wizard-row"
-    ></paginated-selectable-list>
+<div class="container-fluid vis-wizard">
+  <div class="visualizeWizardBreadcrumbs">
+    <bread-crumbs></bread-crumbs>
   </div>
-  <div class="wizard-column wizard-column--large">
-    <h3 class="wizard-sub-title">Or, From a Saved Search</h3>
-    <!-- Saved searches -->
-    <saved-object-finder
-        title="Saved Searches"
-        type="searches"
+  <div class="wizard">
+    <div class="wizard-column wizard-column--small">
+      <h3 class="wizard-sub-title">From a New Search, Select Index</h3>
+      <paginated-selectable-list
+        per-page="20"
+        list="indexPattern.list"
+        user-make-url="makeUrl"
         class="wizard-row"
-        make-url="step2WithSearchUrl"
-      ></saved-object-finder>
+      ></paginated-selectable-list>
+    </div>
+    <div class="wizard-column wizard-column--large">
+      <h3 class="wizard-sub-title">Or, From a Saved Search</h3>
+      <!-- Saved searches -->
+      <saved-object-finder
+          title="Saved Searches"
+          type="searches"
+          class="wizard-row"
+          make-url="step2WithSearchUrl"
+        ></saved-object-finder>
+    </div>
   </div>
 </div>

src/core_plugins/kibana/public/visualize/wizard/wizard.js

@@ -9,17 +9,14 @@ import RegistryVisTypesProvider from 'ui/registry/vis_types';
 import uiModules from 'ui/modules';
 import './wizard.less';
 
-const templateStep = function (num, txt) {
-  return '<div ng-controller="VisualizeWizardStep' + num + '" class="container-fluid vis-wizard">' + txt + '</div>';
-};
-
 const module = uiModules.get('app/visualize', ['kibana/courier']);
 
 /********
 /** Wizard Step 1
 /********/
 routes.when('/visualize/step/1', {
-  template: templateStep(1, require('plugins/kibana/visualize/wizard/step_1.html'))
+  template: require('plugins/kibana/visualize/wizard/step_1.html'),
+  controller: 'VisualizeWizardStep1',
 });
 
 module.controller('VisualizeWizardStep1', function ($scope, $route, kbnUrl, timefilter, Private) {
@@ -44,7 +41,8 @@ module.controller('VisualizeWizardStep1', function ($scope, $route, kbnUrl, time
 /** Wizard Step 2
 /********/
 routes.when('/visualize/step/2', {
-  template: templateStep(2, require('plugins/kibana/visualize/wizard/step_2.html')),
+  template: require('plugins/kibana/visualize/wizard/step_2.html'),
+  controller: 'VisualizeWizardStep2',
   resolve: {
     indexPatternIds: function (courier) {
       return courier.indexPatterns.getIds();