Merge pull request #14 from leaphy-robotics/development

Add Language switch sutff and add restoring temporary saved workspaces

src/app/effects/app.effects.ts

@@ -104,4 +104,4 @@ export class AppEffects {
                 })
             });
     }
-}
+}

src/app/effects/backend.wired.effects.ts

@@ -25,7 +25,7 @@ declare var Blockly: any;
 // Defines the effects on the Electron environment that different state changes have
 export class BackendWiredEffects {
 
-  constructor(private router: Router, private backEndState: BackEndState, private appState: AppState, private blocklyEditorState: BlocklyEditorState, private robotWiredState: RobotWiredState, private dialogState: DialogState, private zone: NgZone, private dialog: MatDialog) {
+  constructor(private blocklyState: BlocklyEditorState, private router: Router, private backEndState: BackEndState, private appState: AppState, private blocklyEditorState: BlocklyEditorState, private robotWiredState: RobotWiredState, private dialogState: DialogState, private zone: NgZone, private dialog: MatDialog) {
     // Only set up these effects when we're in Desktop mode
     this.appState.isDesktop$
       .pipe(filter(isDesktop => !!isDesktop))
@@ -273,6 +273,24 @@ export class BackendWiredEffects {
       case 'open-browser-page':
         const url = args[0];
         window.open(url, '_blank').focus();
+        break;
+      case 'save-workspace-temp':
+        const data = args[0].data;
+        sessionStorage.setItem('workspace', data);
+        break;
+      case 'restore-workspace-temp':
+        console.log('restoring workspace');
+        const workspaceTemp = sessionStorage.getItem('workspace');
+        console.log(workspaceTemp);
+        try {
+          this.blocklyState.setWorkspaceXml(workspaceTemp);
+          this.blocklyState.setProjectFilePath('');
+          this.blocklyState.setWorkspaceStatus(WorkspaceStatus.Restoring);
+        } catch (error) {
+          console.log('Error:', error.message);
+        }
+        console.log('restored workspace');
+        break;
       default:
         console.log(channel);
         break;

src/app/effects/blockly-editor.effects.ts

@@ -29,10 +29,9 @@ export class BlocklyEditorEffects {
         this.appState.currentLanguage$
             .pipe(filter(language => !!language))
             .subscribe(async language => {
+                console.log('Loading Blockly translations for language: ' + language.code);
                 const translations = await import(`node_modules/leaphy-blockly/msg/${language.code}.js`);
-                Object.keys(translations.default).forEach(function (tk) {
-                    Blockly.Msg[tk] = translations[tk];
-                });
+                Blockly.setLocale(translations);
             });
 
         // When the language is changed, save the workspace temporarily
@@ -139,11 +138,17 @@ export class BlocklyEditorEffects {
         this.blocklyState.workspaceStatus$
             .pipe(filter(status => status === WorkspaceStatus.Restoring))
             .pipe(withLatestFrom(this.blocklyState.workspaceXml$, this.blocklyState.workspace$))
-            .subscribe(([, workspaceXml, workspace]) => {
-                workspace.clear();
-                const xml = Blockly.Xml.textToDom(workspaceXml);
-                Blockly.Xml.domToWorkspace(xml, workspace);
-                this.blocklyState.setWorkspaceStatus(WorkspaceStatus.Clean);
+            .subscribe(async ([, workspaceXml, workspace]) => {
+              console.log('Restoring workspace');
+              while (this.blocklyState.workspace == null) {
+                await new Promise(resolve => setTimeout(resolve, 1000));
+              }
+              workspace = this.blocklyState.workspace;
+              console.log('Workspace loaded');
+              workspace.clear();
+              const xml = Blockly.Xml.textToDom(workspaceXml);
+              Blockly.Xml.domToWorkspace(xml, workspace);
+              this.blocklyState.setWorkspaceStatus(WorkspaceStatus.Clean);
             });
 
         // When the user presses undo or redo, trigger undo or redo on the workspace

src/app/modules/blockly-editor/blockly-editor.page.html

@@ -4,7 +4,7 @@
             <app-leaphy-blockly></app-leaphy-blockly>
         </mat-sidenav-content>
         <mat-sidenav id="sidenav" mode="side" [opened]="blocklyState.isSideNavOpen$ | async" position="end">
-            <app-code-view></app-code-view>         
+            <app-code-view></app-code-view>
         </mat-sidenav>
     </mat-sidenav-container>
     <app-button-bar [ngStyle]="(blocklyState.isSideNavOpen$ | async) && {'right': '20%'}"></app-button-bar>

src/app/modules/blockly-editor/blockly-editor.page.ts

@@ -1,4 +1,4 @@
-import { Component } from '@angular/core';
+import {Component} from '@angular/core';
 import { BlocklyEditorState } from 'src/app/state/blockly-editor.state';
 import { DialogState } from 'src/app/state/dialog.state';
 
@@ -8,9 +8,9 @@ import { DialogState } from 'src/app/state/dialog.state';
   styleUrls: ['./blockly-editor.page.scss']
 })
 
-export class BlocklyEditorPage  {
+export class BlocklyEditorPage {
   constructor(
     public blocklyState: BlocklyEditorState,
-  ) {
-  }
+    public dialogState: DialogState,
+  ) {}
 }

src/app/modules/blockly-editor/components/leaphy-blockly/leaphy-blockly.component.html

@@ -1 +1 @@
-<div #blockContent id="blockly-container"></div>
+<div #blockContent id="blockly-container"></div>

src/app/modules/blockly-editor/components/leaphy-blockly/leaphy-blockly.component.ts

@@ -1,6 +1,10 @@
-import { Component, ViewChild, ElementRef, AfterViewInit } from '@angular/core';
+import {
+  Component,
+  ViewChild,
+  ElementRef,
+  AfterViewInit,
+} from '@angular/core';
 import { BlocklyEditorState } from 'src/app/state/blockly-editor.state';
-import { BackEndState } from 'src/app/state/backend.state';
 
 @Component({
     selector: 'app-leaphy-blockly',
@@ -13,9 +17,7 @@ export class LeaphyBlocklyComponent implements AfterViewInit {
 
     constructor(
         public blocklyState: BlocklyEditorState,
-        public backEndState: BackEndState
-    ) {
-    }
+    ) {}
 
     ngAfterViewInit() {
         this.blocklyState.setBlocklyElement(this.blockContent.nativeElement);

src/app/modules/core/components/header/header.component.ts

@@ -102,6 +102,7 @@ export class HeaderComponent {
 
   public onLanguageChanged(language: Language) {
     this.appState.setChangedLanguage(language);
+    window.location.reload();
   }
 
   public onBackToBlocks() {

src/app/state/blockly-editor.state.ts

@@ -179,4 +179,8 @@ export class BlocklyEditorState {
   get workspaceXml(): string {
     return this.workspaceXmlSubject$.getValue();
   }
+
+  get workspace(): any {
+    return this.workspaceSubject$.getValue();
+  }
 }