From 35de0bc70db7c827561abf40d7c54ebce844eab8 Mon Sep 17 00:00:00 2001
From: Dmitry Vasilev <dmitry.vasil@gmail.com>
Date: Fri, 16 Jun 2023 06:13:37 +0300
Subject: [PATCH] show entrypoint in problems and loading view

---
 index.html       |  9 +++++++--
 src/editor/ui.js | 24 ++++++++++++++++++------
 2 files changed, 25 insertions(+), 8 deletions(-)

diff --git a/index.html b/index.html
index 642970b..7a8983b 100644
--- a/index.html
+++ b/index.html
@@ -62,7 +62,7 @@
         box-shadow: 1px 1px 6px 3px var(--shadow_color);
       }
 
-      .tab_content:focus-within, .problems:focus-within {
+      .tab_content:focus-within, .problems_container:focus-within {
         outline: none;
       }
 
@@ -137,7 +137,7 @@
         overflow: auto;
       }
 
-      .debugger, .problems {
+      .debugger, .problems_container {
         padding: 5px;
         overflow: auto;
       }
@@ -160,12 +160,17 @@
 
       .entrypoint_select {
         display: flex;
+        width: fit-content;
         align-items: center;
         margin-left: auto;
+        min-height: 55px;
       }
 
       .entrypoint_title {
         margin-right: 0.5em;
+      }
+
+      .entrypoint_title:not(:first-child) {
         margin-left: 1.5em;
       }
 
diff --git a/src/editor/ui.js b/src/editor/ui.js
index 5ca8100..ed0fa96 100644
--- a/src/editor/ui.js
+++ b/src/editor/ui.js
@@ -57,9 +57,15 @@ export class UI {
                 tabindex: 0,
               }),
             ),
-            this.debugger_loading = el('div', 'debugger_wrapper')
+            this.debugger_loading = el('div', 'debugger_wrapper',
+              el('div', 'entrypoint_select'),
+              this.debugger_loading_message = el('div'),
+            ),
           ),
-          this.problems_container = el('div', {"class": 'problems', tabindex: 0}),
+          this.problems_container = el('div', {"class": 'problems_container', tabindex: 0},
+            el('div', 'entrypoint_select'),
+            this.problems = el('div'),
+          )
         ),
 
         this.files.el,
@@ -211,7 +217,13 @@ export class UI {
   }
 
   render_entrypoint_select(state) {
-    this.entrypoint_select.replaceChildren(
+    for(let select of this.root.getElementsByClassName('entrypoint_select')) {
+      this.do_render_entrypoint_select(state, select)
+    }
+  }
+
+  do_render_entrypoint_select(state, select) {
+    select.replaceChildren(
       el('span', 'entrypoint_title', 'js entrypoint'),
       el('select', {
         click: e => e.stopPropagation(),
@@ -277,7 +289,7 @@ export class UI {
     this.debugger_loaded.style = 'display: none'
     this.debugger_loading.style = ''
 
-    this.debugger_loading.innerText = 
+    this.debugger_loading_message.innerText = 
       state.loading_external_imports_state != null
         ? 'Loading external modules...'
         : 'Waiting...'
@@ -307,12 +319,12 @@ export class UI {
   render_problems(problems) {
     this.debugger_container.style = 'display: none'
     this.problems_container.style = ''
-    this.problems_container.innerHTML = ''
+    this.problems.innerHTML = ''
     problems.forEach(p => {
       const s = this.editor.get_session(p.module)
       const pos = s.doc.indexToPosition(p.index)
       const module = p.module == '' ? "*scratch*" : p.module
-      this.problems_container.appendChild(
+      this.problems.appendChild(
         el('div', 'problem', 
           el('a', {
             href: 'javascript:void(0)',