Merge pull request #385 from PillouMatou/import/export_user

Import/export user

Author: PillouMatou

src/app/app.module.ts

@@ -85,6 +85,8 @@ import { DialogAddGridComponent } from './components/dialog-add-grid/dialog-add-
 import { ChooseYourGridComponent } from './components/choose-your-grid/choose-your-grid.component';
 import { DeleteGridUserComponent } from './components/delete-grid-user/delete-grid-user.component';
 import { DialogDeleteGridUserComponent } from './components/dialog-delete-grid-user/dialog-delete-grid-user.component';
+import { ExportSaveUserDialogComponent } from './components/export-save-user-dialog/export-save-user-dialog.component';
+import { ImportUserComponent } from './components/import-user/import-user.component';
 
 @NgModule({
   declarations: [
@@ -152,7 +154,9 @@ import { DialogDeleteGridUserComponent } from './components/dialog-delete-grid-u
     DialogAddGridComponent,
     ChooseYourGridComponent,
     DeleteGridUserComponent,
-    DialogDeleteGridUserComponent
+    DialogDeleteGridUserComponent,
+    ExportSaveUserDialogComponent,
+    ImportUserComponent
   ],
   imports: [
     BrowserModule,

src/app/components/dialog-add-grid/dialog-add-grid.component.ts

@@ -47,9 +47,11 @@ export class DialogAddGridComponent implements OnInit {
         return this.userPageService.currentUser.id === user.id
       });
       this.userPageService.usersList[indexUser] = this.userPageService.currentUser;
+      this.boardService.gridChosen = newGrid.value['nameGrid'];
       setTimeout(() => {
         this.indexeddbaccessService.addGrid();
         this.boardService.updateElementList();
+
       },200);
     }
 

src/app/components/export-save-user-dialog/export-save-user-dialog.component.css

@@ -0,0 +1,7 @@
+<div class="dialogContent">
+  <div style="display: flex; flex-wrap: nowrap; align-items: center; color: lightgray;">
+    <input [(ngModel)]="this.name" maxlength="32" placeholder="{{this.multilinguism.translate('EnterNameOfTheSave')}}" style="width: 100%"
+           type="textfield">.useraugcom
+  </div>
+  <input (click)="this.exportSave()" type="button" value="{{this.multilinguism.translate('validate')}}">
+</div>

src/app/components/export-save-user-dialog/export-save-user-dialog.component.html

@@ -0,0 +1,28 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ExportSaveUserDialogComponent } from './export-save-user-dialog.component';
+import {Ng2ImgMaxModule} from "ng2-img-max";
+import {RouterTestingModule} from "@angular/router/testing";
+
+describe('XportSaveUserDialogComponent', () => {
+  let component: ExportSaveUserDialogComponent;
+  let fixture: ComponentFixture<ExportSaveUserDialogComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ExportSaveUserDialogComponent ],
+      imports: [Ng2ImgMaxModule, RouterTestingModule]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ExportSaveUserDialogComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/components/export-save-user-dialog/export-save-user-dialog.component.spec.ts

@@ -0,0 +1,48 @@
+import {Component, OnInit} from '@angular/core';
+import {ExportManagerService} from "../../services/export-manager.service";
+import JSZip from "jszip";
+import {saveAs as importedSaveAs} from 'file-saver';
+import {MultilinguismService} from "../../services/multilinguism.service";
+import {BoardService} from "../../services/board.service";
+
+@Component({
+  selector: 'app-xport-save-user-dialog',
+  templateUrl: './export-save-user-dialog.component.html',
+  styleUrls: ['./export-save-user-dialog.component.css']
+})
+export class ExportSaveUserDialogComponent implements OnInit {
+
+  name: String = "save";
+
+  constructor(public  exportManagerService: ExportManagerService,
+              public multilinguism: MultilinguismService,
+              public boardservice: BoardService) {
+  }
+
+  ngOnInit(): void {
+  }
+
+  exportSave() {
+    let tempName;
+    if (this.name.endsWith(".json")) {
+      tempName = this.name.slice(0, this.name.length - 5);
+    } else if (this.name.endsWith(".useraugcom")) {
+      tempName = this.name.slice(0, this.name.length - 7);
+    } else {
+      tempName = this.name;
+    }
+    if (tempName.length == 0) {
+      tempName = "save";
+    }
+
+    const jszip = new JSZip();
+    jszip.file(tempName + '.opgf', this.exportManagerService.data);
+
+    jszip.generateAsync({type: 'blob'}).then(function (content) {
+      // see FileSaver.js
+      importedSaveAs(content, tempName + '.useraugcom');
+    });
+
+  }
+
+}

src/app/components/export-save-user-dialog/export-save-user-dialog.component.ts

@@ -0,0 +1 @@
+<input #file type="file" accept=".useraugcom" (change)="importUser(file.files)" onclick="this.value=null">

src/app/components/import-user/import-user.component.css

@@ -0,0 +1,28 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ImportUserComponent } from './import-user.component';
+import {Ng2ImgMaxModule} from "ng2-img-max";
+import {RouterTestingModule} from "@angular/router/testing";
+
+describe('ImportUserComponent', () => {
+  let component: ImportUserComponent;
+  let fixture: ComponentFixture<ImportUserComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ImportUserComponent ],
+      imports: [Ng2ImgMaxModule, RouterTestingModule]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ImportUserComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/components/import-user/import-user.component.html

@@ -0,0 +1,94 @@
+import { Component, OnInit } from '@angular/core';
+import * as JSZip from 'jszip';
+import {zip} from "rxjs";
+import {BoardService} from "../../services/board.service";
+import {LayoutService} from "../../services/layout.service";
+import {Router} from "@angular/router";
+import {IndexeddbaccessService} from "../../services/indexeddbaccess.service";
+import {GridElement} from "../../types";
+import {JsonValidatorService} from "../../services/json-validator.service";
+
+@Component({
+  selector: 'app-import-user',
+  templateUrl: './import-user.component.html',
+  styleUrls: ['./import-user.component.css']
+})
+export class ImportUserComponent implements OnInit {
+
+  constructor(public boardService: BoardService,
+              public layoutService: LayoutService,
+              public router: Router,
+              public indexedDBacess:IndexeddbaccessService,
+              public jsonValidator: JsonValidatorService) { }
+
+  ngOnInit(): void {
+  }
+
+  importUser(files: FileList) {
+    const zipFolder: JSZip = new JSZip();
+    //let tempBoard;
+    zipFolder.loadAsync(files[0]).then((zipFiles) => {
+      zipFiles.forEach((fileName) => {
+        zipFolder
+          .file(fileName)
+          .async('base64')
+          .then((content) => {
+              this.useUserAugcomZip(content);
+            }
+          );
+      });
+    });
+  }
+
+  useUserAugcomZip(contentZip:any){
+    let userToBeImported;
+    userToBeImported = JSON.parse(this.b64DecodeUnicode(contentZip));
+    console.log('userToBeImported : ',userToBeImported);
+    /*
+    tempBoard.ElementList.forEach(element => {
+      this.checkAndUpdateElementDefaultForm(element);
+    });
+    this.boardService.board = this.jsonValidator.getCheckedGrid(tempBoard);
+    this.layoutService.refreshAll(this.boardService.board.NumberOfCols, this.boardService.board.NumberOfRows, this.boardService.board.GapSize);
+    this.boardService.updateElementList();
+    this.boardService.backHome();
+    console.log(this.boardService.board);
+    this.indexedDBacess.update();
+     */
+    this.indexedDBacess.importUserInDatabase(userToBeImported);
+    this.router.navigate(['logging']);
+  }
+
+  b64DecodeUnicode(str) {
+    return decodeURIComponent(atob(str).split('').map(function(c) {
+      return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
+    }).join(''));
+  }
+
+  checkAndUpdateElementDefaultForm(element: GridElement) {
+    const defaultForm = element.ElementFormsList.find(form => {
+      const newForm = form.LexicInfos.find(info => {
+        return (info.default != null && info.default);
+      });
+      return newForm != null;
+    });
+    if (defaultForm === null) {
+      if (element.ElementFormsList[0] !== null && element.ElementFormsList[0] !== undefined) {
+        element.ElementFormsList.push({
+          DisplayedText: element.ElementFormsList[0].DisplayedText,
+          VoiceText: element.ElementFormsList[0].VoiceText,
+          LexicInfos: [{default: true}],
+          ImageID: element.ElementFormsList[0].ImageID
+        });
+      } else {
+        console.log('DEFAULT FORM NOT FOUND FOR ' + element.ID);
+        element.ElementFormsList.push({
+          DisplayedText: element.ID,
+          VoiceText: element.ID,
+          LexicInfos: [{default: true}],
+          ImageID: element.ID
+        });
+      }
+    }
+  }
+}