Earmark/audiogram-beta
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

reorganization

Browse Source
This commit is contained in:
Seth Trowbridge 2023-06-03 11:38:52 -04:00
parent 8b217c8ce4
commit de986f131b
10 changed files with 46 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
deno.json
View File

@ -1,15 +1,9 @@
{ {
"compilerOptions": { "types": ["./store"], "checkJs": true }, "compilerOptions": { "types": ["*.d.ts"], "checkJs": true },
"importMap": "./deno.map.json", "imports": {
"fmt": { "@twind/": "https://esm.sh/@twind/",
"options": { "react": "https://esm.sh/preact@10.11.3/compat",
"lineWidth": 256 "htm": "https://esm.sh/htm@3.1.1/preact",
} "app": "./js/app.js"
},
"tasks": {
"dev": "deno task serve & deno task test",
"fmt": "deno fmt --watch",
"serve": "deno run -A --unstable --no-check https://deno.land/std@0.167.0/http/file_server.ts",
"test": "deno test store.test.ts --watch --no-lock --no-check"
} }
} }

8
deno.map.json
View File

@ -1,8 +0,0 @@
{
"imports": {
"@twind/": "https://esm.sh/@twind/",
"react": "https://esm.sh/preact@10.11.3/compat",
"htm": "https://esm.sh/htm@3.1.1/preact",
"app": "./src/app.js"
}
}

19
index.html
View File

@ -1,7 +1,12 @@
<meta charset="utf-8"/> <html>
<meta name="viewport" content="width=device-width, initial-scale=1"/> <head>
<!----> <meta charset="utf-8"/>
<div id="app"></div> <meta name="viewport" content="width=device-width, initial-scale=1"/>
<script type="importmap-shim" src="./deno.map.json"></script> </head>
<script type="module-shim">import "app";</script> <body>
<script async src="https://unpkg.com/es-module-shims@0.13.1/dist/es-module-shims.min.js"></script> <div id="app"></div>
<script type="importmap-shim" src="./deno.json"></script>
<script type="module-shim">import "app";</script>
<script async src="https://unpkg.com/es-module-shims@0.13.1/dist/es-module-shims.min.js"></script>
</body>
</html>

12
src/app.js → js/app.js
View File

@ -15,23 +15,17 @@ TW.Init(ShadowCSS, ShadowDiv);
React.render(html` React.render(html`
<${Store.Provider}> <${Store.Provider}>
<div class="grid grid-cols-[300px_auto] items-center">
<div class="col-start-1 p-10">
<img src="./logo.png"/>
</div>
<div class="flex justify-center"> <div class="flex justify-center">
<${UI.Select}/> <${UI.Select}/>
</div> </div>
<div class="col-start-1">
<${UI.Controls}/> <${UI.Controls}/>
</div>
<div class=""> <div class="flex flex-row justify-center">
<${UI.Chart}> <${UI.Chart}>
<${UI.Audiogram}/> <${UI.Audiogram}/>
<//> <//>
</div> </div>
</div>
<//> <//>
`, ShadowDiv); `, ShadowDiv);

4
src/store.js → js/store.js
View File

@ -240,8 +240,8 @@ export const Initial = Reducer(
] ]
}, {Name:"Test", Data:0}); }, {Name:"Test", Data:0});
/** @type {preact.Context<Store.Binding>} */
export const Context = React.createContext([Initial, (_a)=>{}]); export const Context = React.createContext(/** @type {Store.Binding} */([Initial, (_a)=>{}]));
/** @type {(props:{children:preact.ComponentChildren})=>preact.VNode} */ /** @type {(props:{children:preact.ComponentChildren})=>preact.VNode} */
export const Provider =(props)=> export const Provider =(props)=>

0
src/tone.js → js/tone.js
View File

2
src/twind.js → js/twind.js
View File

@ -2,7 +2,7 @@ import * as TW from "@twind/core@1.0.1";
import TWPreTail from "@twind/preset-tailwind@1.0.1"; import TWPreTail from "@twind/preset-tailwind@1.0.1";
import TWPreAuto from "@twind/preset-autoprefix@1.0.1"; import TWPreAuto from "@twind/preset-autoprefix@1.0.1";
/** @type {TW.TwindConfig} */ /** @type {TW.TwindUserConfig} */
export const Configure = { export const Configure = {
theme: theme:
{ {

12
src/ui.js → js/ui.js
View File

@ -46,6 +46,11 @@ export const Select =()=>
return html` return html`
<div class="inline-flex flex-row align-center bg-metal rounded-lg overflow-hidden shadow-md font-sans"> <div class="inline-flex flex-row align-center bg-metal rounded-lg overflow-hidden shadow-md font-sans">
<div class="box-notch">
<div class="p-4">
<img class="h-auto max-w-xs" src="./logo.png"/>
</div>
</div>
<div class="box-notch"> <div class="box-notch">
<div >Select Test</div> <div >Select Test</div>
<div class="box-buttons"> <div class="box-buttons">
@ -104,14 +109,19 @@ export const Controls =()=>
const classTitle = "flex-1 text-sm" const classTitle = "flex-1 text-sm"
return html` return html`
<div class="font-sans bg-metal rounded-lg overflow-hidden shadow-md"> <div class="flex flex-row font-sans bg-metal rounded-lg overflow-hidden shadow-md">
<div class="box-notch"> <div class="box-notch">
<div>
<div class=${classTitle}>Channel</div> <div class=${classTitle}>Channel</div>
<div class="box-buttons min-w-[50%]"> <div class="box-buttons min-w-[50%]">
<${Button} inactive=${State.Chan.Value == 0} light=${State.Chan.Value == 0} classes="flex-1" onClick=${()=>Dispatch({Name:"Chan", Data:-1})}>Left<//> <${Button} inactive=${State.Chan.Value == 0} light=${State.Chan.Value == 0} classes="flex-1" onClick=${()=>Dispatch({Name:"Chan", Data:-1})}>Left<//>
<${Button} inactive=${State.Chan.Value == 1} light=${State.Chan.Value == 1} classes="flex-1" onClick=${()=>Dispatch({Name:"Chan", Data:1})}>Right<//> <${Button} inactive=${State.Chan.Value == 1} light=${State.Chan.Value == 1} classes="flex-1" onClick=${()=>Dispatch({Name:"Chan", Data:1})}>Right<//>
</div> </div>
</div> </div>
<div>
</div>
</div>
<div class="box-notch"> <div class="box-notch">
<div class=${classTitle}>Frequency</div> <div class=${classTitle}>Frequency</div>
<div class="box-buttons min-w-[50%]"> <div class="box-buttons min-w-[50%]">

0
store.d.ts → ts/store.d.ts vendored
View File

0
store.test.ts → ts/store.test.ts
View File