1 | import { createApp } from "vue";
|
---|
2 | import { createStore } from "vuex"
|
---|
3 | import App from "./App.vue";
|
---|
4 | import ToggleButton from "./components/ToggleButton.vue"
|
---|
5 | import Util from "./js/Util"
|
---|
6 |
|
---|
7 | export class TranscriptionViewModel {
|
---|
8 | /**
|
---|
9 | * Initialises a new instance of the {@link TranscriptionViewModel} class.
|
---|
10 | *
|
---|
11 | * @param {TranscriptionModel} transcription
|
---|
12 | * @param {File} file The file from which the transcription was generated.
|
---|
13 | */
|
---|
14 | constructor(transcription, file) {
|
---|
15 | /** @type {String} The UUID of this transcription. */
|
---|
16 | this.id = Util.generateUuid();
|
---|
17 |
|
---|
18 | /** @type {String} The transcription. */
|
---|
19 | this.transcription = transcription.transcription;
|
---|
20 |
|
---|
21 | /** @type {String} The name of the file from which the transcription was generated. */
|
---|
22 | this.fileName = transcription.file_name;
|
---|
23 |
|
---|
24 | /** @type {TranscriptionMetadata[]} The transcription metadata. */
|
---|
25 | this.metadata = transcription.metadata;
|
---|
26 |
|
---|
27 | /** @type {File} The file from which the transcription was generated. */
|
---|
28 | this.file = file;
|
---|
29 | }
|
---|
30 | }
|
---|
31 |
|
---|
32 | export class PlaybackState {
|
---|
33 | /**
|
---|
34 | * Initialises a new instance of the {@link PlaybackState} class.
|
---|
35 | * @param {String} id The ID of the transcription for which audio is being played.
|
---|
36 | * @param {Boolean} isPlaying A value indicating if audio is currently being played.
|
---|
37 | * @param {Number} currentTime The current time in the audio playback.
|
---|
38 | * @param {Number} length The length of the audio track.
|
---|
39 | */
|
---|
40 | constructor(id = "", isPlaying = false, currentTime = 0, length = 0) {
|
---|
41 | /** @type {String} The ID of the transcription for which audio is currently being played. */
|
---|
42 | this.id = id;
|
---|
43 |
|
---|
44 | /** @type {Boolean} Gets a value indicating if audio is currently being played back. */
|
---|
45 | this.isPlaying = isPlaying;
|
---|
46 |
|
---|
47 | /** @type {Number} Gets the current time in the playback. */
|
---|
48 | this.currentTime = currentTime;
|
---|
49 |
|
---|
50 | /** @type {Number} Gets the length of the current audio track. */
|
---|
51 | this.length = length;
|
---|
52 | }
|
---|
53 | }
|
---|
54 |
|
---|
55 | const store = createStore({
|
---|
56 | state() {
|
---|
57 | return {
|
---|
58 | /** @type {Map<String, String>} */
|
---|
59 | translations: new Map(),
|
---|
60 | /** @type {Map<String, TranscriptionViewModel>} */
|
---|
61 | rawTranscriptions: new Map(),
|
---|
62 | playbackState: new PlaybackState()
|
---|
63 | }
|
---|
64 | },
|
---|
65 | mutations: {
|
---|
66 | /**
|
---|
67 | * Adds a new transcription to the store.
|
---|
68 | * @param {*} state The state of the store.
|
---|
69 | * @param {TranscriptionViewModel} transcription The transcription's view model object.
|
---|
70 | */
|
---|
71 | transcriptionAdd(state, transcription) {
|
---|
72 | state.rawTranscriptions.set(transcription.id, transcription);
|
---|
73 | },
|
---|
74 |
|
---|
75 | /**
|
---|
76 | * Removes a transcription from the store.
|
---|
77 | * @param {*} state The state of the store.
|
---|
78 | * @param {String} id The UUID of the transcription.
|
---|
79 | */
|
---|
80 | transcriptionRemove(state, id) {
|
---|
81 | state.rawTranscriptions.delete(id);
|
---|
82 | },
|
---|
83 |
|
---|
84 | /**
|
---|
85 | * Sets the current playback state.
|
---|
86 | * @param {*} state The state of the store.
|
---|
87 | * @param {PlaybackState} playbackState The new playback state.
|
---|
88 | */
|
---|
89 | setPlaybackState(state, playbackState) {
|
---|
90 | state.playbackState = playbackState;
|
---|
91 | },
|
---|
92 | setCurrentlyPlaying(state, isPlaying) {
|
---|
93 | state.playbackState.isPlaying = isPlaying;
|
---|
94 | },
|
---|
95 | setCurrentPlaybackTime(state, time) {
|
---|
96 | state.playbackState.currentTime = time;
|
---|
97 | },
|
---|
98 | setCurrentlyPlayingId(state, id) {
|
---|
99 | state.playbackState.id = id;
|
---|
100 | },
|
---|
101 | setTranslations(state, translations) {
|
---|
102 | state.translations = translations;
|
---|
103 | }
|
---|
104 | }
|
---|
105 | });
|
---|
106 |
|
---|
107 | createApp(App)
|
---|
108 | .use(store)
|
---|
109 | .component("ToggleButton", ToggleButton)
|
---|
110 | .mount("#app");
|
---|
111 |
|
---|
112 | /* === Get interface translations === */
|
---|
113 |
|
---|
114 | /** @type {Map<String, String>} */
|
---|
115 | const translations = new Map();
|
---|
116 |
|
---|
117 | /* We might be running under Greenstone, so pull the tranlsations from there if so */
|
---|
118 | /* eslint-disable no-undef */
|
---|
119 | if (typeof gs !== "undefined" && gs.text && gs.text.atea) {
|
---|
120 | for (const key in gs.text.atea) {
|
---|
121 | translations.set(key, gs.text.atea[key]);
|
---|
122 | }
|
---|
123 |
|
---|
124 | store.commit("setTranslations", translations)
|
---|
125 | }
|
---|
126 | /* eslint-enable no-undef */
|
---|
127 | else {
|
---|
128 | fetch("resources/interface_atea.properties")
|
---|
129 | .then(async response => {
|
---|
130 | const responseText = await response.text();
|
---|
131 | const responseTranslations = responseText.split("\n");
|
---|
132 |
|
---|
133 | for (const translation of responseTranslations) {
|
---|
134 | const components = translation.split("=");
|
---|
135 |
|
---|
136 | if (components[0] === "") {
|
---|
137 | continue;
|
---|
138 | }
|
---|
139 |
|
---|
140 | const namespaceEndIndex = components[0].lastIndexOf(".");
|
---|
141 | translations.set(components[0].slice(namespaceEndIndex + 1), components[1]);
|
---|
142 | }
|
---|
143 |
|
---|
144 | store.commit("setTranslations", translations)
|
---|
145 | });
|
---|
146 | }
|
---|