Wiring in majority of minimap-view

src/app/editor/code-view/view.base.ts

@@ -18,6 +18,7 @@ import { ServiceMessage } from '../../common/types/service-message.type';
 export class CodeViewBase {
     public uuid: string                            = uuid.v4();
     @Input() public isDefault: boolean             = false;
+    @Input() public isMiniMap: boolean             = false;
     public leftSiblingUUID!: string;
     public rightSiblingUUID!: string;
 
@@ -150,16 +151,30 @@ export class CodeViewBase {
         window.main.toggleFullScreen();
     }
 
+    public setAsMiniMapView() {
+        this.editor.renderer.showLineNumbers = false;
+        this.editor.renderer.setShowGutter(false);
+
+        this.editor.setReadOnly(true);
+        this.editor.setFontSize(2);
+        this.editor.setHighlightActiveLine(false);
+        this.editor.setHighlightGutterLine(false);
+        this.editor.setShowFoldWidgets(false);
+        this.editor.setShowPrintMargin(false);
+        this.editorElm.nativeElement.parentElement.classList.add("col-1");
+        this.editorElm.nativeElement.parentElement.classList.add("zero-margin-padding");
+    }
+
     public zoomIn() {
         this.editor.setFontSize(
             parseInt(this.editor.getFontSize()) + 1
-        )
+        );
     }
 
     public zoomOut() {
         this.editor.setFontSize(
             parseInt(this.editor.getFontSize()) - 1
-        )
+        );
     }
 
     public movelinesUp() {

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

@@ -26,7 +26,7 @@ import { ServiceMessage } from '../../common/types/service-message.type';
     templateUrl: './view.component.html',
     styleUrl: './view.component.css',
     host: {
-        'class': 'col'
+        'class': 'col zero-margin-padding'
     }
 })
 export class CodeViewComponent extends CodeViewBase {
@@ -34,22 +34,26 @@ export class CodeViewComponent extends CodeViewBase {
 
     constructor() {
         super();
-
-        this.editorsService.set(this.uuid, this);
     }
 
 
     private ngAfterViewInit(): void {
-        if (this.isDefault) {
-            this.editorsService.setActiveEditor(this.uuid);
-            this.addActiveStyling();
-        }
-
         this.loadAce();
     }
 
     private loadAce(): void {
         this.configAceAndBindToElement()
+
+        if (this.isDefault) {
+            this.editorsService.setActiveEditor(this.uuid);
+            this.addActiveStyling();
+        }
+
+        if (this.isMiniMap) {
+            this.setAsMiniMapView();
+            return;
+        }
+
         this.loadAceKeyBindings();
         this.loadAceEventBindings();
     }
@@ -61,6 +65,7 @@ export class CodeViewComponent extends CodeViewBase {
 
         this.editor = ace.edit( this.editorElm.nativeElement );
         this.editor.setOptions( this.editorSettings.CONFIG );
+        this.editorsService.set(this.uuid, this);
     }
 
     private loadAceKeyBindings(): void {

src/app/editor/editors.component.html

@@ -4,6 +4,7 @@
         <code-view [isDefault]="true"></code-view>
         <hr class="col vr-pane-handle" pane-handle />
         <code-view></code-view>
+        <code-view [isMiniMap]="true"></code-view>
     </div>
 
 <div>

src/app/editor/editors.component.ts

@@ -106,6 +106,8 @@ export class EditorsComponent {
 
                 editorComponent.activeFile = file;
                 editor.setSession(file.session);
+                this.editorsService.miniMapView.editor.setSession(file.session);
+                this.editorsService.miniMapView.activeFile = file;
             } else if (message.action === "close-tab") {
                 let file    = this.filesService.get(message.filePath);
                 let editors = this.editorsService.getEditorsAsArray();
@@ -114,6 +116,10 @@ export class EditorsComponent {
                     let editorComponent = editors[i];
                     if (editorComponent.editor.session == file.session) {
                         editorComponent.newSession();
+                        this.editorsService.miniMapView.editor.setSession(
+                            editorComponent.editor.getSession()
+                        );
+                        this.editorsService.miniMapView.activeFile = null;
                     }
                 }