[i18n] Translate ML - New Job(part_1)

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 @@ <h1 class="euiTitle euiTitle--large">New job from {{ui.pageTitle}}</h1>
     <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 @@ <h1 class="euiTitle euiTitle--large">New job from {{ui.pageTitle}}</h1>
           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 @@ <h1 class="euiTitle euiTitle--large">New job from {{ui.pageTitle}}</h1>
       </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 @@ <h1 class="euiTitle euiTitle--large">New job from {{ui.pageTitle}}</h1>
           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 @@ <h1 class="euiTitle euiTitle--large">New job from {{ui.pageTitle}}</h1>
       </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 @@ <h1 class="euiTitle euiTitle--large">New job from {{ui.pageTitle}}</h1>
           </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 @@ <h1 class="euiTitle euiTitle--large">New job from {{ui.pageTitle}}</h1>
             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 @@ <h2 class="euiTitle euiTitle"><i class='fa fa-spinner fa-spin'></i></h2>
             </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 @@ <h4 class="euiTitle euiTitle--small"><i class="fa fa-info-circle"></i> No result
 
     <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 @@ <h4 class="euiTitle euiTitle--small"><i class="fa fa-info-circle"></i> No result
       <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 @@ <h4 class="euiTitle euiTitle--small"><i class="fa fa-info-circle"></i> No result
                 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 @@ <h4 class="euiTitle euiTitle--small"><i class="fa fa-info-circle"></i> No result
       </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 @@ <h4 class="euiTitle euiTitle--small"><i class="fa fa-info-circle"></i> No result
         </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>