Zowe Suite v1.25.0

CHANGELOG.md

@@ -1,8 +1,13 @@
 # Zlux Editor Changelog
 
 ## `2.8.0`
+- Bugfix: Fixed error message & phantom tab when opening undefined length dataset
+- Bugfix: Unable to recalculate the size of monaco-code-container when switching from diff-viewer to code-editor.
+- Added previously selected content comparison (Diff viewer)
 - Added the ability to refresh the file properties in File Tree, when an already exiting untagged file is saved with an encoding type.
 - Added the ability to use the latest USS encoding when saving an exiting file.
+- Removed the Cancel button and replaced it with X button on all dialogue pop-ups
+- Added toggle bar to show and hide File Explorer.
 
 ## `2.7.0`
 - Added function to toggle the file explorer

pluginDefinition.json

@@ -1,7 +1,7 @@
 {
   "identifier": "org.zowe.editor",
   "apiVersion": "1.0.0",
-  "pluginVersion": "2.7.2",
+  "pluginVersion": "2.8.0",
   "license": "EPL-2.0",
   "author": "Zowe",
   "homepage": "https://github.com/zowe/zlux-editor",

webClient/package.json

@@ -1,6 +1,6 @@
 {
   "name": "org.zowe.editor.webclient",
-  "version": "2.7.2",
+  "version": "2.8.0",
   "license": "EPL-2.0",
   "scripts": {
     "start": "export NODE_OPTIONS=--max_old_space_size=4096 || set NODE_OPTIONS=--max_old_space_size=4096 && webpack --config ./webpack.build.config.js --watch --progress",
@@ -36,7 +36,7 @@
     "@angular/router": "~6.0.9",
     "@types/node": "^6.0.112",
     "@zlux/widgets": "git+https://github.com:zowe/zlux-widgets.git",
-    "@zowe/zlux-angular-file-tree": "0.11.0-RC2",
+    "@zowe/zlux-angular-file-tree": "0.11.0-RC4",
     "angular2-template-loader": "~0.6.2",
     "codelyzer": "~5.1.0",
     "compression-webpack-plugin": "~4.0.0",
@@ -66,4 +66,4 @@
     "web-streams-polyfill": "^2.0.5",
     "zone.js": "~0.8.26"
   }
-}
+}

webClient/src/app/core/menu-bar/menu-bar.component.ts

@@ -114,6 +114,8 @@ export class MenuBarComponent implements OnInit, OnDestroy {
     });
     */
     this.addFileTreeMenus(this.menuList);
+    this.addDiffViewerMenus(this.menuList);
+    this.addToggleTreeMenus(this.menuList);
     this.languagesMenu = initMenus(this.languagesMenu);
 
     this.editorControl.languageRegistered.subscribe((languageDefinition)=> {
@@ -375,6 +377,26 @@ export class MenuBarComponent implements OnInit, OnDestroy {
       keyMap: 'Alt+P'
     });
   }
+
+  addDiffViewerMenus(list) {
+    list[0].children.push({
+      name: 'Show/Hide Compare (Diff)',
+      action: {
+          internalName: 'toggleDiffViewer'
+      },
+      keyMap: 'Alt+V'
+    });
+  }
+
+  addToggleTreeMenus(list) {
+    list[0].children.push({
+      name: 'Show/Hide File Explorer',
+      action: {
+          internalName: 'toggleTree'
+      },
+      keyMap: 'Alt+B'
+    });
+  }
 
   ngOnInit() {
     if (this.editorControl._isTestLangMode) {
@@ -537,6 +559,14 @@ export class MenuBarComponent implements OnInit, OnDestroy {
     this.editorControl.toggleFileTreeSearch.next();
   }
 
+  toggleDiffViewer() {
+    this.editorControl.toggleDiffViewer.next();
+  }
+
+  toggleTree() {
+    this.editorControl.toggleTree.next();
+  }
+
   closeAll() {
     let closeAllRef;
     if (this.fileCount == 0) { //TODO: Enhance such that closeAll not visible if no tabs are open
@@ -588,12 +618,13 @@ export class MenuBarComponent implements OnInit, OnDestroy {
 
   saveFile() {
     let fileContext = this.editorControl.fetchActiveFile();
+    let directory = fileContext.model.path || this.editorControl.activeDirectory;
     if (!fileContext) {
       this.snackBar.open('Unable to save, no file found.', 'Dismiss', {duration: MessageDuration.Medium, panelClass: 'center'});
     } else if (fileContext.model.isDataset) {
       this.snackBar.open('Dataset saving not yet supported.', 'Dismiss', {duration: MessageDuration.Short, panelClass: 'center'});
     } else {
-      let sub = this.monacoService.saveFile(fileContext, this.editorControl.activeDirectory).subscribe(() => { sub.unsubscribe(); });
+      let sub = this.monacoService.saveFile(fileContext, directory).subscribe(() => { sub.unsubscribe(); });
     }   
   }
 
@@ -606,7 +637,7 @@ export class MenuBarComponent implements OnInit, OnDestroy {
   }
 
   graphicDiagram() {
-    let file = this.editorControl.openFileList.getValue().filter(x => x.active === true)[0];
+    let file = this.editorControl.fetchActiveFile();
     if (!file) {
       this.snackBar.open(`Please open a file before you generate a diagram.`, 'Close', { duration: MessageDuration.Long, panelClass: 'center' });
     }
@@ -617,7 +648,7 @@ export class MenuBarComponent implements OnInit, OnDestroy {
   }
 
   submitJob() {
-    let file = this.editorControl.openFileList.getValue().filter(x => x.active === true)[0];
+    let file = this.editorControl.fetchActiveFile();
     if (!file || (file.model.language !== 'jcl')) {
       this.snackBar.open(`Please open a JCL file before you submit job.`, 'Close', { duration: MessageDuration.Long, panelClass: 'center' });
     } this.http.post(ENDPOINTS.jobs, { contents: file.model.contents }).subscribe(r => {

webClient/src/app/editor/code-editor/code-editor.component.html

@@ -20,7 +20,8 @@
     (click)="focus()" 
     (refresh)="refreshFile($event, true)" 
     (select)="selectFile($event, true)" 
-    (remove)="closeFile($event)"></app-file-tabs>
+    (remove)="closeFile($event)"
+    (compareContents)="compareContents($event)"></app-file-tabs>
   <app-monaco-settings (options)="setOptions($event)" *ngIf="showSettings"></app-monaco-settings>
   <app-monaco [editorFile]="editorFile" [options]="options" #monaco></app-monaco>
 </div>

webClient/src/app/editor/code-editor/code-editor.component.ts

@@ -315,6 +315,13 @@ export class CodeEditorComponent implements OnInit, OnDestroy {
     }
   }
 
+  compareContents(fileContext: ProjectContext) {
+    this.editorControl.removeActiveFromAllFiles();
+    fileContext.active = true;
+    this.monacoService.savePreviousFileContent(fileContext);
+    this.editorControl.enableDiffViewer.next();
+  }
+
   setTitle(title?:String):void {
     let newTitle = DEFAULT_TITLE; 
     if(title) {

webClient/src/app/editor/code-editor/file-tabs/file-tabs.component.ts

@@ -26,6 +26,7 @@ export class FileTabsComponent implements OnInit, AfterViewChecked {
   @Output() remove = new EventEmitter<ProjectContext>();
   @Output() select = new EventEmitter<ProjectContext>();
   @Output() refresh = new EventEmitter<ProjectContext>();
+  @Output() compareContents = new EventEmitter<ProjectContext>();
   @ViewChild(PerfectScrollbarComponent) componentRef: PerfectScrollbarComponent;
 
   private scrollConfig = {
@@ -82,6 +83,10 @@ export class FileTabsComponent implements OnInit, AfterViewChecked {
       {
         text: "Refresh Contents", // TODO: This needs a confirmation modal
         action: () => this.refresh.next(item)
+      },
+      {
+        text: "Compare Contents (Diff)",
+        action: () => this.compareContents.next(item)
       }
     ], true)
     event.stopImmediatePropagation();

webClient/src/app/editor/code-editor/monaco/monaco.component.html

@@ -10,7 +10,9 @@
 -->
 <div id="monaco-editor-container">
 <app-loading-indicator class="loading-indicator"></app-loading-indicator>
-<div class="monaco-code-editor" #monacoEditor></div>
+<div class="monaco-code-editor" #monacoEditor [hidden]="!showEditor"></div>
+<!-- For some reason, there is a bug where [hidden] style attrib does not work for diff viewer element-->
+<div id="monaco-diff-viewer" style="height:100%; width:100%" [style.visibility]="!showDiffViewer ? 'hidden': 'visible'" ></div>
 
 <!--  <ngx-monaco-editor class="monaco-code-editor" [options]="options" (onInit)="onMonacoInit($event)" #ngxMonaco></ngx-monaco-editor> -->
 </div>

webClient/src/app/editor/code-editor/monaco/monaco.component.ts

@@ -20,6 +20,9 @@ import { EditorControlService } from '../../../shared/editor-control/editor-cont
 import { LanguageServerService } from '../../../shared/language-server/language-server.service';
 import { Angular2InjectionTokens, Angular2PluginViewportEvents } from 'pluginlib/inject-resources';
 import * as monaco from 'monaco-editor';
+import { Subscription } from 'rxjs/Rx';
+import { EditorKeybindingService } from '../../../shared/editor-keybinding.service';
+import { KeyCode } from '../../../shared/keycode-enum';
 const ReconnectingWebSocket = require('reconnecting-websocket');
 
 @Component({
@@ -52,13 +55,22 @@ export class MonacoComponent implements OnInit, OnChanges {
   monacoEditorRef: ElementRef;
   private editor: any;
   private monacoConfig: MonacoConfig;
+  private showEditor: boolean;
+  private showDiffViewer: boolean;
+  private keyBindingSub: Subscription = new Subscription();
 
   constructor(
     private monacoService: MonacoService,
     private editorControl: EditorControlService,
     private languageService: LanguageServerService,
+    private appKeyboard: EditorKeybindingService,
     @Inject(Angular2InjectionTokens.LOGGER) private log: ZLUX.ComponentLogger,
     @Inject(Angular2InjectionTokens.VIEWPORT_EVENTS) private viewportEvents: Angular2PluginViewportEvents) {
+      this.keyBindingSub.add(this.appKeyboard.keydownEvent.subscribe((event) => {
+        if (event.which === KeyCode.KEY_V) {
+          this.editorControl.toggleDiffViewer.next();
+        }
+      }));
   }
 
   ngOnInit() {
@@ -89,6 +101,20 @@ export class MonacoComponent implements OnInit, OnChanges {
 
     this.onMonacoInit(editor);
     monaco.editor.remeasureFonts();
+    this.showEditor = true;
+
+    this.editorControl.toggleDiffViewer.subscribe(() =>{
+      this.toggleDiffViewer();
+    });
+
+    this.editorControl.enableDiffViewer.subscribe(() =>{
+      this.showEditor = !this.monacoService.spawnDiffViewer();
+      this.showDiffViewer = !this.showEditor;
+    });
+
+    this.editorControl.refreshLayout.subscribe(() =>{
+      setTimeout(() => this.editor.layout(), 1);
+    });
   }
 
   focus(e: any) {
@@ -106,6 +132,12 @@ export class MonacoComponent implements OnInit, OnChanges {
           changes[input].currentValue['context'],
           changes[input].currentValue['reload'],
           changes[input].currentValue['line']);
+        //TODO: This is a workaround to instruct the editor to remeasure its container when switching from diff-viewer to code-editor
+        if(this.showDiffViewer) {
+          setTimeout(() => this.editor.layout(), 1);
+        }
+        this.showEditor = true;
+        this.showDiffViewer = false;
       }
     }
   }
@@ -192,13 +224,18 @@ export class MonacoComponent implements OnInit, OnChanges {
       // Method that will be executed when the action is triggered.
       // @param editor The editor instance is passed in as a convenience
       run: function (ed) {
-        let fileContext = self.editorControl.fetchActiveFile();
-        let sub = self.monacoService.saveFile(fileContext, self.editorControl.activeDirectory).subscribe(() => sub.unsubscribe());
+        self.saveFile();
         return null;
       }
     });
   }
 
+  saveFile() {
+    let fileContext = this.editorControl.fetchActiveFile();
+    let directory = fileContext.model.path || this.editorControl.activeDirectory;
+    let sub = this.monacoService.saveFile(fileContext, directory).subscribe(() => sub.unsubscribe());
+  }
+
   connectToLanguageServer(lang?: string) {
     let languages = this.languageService.getSettings().endpoint;
     let connExist = this.languageService.connections.map(x => x.name);
@@ -293,6 +330,17 @@ export class MonacoComponent implements OnInit, OnChanges {
     };
     return new ReconnectingWebSocket(wsUrl, undefined, socketOptions);
   }
+
+  toggleDiffViewer(): void {
+    if (this.showDiffViewer) {
+      this.showDiffViewer = false;
+      this.showEditor = true;
+    }
+    else {
+      this.showEditor = !this.monacoService.spawnDiffViewer();
+      this.showDiffViewer = !this.showEditor;
+    }
+  }
 }
 
 /*