add download link & auto download translated file

app/app.py

@@ -507,11 +507,9 @@ def create_app(args):
               id: translate
               type: object
               properties:
-                translatedText:
+                translatedFileUrl:
-                  oneOf:
+                  type: string
-                    - type: string
+                  description: Translated file url
-                    - type: array
-                  description: Translated text(s)
           400:
             description: Invalid request
             schema:
@@ -588,7 +586,7 @@ def create_app(args):
             translated_filename = os.path.basename(translated_file_path)
             return jsonify(
                 {
-                    "translatedFileUrl": url_for('download_file', filename=translated_filename)
+                    "translatedFileUrl": url_for('download_file', filename=translated_filename, _external=True)
                 }
             )
         except Exception as e:

app/static/js/app.js

@@ -35,6 +35,7 @@ document.addEventListener('DOMContentLoaded', function(){
             translationType: "text",
             inputFile: false,
             loadingFileTranslation: false,
+            translatedFileUrl: "",
         },
         mounted: function(){
             var self = this;
@@ -317,10 +318,13 @@ document.addEventListener('DOMContentLoaded', function(){
             removeFile: function(e) {
               e.preventDefault()
               this.inputFile = false;
+              this.translatedFileUrl = "";
+              this.loadingFileTranslation = false;
             },
             translateFile: function(e) {
                 e.preventDefault();
 
+                let self = this;
                 let translateFileRequest = new XMLHttpRequest();
 
                 translateFileRequest.open("POST", BaseUrl + "/translate_file", true);
@@ -333,11 +337,38 @@ document.addEventListener('DOMContentLoaded', function(){
 
                 this.loadingFileTranslation = true
 
-                translateFileRequest.onload = () => {
+                translateFileRequest.onload = function()  {
                     if (translateFileRequest.readyState === 4 && translateFileRequest.status === 200) {
-                        this.loadingFileTranslation = false
+                        try{
+                            self.loadingFileTranslation = false;
+
+                            let res = JSON.parse(this.response);
+                            if (res.translatedFileUrl){
+                                self.translatedFileUrl = res.translatedFileUrl;
+
+                                let link = document.createElement("a");
+                                link.target = "_blank";
+                                link.href = self.translatedFileUrl;
+                                link.click();
+                            }else{
+                                throw new Error(res.error || "Unknown error");
+                            }
+
+                        }catch(e){
+                            self.error = e.message;
+                            self.loadingFileTranslation = false;
+                            self.inputFile = false;
                         }
                     }
+                }
+
+
+
+                translateFileRequest.onerror = function() {
+                    self.error = "Error while calling /translate_file";
+                    self.loadingFileTranslation = false;
+                    self.inputFile = false;
+                };
 
                 translateFileRequest.send(data);
             }

app/templates/index.html

@@ -203,7 +203,8 @@
                                             </div>
                                         </div>
                                     </div>
-                                    <button @click="translateFile" v-if="loadingFileTranslation === false" class="btn">Translate</button>
+                                    <button @click="translateFile" v-if="translatedFileUrl === '' && loadingFileTranslation === false" class="btn">Translate</button>
+                                    <a v-if="translatedFileUrl !== ''" :href="translatedFileUrl" class="btn">Download</a>
                                     <div class="progress" v-if="loadingFileTranslation">
                                         <div class="indeterminate"></div>
                                     </div>