Implement language switching UI

chatapp.svg

@@ -33,6 +33,20 @@
       <text x="14" y="160" style="font: bold 20px sans-serif" fill="black">?</text>
     </g>
   </symbol>
+  <symbol id="flag_denmark" width="20" height="15">
+    <path fill="#c8102e" d="M0,0H20V15H0Z"/>
+    <path fill="#fff" d="M0,6H6V0H8V6H20V8H8V15H6V8H0Z"/>
+  </symbol>
+
+  <symbol id="flag_uk" width="50" height="30">
+	<clipPath id="t">
+		<path d="M25,15h25v15zv15h-25zh-25v-15zv-15h25z"/>
+	</clipPath>
+	<path d="M0,0v30h50v-30z" fill="#012169"/>
+	<path d="M0,0 50,30M50,0 0,30" stroke="#fff" stroke-width="6"/>
+	<path d="M0,0 50,30M50,0 0,30" clip-path="url(#t)" stroke="#C8102E" stroke-width="4"/>
+	<path d="M-1 11h22v-12h8v12h22v8h-22v12h-8v-12h-22z" fill="#C8102E" stroke="#FFF" stroke-width="2"/>
+  </symbol>
 </defs>
 <script type="application/ecmascript">
 <![CDATA[
@@ -433,6 +447,12 @@ document.addEventListener(
     () => document.getElementById("message_box").addEventListener('wheel', on_wheel)
 )
 
+async function switch_language(language_code) {
+  current_language = language_code;
+  removeAllChildren(document.getElementById('messages'));
+  await current_dialog_fn();
+}
+
 async function dialog_ven() {
   if(current_language == "da") {
     await dialog_ven_da();
@@ -480,7 +500,7 @@ async function dialog_ven_en() {
   }
 
 async function dialog_mor() {
-  if(current_language="da") {
+  if(current_language == "da") {
     await dialog_mor_da();
   } else {
     await dialog_mor_en();
@@ -504,7 +524,7 @@ async function dialog_mor_en() {
 }
 
 async function dialog_kaereste() {
-  if(current_language="da") {
+  if(current_language == "da") {
     await dialog_kaereste_da();
   } else {
     await dialog_kaereste_en();
@@ -546,7 +566,7 @@ async function dialog_kaereste_en() {
 }
 
 async function dialog_politi() {
-  if(current_language="da") {
+  if(current_language == "da") {
     await dialog_politi_da();
   } else {
     await dialog_politi_en();
@@ -580,7 +600,7 @@ async function dialog_politi_en() {
 }
 
 async function dialog_support() {
-  if(current_language="da") {
+  if(current_language == "da") {
     await dialog_support_da();
   } else {
     await dialog_support_en();
@@ -620,7 +640,7 @@ async function dialog_support_en() {
 }
 
 async function dialog_nabopige() {
-  if(current_language="da") {
+  if(current_language == "da") {
     await dialog_nabopige_da();
   } else {
     await dialog_nabopige_en();
@@ -681,7 +701,11 @@ async function dialog_nabopige_en() {
   <polyline points="300,20 320,0 320,40" fill="#0084FF" onclick="swipe_viewport()" />
   <polyline points="560,20 600,20 580,0" fill="#0084FF" onclick="scroll_up()" />
   <polyline points="560,30 600,30 580,50" fill="#0084FF" onclick="scroll_down()" />
-  <text x="350" y="30" id="contact_indicator">loading...</text>
+  <text x="325" y="30" id="contact_indicator">loading...</text>
+  <use href="#flag_denmark" x="500" y="35" onclick="switch_language('da')" />
+  <g transform="scale(0.5,0.5)">
+    <use href="#flag_uk" x="1050" y="70" onclick="switch_language('en')" />
+  </g>
 </g>
 
 <!-- [right] messages view -->