- revert implementation once again

tools/gptranslator.html

@@ -616,52 +616,31 @@ <h3 style="cursor: pointer;" data-target="#aboutText">About ️👆</h3>
         translateButton.textContent = "Translate";
     });
 
-    function parseJsonResponse(responseContent) {
-        const responseJsonStr = responseContent.substring(
-            responseContent.indexOf("{"),
-            responseContent.lastIndexOf("}") + 1
-        );
-        try {
-            return JSON5.parse(responseJsonStr);
-        } catch (error) {
-            throw new Error('Failed to parse JSON response');
-        }
-    }
-
-    function sanitizeTranslation(translation) {
-        return translation.replace(/\n/g, '<br>');
-    }
-
     function displayTranslations(data) {
         resultsContainer.innerHTML = "";
         const responseContent = data.choices[0].message.content;
-
+        const responseJsonStr = responseContent.substring(responseContent.indexOf("{"), responseContent.lastIndexOf("}") + 1);
         let responseJsonData;
         try {
-            responseJsonData = parseJsonResponse(responseContent);
-        } catch (error) {
-            console.log(error);
+            responseJsonData = fixJSON(responseJsonStr);
+        } catch (e) {
+            console.log(e);
             resultsContainer.innerHTML = `<p>Could not parse translations. But here is the response (most likely) in JSON format:</p><pre>${responseContent}</pre>`;
             return;
         }
-
         if (responseJsonData && responseJsonData.translation_options) {
             const {detected_language, translation_options} = responseJsonData;
             resultsContainer.innerHTML += `<p><strong>Detected Language:</strong> ${detected_language}</p>`;
-
             translation_options.forEach(option => {
                 const fittingScore = option.hasOwnProperty('fitting_score') ? ` (${option.fitting_score.toFixed(2)})` : '';
-                const sanitizedTranslation = sanitizeTranslation(option.translation);
-
                 resultsContainer.innerHTML += `
 <p class="translation">
     <strong>Translation:${fittingScore}</strong>
-    <span class="value" style="cursor: pointer;">${sanitizedTranslation}</span>
+    <span class="value" style="cursor: pointer;">${option.translation}</span>
     <span class="favorite-btn" style="cursor: pointer; float: right;" title="Add to Favorites">⭐</span>
 </p>
 `;
             });
-
             resultsContainer.querySelectorAll('p.translation').forEach(translation => {
                 translation.querySelector('.value').addEventListener('click', function() {
                     const spanText = this.innerText;
@@ -671,13 +650,12 @@ <h3 style="cursor: pointer;" data-target="#aboutText">About ️👆</h3>
                         console.error('Error in copying text: ', err);
                     });
                 });
-
                 translation.querySelector('.favorite-btn').addEventListener('click', function() {
                     const translationText = this.previousElementSibling.innerText;
                     const inputText = document.getElementById('input-string').value;
                     addFavorite(inputText, translationText);
                 });
-            });
+            })
         } else {
             resultsContainer.innerHTML = `<p>Could not retrieve translations.</p>`;
         }
@@ -753,6 +731,39 @@ <h3 style="cursor: pointer;" data-target="#aboutText">About ️👆</h3>
         });
     });
 
+    const fixJSON = (jsonStr) => {
+        // Remove newline characters from the input string.
+        jsonStr = jsonStr.replace(/\n/g, '');
+
+        // Substitute all the backslashes from JSON string.
+        jsonStr = jsonStr.replace(/\\/g, '');
+
+        try {
+            return JSON5.parse(jsonStr);
+        } catch (error) {
+            while (true) {
+                // Search json string specifically for '"'
+                const match = jsonStr.match(/[\w|"]\s?(")\s?[\w|"]/);
+
+                // If we don't find any, then we come out of the loop
+                if (!match) {
+                    break;
+                }
+
+                // Get the location of \"
+                const s = match.index + match[0].indexOf('"');
+                const e = s + 1;
+                let c = jsonStr.substring(s, e);
+
+                // Replace \" with \'
+                c = c.replace(/"/g, "'");
+                jsonStr = jsonStr.substring(0, s) + c + jsonStr.substring(e);
+            }
+            return JSON5.parse(jsonStr);
+        }
+    };
+
+
     // Additional JavaScript for Camera and OCR Functionality
     document.getElementById('close-camera').addEventListener('click', closeCameraModal);
     document.getElementById('open-camera').addEventListener('click', openCamera);