diff --git a/assets/css/home.css b/assets/css/home.css index be4a529..01e686d 100644 --- a/assets/css/home.css +++ b/assets/css/home.css @@ -108,7 +108,8 @@ As to be honest I've hated CSS for years. */ .itemName { /* Targets the Friendly Name of the Item */ - font-size: 1.5vw; /* Font size based on viewport width */ + /*font-size: 1.5vw; /* Font size based on viewport width */ + font-size: 1.4em; margin-bottom: 5px; /* spacing outside the border of the text */ grid-column: 2; diff --git a/assets/css/pluginRepo.css b/assets/css/pluginRepo.css index 3a10989..b3c3d93 100644 --- a/assets/css/pluginRepo.css +++ b/assets/css/pluginRepo.css @@ -63,7 +63,7 @@ } .plugin-title { - font-size: 2vw; + font-size: 2em; margin-bottom: 5px; grid-column: 2; grid-row: 1; @@ -80,7 +80,7 @@ } .plugin-description { - font-size: 1.5vw; + font-size: 1.5em; grid-column: 3; grid-row: 1/3; diff --git a/assets/css/settings.css b/assets/css/settings.css index dfef210..182562e 100644 --- a/assets/css/settings.css +++ b/assets/css/settings.css @@ -58,7 +58,7 @@ grid-row: 1; margin-right: auto; margin-left: auto; - font-size: 2vw; + font-size: 2em; align-self: center; } @@ -67,7 +67,7 @@ grid-row: 1; margin-right: auto; margin-left: auto; - font-size: 1.5vw; + font-size: 1.5em; align-self: center; } diff --git a/assets/js/langHandler.js b/assets/js/langHandler.js index 56f78b0..188c237 100644 --- a/assets/js/langHandler.js +++ b/assets/js/langHandler.js @@ -14,100 +14,131 @@ var langHandler = { fetch(`/assets/lang/${resourceName}`) .then(response => { - if (response.ok) { - return [response.json(), response.status]; - } else { - // this is triggered by a 404 response or anything but 200 - // intended to catch a case where the language file does not exist. - console.log(`Language file seemed to fail with: ${response.status}`); - console.log(`Providing default language strings...`); - fetch(`/assets/lang/strings.en.json`) - .then(res => res.json()) - .then(defaultData => { - if (defaultData[id]) { - element.textContent = defaultData[id]; - } else { - console.log(`Default Translation for this item does not exist: ${id}`); - element.textContent = "Translations coudln't be found!"; - } - }); - return [response, response.status]; - } - }) - .then(passThru => { - // now we can see if the id exists in this lang - var data = passThru[0]; - var status = passThru[1]; - if (status == 200) { - if (data[id]) { - element.textContent = data[id]; + response.json().then(res => { + // stringing in this way, allows us to work with the JSON formatted response without having to build in another wait for the promise to resolve + // like the previous implementation + if (response.ok) { + if (res[id]) { + element.textContent = res[id]; + } else { + console.log(`Translation for this item does not exist: ${id}`); + fetch(`/assets/lang/strings.en.json`) + .then(defaultRes => defaultRes.json()) + .then(defaultData => { + if (defaultData[id]) { + element.textContent = defaultData[id]; + } else { + console.log(`Default Translation for this item does not exist: ${id}`); + element.textContent = "Translations Missing!"; + } + }); + } } else { - console.log(`Translation for this item does not exist: ${id}`); - // if the translation doesn't exist, default to english translation. + console.log(`Language file seemed to fail with: ${response.status}`); + console.log(`Providing default language strings...`); fetch(`/assets/lang/strings.en.json`) - .then(res => res.json()) + .then(defaultRes => defaultRes.json()) .then(defaultData => { if (defaultData[id]) { element.textContent = defaultData[id]; } else { console.log(`Default Translation for this item does not exist: ${id}`); - element.textContent = "Translations couldn't be found!"; + element.textContent = "Translations missing!"; } }); } - } else { - console.log(`Status: ${status} should be handled by initial then...`); - } + }); }); }, ProvideStringRaw: function ProvideStringRaw(id) { // This will be used for providing strings of generated content, where its not possible to then change the string wtihin the DOM return new Promise(function (resolve, reject) { + var resourceName = `strings.${currentLang}.json`; fetch(`/assets/lang/${resourceName}`) .then(response => { - if (response.ok) { - return [response.json(), response.status]; - } else { - return [response, response.status]; - } - }) - .then(passThru => { - var data = passThru[0]; - var status = passThru[1]; - if (status == 200) { - if (data[id]) { - resolve(data[id]); + response.json().then(res => { + if (response.ok) { + if (res[id]) { + resolve(res[id]); + } else { + console.log(`Translation for this item does not exist: ${id}`); + fetch(`/assets/lang/strings.en.json`) + .then(defaultRes => defaultRes.json()) + .then(defaultData => { + if (defaultData[id]) { + resolve(defaultData[id]); + } else { + console.log(`Default Translation for this item does not exist: ${id}`); + reject("Translations Missing!"); + } + }); + } } else { - console.log(`Translation for this item does not exist: ${id}; within: /assets/lang/${resourceName}`); - // if the translation doesn't exist, default to english translation + // requested language file isn't available + console.log(`Language file seemed to fail with: ${response.status}`); + console.log('Providing default langauge stirngs...'); fetch(`/assets/lang/strings.en.json`) - .then(res => res.json()) + .then(defaultRes => defaultRes.json()) .then(defaultData => { if (defaultData[id]) { resolve(defaultData[id]); } else { - console.log(`Default Translation for this item does not exist: ${id}; within: /assets/lang/strings.en.json`); - reject("Translations coudln't be found!"); + console.log(`Default Translation for this item does not exist: ${id}`); + reject("Translations Missing!"); } }); } - } else { - console.log(`Response for declared language string: ${status}`); - console.log(`Moving to default strings.`); - fetch(`/assets/lang/strings.en.json`) - .then(res => res.json()) - .then(defaultData => { - if (defaultData[id]) { - resolve(defaultData[id]); - } else { - console.log(`Default Translation for this item does not exist: ${id}; within: /assets/lang/strings.en.json`); - reject("Translations couldn't be found!"); - } - }); - } + }); }); + + + //var resourceName = `strings.${currentLang}.json`; + + //fetch(`/assets/lang/${resourceName}`) + // .then(response => { + // if (response.ok) { + // return [response.json(), response.status]; + // } else { + // return [response, response.status]; + // } + // }) + // .then(passThru => { + // var data = passThru[0]; + // var status = passThru[1]; + // if (status == 200) { + // if (data[id]) { + // resolve(data[id]); + // } else { + // console.log(`Translation for this item does not exist: ${id}; within: /assets/lang/${resourceName}`); + // if the translation doesn't exist, default to english translation + // fetch(`/assets/lang/strings.en.json`) + // .then(res => res.json()) + // .then(defaultData => { + // if (defaultData[id]) { + // resolve(defaultData[id]); + // } else { + // console.log(`Default Translation for this item does not exist: ${id}; within: /assets/lang/strings.en.json`); + // reject("Translations coudln't be found!"); + // } + // }); + // } + // } else { + // console.log(`Response for declared language string: ${status}`); + // console.log(`Moving to default strings.`); + // fetch(`/assets/lang/strings.en.json`) + // .then(res => res.json()) + // .then(defaultData => { + // if (defaultData[id]) { + // resolve(defaultData[id]); + // } else { + // console.log(`Default Translation for this item does not exist: ${id}; within: /assets/lang/strings.en.json`); + // reject("Translations couldn't be found!"); + // } + // }); + // } + //}); }); }, DetermineLang: function DetermineLang() { diff --git a/assets/js/pluginRepo.js b/assets/js/pluginRepo.js index 6b09f1d..194f6f6 100644 --- a/assets/js/pluginRepo.js +++ b/assets/js/pluginRepo.js @@ -82,8 +82,9 @@ function modalResults(content, status) { .then(resString => { buttonText = resString; + var formattedContent = formatModalContent(content); - var insertHTML = `
`; + var insertHTML = ` `; modal.innerHTML = insertHTML; var clearModal = document.getElementById("clearModal"); @@ -95,3 +96,18 @@ function modalResults(content, status) { modal.style.display = "block"; }); } + +function formatModalContent(text) { + var splitText = text.split("..."); + var newText = ""; + for (let i = 0; i < splitText.length; i++) { + if (splitText[i].includes("\\n")) { + // Using \\ here to escape the newline character + var tmpString = splitText[i].replace("\\n", ""); + newText += tmpString + "