Create language bundle

index.html

@@ -59,9 +59,9 @@
 		<script src="js/preview/OrbitControls.js"></script>
 		<script src="js/outliner/tree.vue.js"></script>
 		
+		<script src="js/webpack/bundle.js"></script>
 		<script src="js/util.js"></script>
 		<script src="js/property.js"></script>
-		<script src="js/interface/language.js"></script>
 		<script src="js/interface/menu.js"></script>
 		<script src="js/interface/actions.js"></script>
 		<script src="js/interface/themes.js"></script>

js/interface/interface.js

@@ -195,11 +195,8 @@ function setupInterface() {
 		$.extend(true, Interface.data, interface_data)
 	} catch (err) {}
 
-	if (!Language.loading_steps) {
-		Language.loading_steps = true;
-	} else {
-		translateUI()
-	}
+	translateUI()
+	
 	$('.edit_session_active').hide()
 
 	$('#center').toggleClass('checkerboard', settings.preview_checkerboard.value);
@@ -482,6 +479,17 @@ function setSettingsTab(tab) {
 	}
 }
 
+function getStringWidth(string, size) {
+	var a = $('<label style="position: absolute">'+string+'</label>')
+	if (size && size !== 16) {
+		a.css('font-size', size+'pt')
+	}
+	$('body').append(a.css('visibility', 'hidden'))
+	var width = a.width()
+	a.detach()
+	return width;
+};
+
 //UI Edit
 function setProgressBar(id, val, time) {
 	if (!id || id === 'main') {

package.json

@@ -33,10 +33,8 @@
 			"assets/",
 			"build/",
 			"css/",
-			"font/",
-			"js",
-			"lib",
-			"lang",
+			"js/",
+			"lib/",
 			"main.js",
 			"index.html",
 			"package.json",
@@ -88,6 +86,8 @@
 		]
 	},
 	"scripts": {
+		"bundle": "webpack --config webpack.config.js",
+		"bundle-watch": "webpack --config webpack.config.js --watch",
 		"dev": "electron .",
 		"dist": "electron-builder",
 		"beta": "electron-builder --windows portable",
@@ -97,7 +97,9 @@
 		"@types/jquery": "^3.5.4",
 		"electron": "^8.5.5",
 		"electron-builder": "^22.9.1",
-		"electron-notarize": "^1.0.0"
+		"electron-notarize": "^1.0.0",
+		"webpack": "^5.21.2",
+		"webpack-cli": "^4.5.0"
 	},
 	"dependencies": {
 		"electron-updater": "^4.3.1"

src/index.js

@@ -0,0 +1 @@
+import './languages'

src/languages.js

@@ -0,0 +1,95 @@
+
+import de from './../lang/de.json';
+import en from './../lang/en.json';
+import es from './../lang/es.json';
+import fr from './../lang/fr.json';
+import it from './../lang/it.json';
+import ja from './../lang/ja.json';
+import ko from './../lang/ko.json';
+import nl from './../lang/nl.json';
+import pl from './../lang/pl.json';
+import pt from './../lang/pt.json';
+import ru from './../lang/ru.json';
+import sv from './../lang/sv.json';
+import zh from './../lang/zh.json';
+
+const data = {
+	de: de,
+	en: en,
+	es: es,
+	fr: fr,
+	it: it,
+	ja: ja,
+	ko: ko,
+	nl: nl,
+	pl: pl,
+	pt: pt,
+	ru: ru,
+	sv: sv,
+	zh: zh,
+};
+
+window.tl = function(string, variables) {
+	if (string && string.length > 100) return string;
+	var result = Language.data[string]
+	if (result && result.length > 0) {
+		if (variables) {
+			if (variables instanceof Array == false) {
+				variables = [variables];
+			}
+			var i = variables.length;
+			while (i > 0) {
+				i--;
+				result = result.replace(new RegExp('%'+i, 'g'), variables[i])
+			}
+		}
+		return result;
+	} else {
+		return string;
+	}
+}
+window.translateUI = function() {
+	$('.tl').each(function(i, obj) {
+		var text = tl($(obj).text())
+		$(obj).text(text)
+	})
+}
+
+window.Language = {
+	data: {},
+	code: 'en',
+	options: {
+		en: 'English',
+		de: 'Deutsch (German)',
+		es: 'Espa\u00F1ol (Spanish)',
+		fr: 'Fran\u00E7ais (French)',
+		it: 'Italiano (Italian)',
+		ja: '\u65E5\u672C\u8A9E (Japanese)',//日本語
+		ko: '\uD55C\uAD6D\uC5B4 (Korean)',//日本語
+		nl: 'Nederlands (Dutch)',
+		pl: 'Polski (Polish)',
+		pt: 'Portugu\u00EAs (Portuguese)',
+		ru: '\u0440\u0443\u0441\u0441\u043A\u0438\u0439 (Russian)',
+		sv: 'Svenska (Swedish)',
+		zh: '\u4e2d\u6587 (Chinese)',//中文
+	},
+	toString: () => Language.code
+}
+
+
+// Get language code
+let code;
+try {
+	code = JSON.parse(localStorage.getItem('settings')).language.value
+} catch (err) {}
+
+if (!code) {
+	code = navigator.language.replace(/-\w+/, '')
+}
+if (code && Language.options[code]) {
+	Language.code = code
+	document.body.parentNode.attributes.lang.value = Language.code;
+}
+
+
+Language.data = data[Language.code];

webpack.config.js

@@ -0,0 +1,21 @@
+const PathModule = require('path')
+
+module.exports = {
+    mode: 'production',
+    target: 'node',
+    entry: './src/index.js',
+    output: {
+        filename: 'bundle.js',
+        path: PathModule.resolve(__dirname, 'js', 'webpack')
+    },
+    module: {
+        rules: [
+            {
+                test: /\.(jpg|png)$/,
+                use: {
+                    loader: 'url-loader'
+                }
+            }
+        ]
+    }
+}