[i18n] Translate ML - New Job(part_1) (#25647)

* Translate ml -> new_job(part_1)

* resolve review comments

* resolve review comments

* move html containing directive from values

* add description to label

x-pack/plugins/ml/public/jobs/new_job/simple/single_metric/create_job/create_job.html

@@ -4,11 +4,22 @@
   <div ng-controller="MlCreateSingleMetricJob" class="single-metric-job-container">
     <div class="row">
       <div class="col-md-6">
-        <h1 class="euiTitle euiTitle--large">New job from {{ui.pageTitle}}</h1>
+        <h1
+          class="euiTitle euiTitle--large"
+          i18n-id="xpack.ml.newJob.simple.singleMetric.newJobFromTitle"
+          i18n-default-message="New job from {pageTitle}"
+          i18n-values="{ pageTitle: ui.pageTitle }"
+        ></h1>
       </div>
       <div class="col-md-6">
         <div class="pull-right">
-          <span style="font-size:10px;" ng-show="formConfig.chartInterval !== undefined">Chart interval: {{formConfig.chartInterval.getInterval().expression}}</span>
+          <span
+            style="font-size:10px;"
+            ng-show="formConfig.chartInterval !== undefined"
+            i18n-id="xpack.ml.newJob.simple.singleMetric.chartIntervalLabel"
+            i18n-default-message="Chart interval: {interval}"
+            i18n-values="{ interval: formConfig.chartInterval.getInterval().expression }"
+          ></span>
           <ml-full-time-range-selector
             disabled='(jobState === JOB_STATE.RUNNING  || jobState === JOB_STATE.STOPPING || jobState === JOB_STATE.FINISHED)'
             index-pattern='ui.indexPattern'
@@ -23,7 +34,9 @@
     <div class="row form-controls">
 
       <div class="form-group col-md-4">
-        <ml-form-label label-id="new_job_detector_function">Aggregation</ml-form-label>
+        <ml-form-label label-id="new_job_detector_function">
+          {{ ::'xpack.ml.newJob.simple.singleMetric.aggregationLabel' | i18n: {defaultMessage: 'Aggregation'} }}
+        </ml-form-label>
         <ui-select
           aria-labelledby="ml_aria_label_new_job_detector_function"
           aria-describedby="ml_aria_description_new_job_detector_function"
@@ -34,7 +47,7 @@
           ng-disabled="jobState === JOB_STATE.RUNNING  || jobState === JOB_STATE.STOPPING || jobState === JOB_STATE.FINISHED"
           class=""
         >
-          <ui-select-match placeholder="Select an aggregation">
+          <ui-select-match placeholder="{{ ::'xpack.ml.newJob.simple.singleMetric.aggregationPlaceholder' | i18n: {defaultMessage: 'Select an aggregation'} }}">
             {{$select.selected.title}}
           </ui-select-match>
           <ui-select-choices
@@ -46,7 +59,9 @@
       </div>
 
       <div class="form-group col-md-4">
-        <ml-form-label label-id="new_job_detector_fieldname_subset" tooltip-append-to-body="true">Field</ml-form-label>
+        <ml-form-label label-id="new_job_detector_fieldname_subset" tooltip-append-to-body="true">
+          {{ ::'xpack.ml.newJob.simple.singleMetric.fieldLabel' | i18n: {defaultMessage: 'Field'} }}
+        </ml-form-label>
         <ui-select
           aria-labelledby="ml_aria_label_new_job_detector_fieldname_subset"
           aria-describedby="ml_aria_description_new_job_detector_fieldname_subset"
@@ -57,7 +72,7 @@
           ng-disabled="jobState === JOB_STATE.RUNNING || jobState === JOB_STATE.STOPPING || jobState === JOB_STATE.FINISHED"
           class=""
         >
-          <ui-select-match placeholder="Select a field">
+          <ui-select-match placeholder="{{ ::'xpack.ml.newJob.simple.singleMetric.fieldPlaceholder' | i18n: {defaultMessage: 'Select a field'} }}">
             <ml-field-type-icon type="$select.selected.mlType"></ml-field-type-icon>{{$select.selected.name}}
           </ui-select-match>
           <ui-select-choices repeat="field in ui.fields | filter: { name: $select.search }" group-by="'mlType'">
@@ -68,7 +83,9 @@
       </div>
 
       <div class="form-group col-md-4">
-        <ml-form-label label-id="new_job_bucketspan">Bucket span</ml-form-label>
+        <ml-form-label label-id="new_job_bucketspan">
+          {{ ::'xpack.ml.newJob.simple.singleMetric.bucketSpanLabel' | i18n: {defaultMessage: 'Bucket span'} }}
+        </ml-form-label>
         <div class='bucket-span-container'>
           <input
             aria-labelledby="ml_aria_label_new_job_bucketspan"
@@ -91,13 +108,18 @@
           </ml-bucket-span-estimator>
 
           <button class="euiButton euiButton--primary euiButton--small euiButton--fill navbar-btn-link btn-load-vis"
-            aria-label="Run search"
+            aria-label="{{:: 'xpack.ml.newJob.simple.singleMetric.runSearchAriaLabel' | i18n: { defaultMessage: 'Run search' } }}"
             ng-click="loadVis()"
             ng-disabled="ui.formValid === false || jobState === JOB_STATE.RUNNING || jobState === JOB_STATE.STOPPING || jobState === JOB_STATE.FINISHED" >
             <i class="fa fa-play" ></i>
           </button>
         </div>
-        <div ng-hide="ui.bucketSpanValid" class="validation-error">Invalid interval format</div>
+        <div
+          ng-hide="ui.bucketSpanValid"
+          class="validation-error"
+          i18n-id="xpack.ml.newJob.simple.singleMetric.invalidIntervalFormatMessage"
+          i18n-default-message="Invalid interval format"
+        ></div>
         <div ng-show="ui.bucketSpanEstimator.status===-1" class="validation-error">{{ui.bucketSpanEstimator.message}}</div>
       </div>
     </div>
@@ -110,7 +132,12 @@
             class='kuiCheckBox'
             ng-disabled="ui.formValid === false || jobState === JOB_STATE.RUNNING || jobState === JOB_STATE.STOPPING || jobState === JOB_STATE.FINISHED"
             ng-model="formConfig.isSparseData" />
-          <span id="ml_aria_label_new_job_sparsedata" class='kuiCheckBoxLabel__text'>Sparse data</span>
+          <span
+            id="ml_aria_label_new_job_sparsedata"
+            class='kuiCheckBoxLabel__text'
+            i18n-id="xpack.ml.newJob.simple.singleMetric.sparseDataLabel"
+            i18n-default-message="Sparse data"
+          ></span>
           <i ml-info-icon="new_job_sparsedata" />
         </label>
       </div>
@@ -133,8 +160,18 @@
             </div>
             <div class='status-label' ng-show="chartState === CHART_STATE.NO_RESULTS">
               <div class='no-results'>
-                <h4 class="euiTitle euiTitle--small"><i class="fa fa-info-circle"></i> No results found</h4>
-                <span>Consider using the <a ng-click="setFullTimeRange()">full {{ui.indexPattern.title}} data</a></span>
+                <h4
+                  class="euiTitle euiTitle--small"
+                  i18n-id="xpack.ml.newJob.simple.singleMetric.noResultsFoundTitle"
+                  i18n-default-message="{infoIcon} No results found"
+                  i18n-values="{ html_infoIcon: '<i class=\'fa fa-info-circle\'></i>' }"
+                ></h4>
+                <span
+                  i18n-id="xpack.ml.newJob.simple.singleMetric.noResultsFoundDescription"
+                  i18n-default-message="Consider using the"
+                  i18n-description="after this label we have a link containing index pattern"
+                ></span>
+                <a ng-click="setFullTimeRange()">{{indexPatternLinkText}}</a>
               </div>
             </div>
         </div>
@@ -143,33 +180,41 @@
 
     <div ng-show="ui.showJobInput && (jobState === JOB_STATE.NOT_STARTED || jobState === JOB_STATE.RUNNING || jobState === JOB_STATE.STOPPING)">
       <div class="form-group">
-        <ml-form-label label-id="new_job_id" tooltip-append-to-body="true">Name</ml-form-label>
+        <ml-form-label label-id="new_job_id" tooltip-append-to-body="true">
+          {{ ::'xpack.ml.newJob.simple.singleMetric.nameLabel' | i18n: {defaultMessage: 'Name'} }}
+        </ml-form-label>
         <input
           aria-labelledby="ml_aria_label_new_job_id"
           aria-describedby="ml_aria_description_new_job_id"
           id="job-id-input"
           ng-model="formConfig.jobId"
           required
-          placeholder="Job ID"
+          placeholder="{{ ::'xpack.ml.newJob.simple.singleMetric.namePlaceholder' | i18n: {defaultMessage: 'Job ID'} }}"
           ng-change="changeJobIDCase(formConfig)"
           ng-disabled="jobState === JOB_STATE.RUNNING  || jobState === JOB_STATE.STOPPING || jobState === JOB_STATE.FINISHED"
           class="form-control lowercase" />
-          <div ng-hide="ui.validation.checks.jobId.valid" class="validation-error">{{ ( ui.validation.checks.jobId.message || "Enter a name for the job" ) }}</div>
-      </div>
+          <div ng-hide="ui.validation.checks.jobId.valid" class="validation-error">
+            {{ ui.validation.checks.jobId.message || nameNotValidMessage }}
+          </div>
+        </div>
 
       <div class="form-group">
-        <ml-form-label label-id="new_job_description">Description</ml-form-label>
+        <ml-form-label label-id="new_job_description">
+          {{ ::'xpack.ml.newJob.simple.singleMetric.descriptionLabel' | i18n: {defaultMessage: 'Description'} }}
+        </ml-form-label>
         <input
           aria-labelledby="ml_aria_label_new_job_description"
           aria-describedby="ml_aria_description_new_job_description"
           ng-model="formConfig.description"
-          placeholder="Job description"
+          placeholder="{{ ::'xpack.ml.newJob.simple.singleMetric.descriptionPlaceholder' | i18n: {defaultMessage: 'Job description'} }}"
           ng-disabled="jobState === JOB_STATE.RUNNING  || jobState === JOB_STATE.STOPPING || jobState === JOB_STATE.FINISHED"
           class="form-control" />
       </div>
 
       <div class="form-group">
-        <ml-form-label label-id="new_job_group">Job Groups</ml-form-label>
+        <ml-form-label label-id="new_job_group">
+            {{ ::'xpack.ml.newJob.simple.singleMetric.jobGroupsLabel' | i18n: {defaultMessage: 'Job Groups'} }}
+        </ml-form-label>
         <ml-job-group-select
           aria-labelledby="ml_aria_label_new_job_group"
           aria-describedby="ml_aria_description_new_job_group"
@@ -181,14 +226,17 @@
       <div class="form-group">
         <div ng-click="ui.showAdvanced = (!ui.showAdvanced || formConfig.useDedicatedIndex)" class="advanced-button-container">
           <button
-            aria-label="{{ ui.showAdvanced ? 'Hide Advanced' : 'Show Advanced' }}"
+            aria-label="{{ ui.showAdvanced ? hideAdvancedButtonAriaLabel : showAdvancedButtonAriaLabel }}"
             aria-describedby="ml_aria_description_new_job_advanced_settings"
             type="button"
             ng-disabled="formConfig.useDedicatedIndex"
             class="kuiButton kuiButton--small kuiButton--hollow advanced-button">
             <i aria-hidden="true" ng-class="{ 'fa-caret-down': ui.showAdvanced, 'fa-caret-right': !ui.showAdvanced }" class="fa"></i>
           </button>
-          <label>Advanced</label><i ml-info-icon="new_job_advanced_settings" />
+          <label
+            i18n-id="xpack.ml.newJob.simple.singleMetric.advancedLabel"
+            i18n-default-message="Advanced"
+          ></label><i ml-info-icon="new_job_advanced_settings" />
         </div>
         <div class='advanced-group' ng-show="ui.showAdvanced">
           <div class="form-group">
@@ -199,16 +247,22 @@
                 class='kuiCheckBox'
                 ng-model="formConfig.useDedicatedIndex" />
               <span class='kuiCheckBoxLabel__text'>
-                <span id="ml_aria_label_new_job_dedicated_index">Use dedicated index</span>
+                <span
+                  id="ml_aria_label_new_job_dedicated_index"
+                  i18n-id="xpack.ml.newJob.simple.singleMetric.useDedicatedIndexLabel"
+                  i18n-default-message="Use dedicated index"
+                ></span>
                 <i ml-info-icon="new_job_dedicated_index" />
               </span>
             </label>
           </div>
           <div class="form-group">
             <label class='kuiFormLabel kuiVerticalRhythm'>
-              <span id="ml_aria_label_new_job_model_memory_limit">
-                Model memory limit
-              </span>
+              <span
+                id="ml_aria_label_new_job_model_memory_limit"
+                i18n-id="xpack.ml.newJob.simple.singleMetric.modelMemoryLimitLabel"
+                i18n-default-message="Model memory limit"
+              ></span>
               <i ml-info-icon="new_job_model_memory_limit" />
             </label>
             <div></div>
@@ -224,7 +278,12 @@
       </div>
 
       <div class="form-group">
-        <a href="" ng-click="moveToAdvancedJobCreation()">Move to advanced job configuration</a>
+        <a
+          href=""
+          ng-click="moveToAdvancedJobCreation()"
+          i18n-id="xpack.ml.newJob.simple.singleMetric.advancedConfigurationLinkText"
+          i18n-default-message="Move to advanced job configuration"
+        ></a>
       </div>
       <div class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--responsive">
         <div class="euiFlexItem euiFlexItem--flexGrowZero">
@@ -239,71 +298,109 @@
         </div>
         <div class="euiFlexItem euiFlexItem--flexGrowZero">
           <button
-            aria-label="Create Job"
+            aria-label="{{ ::'xpack.ml.newJob.simple.singleMetric.createJobButtonAriaLabel' | i18n: {defaultMessage: 'Create Job'} }}"
             ng-click="createJob()"
             type="button"
             ng-show="jobState === JOB_STATE.NOT_STARTED"
             ng-disabled='ui.formValid === false || ui.dirty === true || formConfig.jobId === undefined || ui.bucketSpanValid === false'
             class="euiButton euiButton--primary euiButton--small euiButton--fill">
-            <span class="euiButton__content">
-              Create Job
-            </span>
+            <span
+              class="euiButton__content"
+              i18n-id="xpack.ml.newJob.simple.singleMetric.createJobButtonLabel"
+              i18n-default-message="Create Job"
+            ></span>
           </button>
         </div>
       </div>
 
-      <div class='job-state-info' ng-show="jobState === JOB_STATE.RUNNING">Analysis running <i class='fa fa-spinner fa-spin'></i></div>
-      <div class='job-state-info' ng-show="jobState === JOB_STATE.STOPPING">Analysis stopping <i class='fa fa-spinner fa-spin'></i></div>
+      <div
+        class='job-state-info'
+        ng-show="jobState === JOB_STATE.RUNNING"
+        i18n-id="xpack.ml.newJob.simple.singleMetric.analysisRunningLabel"
+        i18n-default-message="Analysis running {spinIcon}"
+        i18n-values="{ html_spinIcon: '<i class=\'fa fa-spinner fa-spin\'></i>'}"
+      ></div>
+      <div
+        class='job-state-info'
+        ng-show="jobState === JOB_STATE.STOPPING"
+        i18n-id="xpack.ml.newJob.simple.singleMetric.analysisStoppingLabel"
+        i18n-default-message="Analysis stopping {spinIcon}"
+        i18n-values="{ html_spinIcon: '<i class=\'fa fa-spinner fa-spin\'></i>'}"
+      ></div>
 
       <button
-        aria-label="Stop Job"
+        aria-label="{{ ::'xpack.ml.newJob.simple.singleMetric.stopJobButtonAriaLabel' | i18n: {defaultMessage: 'Stop Job'} }}"
         ng-click="stopJob()"
         type="button"
         ng-show="jobState === JOB_STATE.RUNNING || jobState === JOB_STATE.STOPPING"
         ng-disabled="jobState === JOB_STATE.STOPPING"
         class="euiButton euiButton--danger euiButton--small">
-        <span class="euiButton__content">
-          {{(jobState === JOB_STATE.STOPPING) ? 'Analysis stopping' : 'Stop analysis' }}
-        </span>
+        <span
+          ng-if="jobState === JOB_STATE.STOPPING"
+          class="euiButton__content"
+          i18n-id="xpack.ml.newJob.simple.singleMetric.analysisStoppingButtonLabel"
+          i18n-default-message="Analysis stopping"
+        ></span>
+        <span
+          ng-if="jobState !== JOB_STATE.STOPPING"
+          class="euiButton__content"
+          i18n-id="xpack.ml.newJob.simple.singleMetric.stopAnalysisButtonLabel"
+          i18n-default-message="Stop analysis"
+        ></span>
       </button>
 
       <a
         href='{{resultsUrl}}'
         id="job_running_view_results_link"
         ng-click="addNewJobToRecentlyAccessed(formConfig.jobId, resultsUrl)"
-        aria-label="View results of running job"
+        aria-label="{{ ::'xpack.ml.newJob.simple.singleMetric.viewResultsOfRunningJobButtonAriaLabel' | i18n: {defaultMessage: 'View results of running job'} }}"
         ng-show="jobState === JOB_STATE.RUNNING || jobState === JOB_STATE.STOPPING"
         class="euiButton euiButton--primary euiButton--small euiButton--fill">
-        <span class="euiButton__content">
-          View Results
-        </span>
+        <span
+          class="euiButton__content"
+          i18n-id="xpack.ml.newJob.simple.singleMetric.viewResultsOfRunningJobButtonLabel"
+          i18n-default-message="View Results"
+        ></span>
       </a>
 
     </div>
     <div ng-show="jobState === JOB_STATE.FINISHED">
-      <h3 class="euiTitle euiTitle--large">Job {{formConfig.jobId }} created
-        <i style="color:green;" class="fa fa-check" aria-label="Job finished"></i>
+      <h3 class="euiTitle euiTitle--large">
+        <span
+          i18n-id="xpack.ml.newJob.simple.singleMetric.jobCreatedTitle"
+          i18n-default-message="Job {jobId} created"
+          i18n-values="{ jobId: formConfig.jobId }"
+        ></span>
+        <i
+          style="color:green;"
+          class="fa fa-check"
+          aria-label="{{ ::'xpack.ml.newJob.simple.singleMetric.jobFinishedAriaLabel' | i18n: {defaultMessage: 'Job finished'} }}"
+        ></i>
       </h3>
       <div class="euiSpacer euiSpacer--m"></div>
 
       <button
-        aria-label="Reset"
+        aria-label="{{ ::'xpack.ml.newJob.simple.singleMetric.resetButtonAriaLabel' | i18n: {defaultMessage: 'Reset'} }}"
         ng-click="resetJob()"
         type="button"
         class="euiButton euiButton--primary euiButton--small euiButton--fill">
-        <span class="euiButton__content">
-          Reset
-        </span>
+        <span
+          class="euiButton__content"
+          i18n-id="xpack.ml.newJob.simple.singleMetric.resetButtonLabel"
+          i18n-default-message="Reset"
+        ></span>
       </button>
       <a
         href='{{resultsUrl}}'
         id="job_finished_view_results_link"
         ng-click="addNewJobToRecentlyAccessed(formConfig.jobId, resultsUrl)"
-        aria-label="View results of finished job"
+        aria-label="{{ ::'xpack.ml.newJob.simple.singleMetric.viewResultsOfFinishedJobButtonAriaLabel' | i18n: {defaultMessage: 'View results of finished job'} }}"
         class="euiButton euiButton--primary euiButton--small euiButton--fill">
-        <span class="euiButton__content">
-          View Results
-        </span>
+        <span
+          class="euiButton__content"
+          i18n-id="xpack.ml.newJob.simple.singleMetric.viewResultsOfFinishedJobButtonLabel"
+          i18n-default-message="View Results"
+        ></span>
       </a>
 
     </div>

x-pack/plugins/ml/public/jobs/new_job/simple/single_metric/create_job/create_job_controller.js

@@ -71,7 +71,8 @@ module
     $filter,
     $timeout,
     Private,
-    AppState) {
+    AppState,
+    i18n) {
 
     timefilter.enableTimeRangeSelector();
     timefilter.disableAutoRefreshSelector();
@@ -126,8 +127,28 @@ module
 
     timeBasedIndexCheck(indexPattern, true);
 
+    $scope.indexPatternLinkText = i18n('xpack.ml.newJob.simple.singleMetric.noResultsFound.indexPatternLinkText', {
+      defaultMessage: 'full {indexPatternTitle} data',
+      values: { indexPatternTitle: indexPattern.title }
+    });
+    $scope.nameNotValidMessage = i18n('xpack.ml.newJob.simple.singleMetric.nameNotValidMessage', {
+      defaultMessage: 'Enter a name for the job'
+    });
+    $scope.showAdvancedButtonAriaLabel = i18n('xpack.ml.newJob.simple.singleMetric.showAdvancedButtonAriaLabel', {
+      defaultMessage: 'Show Advanced'
+    });
+    $scope.hideAdvancedButtonAriaLabel = i18n('xpack.ml.newJob.simple.singleMetric.hideAdvancedButtonAriaLabel', {
+      defaultMessage: 'Hide Advanced'
+    });
     const pageTitle = (savedSearch.id !== undefined) ?
-      `saved search ${savedSearch.title}` : `index pattern ${indexPattern.title}`;
+      i18n('xpack.ml.newJob.simple.singleMetric.savedSearchPageTitle', {
+        defaultMessage: 'saved search {savedSearchTitle}',
+        values: { savedSearchTitle: savedSearch.title }
+      })
+      : i18n('xpack.ml.newJob.simple.singleMetric.indexPatternPageTitle', {
+        defaultMessage: 'index pattern {indexPatternTitle}',
+        values: { indexPatternTitle: indexPattern.title }
+      });
 
     $scope.ui = {
       indexPattern,
@@ -142,7 +163,9 @@ module
       fields: [],
       timeFields: [],
       intervals: [{
-        title: 'Auto',
+        title: i18n('xpack.ml.newJob.simple.singleMetric.autoIntervalUnitTitle', {
+          defaultMessage: 'Auto'
+        }),
         value: 'auto',
       /*enabled: function (agg) {
         // not only do we need a time field, but the selected field needs
@@ -150,31 +173,49 @@ module
         return agg.fieldIsTimeField();
       }*/
       }, {
-        title: 'Millisecond',
+        title: i18n('xpack.ml.newJob.simple.singleMetric.millisecondIntervalUnitTitle', {
+          defaultMessage: 'Millisecond'
+        }),
         value: 'ms'
       }, {
-        title: 'Second',
+        title: i18n('xpack.ml.newJob.simple.singleMetric.secondIntervalUnitTitle', {
+          defaultMessage: 'Second'
+        }),
         value: 's'
       }, {
-        title: 'Minute',
+        title: i18n('xpack.ml.newJob.simple.singleMetric.minuteIntervalUnitTitle', {
+          defaultMessage: 'Minute'
+        }),
         value: 'm'
       }, {
-        title: 'Hourly',
+        title: i18n('xpack.ml.newJob.simple.singleMetric.hourlyIntervalUnitTitle', {
+          defaultMessage: 'Hourly'
+        }),
         value: 'h'
       }, {
-        title: 'Daily',
+        title: i18n('xpack.ml.newJob.simple.singleMetric.dailyIntervalUnitTitle', {
+          defaultMessage: 'Daily'
+        }),
         value: 'd'
       }, {
-        title: 'Weekly',
+        title: i18n('xpack.ml.newJob.simple.singleMetric.weeklyIntervalUnitTitle', {
+          defaultMessage: 'Weekly'
+        }),
         value: 'w'
       }, {
-        title: 'Monthly',
+        title: i18n('xpack.ml.newJob.simple.singleMetric.monthlyIntervalUnitTitle', {
+          defaultMessage: 'Monthly'
+        }),
         value: 'M'
       }, {
-        title: 'Yearly',
+        title: i18n('xpack.ml.newJob.simple.singleMetric.yearlyIntervalUnitTitle', {
+          defaultMessage: 'Yearly'
+        }),
         value: 'y'
       }, {
-        title: 'Custom',
+        title: i18n('xpack.ml.newJob.simple.singleMetric.customIntervalUnitTitle', {
+          defaultMessage: 'Custom'
+        }),
         value: 'custom'
       }],
       chartHeight: 310,
@@ -359,8 +400,12 @@ module
                 saveNewDatafeed(job, true);
               })
               .catch((resp) => {
-                msgs.error('Could not open job: ', resp);
-                msgs.error('Job created, creating datafeed anyway');
+                msgs.error(i18n('xpack.ml.newJob.simple.singleMetric.openJobErrorMessage', {
+                  defaultMessage: 'Could not open job: '
+                }), resp);
+                msgs.error(i18n('xpack.ml.newJob.simple.singleMetric.creatingDatafeedErrorMessage', {
+                  defaultMessage: 'Job created, creating datafeed anyway'
+                }));
                 // if open failed, still attempt to create the datafeed
                 // as it may have failed because we've hit the limit of open jobs
                 saveNewDatafeed(job, false);
@@ -369,7 +414,9 @@ module
           })
           .catch((resp) => {
             // save failed
-            msgs.error('Save failed: ', resp.resp);
+            msgs.error(i18n('xpack.ml.newJob.simple.singleMetric.saveFailedErrorMessage', {
+              defaultMessage: 'Save failed: '
+            }), resp.resp);
           });
       } else {
         // show the advanced section as the model memory limit is invalid
@@ -412,12 +459,16 @@ module
                 })
                 .catch((resp) => {
                   // datafeed failed
-                  msgs.error('Could not start datafeed: ', resp);
+                  msgs.error(i18n('xpack.ml.newJob.simple.singleMetric.datafeedNotStartedErrorMessage', {
+                    defaultMessage: 'Could not start datafeed: '
+                  }), resp);
                 });
             }
           })
           .catch((resp) => {
-            msgs.error('Save datafeed failed: ', resp);
+            msgs.error(i18n('xpack.ml.newJob.simple.singleMetric.saveDatafeedFailedErrorMessage', {
+              defaultMessage: 'Save datafeed failed: '
+            }), resp);
           });
       }
     };

x-pack/plugins/ml/public/jobs/new_job/wizard/steps/index_or_search/index_or_search.html

@@ -4,7 +4,11 @@
   <div class='kuiViewContent kuiViewContent--constrainedWidth kuiViewContentItem' >
     <div ng-controller="MlNewJobStepIndexOrSearch" class="visWizard">
       <div class="visWizard__column visWizard__column--small">
-        <h3 class="kuiTitle kuiVerticalRhythm">From a New Search, Select Index</h3>
+        <h3
+          class="kuiTitle kuiVerticalRhythm"
+          i18n-id="xpack.ml.newJob.wizard.createFromNewSearchTitle"
+          i18n-default-message="From a New Search, Select Index"
+        ></h3>
         <paginated-selectable-list
           per-page="20"
           list="indexPatterns"
@@ -16,9 +20,13 @@
       </div>
       <div class="visWizard__column visWizard__column--large">
 
-        <h3 class="kuiTitle kuiVerticalRhythm">Or, From a Saved Search</h3>
+        <h3
+          class="kuiTitle kuiVerticalRhythm"
+          i18n-id="xpack.ml.newJob.wizard.createFromSavedSearchTitle"
+          i18n-default-message="Or, From a Saved Search"
+        ></h3>
         <saved-object-finder
-          title="Saved Searches"
+          title="{{ ::'xpack.ml.newJob.wizard.savedSearchesTooltip' | i18n: {defaultMessage: 'Saved Searches'} }}"
           type="searches"
           class="visWizard__row visWizard__savedObjectFinder kuiVerticalRhythm"
           make-url="withSavedSearchUrl"

x-pack/plugins/ml/public/jobs/new_job/wizard/steps/job_type/job_type.html

@@ -4,7 +4,12 @@
   <div ng-controller="MlNewJobStepJobType">
     <!-- Presents the various options for creating a job -->
     <div class="job-types-content">
-      <h1 class="euiTitle euiTitle--large">Create a job from the {{pageTitleLabel}}</h1>
+      <h1
+        class="euiTitle euiTitle--large"
+        i18n-id="xpack.ml.newJob.wizard.jobType.createJobFromTitle"
+        i18n-default-message="Create a job from the {pageTitleLabel}"
+        i18n-values="{ pageTitleLabel }"
+      ></h1>
       <div class="euiSpacer euiSpacer--l"></div>
 
       <div ng-if="isTimeBasedIndex===false">
@@ -22,8 +27,18 @@
               <span class="euiCallOutHeader__title">{{indexWarningTitle}}</span>
             </div>
             <div class="euiText euiText--small">
-              <p>Anomaly detection can only be run over indices which are time based.<br/>
-                <a class="euiLink euiLink--primary" href="#jobs/new_job">Select a different index</a>
+              <p>
+                <span
+                  i18n-id="xpack.ml.newJob.wizard.jobType.howToRunAnomalyDetectionDescription"
+                  i18n-default-message="Anomaly detection can only be run over indices which are time based."
+                ></span>
+                <br/>
+                <a
+                  class="euiLink euiLink--primary"
+                  href="#jobs/new_job\"
+                  i18n-id="xpack.ml.newJob.wizard.jobType.selectDifferentIndexLinkText"
+                  i18n-default-message="Select a different index"
+                ></a>
               </p>
             </div>
           </div>
@@ -33,11 +48,17 @@
 
       <div ng-show="recognizerResults.count!==0" class="recognizer-section">
         <div class="euiText">
-          <h3 class="euiTitle euiTitle--small">Use a supplied configuration</h3>
-          <p>
-            The fields in your data have been recognized as matching known configurations.
-            Select to create a set of machine learning jobs and associated dashboards.
-          </p>
+          <h3
+            class="euiTitle euiTitle--small"
+            i18n-id="xpack.ml.newJob.wizard.jobType.useSuppliedConfigurationTitle"
+            i18n-default-message="Use a supplied configuration"
+            >
+          </h3>
+          <p
+            i18n-id="xpack.ml.newJob.wizard.jobType.useSuppliedConfigurationDescription"
+            i18n-default-message="The fields in your data have been recognized as matching known configurations.
+            Select to create a set of machine learning jobs and associated dashboards."
+          ></p>
         </div>
         <div class="euiSpacer euiSpacer--m"></div>
         <ml-data-recognizer
@@ -50,10 +71,15 @@
       </div>
 
       <div class="euiText">
-        <h3 class="euiTitle euiTitle--small">Use a wizard</h3>
-        <p>
-          Use one of the wizards to create a machine learning job to find anomalies in your data.
-        </p>
+        <h3
+          class="euiTitle euiTitle--small"
+          i18n-id="xpack.ml.newJob.wizard.jobType.useWizardTitle"
+          i18n-default-message="Use a wizard"
+        ></h3>
+        <p
+          i18n-id="xpack.ml.newJob.wizard.jobType.useWizardDescription"
+          i18n-default-message="Use one of the wizards to create a machine learning job to find anomalies in your data."
+        ></p>
       </div>
 
       <div class="euiSpacer euiSpacer--m"></div>
@@ -64,15 +90,26 @@
             <div class="euiPanel euiPanel--paddingMedium synopsisPanel">
               <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--responsive">
                 <div class="euiFlexItem euiFlexItem--flexGrowZero">
-                  <icon type="'createSingleMetricJob'" size="'xl'" aria-label="Single metric job" class="synopsisIcon" />
+                  <icon
+                    type="'createSingleMetricJob'"
+                    size="'xl'"
+                    aria-label="{{ ::'xpack.ml.newJob.wizard.jobType.singleMetricAriaLabel' | i18n: {defaultMessage: 'Single metric job'} }}"
+                    class="synopsisIcon"
+                  />
                 </div>
                 <div class="euiFlexItem synopsisContent">
-                  <h4 class="euiTitle euiTitle--small synopsisTitle">Single metric</h4>
+                  <h4
+                    class="euiTitle euiTitle--small synopsisTitle"
+                    i18n-id="xpack.ml.newJob.wizard.jobType.singleMetricTitle"
+                    i18n-default-message="Single metric"
+                  ></h4>
                   <div class="euiText synopsisBody">
                     <p>
-                      <span class="euiTextColor euiTextColor--subdued">
-                      Detect anomalies in a single time series.
-                      </span>
+                      <span
+                        class="euiTextColor euiTextColor--subdued"
+                        i18n-id="xpack.ml.newJob.wizard.jobType.singleMetricDescription"
+                        i18n-default-message="Detect anomalies in a single time series."
+                      ></span>
                     </p>
                   </div>
                 </div>
@@ -85,15 +122,26 @@
             <div class="euiPanel euiPanel--paddingMedium synopsisPanel">
               <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--responsive">
                 <div class="euiFlexItem euiFlexItem--flexGrowZero">
-                  <icon type="'createMultiMetricJob'" size="'xl'" aria-label="Multi metric job" class="synopsisIcon" />
+                  <icon
+                    type="'createMultiMetricJob'"
+                    size="'xl'"
+                    aria-label="{{ ::'xpack.ml.newJob.wizard.jobType.multiMetricAriaLabel' | i18n: {defaultMessage: 'Multi metric job'} }}"
+                    class="synopsisIcon"
+                  />
                 </div>
                 <div class="euiFlexItem synopsisContent">
-                  <h4 class="euiTitle euiTitle--small synopsisTitle">Multi metric</h4>
+                  <h4
+                    class="euiTitle euiTitle--small synopsisTitle"
+                    i18n-id="xpack.ml.newJob.wizard.jobType.multiMetricTitle"
+                    i18n-default-message="Multi metric"
+                  ></h4>
                   <div class="euiText synopsisBody">
                     <p>
-                      <span class="euiTextColor euiTextColor--subdued">
-                      Detect anomalies in multiple metrics by splitting a time series by a categorical field.
-                      </span>
+                      <span
+                        class="euiTextColor euiTextColor--subdued"
+                        i18n-id="xpack.ml.newJob.wizard.jobType.multiMetricDescription"
+                        i18n-default-message="Detect anomalies in multiple metrics by splitting a time series by a categorical field."
+                      ></span>
                     </p>
                   </div>
                 </div>
@@ -106,15 +154,26 @@
             <div class="euiPanel euiPanel--paddingMedium synopsisPanel">
               <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--responsive">
                 <div class="euiFlexItem euiFlexItem--flexGrowZero">
-                  <icon type="'createPopulationJob'" size="'xl'" aria-label="Population job" class="synopsisIcon" />
+                  <icon
+                    type="'createPopulationJob'"
+                    size="'xl'"
+                    aria-label="{{ ::'xpack.ml.newJob.wizard.jobType.populationAriaLabel' | i18n: {defaultMessage: 'Population job'} }}"
+                    class="synopsisIcon"
+                  />
                 </div>
                 <div class="euiFlexItem synopsisContent">
-                  <h4 class="euiTitle euiTitle--small synopsisTitle">Population</h4>
+                  <h4
+                    class="euiTitle euiTitle--small synopsisTitle"
+                    i18n-id="xpack.ml.newJob.wizard.jobType.populationTitle"
+                    i18n-default-message="Population"
+                  ></h4>
                   <div class="euiText synopsisBody">
                     <p>
-                      <span class="euiTextColor euiTextColor--subdued">
-                      Detect activity that is unusual compared to the behavior of the population.
-                      </span>
+                      <span
+                        class="euiTextColor euiTextColor--subdued"
+                        i18n-id="xpack.ml.newJob.wizard.jobType.populationDescription"
+                        i18n-default-message="Detect activity that is unusual compared to the behavior of the population."
+                      ></span>
                     </p>
                   </div>
                 </div>
@@ -127,15 +186,26 @@
             <div class="euiPanel euiPanel--paddingMedium synopsisPanel">
               <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--responsive">
                 <div class="euiFlexItem euiFlexItem--flexGrowZero">
-                  <icon type="'createAdvancedJob'" size="'xl'" aria-label="Advanced job" class="synopsisIcon" />
+                  <icon
+                    type="'createAdvancedJob'"
+                    size="'xl'"
+                    aria-label="{{ ::'xpack.ml.newJob.wizard.jobType.advancedAriaLabel' | i18n: {defaultMessage: 'Advanced job'} }}"
+                    class="synopsisIcon"
+                  />
                 </div>
                 <div class="euiFlexItem synopsisContent">
-                  <h4 class="euiTitle euiTitle--small synopsisTitle">Advanced</h4>
+                  <h4
+                    class="euiTitle euiTitle--small synopsisTitle"
+                    i18n-id="xpack.ml.newJob.wizard.jobType.advancedTitle"
+                    i18n-default-message="Advanced"
+                  ></h4>
                   <div class="euiText synopsisBody">
                     <p>
-                      <span class="euiTextColor euiTextColor--subdued">
-                      Use the full range of options to create a job for more advanced use cases.
-                      </span>
+                      <span
+                        class="euiTextColor euiTextColor--subdued"
+                        i18n-id="xpack.ml.newJob.wizard.jobType.advancedDescription"
+                        i18n-default-message="Use the full range of options to create a job for more advanced use cases."
+                      ></span>
                     </p>
                   </div>
                 </div>
@@ -148,10 +218,15 @@
       <div class="euiSpacer euiSpacer--xxl"></div>
 
       <div class="euiText">
-        <h3 class="euiTitle euiTitle--small">Learn more about your data</h3>
-        <p>
-          If you're not sure what type of job to create, first explore the fields and metrics in your data.
-        </p>
+        <h3
+          class="euiTitle euiTitle--small"
+          i18n-id="xpack.ml.newJob.wizard.jobType.learnMoreAboutDataTitle"
+          i18n-default-message="Learn more about your data"
+        ></h3>
+        <p
+          i18n-id="xpack.ml.newJob.wizard.jobType.learnMoreAboutDataDescription"
+          i18n-default-message="If you're not sure what type of job to create, first explore the fields and metrics in your data."
+        ></p>
       </div>
       <div class="euiSpacer euiSpacer--m"></div>
 
@@ -165,15 +240,26 @@
             <div class="euiPanel euiPanel--paddingMedium synopsisPanel">
               <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--responsive">
                 <div class="euiFlexItem euiFlexItem--flexGrowZero">
-                  <icon type="'dataVisualizer'" size="'xl'" aria-label="Data Visualizer" class="synopsisIcon" />
+                  <icon
+                    type="'dataVisualizer'"
+                    size="'xl'"
+                    aria-label="{{ ::'xpack.ml.newJob.wizard.jobType.dataVisualizerAriaLabel' | i18n: {defaultMessage: 'Data Visualizer'} }}"
+                    class="synopsisIcon"
+                  />
                 </div>
                 <div class="euiFlexItem synopsisContent">
-                  <h4 class="euiTitle euiTitle--small synopsisTitle">Data Visualizer</h4>
+                  <h4
+                    class="euiTitle euiTitle--small synopsisTitle"
+                    i18n-id="xpack.ml.newJob.wizard.jobType.dataVisualizerTitle"
+                    i18n-default-message="Data Visualizer"
+                  ></h4>
                   <div class="euiText synopsisBody">
                     <p>
-                      <span class="euiTextColor euiTextColor--subdued">
-                      Learn more about the characteristics of your data and identify the fields for analysis with machine learning.
-                      </span>
+                      <span
+                        class="euiTextColor euiTextColor--subdued"
+                        i18n-id="xpack.ml.newJob.wizard.jobType.dataVisualizerDescription"
+                        i18n-default-message="Learn more about the characteristics of your data and identify the fields for analysis with machine learning."
+                      ></span>
                     </p>
                   </div>
                 </div>

x-pack/plugins/ml/public/jobs/new_job/wizard/steps/job_type/job_type_controller.js

@@ -44,7 +44,8 @@ const module = uiModules.get('apps/ml');
 module.controller('MlNewJobStepJobType',
   function (
     $scope,
-    Private) {
+    Private,
+    i18n) {
 
     timefilter.disableTimeRangeSelector(); // remove time picker from top of page
     timefilter.disableAutoRefreshSelector(); // remove time picker from top of page
@@ -59,8 +60,18 @@ module.controller('MlNewJobStepJobType',
     $scope.indexWarningTitle = '';
     $scope.isTimeBasedIndex = timeBasedIndexCheck(indexPattern);
     if ($scope.isTimeBasedIndex === false) {
-      $scope.indexWarningTitle = (savedSearch.id === undefined) ? `Index pattern ${indexPattern.title} is not time based` :
-        `${savedSearch.title} uses index pattern ${indexPattern.title} which is not time based`;
+      $scope.indexWarningTitle = (savedSearch.id === undefined) ?
+        i18n('xpack.ml.newJob.wizard.jobType.indexPatternNotTimeBasedMessage', {
+          defaultMessage: 'Index pattern {indexPatternTitle} is not time based',
+          values: { indexPatternTitle: indexPattern.title }
+        })
+        : i18n('xpack.ml.newJob.wizard.jobType.indexPatternFromSavedSearchNotTimeBasedMessage', {
+          defaultMessage: '{savedSearchTitle} uses index pattern {indexPatternTitle} which is not time based',
+          values: {
+            savedSearchTitle: savedSearch.title,
+            indexPatternTitle: indexPattern.title
+          }
+        });
     }
 
     $scope.indexPattern = indexPattern;
@@ -68,7 +79,14 @@ module.controller('MlNewJobStepJobType',
     $scope.recognizerResults = { count: 0 };
 
     $scope.pageTitleLabel = (savedSearch.id !== undefined) ?
-      `saved search ${savedSearch.title}` : `index pattern ${indexPattern.title}`;
+      i18n('xpack.ml.newJob.wizard.jobType.savedSearchPageTitleLabel', {
+        defaultMessage: 'saved search {savedSearchTitle}',
+        values: { savedSearchTitle: savedSearch.title }
+      })
+      : i18n('xpack.ml.newJob.wizard.jobType.indexPatternPageTitleLabel', {
+        defaultMessage: 'index pattern {indexPatternTitle}',
+        values: { indexPatternTitle: indexPattern.title }
+      });
 
     $scope.getUrl = function (basePath) {
       return (savedSearch.id === undefined) ? `${basePath}?index=${indexPattern.id}` :