[add data] prototype for string resources

src/plugins/kibana/public/settings/sections/indices/add_data_steps/pipeline_setup/index.js

@@ -1 +1,2 @@
+import './string_resources';
 import './directives/pipeline_setup';

src/plugins/kibana/public/settings/sections/indices/add_data_steps/pipeline_setup/processors/append/directive.js

@@ -1,5 +1,6 @@
 import uiModules from 'ui/modules';
 import template from './view.html';
+import './string_resources';
 
 const app = uiModules.get('kibana');
 

src/plugins/kibana/public/settings/sections/indices/add_data_steps/pipeline_setup/processors/append/string_resources.js

@@ -0,0 +1,26 @@
+import registry from 'ui/string_resources/registry';
+
+registry.register({
+
+  addData: {
+
+    processors: {
+
+      append: {
+
+        targetField:
+          `Target Field:`,
+
+        values:
+          `Values:`,
+
+        valuesHelpText:
+          ` (line delimited)`
+
+      }
+
+    }
+
+  }
+
+});

src/plugins/kibana/public/settings/sections/indices/add_data_steps/pipeline_setup/processors/append/view.html

@@ -1,8 +1,9 @@
 <div class="form-group">
-  <label>Target Field:</label>
+  <label>{{'addData.processors.append.targetField' | resource}}</label>
   <input type="text" class="form-control" ng-model="processor.targetField">
 </div>
 <div class="form-group">
-  <label>Values:</label><span> (line delimited)</span>
+  <label>{{'addData.processors.append.values' | resource}}</label>
+  <span>{{'addData.processors.append.valuesHelpText' | resource}}</span>
   <textarea ng-model="values" class="form-control"></textarea>
 </div>

src/plugins/kibana/public/settings/sections/indices/add_data_steps/pipeline_setup/processors/set/directive.js

@@ -1,5 +1,6 @@
 import uiModules from 'ui/modules';
 import template from './view.html';
+import './string_resources';
 
 const app = uiModules.get('kibana');
 

src/plugins/kibana/public/settings/sections/indices/add_data_steps/pipeline_setup/processors/set/string_resources.js

@@ -0,0 +1,23 @@
+import registry from 'ui/string_resources/registry';
+
+registry.register({
+
+  addData: {
+
+    processors: {
+
+      set: {
+
+        targetField:
+          `Target Field:`,
+
+        value:
+          `Value:`
+
+      }
+
+    }
+
+  }
+
+});

src/plugins/kibana/public/settings/sections/indices/add_data_steps/pipeline_setup/processors/set/view.html

@@ -1,8 +1,8 @@
 <div class="form-group">
-  <label>Target Field:</label>
+  <label>{{'addData.processors.set.targetField' | resource}}</label>
   <input type="text" class="form-control" ng-model="processor.targetField">
 </div>
 <div class="form-group">
-  <label>Value:</label>
+  <label>{{'addData.processors.set.value' | resource}}</label>
   <input type="text" class="form-control" ng-trim="false" ng-model="processor.value">
 </div>

src/plugins/kibana/public/settings/sections/indices/add_data_steps/pipeline_setup/string_resources.js

@@ -0,0 +1,63 @@
+import registry from 'ui/string_resources/registry';
+
+registry.register({
+
+  addData: {
+
+    pipelineSetup: {
+
+      headerTextCallout:
+        `Let's build a pipeline!`,
+
+      headerText:
+        `Ingest pipelines are an easy way to modify documents before they're indexed in Elasticsearch.
+They're composed of processors which can change your data in many ways. Create a pipeline
+below while cycling through your samples to see its effect on your data.`,
+
+      pipelineLabel:
+        `Processor Pipeline`,
+
+      pipelineTooltip:
+        `A pipeline is a definition of a series of processors that are to be executed in the same order
+as they are declared.`,
+
+      nextSample:
+        `Next Sample`,
+
+      previousSample:
+        `Previous Sample`,
+
+      collapseLeftPanel:
+        `Collapse Left Panel`,
+
+      expandLeftPanel:
+        `Expand Left Panel`,
+
+      collapseRightPanel:
+        `Collapse Right Panel`,
+
+      expandRightPanel:
+        `Expand Right Panel`,
+
+      processorTypePlaceholder:
+        `Select a Processor...`,
+
+      emptyPipeline:
+        `Your pipeline is currently empty. Add a processor to get started!`
+
+    },
+
+    pipelineOutput: {
+
+      label:
+        `Pipeline Output`,
+
+      tooltip:
+        `The pipeline output shows the result of the defined pipeline using the sample records
+supplied in the previous step.`,
+
+    }
+
+  }
+
+});

src/plugins/kibana/public/settings/sections/indices/add_data_steps/pipeline_setup/views/pipeline_output.html

@@ -1,9 +1,9 @@
 <div class="header-line">
   <label>
-    Pipeline Output
+    {{'addData.pipelineOutput.label' | resource}}
     <a
-      aria-label="The pipeline output shows the result of the defined pipeline using the sample records supplied in the previous step."
-      tooltip="The pipeline output shows the result of the defined pipeline using the sample records supplied in the previous step."
+      aria-label="{{'addData.pipelineOutput.tooltip' | resource}}"
+      tooltip="{{'addData.pipelineOutput.tooltip' | resource}}"
       tooltip-append-to-body="true"
       target="_blank">
       <i aria-hidden="true" class="fa fa-question-circle"></i>

src/plugins/kibana/public/settings/sections/indices/add_data_steps/pipeline_setup/views/pipeline_setup.html

@@ -1,15 +1,16 @@
 <h2>
-  <em>Let's build a pipeline!</em> Ingest pipelines are an easy way to modify documents before they're indexed in Elasticsearch. They're composed of processors which can change your data in many ways. Create a pipeline below while cycling through your samples to see its effect on your data.
+  <em ng-bind="'addData.pipelineSetup.headerTextCallout' | resource"></em>
+  <span ng-bind="'addData.pipelineSetup.headerText' | resource"></span>
 </h2>
 <div class="main-panels">
   <div
     ng-hide="expandContext < 1"
     class="left-panel">
     <label>
-      Processor Pipeline
+      <span ng-bind="'addData.pipelineSetup.pipelineLabel' | resource"></span>
       <a
-        aria-label="A pipeline is a definition of a series of processors that are to be executed in the same order as they are declared."
-        tooltip="A pipeline is a definition of a series of processors that are to be executed in the same order as they are declared."
+        aria-label="{{'addData.pipelineSetup.pipelineTooltip' | resource}}"
+        tooltip="{{'addData.pipelineSetup.pipelineTooltip' | resource}}"
         tooltip-append-to-body="true"
         target="_blank">
         <i aria-hidden="true" class="fa fa-question-circle"></i>
@@ -28,17 +29,15 @@ <h2>
         <div
           class="form-group"
           ng-hide="pipeline.processors.length > 0">
-          <label>
-            Your pipeline is currently empty. Add a processor to get started!
-          </label>
+          <label>{{'addData.pipelineSetup.emptyPipeline' | resource}}</label>
         </div>
         <div class="add-processor-dropdown">
           <select
             class="form-control"
             ng-options="processorType.title for processorType in processorTypes"
             ng-model="processorType"
             ng-disabled="pipeline.hasCompileError">
-            <option value="">Select a Processor...</option>
+            <option value="">{{'addData.pipelineSetup.processorTypePlaceholder' | resource}}</option>
           </select>
         </div>
       </div>
@@ -47,17 +46,17 @@ <h2>
   <div class="center-panel">
     <div class="buttons">
       <button
-        aria-label="{{expandContext > 1 ? 'Expand Right Panel' : 'Collapse Left Panel'}}"
-        tooltip="{{expandContext > 1 ? 'Expand Right Panel' : 'Collapse Left Panel'}}"
+        aria-label="{{expandContext > 1 ? 'addData.pipelineSetup.expandRightPanel' : 'addData.pipelineSetup.collapseLeftPanel' | resource}}"
+        tooltip="{{expandContext > 1 ? 'addData.pipelineSetup.expandRightPanel' : 'addData.pipelineSetup.collapseLeftPanel' | resource}}"
         ng-click="expandContext = expandContext - 1"
         ng-disabled="expandContext < 1"
         type="button"
         class="btn btn-primary btn-xs collapser">
         <i aria-hidden="true" class="fa fa-chevron-circle-left"></i>
       </button>
       <button
-        aria-label="{{expandContext < 1 ? 'Expand Left Panel' : 'Collapse Right Panel'}}"
-        tooltip="{{expandContext < 1 ? 'Expand Left Panel' : 'Collapse Right Panel'}}"
+        aria-label="{{expandContext > 1 ? 'addData.pipelineSetup.expandLeftPanel' : 'addData.pipelineSetup.collapseRightPanel' | resource}}"
+        tooltip="{{expandContext > 1 ? 'addData.pipelineSetup.expandLeftPanel' : 'addData.pipelineSetup.collapseRightPanel' | resource}}"
         ng-click="expandContext = expandContext + 1"
         ng-disabled="expandContext > 1"
         type="button"

src/plugins/kibana/public/settings/sections/indices/add_data_steps/pipeline_setup/views/processor_ui_container.html

@@ -12,7 +12,7 @@
     <div
       ng-show="processor.error"
       class="alert alert-danger">
-      {{processor.error.message}}
+      {{ processor.error.message }}
     </div>
     <div class="processor-ui-content"></div>
     <output-preview

src/plugins/kibana/public/settings/sections/indices/add_data_steps/pipeline_setup/views/source_data.html

@@ -1,6 +1,6 @@
 <button
-  aria-label="Previous Sample"
-  tooltip="Previous Sample"
+  aria-label="{{'addData.pipelineSetup.previousSample' | resource}}"
+  tooltip="{{'addData.pipelineSetup.previousSample' | resource}}"
   tooltip-append-to-body="true"
   ng-click="previousLine()"
   type="button"
@@ -9,8 +9,8 @@
   <i aria-hidden="true" class="fa fa-caret-left"></i>
 </button>
 <button
-  aria-label="Next Sample"
-  tooltip="Next Sample"
+  aria-label="{{'addData.pipelineSetup.nextSample' | resource}}"
+  tooltip="{{'addData.pipelineSetup.nextSample' | resource}}"
   tooltip-append-to-body="true"
   ng-click="nextLine()"
   type="button"

src/plugins/kibana/public/settings/sections/indices/filebeat/directives/filebeat_wizard.html

@@ -32,7 +32,7 @@
             class="btn btn-primary"
             ng-disabled="!wizard.stepResults.samples"
             ng-click="wizard.nextStep()">
-            Next
+            {{'commonButtons.next' | resource}}
           </button>
         </div>
         <div></div>
@@ -50,14 +50,14 @@
           <button
             class="btn btn-secondary"
             ng-click="wizard.prevStep()">
-            Prev
+            {{'commonButtons.previous' | resource}}
           </button>
         </div>
         <div>
           <button
             class="btn btn-primary"
             ng-click="wizard.nextStep()">
-            Next
+            {{'commonButtons.next' | resource}}
           </button>
         </div>
         <div></div>
@@ -76,15 +76,15 @@
           <button
             class="btn btn-secondary"
             ng-click="wizard.prevStep()">
-            Prev
+            {{'commonButtons.previous' | resource}}
           </button>
         </div>
         <div>
           <button
             class="btn btn-primary"
             ng-disabled="!wizard.stepResults.indexPattern || !wizard.stepResults.indexPattern.id"
-                ng-click="wizard.save()">
-          Save
+            ng-click="wizard.save()">
+            {{'commonButtons.save' | resource}}
           </button>
         </div>
         <div></div>
@@ -100,7 +100,7 @@
           <button
             class="btn btn-primary"
             ng-click="wizard.nextStep()">
-            Done
+            {{'commonButtons.done' | resource}}
           </button>
         </div>
         <div></div>

src/plugins/kibana/public/settings/sections/indices/filebeat/directives/filebeat_wizard.js

@@ -6,6 +6,7 @@ import 'plugins/kibana/settings/sections/indices/add_data_steps/paste_samples_st
 import 'plugins/kibana/settings/sections/indices/add_data_steps/pipeline_setup';
 import 'plugins/kibana/settings/sections/indices/add_data_steps/install_filebeat_step';
 import '../../styles/_add_data_wizard.less';
+import 'string-resources';
 
 // wrapper directive, which sets up the breadcrumb for all filebeat steps
 modules.get('apps/settings')

src/ui/public/string_resources/common_strings.js

@@ -0,0 +1,20 @@
+import registry from 'ui/string_resources/registry';
+
+registry.register({
+
+  commonButtons: {
+
+    next:
+      `Next`,
+
+    previous:
+      `Prev`,
+
+    save:
+      `Save`,
+
+    done:
+      `Done`
+
+  }
+});

src/ui/public/string_resources/filter.js

@@ -0,0 +1,12 @@
+import _ from 'lodash';
+import uiModules from 'ui/modules';
+import registry from './registry';
+
+const app = uiModules.get('kibana');
+const strings = registry.all();
+
+app.filter('resource', function () {
+  return function (input) {
+    return _.get(strings, input) || input;
+  };
+});

src/ui/public/string_resources/index.js

@@ -0,0 +1,2 @@
+import './common_strings';
+import './filter';

src/ui/public/string_resources/registry.js

@@ -0,0 +1,11 @@
+import _ from 'lodash';
+const registry = {};
+
+export default {
+  register: function (stringObj) {
+    _.defaultsDeep(registry, stringObj);
+  },
+  all: function () {
+    return registry;
+  }
+};

webpackShims/string-resources.js

@@ -0,0 +1 @@
+require('ui/string_resources/index');