android: editor loads (with error), some i18n groundwork

Author: GarboMuffin

android/app/build.gradle.kts

@@ -38,6 +38,7 @@ android {
     }
     buildFeatures {
         compose = true
+        buildConfig = true
     }
 }
 

android/app/src/main/assets/l10n

@@ -0,0 +1 @@
+../../../../../src-main/l10n/

android/app/src/main/assets/preload/editor.js

@@ -1,5 +1,89 @@
+const {contextBridge, ipcRenderer} = require('electron');
 
+contextBridge.exposeInMainWorld('EditorPreload', {
+  isInitiallyFullscreen: () => ipcRenderer.sendSync('is-initially-fullscreen'),
+  getInitialFile: () => ipcRenderer.invoke('get-initial-file'),
+  getFile: (id) => ipcRenderer.invoke('get-file', id),
+  openedFile: (id) => ipcRenderer.invoke('opened-file', id),
+  closedFile: () => ipcRenderer.invoke('closed-file'),
+  showSaveFilePicker: (suggestedName) => ipcRenderer.invoke('show-save-file-picker', suggestedName),
+  showOpenFilePicker: () => ipcRenderer.invoke('show-open-file-picker'),
+  setLocale: (locale) => ipcRenderer.sendSync('set-locale', locale),
+  setChanged: (changed) => ipcRenderer.invoke('set-changed', changed),
+  openNewWindow: () => ipcRenderer.invoke('open-new-window'),
+  openAddonSettings: (search) => ipcRenderer.invoke('open-addon-settings', search),
+  openPackager: () => ipcRenderer.invoke('open-packager'),
+  openDesktopSettings: () => ipcRenderer.invoke('open-desktop-settings'),
+  openPrivacy: () => ipcRenderer.invoke('open-privacy'),
+  openAbout: () => ipcRenderer.invoke('open-about'),
+  getPreferredMediaDevices: () => ipcRenderer.invoke('get-preferred-media-devices'),
+  getAdvancedCustomizations: () => ipcRenderer.invoke('get-advanced-customizations'),
+  setExportForPackager: (callback) => {
+    exportForPackager = callback;
+  },
+  setIsFullScreen: (isFullScreen) => ipcRenderer.invoke('set-is-full-screen', isFullScreen)
+});
 
-window.EditorPreload = {
+let exportForPackager = () => Promise.reject(new Error('exportForPackager missing'));
 
-};
+ipcRenderer.on('export-project-to-port', (e) => {
+  const port = e.ports[0];
+  exportForPackager()
+    .then(({data, name}) => {
+      port.postMessage({ data, name });
+    })
+    .catch((error) => {
+      console.error(error);
+      port.postMessage({ error: true });
+    });
+});
+
+window.addEventListener('message', (e) => {
+  if (e.source === window) {
+    const data = e.data;
+    if (data && typeof data.ipcStartWriteStream === 'string') {
+      ipcRenderer.postMessage('start-write-stream', data.ipcStartWriteStream, e.ports);
+    }
+  }
+});
+
+ipcRenderer.on('enumerate-media-devices', (e) => {
+  navigator.mediaDevices.enumerateDevices()
+    .then((devices) => {
+      e.sender.send('enumerated-media-devices', {
+        devices: devices.map((device) => ({
+          deviceId: device.deviceId,
+          kind: device.kind,
+          label: device.label
+        }))
+      });
+    })
+    .catch((error) => {
+      console.error(error);
+      e.sender.send('enumerated-media-devices', {
+        error: `${error}`
+      });
+    });
+});
+
+contextBridge.exposeInMainWorld('PromptsPreload', {
+  alert: (message) => ipcRenderer.sendSync('alert', message),
+  confirm: (message) => ipcRenderer.sendSync('confirm', message),
+});
+
+// In some Linux environments, people may try to drag & drop files that we don't have access to.
+// Remove when https://github.com/electron/electron/issues/30650 is fixed.
+if (navigator.userAgent.includes('Linux')) {
+  document.addEventListener('drop', (e) => {
+    if (e.isTrusted) {
+      for (const file of e.dataTransfer.files) {
+        // Using webUtils is safe as we don't have a legacy build for Linux
+        const {webUtils} = require('electron');
+        const path = webUtils.getPathForFile(file);
+        ipcRenderer.invoke('check-drag-and-drop-path', path);
+      }
+    }
+  }, {
+    capture: true
+  });
+}

android/app/src/main/assets/preload/ipc-init.js

@@ -1,3 +1,29 @@
-const contextBridge = {
+const require = (function() {
+    const contextBridge = {
+        exposeInMainWorld: (objectName, objectImplementation) => {
+            window[objectName] = objectImplementation;
+        }
+    };
 
-};
+    const ipcRenderer = {
+        sendSync: (method, ...args) => {
+            const response = AndroidIpcSync.sendSync(JSON.stringify({
+                method,
+                args
+            }));
+            return JSON.parse(response);
+        },
+        invoke: (method, ...args) => {}
+    };
+
+    return (moduleName) => {
+        if (moduleName === "electron") {
+            return {
+                contextBridge,
+                ipcRenderer
+            };
+        }
+
+        throw new Error(`Mock require() found unknown module: ${moduleName}`);
+    };
+}());

android/app/src/main/java/org/turbowarp/android/EditorView.kt

@@ -1,14 +1,43 @@
 package org.turbowarp.android
 
 import androidx.compose.runtime.Composable
+import org.json.JSONArray
+import org.json.JSONObject
+
+fun mapToJsonObject(map: Map<String, String>): JSONObject {
+    val jsonObject = JSONObject()
+    for ((key, value) in map) {
+        jsonObject.put(key, value)
+    }
+    return jsonObject
+}
 
 @Composable
 fun EditorView() {
     TurboWarpWebView(
         url = "https://editor.android-assets.turbowarp.org/gui/gui.html",
         preloads = listOf(
-            "ipc-init.js",
             "editor.js",
-        )
+        ),
+        ipcHandler = object : IpcHandler {
+            override fun handleSync(
+                method: String,
+                args: JSONArray
+            ): Any? {
+                if (method == "is-initially-fullscreen") {
+                    return false
+                }
+
+                if (method == "set-locale") {
+                    val result = JSONObject()
+                    val strings = L10N.getStrings()
+                    result.put("strings", mapToJsonObject(strings))
+                    println(result)
+                    return result
+                }
+
+                return null
+            }
+        }
     )
 }

android/app/src/main/java/org/turbowarp/android/L10N.kt

@@ -0,0 +1,43 @@
+package org.turbowarp.android
+
+import android.content.Context
+import org.json.JSONObject
+
+object L10N {
+    private val translations = mutableMapOf<String, Map<String, String>>()
+
+    private fun stringsWithDescriptionToMap(jsonObject: JSONObject): Map<String, String> {
+        val map = mutableMapOf<String, String>()
+        for (id in jsonObject.keys()) {
+            println(id)
+            val infoObject = jsonObject.getJSONObject(id)
+            map[id] = infoObject.getString("string")
+        }
+        return map
+    }
+
+    private fun stringsToMap(jsonObject: JSONObject): Map<String, String> {
+        val map = mutableMapOf<String, String>()
+        for (id in jsonObject.keys()) {
+            map[id] = jsonObject.getString(id)
+        }
+        return map
+    }
+
+    fun setup(context: Context) {
+        val englishStrings = readAssetAsString(context, "l10n/en.json")
+        val englishStringsObject = JSONObject(englishStrings)
+        translations["en"] = stringsWithDescriptionToMap(englishStringsObject)
+
+        val translatedStrings = readAssetAsString(context, "l10n/generated-translations.json")
+        val translatedStringsObjects = JSONObject(translatedStrings)
+        for (locale in translatedStringsObjects.keys()) {
+            val localeStringsObject = translatedStringsObjects.getJSONObject(locale)
+            translations[locale] = stringsToMap(localeStringsObject)
+        }
+    }
+
+    fun getStrings(): Map<String, String> {
+        return translations["en"]!!
+    }
+}

android/app/src/main/java/org/turbowarp/android/MainActivity.kt

@@ -4,12 +4,19 @@ import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.activity.enableEdgeToEdge
+import androidx.webkit.WebViewFeature
 import org.turbowarp.android.ui.theme.TurboWarpTheme
 
+// TODO
+private fun isDeviceSupported(): Boolean {
+    return WebViewFeature.isFeatureSupported(WebViewFeature.WEB_MESSAGE_LISTENER)
+}
+
 class MainActivity : ComponentActivity() {
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         enableEdgeToEdge()
+        L10N.setup(applicationContext)
         setContent {
             TurboWarpTheme {
                 EditorView()

android/app/src/main/java/org/turbowarp/android/TurboWarpAssets.kt

@@ -0,0 +1,9 @@
+package org.turbowarp.android
+
+import android.content.Context
+
+fun readAssetAsString(context: Context, path: String): String {
+    val stream = context.assets.open(path)
+    val reader = stream.bufferedReader()
+    return reader.readText()
+}

android/app/src/main/java/org/turbowarp/android/TurboWarpWebView.kt

@@ -5,6 +5,7 @@ import android.content.Context
 import android.graphics.Bitmap
 import android.net.Uri
 import android.view.ViewGroup
+import android.webkit.JavascriptInterface
 import android.webkit.WebResourceRequest
 import android.webkit.WebResourceResponse
 import android.webkit.WebView
@@ -18,12 +19,9 @@ import androidx.webkit.WebViewAssetLoader
 import androidx.webkit.WebViewCompat
 import java.io.IOException
 import java.net.URLConnection
-
-private fun readAssetAsString(context: Context, path: String): String {
-    val stream = context.assets.open(path)
-    val reader = stream.bufferedReader()
-    return reader.readText()
-}
+import androidx.core.net.toUri
+import org.json.JSONArray
+import org.json.JSONObject
 
 private class ServeAsset(
     private val context: Context,
@@ -88,34 +86,53 @@ private class TurboWarpWebViewClient(
     }
 }
 
-private class WebViewIPC : WebViewCompat.WebMessageListener {
+interface IpcHandler {
+    fun handleSync(method: String, args: JSONArray): Any?
+}
+
+private class IpcSync(private val ipcHandler: IpcHandler) {
+    // Android's JavaScript interface apparently only supports the primitive types.
+    // So we have to pass around JSON strings. Real fun.
+    @JavascriptInterface
+    fun sendSync(jsonRequestString: String): String {
+        val jsonRequest = JSONObject(jsonRequestString)
+        val method = jsonRequest.getString("method")
+        val args = jsonRequest.getJSONArray("args")
+
+        val jsonResponse = ipcHandler.handleSync(method, args)
+        return jsonResponse?.toString() ?: "null"
+    }
+}
+
+private class IpcAsync(private val ipcHandler: IpcHandler) : WebViewCompat.WebMessageListener {
+    @SuppressLint("RequiresFeature")
     override fun onPostMessage(
         view: WebView,
         message: WebMessageCompat,
         sourceOrigin: Uri,
         isMainFrame: Boolean,
         replyProxy: JavaScriptReplyProxy
     ) {
-
+        replyProxy.postMessage("e")
     }
 }
 
 private fun getOrigin(url: String): String {
-    val uri = Uri.parse(url)
+    val uri = url.toUri()
     val sb = StringBuilder()
     sb.append(uri.scheme)
     sb.append("://")
     sb.append(uri.host)
-    sb.append(uri.host)
     return sb.toString()
 }
 
-@SuppressLint("SetJavaScriptEnabled")
+@SuppressLint("SetJavaScriptEnabled", "RequiresFeature")
 @Composable
 fun TurboWarpWebView(
     url: String,
     modifier: Modifier = Modifier,
     preloads: List<String> = emptyList(),
+    ipcHandler: IpcHandler? = null
 ) {
     AndroidView(
         modifier = modifier,
@@ -135,14 +152,26 @@ fun TurboWarpWebView(
                 settings.allowFileAccess = false
                 settings.allowContentAccess = false
 
-                WebViewCompat.addWebMessageListener(
-                    this,
-                    "AndroidIPC",
-                    setOf(getOrigin(url)),
-                    WebViewIPC()
-                )
-
-                webViewClient = TurboWarpWebViewClient(context, preloads)
+                // Easier debugging
+                val version = BuildConfig.VERSION_NAME
+                settings.userAgentString += " org.turbowarp.android/$version"
+
+                if (ipcHandler != null) {
+                    val origin = getOrigin(url)
+                    WebViewCompat.addWebMessageListener(
+                        this,
+                        "AndroidIpcAsync",
+                        setOf(origin),
+                        IpcAsync(ipcHandler)
+                    )
+                    addJavascriptInterface(IpcSync(ipcHandler), "AndroidIpcSync")
+                }
+
+                webViewClient = TurboWarpWebViewClient(context, if (ipcHandler == null) {
+                    preloads
+                } else {
+                    listOf("ipc-init.js").plus(preloads)
+                })
             }
         },
         update = { webView ->