From ab6a5a9471442f5c217a36e5743bebacc064e084 Mon Sep 17 00:00:00 2001 From: Nathan James Date: Thu, 29 Sep 2022 21:16:41 +0100 Subject: [PATCH] Sort out whitespace jumping once and for all! --- README.md | 26 +++++++++---------- package.json | 2 +- .../auto-typer-vue/AutoTyperVue.vue | 6 ++++- 3 files changed, 19 insertions(+), 15 deletions(-) diff --git a/README.md b/README.md index 388e8c3..c9ae07e 100644 --- a/README.md +++ b/README.md @@ -22,19 +22,19 @@ Then import the module and css file into your Vue component (see usage/example b ## Props -| Prop | Type | Default | Description | Validation | -| :---------------------- | :----------------------- | :------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | :-------------------------------------------------------------------------------------- | -| `componentTag` | `string` | 'span' | The HTML tag that the element will be. | Currently accepts any of the following: `span`, `p`, `a`, `h*` (where * is any number). | -| `beginningWord` | `string` | `''` | A string prepended to every text item. _If you would like to have a space at the end, I recommend using the ` ` character if you are inputting strings directly, and the javascript escape code `\xa0` if you are inputting it into a bound tag_. | N/A. | -| `writtenBeginningWord` | `string` | `''` | A word that will be typed when the auto-typer begins, and then will stay there. _If you would like to have a space at the end, I recommend using the ` ` character if you are inputting strings directly, and the javascript escape code `\xa0` if you are inputting it bound taginto a _. | N/A. | -| `text` | `string \|array` | `''` | Either a string to be auto-typed, or an array of strings to be auto-typed. | | -| `startDelay` | `number` | `500` | Time (ms) before the auto-typer begins. | Number >= 0. | -| `betweenWordDelay` | `number` | `500` | Time (ms) before the next `text` string is typed. | Number >= 0. | -| `typingDelay` | `number` | `300` | Time (ms) between each character is typed. | Number >= 0. | -| `deletingDelay` | `number` | `100` | Time (ms) between each character is deleted after the text has been typed. | Number >= 0. | -| `waitBeforeDeleteDelay` | `number` | `500` | Time (ms) after the text has been typed before deleting it begins. | Number >= 0. | -| `startByDefault` | `bool` | `true` | Whether to start the auto-typer by default. If set to false, the `begin()` method must be called manually. | Number >= 0. | -| `repeat` | `bool` | `true` | Whether to repeat the text once all of them have been typed. | N/A. | | +| Prop | Type | Default | Description | Validation | +| :---------------------- | :----------------------- | :------ | :--------------------------------------------------------------------------------------------------------- | :-------------------------------------------------------------------------------------- | +| `componentTag` | `string` | 'span' | The HTML tag that the element will be. | Currently accepts any of the following: `span`, `p`, `a`, `h*` (where * is any number). | +| `beginningWord` | `string` | `''` | A string prepended to every text item. | N/A. | +| `writtenBeginningWord` | `string` | `''` | A word that will be typed when the auto-typer begins, and then will stay there. | N/A. | +| `text` | `string \|array` | `''` | Either a string to be auto-typed, or an array of strings to be auto-typed. | | +| `startDelay` | `number` | `500` | Time (ms) before the auto-typer begins. | Number >= 0. | +| `betweenWordDelay` | `number` | `500` | Time (ms) before the next `text` string is typed. | Number >= 0. | +| `typingDelay` | `number` | `300` | Time (ms) between each character is typed. | Number >= 0. | +| `deletingDelay` | `number` | `100` | Time (ms) between each character is deleted after the text has been typed. | Number >= 0. | +| `waitBeforeDeleteDelay` | `number` | `500` | Time (ms) after the text has been typed before deleting it begins. | Number >= 0. | +| `startByDefault` | `bool` | `true` | Whether to start the auto-typer by default. If set to false, the `begin()` method must be called manually. | Number >= 0. | +| `repeat` | `bool` | `true` | Whether to repeat the text once all of them have been typed. | N/A. | | ## Usage/Example ### Basic Example diff --git a/package.json b/package.json index 2bd4aa7..60b2411 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "auto-typer-vue3", - "version": "1.1.0", + "version": "1.1.1", "description": "A simple Autotyper for Vue 3, with some customisation options.", "keywords": [ "vue3", diff --git a/src/components/auto-typer-vue/AutoTyperVue.vue b/src/components/auto-typer-vue/AutoTyperVue.vue index 04bc6e9..36d307a 100644 --- a/src/components/auto-typer-vue/AutoTyperVue.vue +++ b/src/components/auto-typer-vue/AutoTyperVue.vue @@ -110,7 +110,11 @@ export default defineComponent({ // No word to write, stop here! return; } - for (let char of [...this.writtenBeginningWord]) { + let spacedWrittenBeginningWord = this.writtenBeginningWord.replace( + /\s/g, + "\xa0" + ); + for (let char of [...spacedWrittenBeginningWord]) { this.typedBeginningWord += char; await this.delay(this.typingDelay); }