From 071cce001fd8b28c5875bd5d2c31d4c5419dc9f5 Mon Sep 17 00:00:00 2001
From: Diego Rey <diego.despaux@izundo.com>
Date: Sun, 25 Nov 2018 20:42:51 -0300
Subject: [PATCH] Add translations language for matefun component
---
.../app/layout/matefun/matefun.component.html | 69 ++++++++++++++-----
.../app/layout/matefun/matefun.component.ts | 19 +++--
.../src/app/layout/matefun/matefun.module.ts | 24 ++++---
3 files changed, 82 insertions(+), 30 deletions(-)
diff --git a/Frontend Angular 4/src/app/layout/matefun/matefun.component.html b/Frontend Angular 4/src/app/layout/matefun/matefun.component.html
index 55ba8c9..70e915e 100755
--- a/Frontend Angular 4/src/app/layout/matefun/matefun.component.html
+++ b/Frontend Angular 4/src/app/layout/matefun/matefun.component.html
@@ -3,7 +3,7 @@
<div class="row">
<div class="col-md-6">
<ngb-tabset [destroyOnHide]=false (tabChange)="onChangeTab($event)">
- <ngb-tab id="ProgramBtn"title="Programa">
+ <ngb-tab id="ProgramBtn" title='{{ "i18n.object.program" | translate | titlecase }}'>
<ng-template ngbTabContent>
<div class="card">
@@ -11,39 +11,75 @@
<form>
<input type="text" name="archivo" class="nomArchivoInp form-control form-control-sm"
[disabled]="!archivo.editable || archivo.estado=='Corregido' || archivo.estado == 'Entregado'"
- *ngIf="archivo" [(ngModel)]="archivo.nombre" (keyup)="archivoModificado()" placeholder="nombre del archivo" />
+ *ngIf="archivo" [(ngModel)]="archivo.nombre" (keyup)="archivoModificado()" placeholder='{{ "i18n.msg.codemirror.fileName" | translate }}' />
- <button id="downloadFileButton" (click)="downloadFile()" style="margin-left: 10px; float: right;" class="btn btn-sm btn-secondary" placement="bottom" ngbPopover="Exportar (Ctrl+E)" triggers="mouseenter:mouseleave" tiggers="click">
+ <button
+ id="downloadFileButton"
+ (click)="downloadFile()"
+ style="margin-left: 10px; float: right;"
+ class="btn btn-sm btn-secondary"
+ placement="bottom"
+ ngbPopover='{{ "i18n.action.export" | translate | titleCase }} (Ctrl+E)'
+ triggers="mouseenter:mouseleave"
+ tiggers="click">
<i class="fa fa-download "></i>
</button>
-
- <button style="margin-left: 10px; float: right;" id="popover" class="btn btn-sm btn-secondary" placement="bottom" [ngbPopover]=popoverContent #popover="ngbPopover" popoverTitle="Configuración" tiggers="click">
+ <button
+ style="margin-left: 10px; float: right;"
+ id="popover" class="btn btn-sm btn-secondary"
+ placement="bottom"
+ [ngbPopover]=popoverContent
+ #popover="ngbPopover"
+ popoverTitle='{{ "i18n.object.settings" | translate | titleCase }}'
+ tiggers="click">
<i class="fa fa-gear"></i>
</button>
- <div style="margin-left: 10px; float: right;" ngbPopover="Guardar archivo (Ctrl+G)" triggers="mouseenter:mouseleave" placement="bottom" >
+ <div
+ style="margin-left: 10px; float: right;"
+ ngbPopover='{{ "i18n.action.save" | translate | titleCase }} {{ "i18n.object.file" | translate | titleCase }} (Ctrl+G)'
+ triggers="mouseenter:mouseleave"
+ placement="bottom" >
<button [disabled]="!modificado" (click)="guardarArchivo()" class="btn btn-sm btn-secondary" >
<i class="fa fa-save"></i>
</button>
</div>
- <button style="margin-left: 10px; float: right;" (click)="reiniciarInterprete()" class="btn btn-sm btn-secondary" ngbPopover="Reiniciar intérprete (Ctrl+R)" triggers="mouseenter:mouseleave" placement="bottom">
+ <button
+ style="margin-left: 10px; float: right;"
+ (click)="reiniciarInterprete()"
+ class="btn btn-sm btn-secondary"
+ ngbPopover='{{ "i18n.action.restart" | translate | titleCase }} {{ "i18n.object.interpreter" | translate | titleCase }} (Ctrl+R)'
+ triggers="mouseenter:mouseleave"
+ placement="bottom">
<i class="fa fa-refresh"></i>
</button>
- <button style="margin-left: 10px; float: right;" (click)="runCode()" class="btn btn-sm btn-secondary" ngbPopover="Cargar programa (Ctrl+P)" triggers="mouseenter:mouseleave" placement="bottom">
+ <button
+ style="margin-left: 10px; float: right;"
+ (click)="runCode()"
+ class="btn btn-sm btn-secondary"
+ ngbPopover='{{ "i18n.action.load" | translate | titleCase }} {{ "i18n.object.program" | translate | titleCase }} (Ctrl+P)'
+ triggers="mouseenter:mouseleave"
+ placement="bottom">
<i class="fa fa-play"></i>
</button>
- <button style="float: right;" (click)="seleccionarDirectorio()" class="btn btn-sm btn-secondary" ngbPopover="Nuevo archivo (Ctrl+A)" triggers="mouseenter:mouseleave" placement="bottom">
+ <button
+ style="float: right;"
+ (click)="seleccionarDirectorio()"
+ class="btn btn-sm btn-secondary"
+ ngbPopover='{{ "i18n.action.new" | translate | titleCase }} {{ "i18n.object.file" | translate | titleCase }} (Ctrl+A)'
+ triggers="mouseenter:mouseleave"
+ placement="bottom">
<i class="fa fa-plus"></i>
</button>
<ng-template #popoverContent style="width: 15em">
<div style="width: 12em">
<div class="form-group">
- <label>Tema:</label>
+ <label>{{ "i18n.object.theme" | translate | titleCase }}:</label>
<select name="theme" class="form-control form-control-sm" #selectTheme (change)=updateConfig(selectTheme.value)>
<option *ngFor="let theme of themes" [selected]="theme==configCodeMirror.theme" value='{{theme}}'>{{theme}}</option>
</select>
</div>
<div class="form-group">
- <label>Tamaño de fuente:</label>
+ <label>{{ "i18n.msg.codemirror.fontSize" | translate }}:</label>
<div>
<button class="btn btn-sm btn-secondary" (click)="aumentarFuente()">Aâº</button>
<button class="btn btn-sm btn-secondary" (click)="disminuirFuente()">Aâ»</button>
@@ -53,16 +89,17 @@
<div class="form-group">
<label>
<input type="checkbox" style="width: 15px; display: inline-block;" name="argumentoF" class="form-control form-control-sm" [(ngModel)]=argumentoF>
- Mostrar advertencias de uso de funciones
+ {{ "i18n.msg.codemirror.functionWarnings" | translate }}
</label>
<br>
<label>
<input type="checkbox" style="width: 15px; display: inline-block;" name="argumentoI" class="form-control form-control-sm" [(ngModel)]=argumentoI>
- Mostrar advertencias de uso de operadores infijos
+ {{ "i18n.msg.codemirror.infixOperatorsWarnings" | translate }}
+
</label>
</div>
<div class="form-group">
- <button class="btn btn-secondary" (click)="saveConfig()">Guardar</button>
+ <button class="btn btn-secondary" (click)="saveConfig()">{{ "i18n.action.save" | translate | titleCase }}</button>
</div>
</div>
</ng-template>
@@ -79,12 +116,12 @@
<canvas-component (canvasComp)=canvasC></canvas-component>
</ng-template>
</ngb-tab> -->
- <ngb-tab id="FigurasBtn2D" title="Figuras 2D">
+ <ngb-tab id="FigurasBtn2D" title='{{ "i18n.object.figures" | translate | titleCase }} 2D'>
<ng-template ngbTabContent>
<graph2D-component (graph2DComp)=graph2DComp></graph2D-component>
</ng-template>
</ngb-tab>
- <ngb-tab id="FigurasBtn3D" title="Figuras 3D">
+ <ngb-tab id="FigurasBtn3D" title='{{ "i18n.object.figures" | translate | titleCase }} 3D'>
<ng-template ngbTabContent>
<graph3d-component (graph3DComp)=graph3DComp></graph3d-component>
</ng-template>
diff --git a/Frontend Angular 4/src/app/layout/matefun/matefun.component.ts b/Frontend Angular 4/src/app/layout/matefun/matefun.component.ts
index 74867fe..af4e338 100755
--- a/Frontend Angular 4/src/app/layout/matefun/matefun.component.ts
+++ b/Frontend Angular 4/src/app/layout/matefun/matefun.component.ts
@@ -22,6 +22,8 @@ import { NotificacionService } from '../../shared/services/notificacion.service'
import { Graph2DModule } from '../plotter/graph2D/graph2D.module';
import { Graph2DComponent } from '../plotter/graph2D/graph2D.component';
import { Graph3DComponent } from '../plotter/graph3D/graph3D.component';
+import { TranslateService } from '@ngx-translate/core';
+import { TitleCasePipe } from '../../shared/pipes/titlecase.pipe';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
@@ -48,6 +50,7 @@ import * as npm from './../../../../package.json'
var codeMirrorRef:any;
var componentRef : any;
var focus: any;
+
@Component({
moduleId: module.id,
selector: 'matefun',
@@ -58,7 +61,8 @@ var focus: any;
export class MateFunComponent {
-
+ titlecasePipe: any;
+ translateService: any;
consoleDisable: boolean = false;
consolaVisible: boolean = true;
cursorPanel: any;
@@ -101,7 +105,13 @@ export class MateFunComponent {
private notifService: NotificacionService,
private sessionService: SessionService,
private dialogService:DialogService,
- private usuarioService: UsuarioService) {
+ private usuarioService: UsuarioService,
+ public translate: TranslateService) {
+
+ // i18n
+ this.translateService = translate;
+ this.titlecasePipe = new TitleCasePipe();
+
//si el archivo fue seteado en la session.
this.archivo = sessionService.getArchivo();
if(!this.archivo || !this.archivo.id){
@@ -170,7 +180,8 @@ export class MateFunComponent {
var y = cm.getCursor().ch;
x = (Number(x) + 1).toString();
y = (Number(y) + 1).toString();
- this.cursorPanelLabel.textContent = "Posición del cursor: (" + x + "," + y + ")";
+ var cursorPositionTranslate = this.translateService.get('i18n.msg.codemirror.cursorPosition').value;
+ this.cursorPanelLabel.textContent = cursorPositionTranslate + ": (" + x + "," + y + ")";
this.cursorPanel = this.codemirror.instance.addPanel(node, {position: "bottom", stable: true});
@@ -181,7 +192,7 @@ export class MateFunComponent {
var y = cm.getCursor().ch;
x = (Number(x) + 1).toString();
y = (Number(y) + 1).toString();
- that.cursorPanel.node.innerText = "Posición del cursor: (" + x + "," + y + ")";
+ that.cursorPanel.node.innerText = cursorPositionTranslate + ": (" + x + "," + y + ")";
});
this.codemirror.instance.on("keyHandled",function(cm,name,evt){
diff --git a/Frontend Angular 4/src/app/layout/matefun/matefun.module.ts b/Frontend Angular 4/src/app/layout/matefun/matefun.module.ts
index d250a59..80eba44 100755
--- a/Frontend Angular 4/src/app/layout/matefun/matefun.module.ts
+++ b/Frontend Angular 4/src/app/layout/matefun/matefun.module.ts
@@ -12,19 +12,23 @@ import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { NotificacionModule } from '../../notificacion/notificacion.module';
import { Graph2DModule } from '../plotter/graph2D/graph2D.module';
import { Graph3DModule } from '../plotter/graph3D/graph3D.module';
+import { I18nModule } from '../../shared/modules/translate/i18n.module';
+import { TitleCaseModule } from '../../shared/modules/titlecase.module';
@NgModule({
imports: [
- CommonModule,
- FormsModule,
- CanvasModule,
- Graph2DModule,
- Graph3DModule,
- NotificacionModule,
- MateFunRoutingModule,
- CodemirrorModule,
- NgbModule,
- BootstrapModalModule
+ CommonModule,
+ FormsModule,
+ CanvasModule,
+ Graph2DModule,
+ Graph3DModule,
+ NotificacionModule,
+ MateFunRoutingModule,
+ CodemirrorModule,
+ NgbModule,
+ BootstrapModalModule,
+ I18nModule,
+ TitleCaseModule
],
entryComponents: [
ConfirmComponent,
--
GitLab