Changeset 35384

Timestamp:

2021-09-14T11:13:37+12:00 (3 years ago)

Author:

davidb

Message:

Implement transcription text download

Location:

main/trunk/model-interfaces-dev/atea/korero-maori-asr

Files:

• package-lock.json (modified) (2 diffs)
• package.json (modified) (1 diff)
• src/components/TranscriptionItem.vue (modified) (4 diffs)

main/trunk/model-interfaces-dev/atea/korero-maori-asr/package-lock.json

@@ -1296 +1296 @@
       }
     },
+    "@types/file-saver": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/@types/file-saver/-/file-saver-2.0.3.tgz",
+      "integrity": "sha512-MBIou8pd/41jkff7s97B47bc9+p0BszqqDJsO51yDm49uUxeKzrfuNl5fSLC6BpLEWKA8zlwyqALVmXrFwoBHQ==",
+      "dev": true
+    },
     "@types/glob": {
       "version": "7.1.4",
@@ -5887 +5893 @@
       }
     },
+    "file-saver": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz",
+      "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
+    },
     "filesize": {
       "version": "3.6.1",

main/trunk/model-interfaces-dev/atea/korero-maori-asr/package.json

@@ -10 +10 @@
   "dependencies": {
     "core-js": "^3.16.4",
+    "file-saver": "^2.0.5",
     "vue": "^3.0.0",
     "vuex": "^4.0.2"
   },
   "devDependencies": {
+    "@types/file-saver": "^2.0.3",
     "@vue/cli-plugin-babel": "~4.5.0",
     "@vue/cli-plugin-eslint": "~4.5.0",

main/trunk/model-interfaces-dev/atea/korero-maori-asr/src/components/TranscriptionItem.vue

@@ -8 +8 @@
 
             <span>{{ translations.get("TranscriptionItem_FileName") }}: {{ transcription.fileName }}</span>
+
+            <button @click="downloadAsText" type="button">
+                <span class="material-icons">download</span>
+                <span>{{ translations.get("TranscriptionItem_DownloadAsText") }}</span>
+            </button>
 
             <button class="theme-error" @click="remove" type="button">
@@ -36 +41 @@
     display: grid;
     gap: 0.5em 0.5em;
-    grid-template-columns: auto 1fr auto;
+    grid-template-columns: auto 1fr auto auto;
     align-items: center;
 
@@ -52 +57 @@
 <script>
 import { mapState } from "vuex";
+import { saveAs } from "file-saver"
 import TranscriptionItemEditor from "./TranscriptionItemEditor.vue"
 import { TranscriptionViewModel } from "../main";
@@ -85 +91 @@
             // Start our removal animation and give it some time to complete
             Util.delay(550).then(() => this.$store.commit("transcriptionRemove", this.transcription.id));
+        },
+        downloadAsText() {
+            const extensionIndex = this.transcription.fileName.lastIndexOf(".");
+            let fileName = this.transcription.fileName.slice(0, extensionIndex);
+            fileName += "_transcription.txt";
+
+            const blob = new Blob([ this.transcription.transcription ], { type: "text/plain;charset=utf-8" });
+            saveAs(blob, fileName);
         }
     }