Commit f2346aa2 authored by Diego Rey's avatar Diego Rey
Browse files

Add translations language for graph3D component

parent c9681047
......@@ -5,8 +5,7 @@
type="button"
class="btn btn-secondary"
style="min-width: 70px;"
(click)=changeZoomType()
>
(click)=changeZoomType()>
{{getZoom3DTypeName(graphProps.zoomType)}}
</button>
<div class="btn-group" ngbDropdown role="group" aria-label="Button group with nested dropdown">
......@@ -16,8 +15,7 @@
*ngFor="let type of [1,2,3,4]"
class="dropdown-item"
[disabled]="type === graphProps.zoomType"
(click)=changeZoomType(type)
>
(click)=changeZoomType(type)>
{{getZoom3DTypeName(type)}}
</button>
</div>
......@@ -25,32 +23,29 @@
</div>
<button
ngbPopover="Zoom +"
ngbPopover='{{ "i18n.action.zoom" | translate | titleCase}} +'
triggers="mouseenter:mouseleave"
data-placement="bottom"
class="btn btn-sm btn-secondary"
(click)=zoomIn()
>
(click)=zoomIn() >
<i class="fa fa-plus"></i>
</button>
<button
ngbPopover="Zoom -"
ngbPopover='{{ "i18n.action.zoom" | translate | titleCase}} -'
triggers="mouseenter:mouseleave"
data-placement="bottom"
class="btn btn-sm btn-secondary"
(click)=zoomOut()
>
(click)=zoomOut() >
<i class="fa fa-minus"></i>
</button>
<button
ngbPopover="Centrar"
ngbPopover='{{ "i18n.action.center" | translate | titleCase}}'
triggers="mouseenter:mouseleave"
data-placement="bottom"
class="btn btn-sm btn-secondary"
(click)=center()
>
(click)=center() >
<i class="fa fa-arrows"></i>
</button>
......@@ -61,8 +56,7 @@
[ngbPopover]=popoverAxesSize
popoverTitle="Rango de ejes"
#popover="ngbPopover"
tiggers="click"
>
tiggers="click">
<i class="fa fa-arrows-h"></i>
</button>
<ng-template #popoverAxesSize>
......@@ -140,12 +134,11 @@
<button
ngbPopover="Borrar"
ngbPopover='{{ "i18n.action.delete" | translate | titleCase }}'
triggers="mouseenter:mouseleave"
data-placement="bottom"
class="btn btn-sm btn-secondary"
(click)=clear()
>
(click)=clear() >
<i class="fa fa-trash"></i>
</button>
......@@ -155,7 +148,7 @@
placement="bottom"
tiggers="click"
class="btn btn-sm btn-secondary"
popoverTitle="Configuración"
popoverTitle='{{ "i18n.object.settings" | translate | titleCase }}'
>
<i class="fa fa-gear"></i>
</button>
......@@ -164,12 +157,12 @@
<div style="width: 140px;">
<label class="d-block">
<input type="checkbox"[checked]=graphProps.showAxes (click)="changeAxesVisibility()">
Mostrar grilla
{{ "i18n.object.grid" | translate | titleCase }}
</label>
<div style="display: flex;">
<span style="margin-right: 8px; align-self: center;">
Quality:
{{ "i18n.object.quality" | translate | titleCase }}:
</span>
<input
......
......@@ -2,6 +2,8 @@ import { Component, OnInit, ViewChild, ElementRef, NgZone, AfterViewInit } from
import * as graph3DLib from 'graph3D';
import { GHCIService } from '../../../shared/services/ghci.service';
import { formatJSON, AnimationProps, Zoom3DType, GraphProps, Default_GraphProps, debounce } from './graph3D.helper';
import { TranslateService } from '@ngx-translate/core';
import { TitleCasePipe } from '../../../shared/pipes/titlecase.pipe';
@Component({
selector: 'graph3d-component',
......@@ -15,6 +17,9 @@ export class Graph3DComponent implements AfterViewInit {
private ghciServiceSub: any;
private translateService: any;
private titlecasePipe: any;
@ViewChild('graph3DElement')
private graph3DRef: ElementRef;
......@@ -27,9 +32,13 @@ export class Graph3DComponent implements AfterViewInit {
speed: 1000
};
constructor(ghciService: GHCIService, private zone: NgZone) {
constructor(ghciService: GHCIService, private zone: NgZone, public translate: TranslateService) {
const self = this;
// i18n
this.translateService = translate;
this.titlecasePipe = new TitleCasePipe();
this.ghciServiceSub = ghciService.messages.subscribe(
message => {
if (message.tipo == "canvas3D") {
......@@ -177,13 +186,13 @@ export class Graph3DComponent implements AfterViewInit {
public getZoom3DTypeName = (type: Zoom3DType) => {
switch (type) {
case Zoom3DType.Normal:
return 'Normal';
return this.titlecasePipe.transform(this.translateService.get('i18n.object.normal').value);
case Zoom3DType.XAxis:
return 'Eje x';
return this.titlecasePipe.transform(this.translateService.get('i18n.object.axis').value) + ' x';
case Zoom3DType.YAxis:
return 'Eje y';
return this.titlecasePipe.transform(this.translateService.get('i18n.object.axis').value) + ' y';
case Zoom3DType.ZAxis:
return 'Eje z';
return this.titlecasePipe.transform(this.translateService.get('i18n.object.axis').value) + ' z';
}
}
}
......@@ -6,10 +6,19 @@ import { FormsModule } from '@angular/forms';
import { Graph3DComponent } from './graph3D.component';
import { AnimationControlComponent } from '../animation-control/animation-control.component';
import { DirectivesModule } from '../../../shared/directives/directives.module';
import { I18nModule } from '../../../shared/modules/translate/i18n.module';
import { TitleCaseModule } from '../../../shared/modules/titlecase.module';
@NgModule({
imports: [FormsModule, RouterModule, CommonModule, NgbModule, DirectivesModule],
imports: [
FormsModule,
RouterModule,
CommonModule,
NgbModule,
DirectivesModule,
I18nModule,
TitleCaseModule
],
declarations: [
AnimationControlComponent,
Graph3DComponent
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment