From feeb2ca546e0dcaa09aeb7fd32916f503e71b85c Mon Sep 17 00:00:00 2001 From: Ross Williams Date: Wed, 3 Feb 2021 12:01:01 +0000 Subject: [PATCH 1/7] Switch to relative imports --- src/algorithms/organic.ts | 4 +-- src/algorithms/radial.ts | 2 +- src/algorithms/spiral.ts | 4 +-- src/classes/Letter.ts | 10 +++---- src/classes/Phrase.ts | 6 ++-- src/classes/Sentence.ts | 12 ++++---- src/classes/Word.ts | 10 +++---- src/collisions/CollisionsTest.vue | 2 +- src/components/App.vue | 14 ++++----- src/components/RenderedImage.vue | 4 +-- src/components/RenderedLetter.vue | 2 +- src/components/RenderedPhrase.vue | 4 +-- src/functions/alphabets.ts | 2 +- src/functions/blocks.ts | 6 ++-- src/functions/dPath.ts | 2 +- src/functions/draw.ts | 2 +- src/functions/tokenise.ts | 12 ++++---- src/index.ts | 6 ++-- src/store.ts | 8 +++--- src/types/phrases.ts | 2 +- src/types/state.ts | 4 +-- tsconfig.json | 16 ++--------- webpack.config.js | 48 +++++-------------------------- 23 files changed, 68 insertions(+), 114 deletions(-) diff --git a/src/algorithms/organic.ts b/src/algorithms/organic.ts index 6fb2064..29f6a92 100644 --- a/src/algorithms/organic.ts +++ b/src/algorithms/organic.ts @@ -1,8 +1,8 @@ import { Collisions } from "detect-collisions" import { range } from "lodash" -import { Sentence } from "@/classes/Sentence" -import { addRadialGeometry } from "@/algorithms/radial" +import { Sentence } from "../classes/Sentence" +import { addRadialGeometry } from "../algorithms/radial" export function addOrganicGeometry (sentence: Sentence): void { /** diff --git a/src/algorithms/radial.ts b/src/algorithms/radial.ts index 8b22368..7485396 100644 --- a/src/algorithms/radial.ts +++ b/src/algorithms/radial.ts @@ -1,4 +1,4 @@ -import { Sentence } from "@/classes/Sentence" +import { Sentence } from "../classes/Sentence" export function addRadialGeometry (sentence: Sentence, debug = true): void { /** diff --git a/src/algorithms/spiral.ts b/src/algorithms/spiral.ts index 6a5d202..da25c58 100644 --- a/src/algorithms/spiral.ts +++ b/src/algorithms/spiral.ts @@ -1,5 +1,5 @@ -import { Sentence } from "@/classes/Sentence" -import { getSpiralCoord } from '@/functions/geometry' +import { Sentence } from "../classes/Sentence" +import { getSpiralCoord } from '../functions/geometry' export function addSpiralGeometry (sentence: Sentence): void { /** diff --git a/src/classes/Letter.ts b/src/classes/Letter.ts index 1bfe31c..8299645 100644 --- a/src/classes/Letter.ts +++ b/src/classes/Letter.ts @@ -1,10 +1,10 @@ import { sum } from "lodash" -import { Settings } from '@/types/state' -import { TextNode } from '@/classes/Phrase' -import { Word } from '@/classes/Word' -import { Subletter } from '@/types/phrases' -import { circleIntersectionPoints } from '@/functions/geometry' +import { Settings } from '../types/state' +import { TextNode } from '../classes/Phrase' +import { Word } from '../classes/Word' +import { Subletter } from '../types/phrases' +import { circleIntersectionPoints } from '../functions/geometry' export class Letter extends TextNode { depth: "letter" diff --git a/src/classes/Phrase.ts b/src/classes/Phrase.ts index 5613de6..b00b642 100644 --- a/src/classes/Phrase.ts +++ b/src/classes/Phrase.ts @@ -1,8 +1,8 @@ import { compress } from "compress-tag" -import { Path } from '@/types/phrases' -import { Settings } from '@/types/state' -import { Sentence } from '@/classes/Sentence' +import { Path } from '../types/phrases' +import { Settings } from '../types/state' +import { Sentence } from '../classes/Sentence' type Point = { x: number, y: number } type Intent = { diff --git a/src/classes/Sentence.ts b/src/classes/Sentence.ts index 506d92c..9a7ade6 100644 --- a/src/classes/Sentence.ts +++ b/src/classes/Sentence.ts @@ -1,9 +1,9 @@ -import { Settings } from '@/types/state' -import { Phrase } from '@/classes/Phrase' -import { Word } from '@/classes/Word' -import { addRadialGeometry } from "@/algorithms/radial" -import { addOrganicGeometry } from "@/algorithms/organic" -import { addSpiralGeometry } from "@/algorithms/spiral" +import { Settings } from '../types/state' +import { Phrase } from '../classes/Phrase' +import { Word } from '../classes/Word' +import { addRadialGeometry } from "../algorithms/radial" +import { addOrganicGeometry } from "../algorithms/organic" +import { addSpiralGeometry } from "../algorithms/spiral" export class Sentence extends Phrase { depth: 'sentence' diff --git a/src/classes/Word.ts b/src/classes/Word.ts index 12d2ea3..95fb0df 100644 --- a/src/classes/Word.ts +++ b/src/classes/Word.ts @@ -1,8 +1,8 @@ -import { Settings } from '@/types/state' -import { Phrase } from '@/classes/Phrase' -import { Sentence } from '@/classes/Sentence' -import { Letter } from '@/classes/Letter' -import { letterDataFromBlock } from '@/functions/blocks'; +import { Settings } from '../types/state' +import { Phrase } from '../classes/Phrase' +import { Sentence } from '../classes/Sentence' +import { Letter } from '../classes/Letter' +import { letterDataFromBlock } from '../functions/blocks'; export class Word extends Phrase { depth: "word" diff --git a/src/collisions/CollisionsTest.vue b/src/collisions/CollisionsTest.vue index 794b9c9..9054abb 100644 --- a/src/collisions/CollisionsTest.vue +++ b/src/collisions/CollisionsTest.vue @@ -30,7 +30,7 @@ diff --git a/src/components/Footer.vue b/src/components/Footer.vue index e1e5ce9..9817f1b 100644 --- a/src/components/Footer.vue +++ b/src/components/Footer.vue @@ -35,17 +35,17 @@ diff --git a/src/components/RenderedImage.vue b/src/components/RenderedImage.vue index 629131d..0cb8000 100644 --- a/src/components/RenderedImage.vue +++ b/src/components/RenderedImage.vue @@ -20,20 +20,20 @@ diff --git a/src/components/RenderedLetter.vue b/src/components/RenderedLetter.vue index 77039bf..8119173 100644 --- a/src/components/RenderedLetter.vue +++ b/src/components/RenderedLetter.vue @@ -10,15 +10,15 @@ diff --git a/src/components/RenderedPhrase.vue b/src/components/RenderedPhrase.vue index 89d570e..403aec3 100644 --- a/src/components/RenderedPhrase.vue +++ b/src/components/RenderedPhrase.vue @@ -17,17 +17,17 @@ diff --git a/src/components/TextInput.vue b/src/components/TextInput.vue index 7198bb6..112403f 100644 --- a/src/components/TextInput.vue +++ b/src/components/TextInput.vue @@ -32,10 +32,10 @@ export default Vue.extend({ name: "TextInput", computed: { text: { - get(): string { + get (): string { return this.$store.state.text }, - set(text: string): void { + set (text: string): void { this.$store.dispatch("updateInputText", text) }, }, diff --git a/src/functions/alphabets.ts b/src/functions/alphabets.ts index b007f92..2138953 100644 --- a/src/functions/alphabets.ts +++ b/src/functions/alphabets.ts @@ -1,6 +1,6 @@ import { memoize, orderBy, pickBy, values } from "lodash" -import { AlphabetsData, LetterData, AlphabetData } from '../types/alphabets' +import { AlphabetsData, LetterData, AlphabetData } from "../types/alphabets" // Blocks: // s: circle intersects partially with line but is mostly enclosed @@ -14,7 +14,7 @@ const alphabets: AlphabetsData = { action: "create", letters: [ { value: "BUFFER", block: "buffer" }, - { value: "_", block: "buffer" }, + { value: "_", block: "buffer" }, ], }, @@ -22,27 +22,27 @@ const alphabets: AlphabetsData = { priority: 1, action: "create", letters: [ - { value: "B", block: "s", dots: 0, lines: 0 }, - { value: "D", block: "s", dots: 3, lines: 0 }, - { value: "F", block: "s", dots: 0, lines: 3 }, - { value: "G", block: "s", dots: 0, lines: 1 }, - { value: "H", block: "s", dots: 0, lines: 2 }, - { value: "J", block: "p", dots: 0, lines: 0 }, - { value: "K", block: "p", dots: 2, lines: 0 }, - { value: "L", block: "p", dots: 3, lines: 0 }, - { value: "M", block: "p", dots: 0, lines: 3 }, - { value: "N", block: "p", dots: 0, lines: 1 }, - { value: "P", block: "p", dots: 0, lines: 2 }, - { value: "T", block: "d", dots: 0, lines: 0 }, - { value: "R", block: "d", dots: 3, lines: 0 }, - { value: "S", block: "d", dots: 0, lines: 3 }, - { value: "V", block: "d", dots: 0, lines: 1 }, - { value: "W", block: "d", dots: 0, lines: 2 }, - { value: "Y", block: "f", dots: 2, lines: 0 }, - { value: "Z", block: "f", dots: 3, lines: 0 }, - { value: "X", block: "f", dots: 0, lines: 2 }, - { value: "C", block: "p", dots: 4, lines: 0 }, - { value: "Q", block: "f", dots: 4, lines: 0 }, + { value: "B", block: "s", dots: 0, lines: 0 }, + { value: "D", block: "s", dots: 3, lines: 0 }, + { value: "F", block: "s", dots: 0, lines: 3 }, + { value: "G", block: "s", dots: 0, lines: 1 }, + { value: "H", block: "s", dots: 0, lines: 2 }, + { value: "J", block: "p", dots: 0, lines: 0 }, + { value: "K", block: "p", dots: 2, lines: 0 }, + { value: "L", block: "p", dots: 3, lines: 0 }, + { value: "M", block: "p", dots: 0, lines: 3 }, + { value: "N", block: "p", dots: 0, lines: 1 }, + { value: "P", block: "p", dots: 0, lines: 2 }, + { value: "T", block: "d", dots: 0, lines: 0 }, + { value: "R", block: "d", dots: 3, lines: 0 }, + { value: "S", block: "d", dots: 0, lines: 3 }, + { value: "V", block: "d", dots: 0, lines: 1 }, + { value: "W", block: "d", dots: 0, lines: 2 }, + { value: "Y", block: "f", dots: 2, lines: 0 }, + { value: "Z", block: "f", dots: 3, lines: 0 }, + { value: "X", block: "f", dots: 0, lines: 2 }, + { value: "C", block: "p", dots: 4, lines: 0 }, + { value: "Q", block: "f", dots: 4, lines: 0 }, ], }, @@ -50,11 +50,11 @@ const alphabets: AlphabetsData = { priority: 1, action: "attach", letters: [ - { value: "A", block: "v", vert: -1, line: 0 }, - { value: "E", block: "v", vert: 0, line: 0 }, - { value: "I", block: "v", vert: 0, line: 1 }, - { value: "O", block: "v", vert: 1, line: 0 }, - { value: "U", block: "v", vert: 0, line: -1 }, + { value: "A", block: "v", vert: -1, line: 0 }, + { value: "E", block: "v", vert: 0, line: 0 }, + { value: "I", block: "v", vert: 0, line: 1 }, + { value: "O", block: "v", vert: 1, line: 0 }, + { value: "U", block: "v", vert: 0, line: -1 }, ], }, @@ -76,7 +76,7 @@ const alphabets: AlphabetsData = { // Why waste time calling this function over and over for the same parameters? // memoize caches the results per input value -const getLetters = memoize(function getLetters( +const getLetters = memoize(function getLetters ( wantedAlphabets: string[], ): LetterData[] { /** @@ -91,22 +91,22 @@ const getLetters = memoize(function getLetters( // Extract the data that has been requested alphabetsData = pickBy( alphabetsData, - (_, key) => wantedAlphabets.includes(key) + (_, key) => wantedAlphabets.includes(key), ) // Sort the results into priority order const alphabetsByPriority: AlphabetData[] = orderBy( values(alphabetsData), (alphabet: AlphabetData) => alphabet.priority, - 'desc' + "desc", ) // Get the letters array, with the action attached to each letter const lettersByPriority: LetterData[][] = alphabetsByPriority.map( (alphabet: AlphabetData) => { alphabet.letters = alphabet.letters.map( - (letter: LetterData) => ({ ...letter, action: alphabet.action }) + (letter: LetterData) => ({ ...letter, action: alphabet.action }), ) return alphabet.letters - } + }, ) const combinedAlphabetData: LetterData[] = lettersByPriority.flat() return combinedAlphabetData diff --git a/src/functions/blocks.ts b/src/functions/blocks.ts index f4be980..7c95c1a 100644 --- a/src/functions/blocks.ts +++ b/src/functions/blocks.ts @@ -1,6 +1,6 @@ -import { BlockName } from '../types/alphabets' -import { Settings } from '../types/state' -import { Letter } from '../classes/Letter' +import { BlockName } from "../types/alphabets" +import { Settings } from "../types/state" +import { Letter } from "../classes/Letter" type BlockSetting = { height?: number @@ -12,7 +12,7 @@ type BlockSettings = { [block in BlockName]: BlockSetting } -export function letterDataFromBlock( +export function letterDataFromBlock ( letter: Letter, settings: Settings, ): void { @@ -54,7 +54,7 @@ export function letterDataFromBlock( relativeAngularSize: 1, }, buffer: { - relativeAngularSize: settings.config.buffer.letter + relativeAngularSize: settings.config.buffer.letter, }, } diff --git a/src/functions/box.ts b/src/functions/box.ts index 0dcb802..1f79eca 100644 --- a/src/functions/box.ts +++ b/src/functions/box.ts @@ -1,16 +1,16 @@ -export function fixBoundingBox(): void { +export function fixBoundingBox (): void { /** * Sets the bounding box of the rendered SVG to neatly contain its contents. */ setTimeout(() => { - const svgs: NodeListOf = document.querySelectorAll("#render"); + const svgs: NodeListOf = document.querySelectorAll("#render") // Get internal size of SVG svgs.forEach(svg => { - const bbox = svg.getBBox(); + const bbox = svg.getBBox() // Construct and set a viewBox for the SVG const bboxSize = Math.max(bbox.width, bbox.height) - const viewBox = [bbox.x, bbox.y, bboxSize, bboxSize].join(" "); - svg.setAttribute("viewBox", viewBox); + const viewBox = [bbox.x, bbox.y, bboxSize, bboxSize].join(" ") + svg.setAttribute("viewBox", viewBox) }) - }, 1); + }, 1) } diff --git a/src/functions/dPath.ts b/src/functions/dPath.ts index fa3f058..cbb2ee3 100644 --- a/src/functions/dPath.ts +++ b/src/functions/dPath.ts @@ -1,8 +1,8 @@ -import { Path } from '../types/phrases' +import { Path } from "../types/phrases" export interface SVGPath { d: string - 'stroke-width'?: number + "stroke-width"?: number stroke?: string } @@ -33,13 +33,13 @@ export function makePaths ( }) // Parse debug paths return paths.filter((pathInfo: Path) => { - return debug || pathInfo.type !== 'debug' + return debug || pathInfo.type !== "debug" }).map((pathInfo: Path) => { const path: SVGPath = { d: pathInfo.d } if (pathInfo.type === "debug") { - path['stroke-width'] = 0.5 + path["stroke-width"] = 0.5 if (pathInfo.purpose) { - path['stroke'] = debugPurposes[pathInfo.purpose].colour + path.stroke = debugPurposes[pathInfo.purpose].colour } } return path diff --git a/src/functions/draw.ts b/src/functions/draw.ts index dd76227..0cc0b47 100644 --- a/src/functions/draw.ts +++ b/src/functions/draw.ts @@ -1,6 +1,6 @@ -import { Sentence } from '../classes/Sentence' +import { Sentence } from "../classes/Sentence" -export function drawTokenisedInput( +export function drawTokenisedInput ( tokenisedInput: Sentence[], ): Sentence[] { /** diff --git a/src/functions/geometry.ts b/src/functions/geometry.ts index ce4046d..94a655f 100644 --- a/src/functions/geometry.ts +++ b/src/functions/geometry.ts @@ -1,4 +1,4 @@ -export function getSpiralCoord( +export function getSpiralCoord ( rungWidth: number, pointSpacing: number, totalPoints: number, @@ -23,41 +23,37 @@ export function getSpiralCoord( // Parametric equations to render the spiral const x = - (rungWidth / (2 * Math.PI) - * + (rungWidth / (2 * Math.PI) * Math.sqrt( - (2 * pointSpacing * selectedPoint) / (rungWidth / (2 * Math.PI)) - ) - * + (2 * pointSpacing * selectedPoint) / (rungWidth / (2 * Math.PI)), + ) * Math.cos( Math.sqrt( - (2 * pointSpacing * selectedPoint) / (rungWidth / (2 * Math.PI)) + (2 * pointSpacing * selectedPoint) / (rungWidth / (2 * Math.PI)), ) - - (Math.PI/2) - + (Math.PI / 2) - Math.sqrt( - (2 * pointSpacing * totalPoints) / (rungWidth / (2 * Math.PI)) - ) + (2 * pointSpacing * totalPoints) / (rungWidth / (2 * Math.PI)), + ), ) - (rungWidth / 4) - ) * multiplier + ) * multiplier const y = ( - (rungWidth / (2 * Math.PI)) - * + (rungWidth / (2 * Math.PI)) * Math.sqrt( - (2 * pointSpacing * selectedPoint) / (rungWidth / (2 * Math.PI)) - ) - * + (2 * pointSpacing * selectedPoint) / (rungWidth / (2 * Math.PI)), + ) * Math.sin( Math.sqrt( - (2 * pointSpacing * selectedPoint) / (rungWidth / (2 * Math.PI)) + (2 * pointSpacing * selectedPoint) / (rungWidth / (2 * Math.PI)), ) + - (Math.PI/2) - + (Math.PI / 2) - Math.sqrt( - (2 * pointSpacing * totalPoints) / (rungWidth / (2 * Math.PI)) - ) + (2 * pointSpacing * totalPoints) / (rungWidth / (2 * Math.PI)), + ), ) + - rungWidth/4 + rungWidth / 4 ) * multiplier return [-x, -y] @@ -65,7 +61,7 @@ export function getSpiralCoord( // why are they both negative? I do not know. but it works. } -export function circleIntersectionPoints( +export function circleIntersectionPoints ( x0: number, y0: number, r0: number, @@ -94,9 +90,9 @@ export function circleIntersectionPoints( const rx = -dy * (h / d) const ry = dx * (h / d) const xi = x2 + rx - const xi_prime = x2 - rx + const xiPrime = x2 - rx const yi = y2 + ry - const yi_prime = y2 - ry - return [xi, xi_prime, yi, yi_prime] - // xi is positive, xi_prime is negative for the word-letter situation + const yiPrime = y2 - ry + return [xi, xiPrime, yi, yiPrime] + // xi is positive, xiPrime is negative for the word-letter situation } diff --git a/src/functions/tokenise.ts b/src/functions/tokenise.ts index 3625193..2bab7a6 100644 --- a/src/functions/tokenise.ts +++ b/src/functions/tokenise.ts @@ -1,9 +1,9 @@ -import { Settings } from '../types/state' -import { LetterData } from '../types/alphabets' -import { Sentence } from '../classes/Sentence' -import { Word } from '../classes/Word' -import { Letter } from '../classes/Letter' -import { getLetters } from '../functions/alphabets' +import { Settings } from "../types/state" +import { LetterData } from "../types/alphabets" +import { Sentence } from "../classes/Sentence" +import { Word } from "../classes/Word" +import { Letter } from "../classes/Letter" +import { getLetters } from "../functions/alphabets" let ID_COUNTER = 0 @@ -13,7 +13,7 @@ export function tokeniseSentence ( alphabets: string[], settings: Settings, ): Sentence[] -export function tokeniseSentence( +export function tokeniseSentence ( sentence: string, splitBy: string[], alphabets: string[], @@ -53,21 +53,21 @@ export function tokeniseSentence( return new Sentence( ID_COUNTER++, settings, - tokeniseSentence(phrase, splitBy.slice(1), alphabets, settings) + tokeniseSentence(phrase, splitBy.slice(1), alphabets, settings), ) } else { // The delimiters have been used up, so sentence is a word. return new Word( ID_COUNTER++, settings, - tokeniseAWordIntoLetters(phrase, alphabets, settings) + tokeniseAWordIntoLetters(phrase, alphabets, settings), ) } }) return phrases } -function tokeniseAWordIntoLetters( +function tokeniseAWordIntoLetters ( word: string, alphabets: string[], settings: Settings, @@ -114,7 +114,7 @@ function tokeniseAWordIntoLetters( // Add a buffer letter after each letter subletterCharacters = subletterCharacters.map( - characters => [characters, ["BUFFER"]] + characters => [characters, ["BUFFER"]], ).flat() // Convert subletter characters to subletters @@ -125,19 +125,19 @@ function tokeniseAWordIntoLetters( characters.map( (character: string) => { return { - depth: 'subletter', + depth: "subletter", ...getLetters(alphabets).find( - (letter) => letter.value === character - )! + (letter) => letter.value === character, + )!, } - } - ) + }, + ), ) }) return letters } -function skimACharacterFromAWord( +function skimACharacterFromAWord ( word: string, alphabets: string[], ): string | null { @@ -158,7 +158,7 @@ function skimACharacterFromAWord( return null } -function skimSubletterCharactersFromCharacters( +function skimSubletterCharactersFromCharacters ( characters: string[], alphabets: string[], ): string[] { diff --git a/src/index.ts b/src/index.ts index 71d3e9f..5a30244 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,20 +1,20 @@ -import './root.scss' +import "./root.scss" import Vue from "vue" -import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome' +import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome" -import App from './components/App.vue' -import store from './store' +import App from "./components/App.vue" +import store from "./store" -Vue.component('font-awesome-icon', FontAwesomeIcon) +Vue.component("font-awesome-icon", FontAwesomeIcon) -const vm = new Vue({ - el: '#app', - template: '', +new Vue({ // eslint-disable-line no-new + el: "#app", + template: "", components: { App }, render: h => h(App), store, - mounted() { - this.$store.dispatch("updateInputText", "Gallifreyo Test") - } + mounted () { + return this.$store.dispatch("updateInputText", "Gallifreyo Test") + }, }) diff --git a/src/shims-raw-loader.d.ts b/src/shims-raw-loader.d.ts index 3417a40..1cc34d2 100644 --- a/src/shims-raw-loader.d.ts +++ b/src/shims-raw-loader.d.ts @@ -1,4 +1,4 @@ -declare module '!!raw-loader!*' { +declare module "!!raw-loader!*" { const contents: string export = contents } diff --git a/src/shims-vue.d.ts b/src/shims-vue.d.ts index d9f24fa..b399827 100644 --- a/src/shims-vue.d.ts +++ b/src/shims-vue.d.ts @@ -1,4 +1,4 @@ -declare module '*.vue' { - import Vue from 'vue' +declare module "*.vue" { + import Vue from "vue" export default Vue } diff --git a/src/store.ts b/src/store.ts index c593b30..0bea115 100644 --- a/src/store.ts +++ b/src/store.ts @@ -2,21 +2,21 @@ import Vue from "vue" import Vuex from "vuex" import { setWith } from "lodash" -import { State } from './types/state' -import { tokeniseSentence } from './functions/tokenise' -import { drawTokenisedInput } from './functions/draw' -import { fixBoundingBox } from './functions/box' +import { State } from "./types/state" +import { tokeniseSentence } from "./functions/tokenise" +import { drawTokenisedInput } from "./functions/draw" +import { fixBoundingBox } from "./functions/box" Vue.use(Vuex) export default new Vuex.Store({ - strict: process.env.NODE_ENV !== 'production', + strict: process.env.NODE_ENV !== "production", state: { text: "", alphabets: {}, phrases: [], settings: { - splits: [ "\n\n", "\n", " " ], + splits: ["\n\n", "\n", " "], selectedAlphabets: ["base", "Sherman", "ShermanVowels"], scaling: true, // sentence size scaling watermark: true, @@ -36,12 +36,12 @@ export default new Vuex.Store({ buffer: { letter: 0.5, word: 0.2, sentence: 0.05 }, automatic: { scaledLessThan: 6, spiralMoreThan: 9 }, sizeScaling: 1, - positionAlgorithm: 'Automatic', + positionAlgorithm: "Automatic", }, }, } as State, mutations: { - transliterate(state: State) { + transliterate (state: State) { state.phrases = [] state.phrases = drawTokenisedInput( tokeniseSentence( @@ -53,25 +53,26 @@ export default new Vuex.Store({ ) fixBoundingBox() }, - modifyInput(state: State, newInput: string) { + modifyInput (state: State, newInput: string) { state.text = newInput }, - modifySingleSetting(state: State, { prop, value }) { + modifySingleSetting (state: State, { prop, value }) { setWith(state, prop, value, (nsValue, key, nsObject) => { return Vue.set(nsObject, key, nsValue) }) }, }, actions: { - updateInputText({ commit }, inputText: string) { + updateInputText ({ commit }, inputText: string) { commit("modifyInput", inputText) commit("transliterate") }, - updateSingleSetting({ commit }, { prop, value }) { + updateSingleSetting ( + { commit }, { prop, value }: { prop: string, value: string }, + ) { prop = `settings.${prop}` commit("modifySingleSetting", { prop, value }) commit("transliterate") }, }, }) - diff --git a/src/types/phrases.ts b/src/types/phrases.ts index 5c92953..0b13b12 100644 --- a/src/types/phrases.ts +++ b/src/types/phrases.ts @@ -1,4 +1,4 @@ -import { LetterData } from '../types/alphabets' +import { LetterData } from "../types/alphabets" /* * Tokenised and Rendered Input diff --git a/src/types/state.ts b/src/types/state.ts index 3e45ecd..c2f8255 100644 --- a/src/types/state.ts +++ b/src/types/state.ts @@ -1,5 +1,5 @@ -import { AlphabetsData } from '../types/alphabets' -import { Sentence } from '../classes/Sentence' +import { AlphabetsData } from "../types/alphabets" +import { Sentence } from "../classes/Sentence" /* * State @@ -42,12 +42,12 @@ export type Config = { buffer: BufferConfig automatic: AutomaticConfig sizeScaling: number - positionAlgorithm: 'Automatic' | 'Radial' | 'Organic' | 'Spiral' + positionAlgorithm: "Automatic" | "Radial" | "Organic" | "Spiral" } export type BlockConfig = { - height: number // Height of this letter above (inside) the word circle - width: number // The base relativeAngularSize for a letter in this block + height: number // Height of this letter above (inside) the word circle + width: number // The base relativeAngularSize for a letter in this block } export type VowelBlockConfig = BlockConfig & { From 2f688fb347713944fcfc53139a08ac3df9335815 Mon Sep 17 00:00:00 2001 From: Ross Williams Date: Wed, 3 Feb 2021 13:50:35 +0000 Subject: [PATCH 5/7] Fix JSDoc comments --- src/algorithms/organic.ts | 24 +++++++-------- src/algorithms/radial.ts | 26 ++++++++--------- src/algorithms/spiral.ts | 20 ++++++------- src/classes/Letter.ts | 30 +++++++++---------- src/classes/Phrase.ts | 48 +++++++++++++++--------------- src/classes/Sentence.ts | 45 ++++++++++++++-------------- src/classes/Word.ts | 24 +++++++-------- src/collisions/circles.ts | 6 ++-- src/functions/alphabets.ts | 60 ++++++++++++++++++++------------------ src/functions/blocks.ts | 23 +++++++-------- src/functions/box.ts | 6 ++-- src/functions/dPath.ts | 6 ++-- src/functions/draw.ts | 14 ++++----- src/functions/geometry.ts | 46 ++++++++++++++--------------- src/functions/tokenise.ts | 60 +++++++++++++++++++------------------- 15 files changed, 219 insertions(+), 219 deletions(-) diff --git a/src/algorithms/organic.ts b/src/algorithms/organic.ts index a7ef531..352f492 100644 --- a/src/algorithms/organic.ts +++ b/src/algorithms/organic.ts @@ -4,19 +4,19 @@ import { range } from "lodash" import { Sentence } from "../classes/Sentence" import { addRadialGeometry } from "../algorithms/radial" +/** + * An advanced positioning algorithm that extends the radial algorithm. + * Each subphrase is initially placed around a circle, and then they are all + * grown simultaneously, pushing each other aside until they occupy as much + * space as possible. + * + * Size scaling affects the initial size of each subphrase and the initial + * angle allocated for its growth. + * + * Works well for medium-to-low length phrases. Much slower than the other + * algorithms. + */ export function addOrganicGeometry (sentence: Sentence): void { - /** - * An advanced positioning algorithm that extends the radial algorithm. - * Each subphrase is initially placed around a circle, and then they are all - * grown simultaneously, pushing each other aside until they occupy as much - * space as possible. - * - * Size scaling affects the initial size of each subphrase and the initial - * angle allocated for its growth. - * - * Works well for medium-to-low length phrases. Much slower than the other - * algorithms. - */ const collisions = new Collisions() const result = collisions.createResult() const boundaryResolution = 16 diff --git a/src/algorithms/radial.ts b/src/algorithms/radial.ts index cc9578a..8731e1c 100644 --- a/src/algorithms/radial.ts +++ b/src/algorithms/radial.ts @@ -1,19 +1,19 @@ import { Sentence } from "../classes/Sentence" +/** + * The basic positioning algorithm. Each subphrase is placed around a + * circle, taking up as much space as possible in its allocated segment. + * + * Size scaling affects the angle subtended by each phrase within the + * circle. + * + * Works well at low disparity. Much faster than the organic algorithm. + * + * @param debug - Boolean; whether or not to draw debug lines. Debug lines + * are not desirable if this function is only being used to calculate initial + * geometry à la the organic algorithm. + */ export function addRadialGeometry (sentence: Sentence, debug = true): void { - /** - * The basic positioning algorithm. Each subphrase is placed around a - * circle, taking up as much space as possible in its allocated segment. - * - * Size scaling affects the angle subtended by each phrase within the - * circle. - * - * Works well at low disparity. Much faster than the organic algorithm. - * - * @param debug: Boolean; whether or not to draw debug lines. Debug lines are - * not desirable if this function is only being used to calculate initial - * geometry à la the organic algorithm. - */ sentence.phrases.forEach((phrase, index) => { // Calculate the angle subtended by the subphrase's radius const radialSubtension = phrase.absoluteAngularSize! / 2 diff --git a/src/algorithms/spiral.ts b/src/algorithms/spiral.ts index 439a6df..e3da6a8 100644 --- a/src/algorithms/spiral.ts +++ b/src/algorithms/spiral.ts @@ -1,17 +1,17 @@ import { Sentence } from "../classes/Sentence" import { getSpiralCoord } from "../functions/geometry" +/** + * An advanced positioning algorithm. Places each subphrase on the path of + * a spiral. This makes good use of the normally-unused space in the + * middle of the phrase. + * + * Size-scaling affects the length of the spiral that the subphrase takes + * up, though this can cause it to overlap with neighbouring rungs. + * + * Works well for very long phrases. + */ export function addSpiralGeometry (sentence: Sentence): void { - /** - * An advanced positioning algorithm. Places each subphrase on the path of - * a spiral. This makes good use of the normally-unused space in the - * middle of the phrase. - * - * Size-scaling affects the length of the spiral that the subphrase takes - * up, though this can cause it to overlap with neighbouring rungs. - * - * Works well for very long phrases. - */ // Spiral buffer is both the distance between spiral rungs and the // distance between words, to ensure visually consistent spacing. const spiralBuffer = 1 + sentence.settings.config.buffer.word diff --git a/src/classes/Letter.ts b/src/classes/Letter.ts index 86d6391..05c0e33 100644 --- a/src/classes/Letter.ts +++ b/src/classes/Letter.ts @@ -20,15 +20,15 @@ export class Letter extends TextNode { this.subletters = subletters } + /** + * Generates the SVG path for a given letter and attaches it as letter.d. + * + * @param word - The word that contains this letter. + * @param angleSubtendedByVowel - The absolute angle to be subtended by a + * vowel for this word. + * @returns void; letter retains path information. + */ draw (word: Word, angleSubtendedByVowel: number): void { - /** - * Generates the SVG path for a given letter and attaches it as letter.d. - * - * @param word: The word that contains this letter. - * @param angleSubtendedByVowel: The absolute angle to be subtended by a - * vowel for this word. - * @returns void; letter retains path information. - */ const subletters = this.subletters // The width of this letter as an angle @@ -227,14 +227,14 @@ export class Letter extends TextNode { ) } + /** + * Set the angular location of this letter based on its position in the + * word. + * + * @param word - The word that contains this letter. + * @param index - The index of this letter in the word. + */ addAngularLocation (word: Word, index: number): void { - /** - * Set the angular location of this letter based on its position in the - * word. - * - * @param word: The word that contains this letter. - * @param index: The index of this letter in the word. - */ this.angularLocation = ( word.phrases.slice(0, index + 1).reduce((total, letter) => { return total + letter.subletters[0].absoluteAngularSize! diff --git a/src/classes/Phrase.ts b/src/classes/Phrase.ts index 2e2270e..9dc5128 100644 --- a/src/classes/Phrase.ts +++ b/src/classes/Phrase.ts @@ -10,10 +10,10 @@ type Intent = { purpose?: "angle" | "position" | "circle" } +/** + * Base class for all written nodes. + */ export abstract class TextNode { - /** - * Base class for all written nodes. - */ id: number settings: Settings angularLocation?: number @@ -25,14 +25,14 @@ export abstract class TextNode { this.paths = [] } + /** + * Draw a circle of a radius around a point. + */ drawCircle ( centre: Point, radius: number, intent: Intent = { type: "default" }, ): void { - /** - * Draw a circle of a radius around a point. - */ const path = compress` M ${centre.x} ${centre.y} m -${radius} 0 @@ -41,6 +41,9 @@ export abstract class TextNode { this.paths.push({ d: path, ...intent }) } + /** + * Draw a curve between two points of known radius. + */ drawArc ( from: Point, to: Point, @@ -48,9 +51,6 @@ export abstract class TextNode { { largeArc, sweep }: { largeArc: boolean, sweep: boolean }, intent: Intent = { type: "default" }, ): void { - /** - * Draw a curve between two points of known radius. - */ const path = compress` M ${from.x} ${from.y} A ${radius} ${radius} 0 ${largeArc ? "1" : "0"} ${sweep ? "1" : "0"} @@ -58,23 +58,23 @@ export abstract class TextNode { this.paths.push({ d: path, ...intent }) } + /** + * Draw a line between two points. + */ drawLine ( from: Point, to: Point, intent: Intent = { type: "default" }, ): void { - /** - * Draw a line between two points. - */ const path = `M ${from.x} ${from.y} L ${to.x} ${to.y}` this.paths.push({ d: path, ...intent }) } } +/** + * Base class for sentences and words. + */ export abstract class Phrase extends TextNode { - /** - * Base class for sentences and words. - */ relativeAngularSize?: number absoluteAngularSize?: number x: number @@ -91,16 +91,16 @@ export abstract class Phrase extends TextNode { this.radius = 100 } + /** + * Set the angular location of this subphrase based on its position in the + * parent phrase. + * + * Used for positioning in the Radial and Organic algorithms. + * + * @param parent - The sentence that contains this phrase. + * @param index - The index of this letter in the word. + */ addAngularLocation (parent: Sentence, index: number): void { - /** - * Set the angular location of this subphrase based on its position in the - * parent phrase. - * - * Used for positioning in the Radial and Organic algorithms. - * - * @param parent: The sentence that contains this phrase. - * @param index: The index of this letter in the word. - */ this.angularLocation = ( parent.phrases.slice(0, index + 1).reduce( (total, phrase) => { diff --git a/src/classes/Sentence.ts b/src/classes/Sentence.ts index ad15bb6..bb4bfe0 100644 --- a/src/classes/Sentence.ts +++ b/src/classes/Sentence.ts @@ -42,11 +42,11 @@ export class Sentence extends Phrase { this.phrases.forEach(phrase => phrase.draw()) } + /** + * Sets the relative angular size on each subphrase, normalised such that + * they average to 1. + */ addRelativeAngularSizes (): void { - /** - * Sets the relative angular size on each subphrase, normalised such that - * they average to 1. - */ this.phrases.forEach(phrase => { phrase.relativeAngularSize = Math.pow( phrase.phrases.length, this.settings.config.sizeScaling, @@ -68,12 +68,12 @@ export class Sentence extends Phrase { }) } + /** + * Convert relative angular sizes on subphrases to absolute angular sizes. + * + * TODO This will fail when the relative angular sizes do not average to 1. + */ addAbsoluteAngularSizes (relativeAngularSizeSum: number): void { - /** - * Convert relative angular sizes on subphrases to absolute angular sizes. - * - * TODO This will fail when the relative angular sizes do not average to 1. - */ this.phrases.forEach((phrase) => { phrase.absoluteAngularSize = ( phrase.relativeAngularSize! * 2 * Math.PI / relativeAngularSizeSum @@ -81,26 +81,25 @@ export class Sentence extends Phrase { }) } + /** + * Calculate the radius of this sentence from the buffer radius. + */ addRadiusFromBuffer (parent: Sentence): void { - /** - * Calculate the radius of this sentence from the buffer radius. - */ const bufferWidth = parent.radius * this.settings.config.buffer.sentence this.radius = this.bufferRadius - bufferWidth } + /** + * Calculates the geometry of each of this sentence's subphrases. + * + * 'Geometry' refers to the x, y, and properties of a phrase, with + * angularLocation sometimes being used as an intermediary property. + * + * This method selects a positioning algorithm and then executes it. + * + * @returns void; Modifies the subphrase in place to add x, y, and radius + */ addGeometry (): void { - /** - * Calculates the geometry of each of this sentence's subphrases. - * - * 'Geometry' refers to the x, y, and properties of a phrase, with - * angularLocation sometimes being used as an intermediary property. - * - * This method selects a positioning algorithm and then executes it. - * - * @returns void; Modifies the subphrase in place to add x, y, and radius - */ - // Get the global default algorithm let positionAlgorithm = this.settings.config.positionAlgorithm diff --git a/src/classes/Word.ts b/src/classes/Word.ts index 51d8175..8cad285 100644 --- a/src/classes/Word.ts +++ b/src/classes/Word.ts @@ -52,19 +52,19 @@ export class Word extends Phrase { }) } + /** + * Add letter data from the block presets. + */ addBlockDataToLetters (): void { - /** - * Add letter data from the block presets. - */ this.phrases.forEach((letter) => { letterDataFromBlock(letter, this.settings) }) } + /** + * Convert relative angular sizes on letters to absolute angular sizes. + */ addAbsoluteAngularSizes (relativeAngularSizeSum: number): void { - /** - * Convert relative angular sizes on letters to absolute angular sizes. - */ this.phrases.forEach((letter) => { letter.subletters[0].absoluteAngularSize = ( letter.subletters[0].relativeAngularSize! * 2 * Math.PI / @@ -73,13 +73,13 @@ export class Word extends Phrase { }) } + /** + * Calculate the radius of this sentence from the buffer radius. + * + * Parent is passed to this for consistency with the same method on + * Sentence, as they are not distinguishable. + */ addRadiusFromBuffer (_parent: Sentence): void { - /** - * Calculate the radius of this sentence from the buffer radius. - * - * Parent is passed to this for consistency with the same method on - * Sentence, as they are not distinguishable. - */ this.radius = this.bufferRadius * (1 - this.settings.config.buffer.word) } } diff --git a/src/collisions/circles.ts b/src/collisions/circles.ts index 798acfc..bdb7dd2 100644 --- a/src/collisions/circles.ts +++ b/src/collisions/circles.ts @@ -68,10 +68,10 @@ export class GrowingCirclesTest { } } + /** + * Generate, position and size the word circles. + */ createCircles (): void { - /** - * Generate, position and size the word circles. - */ // Clear all existing circles from the screen. this.bodies.forEach(body => body.remove()) this.bodies = [] diff --git a/src/functions/alphabets.ts b/src/functions/alphabets.ts index 2138953..b822039 100644 --- a/src/functions/alphabets.ts +++ b/src/functions/alphabets.ts @@ -76,40 +76,42 @@ const alphabets: AlphabetsData = { // Why waste time calling this function over and over for the same parameters? // memoize caches the results per input value -const getLetters = memoize(function getLetters ( - wantedAlphabets: string[], -): LetterData[] { +const getLetters = memoize( /** * Selects alphabets from the alphabet data file and returns their letters in * order of priority, to be passed to the tokeniser. * - * @param wantedAlphabets: list of alphabet names that are wanted + * @param wantedAlphabets - list of alphabet names that are wanted * @returns all letters from the selected alphabets in priority order */ - // Get all data from the config file - let alphabetsData: AlphabetsData = alphabets - // Extract the data that has been requested - alphabetsData = pickBy( - alphabetsData, - (_, key) => wantedAlphabets.includes(key), - ) - // Sort the results into priority order - const alphabetsByPriority: AlphabetData[] = orderBy( - values(alphabetsData), - (alphabet: AlphabetData) => alphabet.priority, - "desc", - ) - // Get the letters array, with the action attached to each letter - const lettersByPriority: LetterData[][] = alphabetsByPriority.map( - (alphabet: AlphabetData) => { - alphabet.letters = alphabet.letters.map( - (letter: LetterData) => ({ ...letter, action: alphabet.action }), - ) - return alphabet.letters - }, - ) - const combinedAlphabetData: LetterData[] = lettersByPriority.flat() - return combinedAlphabetData -}) + function getLetters ( + wantedAlphabets: string[], + ): LetterData[] { + // Get all data from the config file + let alphabetsData: AlphabetsData = alphabets + // Extract the data that has been requested + alphabetsData = pickBy( + alphabetsData, + (_, key) => wantedAlphabets.includes(key), + ) + // Sort the results into priority order + const alphabetsByPriority: AlphabetData[] = orderBy( + values(alphabetsData), + (alphabet: AlphabetData) => alphabet.priority, + "desc", + ) + // Get the letters array, with the action attached to each letter + const lettersByPriority: LetterData[][] = alphabetsByPriority.map( + (alphabet: AlphabetData) => { + alphabet.letters = alphabet.letters.map( + (letter: LetterData) => ({ ...letter, action: alphabet.action }), + ) + return alphabet.letters + }, + ) + const combinedAlphabetData: LetterData[] = lettersByPriority.flat() + return combinedAlphabetData + }, +) export { getLetters } diff --git a/src/functions/blocks.ts b/src/functions/blocks.ts index 7c95c1a..0420387 100644 --- a/src/functions/blocks.ts +++ b/src/functions/blocks.ts @@ -12,22 +12,21 @@ type BlockSettings = { [block in BlockName]: BlockSetting } +/** + * Takes a letter with tokenised subletters (i.e. subletters that do not yet + * have intermediary data attached to them). Then, from their block (which + * was always a placeholder to represent later configuration), supply that + * block's configuration. + * + * Attaches intermediary data to subletters. Modifies letter in place. + * + * @param letter - The letter to be given block data. + * @returns void; modifies letters in place. + */ export function letterDataFromBlock ( letter: Letter, settings: Settings, ): void { - /** - * Takes a letter with tokenised subletters (i.e. subletters that do not yet - * have intermediary data attached to them). Then, from their block (which - * was always a placeholder to represent later configuration), supply that - * block's configuration. - * - * Attaches intermediary data to subletters. Modifies letter in place. - * - * @param letter: The letter to be given block data. - * @returns void; modifies letters in place. - */ - const BLOCK_SETTINGS: BlockSettings = { s: { height: settings.config.s.height, diff --git a/src/functions/box.ts b/src/functions/box.ts index 1f79eca..26111f9 100644 --- a/src/functions/box.ts +++ b/src/functions/box.ts @@ -1,7 +1,7 @@ +/** + * Sets the bounding box of the rendered SVG to neatly contain its contents. + */ export function fixBoundingBox (): void { - /** - * Sets the bounding box of the rendered SVG to neatly contain its contents. - */ setTimeout(() => { const svgs: NodeListOf = document.querySelectorAll("#render") // Get internal size of SVG diff --git a/src/functions/dPath.ts b/src/functions/dPath.ts index cbb2ee3..9f0cdb2 100644 --- a/src/functions/dPath.ts +++ b/src/functions/dPath.ts @@ -12,13 +12,13 @@ const debugPurposes = { circle: { colour: "limegreen", priority: 0 }, } +/** + * Converts a list of paths to SVG paths. + */ export function makePaths ( paths: Path[], debug: boolean, ): SVGPath[] { - /** - * Converts a list of paths to SVG paths. - */ // Put default paths on top of debug paths paths = [...paths].sort((a, b) => { // Default always comes first diff --git a/src/functions/draw.ts b/src/functions/draw.ts index 0cc0b47..a939e4d 100644 --- a/src/functions/draw.ts +++ b/src/functions/draw.ts @@ -1,15 +1,15 @@ import { Sentence } from "../classes/Sentence" +/** + * Renders the tokenised input into an SVG image. + * + * @param tokenisedInput - The tokenised input. + * @param settings - The settings object, for configuration. + * @returns Data to form the final SVG image. + */ export function drawTokenisedInput ( tokenisedInput: Sentence[], ): Sentence[] { - /** - * Renders the tokenised input into an SVG image. - * - * @param tokenisedInput: The tokenised input. - * @param settings: The settings object, for configuration. - * @returns Data to form the final SVG image. - */ // XXX Because a list of phrases is being passed to this, each one will be // rendered identically. This is not desirable - at the top level, each // phrase is a different paragraphs, and this means that each paragraph will diff --git a/src/functions/geometry.ts b/src/functions/geometry.ts index 94a655f..b22f7eb 100644 --- a/src/functions/geometry.ts +++ b/src/functions/geometry.ts @@ -1,3 +1,15 @@ +/** + * Given parameters to form a spiral and select a point on it, returns the + * coordinates of that point. + * + * @param rungWidth - The distance between each rung of the spiral. + * @param pointSpacing - The distance between points on the spiral. + * @param totalPoints - The total number of points to draw on the spiral. + * @param selectedPoint - The index of the point that is selected, starting + * from the outer edge of the spiral. + * @param multiplier - A factor to rescale the spiral size. + * @returns [x, y]: The coordinates of the selected point. + */ export function getSpiralCoord ( rungWidth: number, pointSpacing: number, @@ -5,18 +17,6 @@ export function getSpiralCoord ( selectedPoint: number, multiplier = 1, ): number[] { - /** - * Given parameters to form a spiral and select a point on it, returns the - * coordinates of that point. - * - * @param rungWidth: The distance between each rung of the spiral. - * @param pointSpacing: The distance between points on the spiral. - * @param totalPoints: The total number of points to draw on the spiral. - * @param selectedPoint: The index of the point that is selected, starting - * from the outer edge of the spiral. - * @param multiplier: A factor to rescale the spiral size. - * @returns [x, y]: The coordinates of the selected point. - */ // The spiral is drawn starting from the centre. The points need to be // plotted starting from the edge, so the index should be inverted selectedPoint = totalPoints - selectedPoint @@ -61,6 +61,17 @@ export function getSpiralCoord ( // why are they both negative? I do not know. but it works. } +/** + * Calculates the points of intersection of two circles given their + * coordinates and radii. + * @param x0 - x-coordinate of the first circle. + * @param y0 - y-coordinate of the first circle. + * @param r0 - Radius of the first circle. + * @param x0 - x-coordinate of the second circle. + * @param y0 - y-coordinate of the second circle. + * @param r0 - Radius of the second circle. + * @returns [x, x, y, y] for the two points of intersection. + */ export function circleIntersectionPoints ( x0: number, y0: number, @@ -69,17 +80,6 @@ export function circleIntersectionPoints ( y1: number, r1: number, ): number[] { - /** - * Calculates the points of intersection of two circles given their - * coordinates and radii. - * @param x0: x-coordinate of the first circle. - * @param y0: y-coordinate of the first circle. - * @param r0: Radius of the first circle. - * @param x0: x-coordinate of the second circle. - * @param y0: y-coordinate of the second circle. - * @param r0: Radius of the second circle. - * @returns [x, x, y, y] for the two points of intersection. - */ const dx = x1 - x0 const dy = y1 - y0 const d = Math.hypot(dy, dx) diff --git a/src/functions/tokenise.ts b/src/functions/tokenise.ts index 2bab7a6..0053b13 100644 --- a/src/functions/tokenise.ts +++ b/src/functions/tokenise.ts @@ -7,6 +7,20 @@ import { getLetters } from "../functions/alphabets" let ID_COUNTER = 0 +/** + * Takes a string and converts it to tokens. Tokens are dicts that instruct + * the renderer on what to draw e.g. what letters and shapes are present. + * The renderer will decide how to draw those things e.g. what size + * everything is. + * + * @param sentence - A string containing the sentence to be tokenised. + * Gallifreyo's definition of a sentence is a series of words, but what those + * words are can be anything. Most words will also be sentences. + * @param splitBy - An array of strings by which to split + * @param alphabets - List of alphabet names to use + * @param settings - A settings object to pass to the constructed phrases. + * @returns A list of tokenised phrases. + */ export function tokeniseSentence ( sentence: string, splitBy: string[], @@ -19,20 +33,6 @@ export function tokeniseSentence ( alphabets: string[], settings: Settings, ): (Sentence | Word)[] { - /** - * Takes a string and converts it to tokens. Tokens are dicts that instruct - * the renderer on what to draw e.g. what letters and shapes are present. - * The renderer will decide how to draw those things e.g. what size - * everything is. - * - * @param sentence: A string containing the sentence to be tokenised. - * Gallifreyo's definition of a sentence is a series of words, but what those - * words are can be anything. Most words will also be sentences. - * @param splitBy: An array of strings by which to split - * @param alphabets: List of alphabet names to use - * @param settings: A settings object to pass to the constructed phrases. - * @returns A list of tokenised phrases. - */ // This is a recursive function that pops from splitBy. There are two // possible return values: // 1. If there is at least one splitBy delimiter, split the text by it. @@ -67,15 +67,15 @@ export function tokeniseSentence ( return phrases } +/** +* Takes a word as a string. Iterates through it to return its phrases +* property, which is an array of Letters. +*/ function tokeniseAWordIntoLetters ( word: string, alphabets: string[], settings: Settings, ): Letter[] { - /** - * Takes a word as a string. Iterates through it to return its phrases - * property, which is an array of Letters. - */ // I want to loop through the segments of the word in variable stages. // When I find a match against the alphabets, I should obey that alphabet's // action and use it to assign a subletter. @@ -137,16 +137,16 @@ function tokeniseAWordIntoLetters ( return letters } +/** +* Skims a single letter from the first part of a word and returns the +* relevant character, as a string. +* +* If there is no match, returns null. +*/ function skimACharacterFromAWord ( word: string, alphabets: string[], ): string | null { - /** - * Skims a single letter from the first part of a word and returns the - * relevant character, as a string. - * - * If there is no match, returns null. - */ // Grab the alphabet directly from source const sourceLetters: LetterData[] = getLetters(alphabets) // Find the source letter that matches the start of the word @@ -158,16 +158,16 @@ function skimACharacterFromAWord ( return null } +/** +* Takes an array of characters, as strings, and returns the first subletter +* that can be created from that array. +* +* Returns subletter as a list of characters, as strings. +*/ function skimSubletterCharactersFromCharacters ( characters: string[], alphabets: string[], ): string[] { - /** - * Takes an array of characters, as strings, and returns the first subletter - * that can be created from that array. - * - * Returns subletter as a list of characters, as strings. - */ // Grab the alphabet directly from source const sourceLetters: LetterData[] = getLetters(alphabets) // Iterate through letters and their actions From 70023d54504b821d905608d863b441ebf4516ed3 Mon Sep 17 00:00:00 2001 From: Ross Williams Date: Thu, 4 Feb 2021 15:19:45 +0000 Subject: [PATCH 6/7] Enforce type safety throughout components --- .eslintrc.json | 2 +- package.json | 1 - src/collisions/CollisionsTest.vue | 2 +- src/components/Footer.vue | 2 +- src/components/RenderedImage.vue | 12 ++-- src/components/RenderedLetter.vue | 17 +++-- src/components/RenderedPhrase.vue | 25 ++++--- src/components/SettingsOptions.vue | 112 +++++++++++++++++------------ src/components/TextInput.vue | 13 ++-- src/index.ts | 4 +- src/store.ts | 66 ++++++----------- src/types/state.ts | 4 +- tsconfig.json | 3 +- 13 files changed, 141 insertions(+), 122 deletions(-) diff --git a/.eslintrc.json b/.eslintrc.json index 223023d..707b771 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -33,7 +33,7 @@ ], "@typescript-eslint/no-non-null-assertion": "off", "prefer-template": "error", - "quotes": ["error", "double"], + "quotes": ["warn", "double"], "comma-dangle": ["error", "always-multiline"] } } diff --git a/package.json b/package.json index 05372e1..724d39d 100644 --- a/package.json +++ b/package.json @@ -64,7 +64,6 @@ "vue-loader": "^15.9.6", "vue-style-loader": "^4.1.2", "vue-template-compiler": "^2.6.12", - "vuex": "^3.6.2", "webpack": "^4.46.0", "webpack-cli": "^3.3.11" }, diff --git a/src/collisions/CollisionsTest.vue b/src/collisions/CollisionsTest.vue index 9a8a6f9..155e1d5 100644 --- a/src/collisions/CollisionsTest.vue +++ b/src/collisions/CollisionsTest.vue @@ -44,7 +44,7 @@ export default Vue.extend({ }, computed: { time: { - get () { return this.test.endTime - this.test.startTime }, + get (): number { return this.test.endTime - this.test.startTime }, }, }, methods: { diff --git a/src/components/Footer.vue b/src/components/Footer.vue index 9817f1b..12cc1ab 100644 --- a/src/components/Footer.vue +++ b/src/components/Footer.vue @@ -34,9 +34,9 @@