source: main/trunk/model-interfaces-dev/atea/korero-maori-asr/src/main.js@ 35433

import { createApp } from "vue";
import { createStore } from "vuex"
import App from "./App.vue";
import ToggleButton from "./components/ToggleButton.vue"

export class TranscriptionViewModel {
    /**
     * Initialises a new instance of the {@link TranscriptionViewModel} class.
     *
     * @param {TranscriptionModel} transcription
     * @param {File} file The file from which the transcription was generated.
     */
    constructor(transcription, file) {
        /** @type {String} The UUID of this transcription. */
        this.id = TranscriptionViewModel.getId(file); // Should be a fairly reliable indicator of uniqueness.

        /** @type {String} The transcription. */
        this.transcription = transcription.transcription;

        /** @type {String} The name of the file from which the transcription was generated. */
        this.fileName = transcription.file_name;

        /** @type {TranscriptionMetadata[]} The transcription metadata. */
        this.metadata = transcription.metadata;

        /** @type {File} The file from which the transcription was generated. */
        this.file = file;
    }

    static getId(file) {
        return file.name + file.size + file.type;
    }
}

export class PlaybackState {
    /**
     * Initialises a new instance of the {@link PlaybackState} class.
     * @param {String} id The ID of the transcription for which audio is being played.
     * @param {Boolean} isPlaying A value indicating if audio is currently being played.
     * @param {Number} currentTime The current time in the audio playback.
     * @param {Number} length The length of the audio track.
     */
    constructor(id = "", isPlaying = false, currentTime = 0, length = 0) {
        /** @type {String} The ID of the transcription for which audio is currently being played. */
        this.id = id;

        /** @type {Boolean} Gets a value indicating if audio is currently being played back. */
        this.isPlaying = isPlaying;

        /** @type {Number} Gets the current time in the playback. */
        this.currentTime = currentTime;

        /** @type {Number} Gets the length of the current audio track. */
        this.length = length;
    }
}

export class TranscriptionExistsError extends Error {
    constructor(message = "", ...args) {
        super(message, ...args);
    }
}

const store = createStore({
    state() {
        return {
            /** @type {Map<String, String>} */
            translations: new Map(),
            /** @type {Map<String, TranscriptionViewModel>} */
            rawTranscriptions: new Map(),
            playbackState: new PlaybackState()
        }
    },
    mutations: {
        /**
         * Adds a new transcription to the store.
         * @param {*} state The state of the store.
         * @param {TranscriptionViewModel} transcription The transcription's view model object.
         */
        transcriptionAdd(state, transcription) {
            if (state.rawTranscriptions.has(transcription.id)) {
                throw new Error("Transcription already exists");
            }
            state.rawTranscriptions.set(transcription.id, transcription);
        },

        /**
         * Removes a transcription from the store.
         * @param {*} state The state of the store.
         * @param {String} id The UUID of the transcription.
         */
        transcriptionRemove(state, id) {
            state.rawTranscriptions.delete(id);
        },

        /**
         * Sets the current playback state.
         * @param {*} state The state of the store.
         * @param {PlaybackState} playbackState The new playback state.
         */
        setPlaybackState(state, playbackState) {
            state.playbackState = playbackState;
        },
        setCurrentlyPlaying(state, isPlaying) {
            state.playbackState.isPlaying = isPlaying;
        },
        setCurrentPlaybackTime(state, time) {
            state.playbackState.currentTime = time;
        },
        setCurrentlyPlayingId(state, id) {
            state.playbackState.id = id;
        },
        setTranslations(state, translations) {
            state.translations = translations;
        }
    },
    getters: {
        hasTranscriptionOfFile: (state) => (file) => {
            const id = TranscriptionViewModel.getId(file);
            return state.rawTranscriptions.has(id);
        }
    }
});

createApp(App)
    .use(store)
    .component("ToggleButton", ToggleButton)
    .mount("#app");

/* === Get interface translations === */

/** @type {Map<String, String>} */
const translations = new Map();

/* We might be running under Greenstone, so pull the tranlsations from there if so */
/* eslint-disable no-undef */
if (typeof gs !== "undefined" && gs.text && gs.text.atea) {
    for (const key in gs.text.atea) {
        translations.set(key, gs.text.atea[key]);
    }

    store.commit("setTranslations", translations)
}
/* eslint-enable no-undef */
else {
    fetch("resources/interface_atea.properties")
        .then(async response => {
            const responseText = await response.text();
            const responseTranslations = responseText.split("\n");

            for (const translation of responseTranslations) {
                const components = translation.split("=");

                if (components[0] === "") {
                    continue;
                }

                const namespaceEndIndex = components[0].lastIndexOf(".");
                translations.set(components[0].slice(namespaceEndIndex + 1), components[1]);
            }

            store.commit("setTranslations", translations)
        });
}