Repository: hedyorg/hedy

Issue:
[UI idea] Add language switcher to the UI
### Discussed in https://github.com/Felienne/hedy/discussions/1564

![image](https://user-images.githubusercontent.com/1003685/147070660-6ff920f7-282d-4d78-908d-32c2a7b765d9.png)

There is a method already in `hedy_translation` that you can call to translate snippets back and forth:

https://github.com/Felienne/hedy/blob/2ed4621472a47628c866f7abf53aec54e2a1a6a0/hedy_translation.py#L24

So this is just a matter of adding it to the UI.

Flags can be a bit tricky though, since not all languages have a good 1:1 mapping to countries (f.e. do we do the Indian flag for both Hindi and Bengali? Does the Spanish flag also represent the Spanish speaking community we have in South-America)

Alternatively we could do little squares with language names/codes (Nl, En, Es etc.)


Discussion:
Ow and of course we need a similar switcher in the side bar too... Will be a bit more tricky since there is less space there!

Resolving patch:
diff --git a/app.py b/app.py
--- a/app.py
+++ b/app.py
@@ -1,5 +1,7 @@
 # coding=utf-8
 import sys
+
+import hedy_translation
 from website.yaml_file import YamlFile
 
 if (sys.version_info.major < 3 or sys.version_info.minor < 7):
@@ -67,6 +69,12 @@
     'pt_br': 'pt_pt'
 }
 
+ALL_KEYWORD_LANGUAGES = {
+    'en': 'EN',
+    'nl': 'NL',
+    'es': 'ES'
+}
+
 LEVEL_DEFAULTS = collections.defaultdict(hedy_content.NoSuchDefaults)
 for lang in ALL_LANGUAGES.keys():
     LEVEL_DEFAULTS[lang] = hedy_content.LevelDefaults(lang)
@@ -284,6 +292,10 @@ def setup_language():
         session['lang'] = request.accept_languages.best_match(ALL_LANGUAGES.keys(), 'en')
     g.lang = session['lang']
 
+
+    # Always set the keyword languages to English when starting
+    g.keyword_lang = "en"
+
     # Set the page direction -> automatically set it to "left-to-right"
     # Switch to "right-to-left" if one of the language in the list is selected
     # This is the only place to expand / shrink the list of RTL languages -> front-end is fixed based on this value
@@ -291,6 +303,7 @@ def setup_language():
     if g.lang in ['ar', 'he', 'ur']:
         g.dir = "rtl"
 
+
     # Check that requested language is supported, otherwise return 404
     if g.lang not in ALL_LANGUAGES.keys():
         return "Language " + g.lang + " not supported", 404
@@ -1072,11 +1085,30 @@ def change_language():
     session['lang'] = body.get('lang')
     return jsonify({'succes': 200})
 
+@app.route('/translate_keywords', methods=['POST'])
+def translate_keywords():
+    body = request.json
+    translated_code = hedy_translation.translate_keywords(body.get('code'), body.get('start_lang'), body.get('goal_lang'), level=int(body.get('level', 1)))
+    if translated_code:
+        return jsonify({'success': 200, 'code': translated_code})
+    else:
+        return g.auth_texts.get('translate_error'), 400
 
 @app.template_global()
 def current_language():
     return make_lang_obj(g.lang)
 
+@app.template_global()
+def current_keyword_language():
+    return make_keyword_lang_obj(g.keyword_lang)
+
+@app.template_global()
+def other_keyword_language():
+    if session['lang'] in ALL_KEYWORD_LANGUAGES.keys() and g.keyword_lang != session['lang']:
+        return make_keyword_lang_obj(g.lang)
+    if g.keyword_lang != "en": #Always return English as an option!
+        return make_keyword_lang_obj("en")
+    return None
 
 @app.template_global()
 def main_menu_entries():
@@ -1128,6 +1160,13 @@ def make_lang_obj(lang):
         'lang': lang
     }
 
+def make_keyword_lang_obj(lang):
+    """Make a language object for a given language."""
+    return {
+        'sym': ALL_KEYWORD_LANGUAGES[lang],
+        'lang': lang
+    }
+
 
 @app.template_global()
 def modify_query(**new_values):
diff --git a/website/teacher.py b/website/teacher.py
--- a/website/teacher.py
+++ b/website/teacher.py
@@ -401,8 +401,9 @@ def view_adventure(user, adventure_id):
         if adventure['creator'] != user['username'] and not is_admin(user):
             return utils.error_page(error=403, ui_message='retrieve_adventure')
 
-        # Add id with current level to the <pre> tag to let syntax highlighting know which highlighting we need!
-        adventure['content'] = adventure['content'].replace("<pre>", "<pre id='" + str(adventure['level']) + "'>")
+        # Add level to the <pre> tag to let syntax highlighting know which highlighting we need!
+        adventure['content'] = adventure['content'].replace("<pre>", "<pre level='" + str(adventure['level']) + "'>")
+        print(adventure['content'])
         return render_template('view-adventure.html', adventure=adventure,
                                page_title=hedyweb.get_page_title('view adventure'), current_page='my-profile')
 


Test patch: