From 359b2772f6ff12b8bb9f85d7fe281a617cafa267 Mon Sep 17 00:00:00 2001
From: Dmitry Vasilev <dmitry.vasil@gmail.com>
Date: Mon, 17 Oct 2022 16:44:47 +0800
Subject: [PATCH] toggle editor fullscreen (focus mode)

---
 index.html           | 7 ++++---
 src/editor/editor.js | 8 ++++++++
 src/editor/ui.js     | 6 ++++++
 3 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index ac52cab..11278b7 100644
--- a/index.html
+++ b/index.html
@@ -41,8 +41,9 @@
         grid-template-columns: 70% 30%;
       }
 
-      .bottom {
-        display: grid;
+      .root.fullscreen_editor {
+        grid-template-columns: 100% 0%;
+        grid-template-rows: 1fr 0fr 2.5em;
       }
 
       .editor_container, .bottom, .eval, .files_container, .statusbar {
@@ -134,8 +135,8 @@
 
       .bottom {
         grid-area: bottom;
-        position: relative;
         overflow: auto;
+        display: grid;
       }
 
       .debugger {
diff --git a/src/editor/editor.js b/src/editor/editor.js
index a173143..ea6a841 100644
--- a/src/editor/editor.js
+++ b/src/editor/editor.js
@@ -329,6 +329,14 @@ export class Editor {
       }
     })
 
+    this.ace_editor.commands.bindKey("F5", "fullscreen_editor");
+    this.ace_editor.commands.addCommand({
+      name: 'fullscreen_editor',
+      exec: (editor) => {
+        this.ui.fullscreen_editor()
+      }
+    })
+
 
     this.ace_editor.commands.bindKey("F1", "focus_value_explorer");
     this.ace_editor.commands.addCommand({
diff --git a/src/editor/ui.js b/src/editor/ui.js
index 7a72d69..666e7a3 100644
--- a/src/editor/ui.js
+++ b/src/editor/ui.js
@@ -283,6 +283,7 @@ export class UI {
       ['Step out of call', 'Ctrl-o', '\\o'],
       ['When in call tree view, jump to return statement', 'Enter'],
       ['When in call tree view, jump to function arguments', 'a'],
+      ['Expand/collapse editor to fullscreen', 'F5'],
     ]
     return el('dialog', 'help_dialog',
       el('table', 'help',
@@ -314,4 +315,9 @@ export class UI {
     )
   }
 
+  fullscreen_editor() {
+    this.root.classList.toggle('fullscreen_editor')
+    this.editor.ace_editor.resize()
+  }
+
 }