Changeset 35728


Ignore:
Timestamp:
2021-11-11T15:22:25+13:00 (3 weeks ago)
Author:
cstephen
Message:

Allow linebreak normalisation in direct input

Location:
main/trunk/model-interfaces-dev/atea/macron-restoration/src
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • main/trunk/model-interfaces-dev/atea/macron-restoration/src/components/DirectInput.vue

    r35726 r35728  
    88        <span v-if="errorState" class="error-text">Something went wrong! Please try modifying your input text.</span>
    99
    10         <!-- eslint-disable-next-line vue/require-v-for-key -->
    11         <span v-for="word in validRestored" :class="{ 'highlight': word.macronised && this.showMacronisedWords }">{{ word.w }}&nbsp;</span>
     10        <span class="preserveWhitespace" v-html="formattedRestored" />
    1211    </div>
    1312
    1413    <div class="flex">
    15         <input type="checkbox" id="i-preserve-existing-macrons" v-model="preserveExistingMacrons" />
     14        <input type="checkbox" id="i-preserve-existing-macrons" v-model="preserveExistingMacrons" @input="startMacronisationWait" />
    1615        <label for="i-preserve-existing-macrons">{{ translations.get('DirectInput_PreserveExistingMacrons') }}</label>
    1716    </div>
     
    2019        <input type="checkbox" id="i-show-macronised-words" v-model="showMacronisedWords" />
    2120        <label for="i-show-macronised-words">{{ translations.get('DirectInput_ShowMacronisedWords') }}</label>
     21    </div>
     22
     23    <div class="flex right-column">
     24        <input type="checkbox" id="i-show-macronised-words" v-model="normaliseLinebreaks" />
     25        <label for="i-show-macronised-words">{{ translations.get('DirectInput_NormaliseLinebreaks') }}</label>
    2226    </div>
    2327
     
    3337}
    3438
     39.preserveWhitespace {
     40    white-space: pre-line;
     41}
     42
    3543.input-area {
    36     resize: none;
     44    resize: vertical;
    3745    min-height: 4em;
    38     overflow: hidden;
    3946}
    4047
     
    7279            preserveExistingMacrons: true,
    7380            showMacronisedWords: false,
    74             transcribeTimeout: null,
    75             waitingOnTranscribe: false,
    76             errorState: false
     81            macroniseWaitTimeout: null,
     82            waitingToMacronise: false,
     83            errorState: false,
     84            normaliseLinebreaks: false
    7785        }
    7886    },
    7987    computed: {
    8088        canDownload() {
    81             return this.restored !== null && !this.waitingOnTranscribe;
     89            return this.restored !== null && !this.waitingToMacronise;
    8290        },
    8391        input: {
     
    8795            set(newValue) {
    8896                this.$store.commit("setDirectInput", newValue);
     97                this.startMacronisationWait();
    8998            }
    9099        },
     
    97106            }
    98107        },
    99         validRestored() {
    100             return this.restored.filter(w => w.w !== "");
     108        formattedRestored() {
     109            let restored = "";
     110
     111            for (const word of this.restored) {
     112                if (word.w) {
     113                    if (word[0] !== "-") {
     114                        restored += " ";
     115                    }
     116
     117                    if (word.macronised && this.showMacronisedWords) {
     118                        restored += `<mark class="highlight">${word.w}</mark>`;
     119                    }
     120                    else {
     121                        restored += word.w;
     122                    }
     123                }
     124
     125                if (word.linebreak) {
     126                    restored += this.normaliseLinebreak(word.linebreak);
     127                }
     128            }
     129
     130            return restored;
    101131        },
    102132        ...mapState({
    103133            translations: state => state.translations
    104134        })
    105     },
    106     watch: {
    107         input() {
    108             this.waitingOnTranscribe = true;
    109 
    110             if (this.transcribeTimeout !== null) {
    111                 clearTimeout(this.transcribeTimeout);
    112             }
    113 
    114             this.transcribeTimeout = setTimeout(this.updateMacronisedText, 1000);
    115         }
    116135    },
    117136    methods: {
     
    124143            event.target.height = event.target.scrollHeight;
    125144        },
     145        startMacronisationWait() {
     146            if (this.input === null || this.input === "") {
     147                return;
     148            }
     149
     150            this.waitingToMacronise = true;
     151
     152            if (this.macroniseWaitTimeout !== null) {
     153                clearTimeout(this.macroniseWaitTimeout);
     154            }
     155
     156            this.macroniseWaitTimeout = setTimeout(this.updateMacronisedText, 1000);
     157        },
    126158        async updateMacronisedText() {
    127159            this.errorState = false;
     
    129161            try {
    130162                this.restored = await macroniser.directMacronisation(this.input, this.preserveExistingMacrons);
    131                 this.waitingOnTranscribe = false;
     163                this.waitingToMacronise = false;
    132164            }
    133165            catch (ex) {
     
    139171            const blob = new Blob([ this.restored ], { type: "text/plain;charset=utf-8" });
    140172            saveAs(blob, "restored.txt");
     173        },
     174        /**
     175         * Normalises a linebreak.
     176         * @param {String} linebreak The linebreak sequence.
     177         */
     178        normaliseLinebreak(linebreak) {
     179            if (!this.normaliseLinebreaks) {
     180                return linebreak;
     181            }
     182
     183            const rCount = linebreak.split("\r").length - 1;
     184            const nCount = linebreak.split("\n").length - 1;
     185
     186            if (rCount > 1) {
     187                if (nCount > 0) {
     188                    return "\r\n\r\n";
     189                }
     190
     191                return "\r\r";
     192            }
     193            else if (nCount > 1) {
     194                return "\n\n";
     195            }
     196
     197            return linebreak;
    141198        }
    142199    }
  • main/trunk/model-interfaces-dev/atea/macron-restoration/src/styles/_material.scss

    r35723 r35728  
    3232    // Default theme
    3333    @extend .theme-primary;
     34}
     35
     36/* Scrollbar replacement */
     37
     38::-webkit-scrollbar {
     39    width: 8px;
     40    height: 8px;
     41}
     42
     43::-webkit-scrollbar-track {
     44    background: #f1f1f1;
     45}
     46
     47::-webkit-scrollbar-thumb {
     48    background: #CCC;
     49    border-radius: 3px;
     50
     51    transition-duration: var(--transition-duration);
     52
     53    &:hover {
     54        background: #666;
     55        height: 8px;
     56        width: 8px;
     57    }
    3458}
    3559
     
    114138    display: flex;
    115139    flex-wrap: wrap;
     140    align-content: flex-start;
     141    align-items: flex-start;
    116142
    117143    border-radius: var(--border-radius);
     
    123149    @extend .text-container;
    124150
     151    align-items: center;
    125152    overflow-x: auto;
    126153    overflow-y: hidden;
     
    140167    font-size: 1em;
    141168
    142     transition-duration: var(--transition-duration);
     169    transition: border var(--transition-duration);
    143170
    144171    &:hover {
     
    416443}
    417444
    418 /* Scrollbar replacement */
    419 
    420 ::-webkit-scrollbar {
    421     width: 6px;
    422     height: 6px;
    423 }
    424 
    425 ::-webkit-scrollbar-track {
    426     background: #f1f1f1;
    427 }
    428 
    429 ::-webkit-scrollbar-thumb {
    430     background: #CCC;
    431     border-radius: 3px;
    432 
    433     transition-duration: var(--transition-duration);
    434 
    435     &:hover {
    436         background: #666;
    437         height: 8px;
    438         width: 8px;
    439     }
    440 }
    441 
    442445/* === Start Theme Definitions === */
    443446
Note: See TracChangeset for help on using the changeset viewer.