Some more initial UI work, initial translation support

src/applets/welcome/routes.py

@@ -1,12 +1,21 @@
 from applets.welcome import bp
 from flask import Flask, request, session, redirect, \
      url_for, render_template, flash, Blueprint
+# we use this neat little trick to get config data from the main app
+from flask import current_app
 import gettext
 import dmm.lsblk as lsblk
 
 # Set up Gettext
-en_i18n = gettext.translation("welcome", './locales', fallback=True, languages=['af', 'en'])
-en_i18n.install()
+def set_language(LANG):
+    """
+    Sets language for this applet
+    """
+    translations = gettext.translation("welcome", './applets/welcome/locales', fallback=True, languages=[LANG])
+    translations.install()
+    _ = translations.gettext
+
+set_language('en')
 
 @bp.route('/welcome',methods=['GET', 'POST', 'PUT'])
 def welcome_index():
@@ -14,9 +23,20 @@ def welcome_index():
     The page you'd get if you access the root of
     this app in a browser.
     """
+    if request.method == 'POST':
+        if "lang" in request.form.keys():
+            current_app.config['CONFIG']['global_settings']['language'] = request.form["lang"]
+            LANG = current_app.config['CONFIG']['global_settings']['language']
+            set_language(LANG)
+            FORMLANG = request.form["lang"]
+        if "keyboard" in request.form.keys():
+            print(request.form["keyboard"])
+        if "timezone" in request.form.keys():
+            print(request.form["timezone"])
+    lang = current_app.config['CONFIG']['global_settings']['language']
     blkid = lsblk.list_scsi_devices()
     string_dict = build_stringlist()
-    return render_template('welcome.html', string_dict=string_dict)
+    return render_template('welcome.html', string_dict=string_dict, selected_lang=lang)
 
 
 def build_stringlist():
@@ -29,5 +49,12 @@ def build_stringlist():
     string_dict['language_text'] = _("Language:")
     string_dict['keylayout_text'] = _("Keyboard Layout:")
     string_dict['timezone_text'] = _("Time Zone:")
+    lang_dict = {}
+    lang_dict['af'] = _("Afrikaans")
+    lang_dict['en'] = _("English (International)")
+    lang_dict['en-us'] = _("English (United States)")
+    lang_dict['en-uk'] = _("English (United Kingdom)")
+    lang_dict['en-za'] = _("English (South Africa)")
+    string_dict['lang_list'] = lang_dict
     return string_dict
 

src/applets/welcome/welcome.html

@@ -1,38 +1,43 @@
 {% extends "layout.html" %}
 {% block body %}
 
-<img style="top: 10px; width: 100%;" src="/static/applets/welcome/img/banner.png" alt="Debian Image banner" />
+<img style="width: 100%; border-radius: 8px;" src="/static/applets/welcome/img/banner.png" alt="Debian Image banner" />
+
 <p><b> {{ string_dict['welcome_text'] }} </b></p>
 <p>{{ string_dict['confirm_text'] }} </p>
 
+<form action="/welcome" method="POST">
 <img src="/static/icons/keyboard.svg" /> {{ string_dict['language_text'] }} 
 <div class="control is-link" width="180px">
   <div class="select">
-    <select style="width: 180px">
-      <option>English</option>
-      <option>Afrikaans</option>
+    <select hx-post="/welcome" hx-target="body" name="lang" style="width: 220px">
+      {% for lang in string_dict['lang_list'] %}
+      <option value="{{lang}}" {% if lang == selected_lang %} selected=selected {% endif %}>{{ string_dict['lang_list'][lang] }}</option>
+      {% endfor %}
     </select>
   </div>
 </div>
-
+</form>
 <br>
 
+<form>
 <img src="/static/icons/keyboard.svg" /> {{ string_dict['keylayout_text'] }}
 <div class="control is-link">
   <div class="select">
-    <select style="width: 180px">
+    <select hx-post="/welcome" hx-target="body" name="keyboard" style="width: 220px">
       <option>en-us</option>
       <option>en-uk</option>
     </select>
   </div>
 </div>
-
+</form>
 <br />
 
+<form>
 <img src="/static/icons/keyboard.svg" /> {{ string_dict['timezone_text'] }}
 <div class="control is-link">
   <div class="select">
-    <select style="width: 180px">
+    <select hx-post="/welcome" hx-target="body" name="timezone" style="width: 220px">
       <option>Africa/Johannesburg</option>
       <option>UTC</option>
     </select>
@@ -40,6 +45,7 @@
 </div>
 
 
+</form>
 
 </div>
 </div>