matefun.component.ts 24 KB
Newer Older
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
import { Component, NgModule, ViewChild, HostListener, ElementRef, ComponentRef, TemplateRef } from '@angular/core';
import { CanvasModule} from '../canvas/canvas.module';
import { CanvasComponent } from '../canvas/canvas.component';
import { Http, JsonpModule } from '@angular/http';
import { Headers, RequestOptions } from '@angular/http';
import { HaskellService } from '../../shared/services/haskell.service';
import { WebsocketService } from '../../shared/services/websocket.service';
import { UsuarioService } from '../../shared/services/usuario.service';
import { SessionService } from '../../shared/services/session.service';
import { GHCIService } from '../../shared/services/ghci.service';
import { AuthenticationService } from '../../shared/services/authentication.service';
import { GHCI_URL } from '../../shared/config';
import { Archivo } from '../../shared/objects/archivo';
import { Configuracion } from '../../shared/objects/usuario';
import { ConfirmComponent } from './confirm.component';
import { SeleccionarDirectorioComp } from './seleccionarDirectorio.component';
import { DialogService } from "ng2-bootstrap-modal";
import { CodemirrorComponent } from 'ng2-codemirror';
import { NgbPopoverConfig, NgbPopover} from '@ng-bootstrap/ng-bootstrap';
import { NgbPopoverWindow } from '@ng-bootstrap/ng-bootstrap/popover/popover';
import { NotificacionService } from '../../shared/services/notificacion.service';
Diego Rey's avatar
Diego Rey committed
22
23
import { Graph2DModule } from '../plotter/graph2D/graph2D.module';
import { Graph2DComponent } from '../plotter/graph2D/graph2D.component';
24
import { Graph3DComponent } from '../plotter/graph3D/graph3D.component';
25
26
import { TranslateService } from '@ngx-translate/core';
import { TitleCasePipe } from '../../shared/pipes/titlecase.pipe';
27
28
29

import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
30
// import 'codemirror/mode/haskell/haskell';
31
32
33
34
35
36
37
38
39
40
41
42
import 'codemirror/addon/display/panel';
import 'codemirror/addon/hint/show-hint';
import 'codemirror/addon/hint/anyword-hint';
import 'codemirror/mode/markdown/markdown';
import 'codemirror/lib/codemirror';
import 'codemirror/addon/search/search';


import 'codemirror/addon/dialog/dialog';
import 'codemirror/addon/search/search';
import 'codemirror/addon/search/matchesonscrollbar';
import 'codemirror/addon/search/jump-to-line';
43
import 'codemirror/addon/edit/matchbrackets';
44
45
import 'codemirror/addon/selection/active-line';
import 'codemirror/addon/comment/comment.js';
46

47
48
import './codemirror/matefun-mode-ES.js'
import './codemirror/matefun-mode-EN.js'
Franco Pariani's avatar
Franco Pariani committed
49
import './codemirror/functions_definition.js'
50

51
52
import * as npm from './../../../../package.json'

53
54
55
var codeMirrorRef:any;
var componentRef : any;
var focus: any;
56

57
58
59
60
61
@Component({
    moduleId: module.id,
    selector: 'matefun',     
    templateUrl: './matefun.component.html',   
    styleUrls: ['./matefun.component.scss'],  
62
    providers: [ WebsocketService, NgbPopoverConfig, UsuarioService ]
63
64
65
66
})


export class MateFunComponent {
67
68
    titlecasePipe: any;
    translateService: any;
69
70
71
72
73
74
75
76
77
78
79
80
    consoleDisable: boolean = false;
    consolaVisible: boolean = true;
    cursorPanel: any;
    cursorPanelLabel: any;
    cursorLabelInit : boolean = false;
    entrada : string = '';
    archivo : Archivo;
    copiaNombreArchivo:string;
    copiaContenidoArchivo:string;
    modificado = false;
    argumentoI = false;
    argumentoF = false;
Franco Pariani's avatar
Franco Pariani committed
81
    hintsCheck = true;
Franco Pariani's avatar
Franco Pariani committed
82
    typingCheck = true;
83
84
85
86
87
88
89
90
91
    editableLoaded = false;
    editDialogFired = false;
    archivosTree :any;
    idRecorridos: any;
    code: string ='';
    configCodeMirror = {
        readOnly: false,
        lineNumbers: true,
        lineWrapping : true,
92
        matchBrackets: true,
93
        styleActiveLine: true,
94
95
        extraKeys: {"Ctrl-Space": "autocomplete"},
        mode: {
96
            name: "matefun-EN", 
97
98
99
100
            globalVars: true
        },
        gutters: ["CodeMirror-linenumbers", "breakpoints"],
        theme: 'dracula',
101
102
        fontSize: 12,
        hintOptions: {
103
104
            completeSingle: false,
            closeCharacters: /[^\d\w\_]/
105
        }
106
107
    };
    themes = ['3024-day', '3024-night', 'abcdef', 'ambiance-mobile', 'ambiance', 'base16-dark', 'base16-light', 'bespin', 'blackboard', 'cobalt', 'colorforth', 'dracula', 'duotone-dark', 'duotone-light', 'eclipse', 'elegant', 'erlang-dark', 'hopscotch', 'icecoder', 'isotope', 'lesser-dark', 'liquibyte', 'material', 'mbo', 'mdn-like', 'midnight', 'monokai', 'neat', 'neo', 'night', 'panda-syntax', 'paraiso-dark', 'paraiso-light', 'pastel-on-dark', 'railscasts', 'rubyblue', 'seti', 'solarized', 'the-matrix', 'tomorrow-night-bright', 'tomorrow-night-eighties', 'ttcn', 'twilight', 'vibrant-ink', 'xq-dark', 'xq-light', 'yeti', 'zenburn']
108
    version: string = npm.version;
109
110
111
112
113
114
115
116
117

    constructor(
        private haskellService: HaskellService,
        private authService: AuthenticationService, 
        private ghciService: GHCIService, 
        private elRef: ElementRef, 
        private notifService: NotificacionService,
        private sessionService: SessionService,
        private dialogService:DialogService,
118
119
120
121
122
123
124
        private usuarioService: UsuarioService,
        public translate: TranslateService) {

        // i18n
        this.translateService = translate;
        this.titlecasePipe = new TitleCasePipe();

125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
        //si el archivo fue seteado en la session. 
        this.archivo = sessionService.getArchivo();
        if(!this.archivo || !this.archivo.id){
            this.newFile();
        }
        this.copiaContenidoArchivo = this.archivo.contenido;
        this.copiaNombreArchivo = this.archivo.nombre;
        if(authService.getUser().configuracion){
            var config: Configuracion = authService.getUser().configuracion;
            if(config.fontSizeEditor<=30 && config.fontSizeEditor>=8){
                this.configCodeMirror.fontSize = config.fontSizeEditor;
            }
            if(this.themes.some(theme => theme==config.themeEditor)){
                this.configCodeMirror.theme = config.themeEditor;                
            }
            sessionStorage.setItem('codeMirrorConfig',JSON.stringify(this.configCodeMirror));
            this.argumentoI = config.argumentoI;
            this.argumentoF = config.argumentoF;

        }
        this.code = "my code";
        let svg : string = '';

    }


    @ViewChild(CodemirrorComponent) codemirror: CodemirrorComponent;
    // @ViewChild(NgbPopover) popover: NgbPopover;
    @ViewChild('popover') popover: NgbPopover;

    updateConfig(theme){
        this.configCodeMirror.theme = theme;
        this.codemirror.instance.setOption('theme', theme); 
        sessionStorage.setItem('codeMirrorConfig',JSON.stringify(this.configCodeMirror));
    }

    lockSaveButton (){
        this.copiaNombreArchivo = this.archivo.nombre;
        this.copiaContenidoArchivo = this.archivo.contenido;
        this.modificado = false;
    }
    

    showConfirm() {
        let disposable = this.dialogService.addDialog(ConfirmComponent, {
            title:'Está intentando editar un archivo de solo lectura', 
            message:'Está editando un archivo de solo lectura, desea continuar?'})
        .subscribe((isConfirmed)=>{

            if(isConfirmed) {
                codeMirrorRef.options.readOnly = false;
                componentRef.editDialogFired = true;
            }
178
179
        });        
    }
180

181
182
183
184
185
186
187
188
189
190
191
192
    /* Panel para la posición del cursor */
    makePanel() {

        var node = document.createElement("div");
        node.id = "cursorpos-panel";
        node.className = "panel bottom";
        this.cursorPanelLabel = node.appendChild(document.createElement("span"));
        var cm = this.codemirror.instance;
        var x = cm.getCursor().line;
        var y = cm.getCursor().ch; 
        x = (Number(x) + 1).toString();
        y = (Number(y) + 1).toString();
193
194
        var cursorPositionTranslate = this.translateService.get('i18n.msg.codemirror.cursorPosition').value;
        this.cursorPanelLabel.textContent = cursorPositionTranslate + ": (" + x + "," + y + ")";    
195
196
197
198
199
200


        this.cursorPanel = this.codemirror.instance.addPanel(node, {position: "bottom", stable: true});
        var that = this;
        //agregamos el evento que setea la posición
        this.codemirror.instance.on("cursorActivity",function(cm){
201
202
203
204
            var x = cm.getCursor().line;
            var y = cm.getCursor().ch; 
            x = (Number(x) + 1).toString();
            y = (Number(y) + 1).toString();
205
            that.cursorPanel.node.innerText = cursorPositionTranslate + ": (" + x + "," + y + ")";    
206
        });
207

208
209
210
211
212
213
214
        this.codemirror.instance.on("keyHandled",function(cm,name,evt){
            if(name.code==="Digit1" && name.ctrlKey && name.shiftKey){
                that.seleccionarDirectorio();
            } else if(name.code==="Digit2" && name.ctrlKey && name.shiftKey){
                that.saveConfig();
            }
        });
215

216
        this.codemirror.instance.on("keypress",function(cm,name,evt){
217

218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
            if(!that.editDialogFired && JSON.parse(sessionStorage.currentUser).tipo === "docente" && cm.options.readOnly){
                codeMirrorRef = that.codemirror.instance;
                componentRef = that;
                that.showConfirm(); 
            }

        });
    } 

    saveConfig(){
        var config = new Configuracion();
        config.themeEditor = this.configCodeMirror.theme;
        config.fontSizeEditor = this.configCodeMirror.fontSize;
        var confUser = this.authService.getUserConfig();
        var reiniciar = confUser.argumentoF != this.argumentoF || confUser.argumentoI != this.argumentoI;
        config.argumentoF = this.argumentoF;
        config.argumentoI = this.argumentoI;
        this.usuarioService.actualizarConfiguracion(this.authService.getUser().cedula,config)
        .subscribe(
            success=> {
                //this.ghciService.consoleRef.Write("Configuración guardada"  + "\n");
                this.popover.close();
                this.authService.setUserConfig(success);
                if(reiniciar){
                    this.reiniciarInterprete();
243
244
                }

245
246
247
248
            },
            error=> {
                this.notifService.error(error);
                this.popover.close();
249
            }
Franco Pariani's avatar
Franco Pariani committed
250
251
252
253
254
255
        );
        if (!this.hintsCheck){
            delete this.configCodeMirror.extraKeys["Ctrl-Space"];
        }else{
            this.configCodeMirror.extraKeys["Ctrl-Space"] = "autocomplete";
        }
256
257
258
259
260
    }

    aumentarFuente(){
        if(this.configCodeMirror.fontSize<30){
            this.configCodeMirror.fontSize++;
261
        }
262
    }
263

264
265
266
    disminuirFuente(){
        if(this.configCodeMirror.fontSize>8){
            this.configCodeMirror.fontSize--;
267
        }
268
    }
269

270
271
    @HostListener('document:click', ['$event'])
    private documentClicked(event: MouseEvent): void {
272

273
274
        // Popover is open
        if (this.popover && this.popover.isOpen()) {
275

276
277
            // Not clicked on self element
            if (!(this.popover as any)._elementRef.nativeElement.contains(event.target)) {
278

279
280
                // Hacking typescript to access private member
                const popoverWindowRef: ComponentRef<NgbPopoverWindow> = (this.popover as any)._windowRef;
281

282
283
284
                // If clicked outside popover window
                if (!popoverWindowRef.location.nativeElement.contains(event.target)) {
                    this.popover.close();
285
286
287
                }
            }
        }
288
    }
289

290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
    ngOnInit() {

        this.ghciService.rendered(); 


        this.haskellService.getArchivos(this.authService.getUser().cedula)
        .subscribe(
            archivos => {
                //.filter(function(a){return !a.eliminado})
                this.buildTreeFromList(archivos);

            }, 
            error => console.log("Error al obtener los archivos del alumno") 
            );

        function KeyPress(e) {

            var evtobj = window.event? event : e
            if (evtobj.keyCode == 90 && evtobj.ctrlKey){
                //alert("Ctrl+z")
            };
            if(evtobj.key.toLowerCase() ==="a" && evtobj.ctrlKey){
                componentRef.seleccionarDirectorio();
                return false;
            }else if(evtobj.key.toLowerCase() ==="e" && evtobj.ctrlKey){
                componentRef.downloadFile();
                return false;
            } else if(evtobj.key.toLowerCase() ==="r" && evtobj.ctrlKey){
                componentRef.reiniciarInterprete();
                return false;
            } else if(evtobj.key.toLowerCase() ==="g" && evtobj.ctrlKey){
                componentRef.guardarArchivo();
                return false;
            } else if(evtobj.key.toLowerCase() ==="o" && evtobj.ctrlKey){
                document.getElementById("popover").click();
                return false;
            } else if(evtobj.ctrlKey && evtobj.altKey && evtobj.key.toLowerCase() ==="p"){
                document.getElementById("ProgramBtn").click();
                var that  = componentRef;
                setTimeout(function() {
                    that.codemirror.instance.focus();
                },250);
                componentRef.codemirror.instance.focus();
                focus ="program";
                return false;
            }  else if(evtobj.ctrlKey && evtobj.altKey && evtobj.key.toLowerCase() ==="c"){
                componentRef.ghciService.focusConsole();
                focus = "consola";
                return false;
            }  else if(evtobj.ctrlKey && evtobj.altKey && evtobj.key.toLowerCase() ==="f"){
                document.getElementById("FigurasBtn").click()
                componentRef.ghciService.focusConsole();
                focus = "graficas";
                return false;
            }  else if(evtobj.key.toLowerCase() ==="p" && evtobj.ctrlKey && !evtobj.altKey){
                componentRef.runCode();
                return false;
            } 
348
        }
349
        document.onkeydown = KeyPress;
Franco Pariani's avatar
Franco Pariani committed
350
351
352
353
354
355
356
357

        let currentSession = sessionStorage.getItem("currentUser"); 
        let langCode = currentSession ? JSON.parse(currentSession).language : 'es';
        if (langCode == 'es'){
            this.configCodeMirror.mode.name = "matefun-ES";
        }else if (langCode == 'en'){
            this.configCodeMirror.mode.name = "matefun-EN";
        }
358
    }
359

360
361
362
363
364
365
366
367
368
369
370
371
    ngAfterViewInit() {
        componentRef = this;
        if(this.codemirror.instance!=null && !this.cursorLabelInit){
            this.cursorLabelInit = true;
            this.codemirror.instance.setOption('theme', this.configCodeMirror.theme);
            this.makePanel();    
        }
        if(!this.editableLoaded && this.codemirror.instance!=null &&(this.sessionService.archivo.editable!==undefined)){
            try{
                var editable = this.sessionService.archivo.editable && (this.sessionService.archivo.estado == 'Edicion' || this.sessionService.archivo.estado == 'Devuelto');
                this.codemirror.instance.options.readOnly = !editable;
                this.editableLoaded = true;
372
373


374
375
376
377
            } catch(err) {
                return;

            }
378
379
        }

380
381
382
383
384
385
386
387
388
389
390
391
    }
    
    htmlEncode(value:string){
        return value
        .replace('Prelude> ','')
        .replace(/&/g, '&amp;')
        .replace(/\s/g, '&nbsp;')
        .replace(/"/g, '&quot;')
        .replace(/'/g, '&#39;')
        .replace(/</g, '&lt;')
        .replace(/>/g, '&gt;');
    }
392

393
    // @ViewChild(CanvasComponent) canvasC: CanvasComponent;
394
    @ViewChild(Graph3DComponent) graph3DComp: Graph3DComponent;
395

Diego Rey's avatar
Diego Rey committed
396
    @ViewChild(Graph2DComponent) graph2DComp: Graph2DComponent;
397

398
399
400
401
    funcionSTR: string = 'Math.sin(x)*x*x-20';
    consola: string = '';
    command: string = '';
    tipo: number = 1;
402

403
404
405
406
    private onKey = function (value: string) {
        this.funcionSTR = value;
        this.archivo.contenido = value;
    }
407

408
409
410
    private writeCommand = function (value: string){
        this.command = value.split("\n")[value.split("\n").length - 1];
    }
411

412
413
414
415
    private selectFunction = function() {
        this.tipo = 1;
        this.funcionSTR = "Math.sin(x)*x*x-20";
    }
416

417
418
419
420
    private selectElipse = function() {
        this.tipo = 2;
        this.funcionSTR = "elipse(x,y,radioX, radioY, rotacion_en_grados)";
    }
421

422
423
424
425
    private selectCircle = function() {
        this.tipo = 3;
        this.funcionSTR = "circulo(x,y,radio)";
    }
426

427
428
429
    private elipse = function(x: number, y: number, radiusX: number, radiusY: number, rotation: number) {
        return [x, y, radiusX, radiusY, rotation];
    }
430

431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
    private circulo = function(x: number, y: number, radius: number) {
        return [x, y, radius];
    }

    inputConsola(text:any){
        this.entrada = text;            
    }
    newFile(){
        this.archivo = new Archivo();
        this.archivo.cedulaCreador = this.authService.getUser().cedula;
        this.archivo.contenido = "";
        this.archivo.nombre = "";
        this.copiaNombreArchivo = '';
        this.copiaContenidoArchivo = '';
    }

447
    archivoModificado(event){
Franco Pariani's avatar
Franco Pariani committed
448
        if (this.hintsCheck && !event.ctrlKey && !event.altKey){
449
            if (/^[\w\_\d]$/.test(event.key) || event.key == 'Enter')
450
451
452
453
454
455
                this.codemirror.instance.showHint(event);
            if(this.copiaNombreArchivo!=this.archivo.nombre || this.copiaContenidoArchivo != this.archivo.contenido){
                this.modificado = true;
            }else{
                this.modificado = false;
            }
456
        }
457
458
        if (event.ctrlKey && event.shiftKey && event.key == 'K')
            this.codemirror.instance.toggleComment();
459
    }
460

461
    clickEnEditor(event){
Franco Pariani's avatar
Franco Pariani committed
462
463
        if (this.typingCheck)
            this.codemirror.instance.functionDefinition(this.archivo.nombre, this.codemirror.instance.doc, event);
464
465
    }

466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
    guardarArchivo(){
        var regex = /^[A-Z]/
        if(this.archivo.nombre.trim() == ""){
            this.notifService.error("Nombre de archivo sin especificar");
        }else if (!regex.test(this.archivo.nombre)){
            this.notifService.error("Nombre de archivo debe iniciar con mayusula.")
        }else{
            if(this.archivo.id){
                this.haskellService.editarArchivo(this.archivo.id, this.archivo)
                .subscribe(
                    archivo => {
                        //this.ghciService.consoleRef.Write("Editar archivo: " + this.archivo.nombre + "\n");
                        this.archivo = archivo;
                        this.lockSaveButton();
                    }, 
                    error => {
                        this.notifService.error(error);
                    });
484
            }else{
485
486
487
488
489
490
491
492
493
494
495
                this.haskellService.crearArchivo(this.archivo)
                .subscribe(
                    archivo => {
                        //this.ghciService.consoleRef.Write("Archivo creado: " + this.archivo.nombre + "\n");
                        this.archivo = archivo;
                        this.lockSaveButton();
                    }, 
                    error => {
                        this.notifService.error(error);
                    });

496
497
            }
        }
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
    }
    runCode(){

        this.ghciService.setCodemirrorRef(this.codemirror.instance);
        this.ghciService.resetGutters();
        var regex = /^[A-Z]/
        if(this.archivo.nombre.trim() == ""){
            this.notifService.error("Nombre de archivo sin especificar");
        }else if (!regex.test(this.archivo.nombre)){
            this.notifService.error("Nombre de archivo debe iniciar con mayusula.")
        }else{

            var resultado = this.sessionService.cargarDependencias(this.archivo);
            if(resultado["status"]==="miss"){
                this.ghciService.outputConsole("Error: No se encuentra el archivo " + resultado["nombre"] + "\n");
                return;
            }
            if(this.archivo.id){
                if(this.archivo.editable || this.authService.getUser().tipo == 'docente'){
517
518
519
520
                    this.haskellService.editarArchivo(this.archivo.id, this.archivo)
                    .subscribe(
                        archivo => {
                            this.archivo = archivo;
521
522
523
524
525
526
527
528
                            var list = this.sessionService.getDependencias(),
                            idList = [];
                            for(var l in list){
                                idList.push(list[l].id);
                            }
                            if(!idList.some(id => id ==archivo.id)){
                                idList.push(archivo.id);
                            }
529
                            this.lockSaveButton();
530
                            this.ghciService.loadFile(archivo.id,idList);
531
532
533
534
535
                        }, 
                        error => {
                            this.notifService.error(error);
                        });
                }else{
536
537
538
539
                    var list = this.sessionService.getDependencias(),
                    idList = [];
                    for(var l in list){
                        idList.push(list[l].id);
540
                    }
541
542
543
544
                    if(!idList.some(id => id ==this.archivo.id)){
                        idList.push(this.archivo.id);
                    }
                    this.ghciService.loadFile(this.archivo.id,idList);
545
                }
546
547
548
549
550
551
552
553
554
555
556
            }else{
                this.haskellService.crearArchivo(this.archivo)
                .subscribe(
                    archivo => {
                        this.archivo = archivo;
                        this.lockSaveButton();
                        this.ghciService.loadFile(archivo.id,[]);
                    }, 
                    error => {
                        this.notifService.error(error);
                    });
557
558
            }
        }
559
        this.ghciService.focusConsole();
560

561
562
563
564
565
    }
    download(filename, text) {
        var element = document.createElement('a');
        element.setAttribute('href', 'data:application/octet-stream,' + encodeURIComponent(text));
        element.setAttribute('download', filename+ ".mf");
566

567
568
        element.style.display = 'none';
        document.body.appendChild(element);
569

570
        element.click();
571

572
573
574
575
576
577
578
        document.body.removeChild(element);
    }
    downloadFile(){
        var nom = this.archivo.nombre;
        var content = this.archivo.contenido;
        if(nom!= undefined && nom!="" && content!= undefined && content !=""){
            this.download(nom , content);
579
580
        }

581
582
583
584
    }
    reiniciarInterprete(){
        this.ghciService.reiniciarInterprete();
    }
585

586
587
588
    toggleConsole(){
        this.consolaVisible = !this.consolaVisible;
    }
589

590
591
592
593
594
595
596
597
598
599
600
    seleccionarDirectorio(){
        this.archivosTree = this.sessionService.getArchivos(undefined);
        var that = this;
        let disposable = this.dialogService.addDialog(SeleccionarDirectorioComp, {
            title:'', 
            message:'',
            archivos:this.archivosTree,
            directorioActual:this.archivosTree,
            nombre:'',
            parent:this})
        .subscribe((isConfirmed)=>{
601

602
            if(isConfirmed) {
603
604


605
606
607
608
609
                //codeMirrorRef.options.readOnly = false;
                //componentRef.editDialogFired = true;
            }
        });
    }
610
611


612
    buildTreeFromList (archivos){
613
614


615
616
617
618
619
620
621
622
        this.sessionService.setArchivosList(archivos);
        var root :Archivo;

        for(var a in archivos){
            var arch = archivos[a];
            if(arch.padreId===-1){
                root = arch;
            } 
623
        }
624
625
626
627
628
629
630
631
632
633
        this.idRecorridos = [root.id];
        var archivos2 = archivos.filter(
            function(a){
                return a.id!==root.id;
            }
            );
        var tree = this.buildTree(archivos2,root);
        this.archivosTree = tree;
        this.sessionService.setArchivosTree(tree);
    }
634
635


636
637
638
639
640
641
642
    buildTree(archivos, root){
        root.archivos = this.getArchivos(root.id,archivos);
        for(var a in root.archivos){
            if(root.archivos[a].directorio && this.idRecorridos[root.archivos[a].id] === undefined){
                var id = root.archivos[a].id;
                var archivos2 = archivos.filter(function(a){return a.id!==id});
                root.archivos[a] = this.buildTree(archivos2 ,root.archivos[a]);
643
644
            }
        }
645
646
        return root;
    }
647

648
649
650
651
652
653
    getArchivos(id,archivos){
        return archivos.filter(
            function(a){
                return a.padreId === id;
            });
    }
654

655
656
657
658
659
    onChangeTab(event) {
        if (event.nextId == 'FigurasBtn3D') {
            this.graph3DComp.onActivate();
        }
    }
660
}