Added localization functions

Added 'localizedStringWithReplacements' that returns a localized version of the string with special tags replaced

src/common/scripts/button.js

@@ -1,7 +1,7 @@
 import { info, error } from './logger.js'
 import { getResource, getExtensionURL } from './common.js'
 import { togglePictureInPicture } from './video.js'
-import { localizedButtonTitle } from './localization.js'
+import { localizedString } from './localization.js'
 
 const BUTTON_ID = 'PiPer_button';
 
@@ -21,7 +21,7 @@ export const addButton = function(parent) {
 
     // Set button properties
     button.id = BUTTON_ID;
-    button.title = localizedButtonTitle();
+    button.title = localizedString('button-title');
     const buttonStyle = getResource().buttonStyle;
     if (buttonStyle) button.style.cssText = buttonStyle;
     const buttonClassName = getResource().buttonClassName;

src/common/scripts/localization.js

@@ -1,19 +1,63 @@
+import { error } from './logger.js'
+
+const localizations = {};
+
+localizations['button-title'] = {
+  'en': 'Open Picture in Picture mode',
+  'de': 'Bild-in-Bild starten',
+  'nl': 'Beeld in beeld starten',
+  'fr': 'Démarrer Image dans l’image',
+};
+
+// Set English as the default fallback language
+const defaultLanguage = 'en';
+
 /**
- * Returns localized button title
+ * Returns a localized version of the string designated by the specified key
  *
+ * @param {string} key - the key for a string 
+ * @param {string=} language - two-letter ISO 639-1 language code
  * @return {string}
  */
-export const localizedButtonTitle = function() {
-  const language = navigator.language.substring(0, 2);
-  switch (language) {
-    case 'de':
-      return 'Bild-in-Bild starten';
-    case 'nl':
-      return 'Beeld in beeld starten';
-    case 'fr':
-      return 'Démarrer Image dans l’image';
-    case 'en':
-    default:
-      return 'Open Picture in Picture mode';
+export const localizedString = function(key, language = navigator.language.substring(0, 2)) {
+  
+  // Get all localizations for key
+  const /** Object<string,string> */ localizationsForKey = localizations[key];
+  if (localizationsForKey) {
+    
+    // Get the users specific localization or fallback to default language
+    let string = localizationsForKey[language] || localizationsForKey[defaultLanguage];
+    if (string) return string;
   }
-};
+  
+  error(`No localized string found for key '${key}'`);
+  return '';
+};
+
+/**
+ * Returns a localized version of the string designated by the specified key with tags replaced
+ *
+ * @param {string} key - the key for a string 
+ * @param {Array<Array<string>>} replacements - an array of arrays containing pairs of tags and their replacement
+ * @param {string=} language - two-letter ISO 639-1 language code
+ * @return {string}
+ */
+export const localizedStringWithReplacements = function(key, replacements, language) {
+  
+  let string = localizedString(key, language);
+  
+  // Replace tags of the form [XXX] with directed replacements if needed
+  for (let index = replacements.length; index--; ) {
+    let replacement = replacements[index];
+    
+    // Ensure tags do not contain special characters (this gets optimised away as opposed to escaping the tags with the associated performance cost)
+    if (/[^-_0-9a-zA-Z\/]/.test(replacement[0])) {
+      error(`Invalid characters used in localized string tag '${replacement[0]}'`);
+    }
+    
+    const regex = new RegExp(`\\\[${replacement[0]}\\\]`, 'g');
+    string = string.replace(regex, replacement[1]);
+  }
+
+  return string;
+};

src/safari-legacy/update.plist

@@ -10,7 +10,7 @@
 			<key>CFBundleShortVersionString</key>
 			<string></string>
 			<key>CFBundleVersion</key>
-			<string>172</string>
+			<string>173</string>
 			<key>Developer Identifier</key>
 			<string>BQ6Q24MF9X</string>
 			<key>URL</key>