From 142c72eb146493df7773ab38a31a559121f607d9 Mon Sep 17 00:00:00 2001 From: Seth Trowbridge Date: Mon, 5 Dec 2022 23:22:37 -0500 Subject: [PATCH] trying to fix language server issues --- deno.json | 6 ++-- src/app.js | 65 ++++++++++------------------------ src/store.js | 53 +++++++++++++++------------ store.d.ts | 7 ++-- store.test.js => store.test.ts | 46 +++++++----------------- 5 files changed, 69 insertions(+), 108 deletions(-) rename store.test.js => store.test.ts (55%) diff --git a/deno.json b/deno.json index 26d8a62..331aa3a 100644 --- a/deno.json +++ b/deno.json @@ -1,9 +1,9 @@ { - "compilerOptions": {"types":["/store.d.ts"]}, + "compilerOptions": {"types":["./store"], "checkJs": true}, "tasks": { "fs": "deno run -A --no-lock https://deno.land/std@0.166.0/http/file_server.ts", - "test": "deno test --no-lock --watch store.test.js", - "test-debug": "deno test --no-lock --inspect-brk store.test.js" + "test": "deno test --no-lock --no-check --watch store.test.ts", + "test-debug": "deno test --no-lock --no-check --inspect-brk store.test.ts" } } \ No newline at end of file diff --git a/src/app.js b/src/app.js index c4919d9..402a0a7 100644 --- a/src/app.js +++ b/src/app.js @@ -1,46 +1,9 @@ import * as TW from "./twind.js"; import * as UI from "./ui.js"; -import { Reducer, Initial } from "./store.js"; +import * as Store from "./store.js"; import React from "https://esm.sh/preact@10.11.3/compat"; import {html} from "https://esm.sh/htm@3.1.1/preact"; -/** @type {preact.Context} */ -const StoreContext = React.createContext([Initial, (_a)=>{}]); - - -/** @type {(props:{children:preact.ComponentChildren})=>preact.VNode} */ -const StoreProvider =(props)=> -{ - const reducer = React.useReducer(Reducer, Initial); - return html`<${StoreContext.Provider} value=${reducer}>${props.children}`; -} - -/** @typedef {[state:Store.State, dispatch:(inAction:Store.Action)=>void]} Binding */ -/** @type {()=>Binding} */ -const StoreConsumer =()=> React.useContext(StoreContext); - -const Deep =()=> -{ - const [State, Dispatch] = StoreConsumer(); - return html` - <${UI.Button} onClick=${()=>Dispatch({Name:"Stim", Data:1})} disabled=${State.Stim.Value == State.Stim.Max}> - ${State.Stim.Value} - `; -} - -const Audiogram =()=> -{ - const [State, Dispatch] = StoreConsumer(); - return html` - - ${State.Draw} - <${UI.Mark} right=${false} x=${"10%"} y="20%" response=${true} /> - <${UI.Mark} right=${false}/> - - - `; -} - const ShadowDOM = document.querySelector("#app").attachShadow({mode: "open"}); const ShadowDiv = document.createElement("div"); const ShadowCSS = document.createElement("style"); @@ -49,20 +12,30 @@ ShadowDOM.append(ShadowDiv); TW.Init(ShadowCSS, ShadowDiv); +const Audiogram =()=> +{ + const [State, Dispatch] = Store.Consumer(); + + const testL = State.Draw.TestL.Points.map(p=>html`<${UI.Mark} x=${p.X} y=${p.Y} response=${p.Mark.Resp} right=${false}/>`); + const testR = State.Draw.TestR.Points.map(p=>html`<${UI.Mark} x=${p.X} y=${p.Y} response=${p.Mark.Resp} right=${true} />`); + const userL = State.Draw.UserL.Points.map(p=>html`<${UI.Mark} x=${p.X} y=${p.Y} response=${p.Mark.Resp} right=${false}/>`); + const userR = State.Draw.UserR.Points.map(p=>html`<${UI.Mark} x=${p.X} y=${p.Y} response=${p.Mark.Resp} right=${true} />`); + + return html` + + ${testL} + ${testR} + `; +}; + React.render(html` - <${StoreProvider}> + <${Store.Provider}> <${UI.Button} icon="+">hey! <${UI.Button} light>Left <${UI.Button} inactive>Right <${UI.Button} disabled>Right - <${Deep}/> <${UI.Chart}> - - <${UI.Mark} right=${true} x=${"20%"} y="20%" /> - <${UI.Mark} right=${false} x=${"10%"} y="20%" response=${true} /> - <${UI.Mark} right=${false}/> - - + <${Audiogram}/> `, ShadowDiv); \ No newline at end of file diff --git a/src/store.js b/src/store.js index 0dca492..955f66a 100644 --- a/src/store.js +++ b/src/store.js @@ -1,3 +1,5 @@ +import React from "https://esm.sh/preact@10.11.3/compat"; + const size = 1/6; /** @type {Array} */ export const ColumnMapping = [ @@ -26,7 +28,7 @@ export const ColumnLookup =(inFrequency)=> /** @type {(freq:Store.TestFrequency, chan:number, user:boolean)=>Store.TestFrequencySample|undefined} */ export const MarkGet =(freq, chan, user)=> freq[/** @type {Store.PlotKey} */ (`${user ? "User" : "Test"}${chan ? "R" : "L"}`)]; -/** @type {(freq:Store.TestFrequency, chan:number, mark:TestFrequencySample|undefined)=>Store.TestFrequencySample|undefined} */ +/** @type {(freq:Store.TestFrequency, chan:number, mark:Store.TestFrequencySample|undefined)=>Store.TestFrequencySample|undefined} */ export const MarkSet =(freq, chan, mark)=> freq[ chan ? "UserR" : "UserL" ] = mark; /** @type {Store.State} */ @@ -95,16 +97,13 @@ const Update = }; -/** @type {(inTest:Store.Test, inChan:number, inStim:Range, inIsUser:boolean)=>Store.DrawGroup} */ +/** @type {(inTest:Store.Test, inChan:number, inStim:Store.Range, inIsUser:boolean)=>Store.DrawGroup} */ export function Congtiguous(inTest, inChan, inStim, inIsUser) { /** @type {Store.DrawGroup} */ const output = {Points:[], Paths:[]}; let plot; - let valid = false; - /** @type {Array} */ - let segment = []; for(let i=0; i} */ +export const Context = React.createContext([Initial, (_a)=>{}]); +/** @type {(props:{children:preact.ComponentChildren})=>preact.VNode} */ +export const Provider =(props)=> +{ + const initialized = Reducer(Initial, {Name:"Test", Data:0}); + /** @type {Store.Binding} */ + const reducer = React.useReducer(Reducer, initialized); + return React.createElement(Context.Provider, {value:reducer, children:props.children}); +} +/** @type {()=>Store.Binding} */ +export const Consumer =()=> React.useContext(Context); \ No newline at end of file diff --git a/store.d.ts b/store.d.ts index b3193f2..9aecda1 100644 --- a/store.d.ts +++ b/store.d.ts @@ -47,8 +47,11 @@ declare namespace Store { type PlotKeyTest = "TestL" | "TestR"; type PlotKey = PlotKeyUser | PlotKeyTest; - type DrawPoint = { X: number; Y: number; Mark: TestFrequencySample }; - type DrawGroup = { Points: Array; Paths: Array> }; + type DrawPoint = { X: number|string; Y: number|string; Mark: TestFrequencySample }; + type DrawLine = { Head:DrawPoint, Tail:DrawPoint}; + type DrawGroup = { Points: Array; Paths: Array }; type DrawChart = { Left: DrawGroup; Right: DrawGroup }; type DrawTest = { User?: DrawChart; Test?: DrawChart }; + + type Binding = [state:State, dispatch:(inAction:Action)=>void] } diff --git a/store.test.js b/store.test.ts similarity index 55% rename from store.test.js rename to store.test.ts index b3681c9..0b46df9 100644 --- a/store.test.js +++ b/store.test.ts @@ -1,5 +1,5 @@ import { assertEquals } from "https://deno.land/std@0.166.0/testing/asserts.ts"; -import { Reducer, ColumnMapping, Congtiguous, Initial } from "./src/store.js"; +import { Reducer, ColumnMapping, Initial } from "./src/store.js"; let state = {...Initial}; @@ -41,7 +41,7 @@ Deno.test("Initialize", async(t)=> await t.step("Live context values are correct", ()=> { assertEquals(state.Live.Test, state.Tests[0]); - assertEquals(state.Live.Freq.Hz, ColumnMapping[state.Freq.Value][0]); + assertEquals(state.Live.Freq?.Hz, ColumnMapping[state.Freq.Value][0]); assertEquals(state.Live.Mark, undefined, "(User) Mark is undefined"); }); }); @@ -64,10 +64,10 @@ Deno.test("Make Marks", async(t)=> await t.step("Check marked value", ()=> { - assertEquals(state.Live.Freq.UserL !== undefined, true, `there will be a user mark for the left channel`); - assertEquals(state.Live.Freq.UserR === undefined, true, `but not the right`); - assertEquals(state.Live.Mark.Stim, state.Stim.Value); - assertEquals(state.Live.Mark.Resp, true); + assertEquals(state.Live.Freq?.UserL !== undefined, true, `there will be a user mark for the left channel`); + assertEquals(state.Live.Freq?.UserR === undefined, true, `but not the right`); + assertEquals(state.Live.Mark?.Stim, state.Stim.Value); + assertEquals(state.Live.Mark?.Resp, true); }); await t.step("Dispatch Freq, Stim, and Chan updates", ()=> @@ -85,40 +85,18 @@ Deno.test("Make Marks", async(t)=> await t.step("Check marked value", ()=> { - assertEquals(state.Live.Freq.UserR !== undefined, true, `there will be a user mark for the right channel`); - assertEquals(state.Live.Freq.UserL !== undefined, true, `and the left`); - assertEquals(state.Live.Mark.Stim, state.Stim.Value); - assertEquals(state.Live.Mark.Resp, false); + assertEquals(state.Live.Freq?.UserR !== undefined, true, `there will be a user mark for the right channel`); + assertEquals(state.Live.Freq?.UserL !== undefined, true, `and the left`); + assertEquals(state.Live.Mark?.Stim, state.Stim.Value); + assertEquals(state.Live.Mark?.Resp, false); }); await t.step("Live context values are correct", ()=> { assertEquals(state.Live.Test, state.Tests[0]); - assertEquals(state.Live.Freq.Hz, ColumnMapping[state.Freq.Value][0]); - assertEquals(state.Live.Mark.Stim, state.Stim.Value); + assertEquals(state.Live.Freq?.Hz, ColumnMapping[state.Freq.Value][0]); + assertEquals(state.Live.Mark?.Stim, state.Stim.Value); }); console.log(state.Draw); -}); - -Deno.test("Contiguous Lines", ()=> -{ - /** @type {Store.Test} */ - const model = { - Name:"", - Plot:[ - {Hz: 500, TestL: {Stim:30, Resp:true}, TestR: {Stim:35, Resp:true}, UserL:{Stim:20, Resp:true}}, - {Hz: 1000, TestL: {Stim:40, Resp:true}, TestR: {Stim:45, Resp:true}, UserL:{Stim:30, Resp:true}}, - {Hz: 2000, TestL: {Stim:40, Resp:true}, TestR: {Stim:45, Resp:true}, UserL:{Stim:30, Resp:false}}, - {Hz: 3000, TestL: {Stim:30, Resp:true}, TestR: {Stim:35, Resp:true}, UserL:{Stim:20, Resp:true}}, - {Hz: 4000, TestL: {Stim:40, Resp:true}, TestR: {Stim:45, Resp:true}, UserL:{Stim:30, Resp:true}}, - {Hz: 4000, TestL: {Stim:50, Resp:true}, TestR: {Stim:55, Resp:true}, UserL:{Stim:40, Resp:true}} - ] - } - - const {Points, Paths} = Congtiguous(model, 0, Initial.Stim, true); - assertEquals(Points.length, 6); - assertEquals(Paths.length, 2); - assertEquals(Paths[0].length, 2); - assertEquals(Paths[1].length, 3); }); \ No newline at end of file