[CHORE] Explicit JS initialization everywhere (hedyorg#4052)

Remove `APP_STATE` and `passFromHtml` features. All JavaScript initialization is now done by calling `initialize()` (in `initialize.ts`), and optionally by passing page-specific options (from Python to JavaScript in `javascript_page_options`, which get dispatched in `initialize.ts`).

Each module now has their own copy of some globals they might need... this is still not the ideal end state, but at least each individual module can now be refactored independently. 

Also making an attempt to reduce the size of `app.ts`, which is starting to grow quite large, by moving functionality out into their own files where it  makes sense.

In this PR:

- Remove `APP_STATE`
- Introduce page-specific initialization options
- Move the app-specific logic (around loading programs, hiding and showing various page elements based on the current tab) from `tabs.ts` to `app.ts`, by using an event mechanism (`tabs.on('afterSwitch', () => { ... })`).
- Move the functionality that has to do with debugging from `app.ts` into `debugging.ts`.
- Move the `onElementBecomesVisible` functionality out of `app.ts` into its own file
- Move some `<script>` tags out from HTML into JavaScript

app.py

@@ -880,7 +880,15 @@ def tutorial_index():
         parsons_exercises=parsons,
         cheatsheet=cheatsheet,
         adventures_per_level=adventures_per_level,
-        blur_button_available=False)
+        blur_button_available=False,
+        # See initialize.ts
+        javascript_page_options=dict(
+            page='code',
+            level=level,
+            lang=g.lang,
+            adventures=adventures,
+            start_tutorial=True,
+        ))
 
 
 @app.route('/teacher-tutorial', methods=['GET'])
@@ -898,9 +906,15 @@ def teacher_tutorial(user):
         )
 
     return render_template('for-teachers.html', current_page='my-profile',
-                           page_title=gettext('title_for-teacher'), teacher_classes=teacher_classes,
-                           teacher_adventures=adventures, tutorial=True,
-                           content=hedyweb.PageTranslations('for-teachers').get_page_translations(g.lang))
+                           page_title=gettext('title_for-teacher'),
+                           teacher_classes=teacher_classes,
+                           teacher_adventures=adventures,
+                           tutorial=True,
+                           content=hedyweb.PageTranslations('for-teachers').get_page_translations(g.lang),
+                           javascript_page_options=dict(
+                               page='for-teachers',
+                               tutorial=True,
+                           ))
 
 
 # routing to index.html
@@ -1099,7 +1113,15 @@ def index(level, program_id):
         quiz_questions=quiz_questions,
         adventures_per_level=adventures_per_level,
         cheatsheet=cheatsheet,
-        blur_button_available=False)
+        blur_button_available=False,
+        # See initialize.ts
+        javascript_page_options=dict(
+            page='code',
+            level=level_number,
+            lang=g.lang,
+            adventures=adventures,
+            loaded_program=loaded_program,
+        ))
 
 
 @app.route('/hedy/<id>/view', methods=['GET'])
@@ -1168,8 +1190,8 @@ def get_specific_adventure(name, level, mode):
     except BaseException:
         return utils.error_page(error=404, ui_message=gettext('no_such_level'))
 
-    adventure = [x for x in load_adventures_for_level(level) if x.get('short_name') == name]
-    if not adventure:
+    adventures = [x for x in load_adventures_for_level(level) if x.get('short_name') == name]
+    if not adventures:
         return utils.error_page(error=404, ui_message=gettext('no_such_adventure'))
 
     prev_level = level - 1 if [x for x in load_adventures_for_level(
@@ -1192,10 +1214,17 @@ def get_specific_adventure(name, level, mode):
                            hide_cheatsheet=None,
                            enforce_developers_mode=None,
                            teacher_adventures=[],
-                           adventures=adventure,
+                           adventures=adventures,
                            latest=version(),
                            raw=raw,
-                           blur_button_available=False)
+                           blur_button_available=False,
+                           # See initialize.ts
+                           javascript_page_options=dict(
+                               page='code',
+                               lang=g.lang,
+                               level=level,
+                               adventures=adventures,
+                           ))
 
 
 @app.route('/cheatsheet/', methods=['GET'], defaults={'level': 1})

build-tools/heroku/generate-client-messages.py

@@ -15,7 +15,9 @@
 OUTPUT_FILE = 'static/js/message-translations.ts'
 
 ADDITIONAL_GETTEXT_KEYS = [
-    'level_title'
+    'level_title',
+    'unsaved_class_changes',
+    'teacher_welcome',
 ]
 
 

content/client-messages.txt

@@ -1 +1,3 @@
 gettext('level_title')
+gettext('unsaved_class_changes')
+gettext('teacher_welcome')