diff --git a/app-gale.js b/app-gale.js deleted file mode 100644 index e5e1300..0000000 --- a/app-gale.js +++ /dev/null @@ -1,79 +0,0 @@ -/** @import * as TYPES from "./graph/types.ts" */ -import * as FSHandle from "./store-directory-handle.js"; - -const {Div, DOM} = Gale({ - Title:{ - padding:"2rem", - background: "blue", - color:"white" - }, - Plain:{} -}) - -/** @type {Van.State>} */ -const rooms = van.state({}); - -async function EvaluateHandle() -{ - try - { - const module = await import("./data/room.js"+"?rand="+Math.random()); - /** @type {Record} */ - const read = module.default(); - console.log("rooms found:", read); - rooms.val = read; - } - catch(e) - { - console.log("rooms read error:", e); - rooms.val = {}; - } -} -let handle = await FSHandle.getDirectoryHandle(); -EvaluateHandle(); - -/** @type {(pass:TYPES.Pass, parts:TYPES.GraphParts)=>()=>HTMLElement} */ -function Pass(pass, parts) -{ - const rerender = van.state(0); - return ()=>{ - console.log("rerendering...", rerender.val) - return Div.Plain( - Div.Title( - DOM.div.Plain(pass.name), - DOM.span.Plain(pass.path), - ), - ()=>{ - return DOM.button.Plain( - {async onclick(){ - await pass.load(); - rerender.val++ - }}, - pass.live ? "Dump" : "Load" - ) - }, - - ) - } -} - - -function App() -{ - return Div.Plain( - DOM.button({ - async onclick(){ - handle = await showDirectoryPicker(); - await FSHandle.setDirectoryHandle(handle); - EvaluateHandle(); - } - }, "Pick Directory"), - Object.entries(rooms.val).map(([room_id, graphParts])=> - Object.entries(graphParts.Pass).map(([pass_id, pass])=>{ - return Pass(pass, graphParts) - }) - ) - ) -} - -van.add(document.body, App); diff --git a/app.js b/app.js new file mode 100644 index 0000000..485e4a4 --- /dev/null +++ b/app.js @@ -0,0 +1,175 @@ +/** @import * as TYPES from "./graph/types.ts" */ +import * as FSHandle from "./store-directory-handle.js"; + +const {Div, DOM} = Gale({ + Title:{ + padding:"2rem", + background: "blue", + color:"white" + }, + Plain:{}, + PartGroup:{ + display: `flex`, + flexWrap: `wrap` + }, + Part:{ + border: `1px solid black`, + borderRadius: `5px`, + padding: `1rem` + } +}); + +async function PickHandle() +{ + handle = await showDirectoryPicker(); + await FSHandle.setDirectoryHandle(handle); + await LoadHandleFiles(); +} +async function LoadHandleFiles() +{ + try + { + const module = await import("./data/room.js"+"?rand="+Math.random()); + /** @type {Record} */ + const read = module.default(); + rooms.val = read; + } + catch(_e) + { + rooms.val = {}; + } +} +/** @type {Van.State>} */ +const rooms = van.state({}); +let handle = await FSHandle.getDirectoryHandle(); +await LoadHandleFiles(); + + +/** @type {(room_id:string, graphParts:TYPES.GraphParts)=>HTMLElement} */ +function Room(room_id, graphParts) +{ + const rerender = van.state(0); + return Div.Plain( + + Div.Plain("Passes:"), + Object.entries(graphParts.Pass).map(([pass_id, pass])=>{ + return ()=>{ + console.log("rerendering...", rerender.val) + return Div.Plain( + Div.Title( + DOM.div.Plain(pass.name), + DOM.span.Plain(pass.path), + ), + ()=>{ + return DOM.button.Plain( + {async onclick(){ + await pass[pass.live ? "dump" : "load"](); + rerender.val++ + }}, + pass.live ? "Dump" : "Load" + ) + }, + ) + } + }), + + Div.Plain("Parts"), + Div.PartGroup( + Object.entries(graphParts.Part).map(([part_id, part])=>{ + + return ()=>{ + + rerender.val; + + const work = [] + for(const [_pass_ref, data] of part.pass) + { + + work.push(Div.Part( + DOM.h5("Pass:", _pass_ref.name), + DOM.p(data.time), + data.work.map(([time, data, user])=>Div.Plain( + DOM.span(time), + " ", + DOM.strong(data), + )) + )) + } + + return Div.Part( + DOM.h3("Part:", part.name), + ...work + ); + } + + }), + ), + + Div.Plain("Desks"), + Div.PartGroup( + Object.entries(graphParts.Desk).map(([desk_id, desk])=>{ + + return ()=>{ + + rerender.val; + + /** @type {(part:TYPES.Part, index:number, pass:TYPES.Pass, dirty:TYPES.Flag)=>HTMLElement|null} */ + const Iterator = (part, index, pass, dirty)=>{ + + const partPass = part.pass.get(pass); + if(partPass) + { + const time = partPass.time; + const latest = partPass.work.find(t=>t[0] == time); + + + return Div.Plain( + part.name, + DOM.p( dirty.need.includes(index) ? "Dirty" : "Good!" ), + Div.Part( + time, " ", latest?.[1] || "" + ) + ); + } + return null; + } + + const work = []; + for(const [pass, dirty] of desk.pass) + { + work.push(Div.Part( + DOM.h5("Pass:", pass.name), + Div.Part( + DOM.h4("Need:"), + desk.need.map((part, index)=>Iterator(part, index, pass, dirty)) + ), + Div.Part( + DOM.h4("Make:"), + desk.make.map((part, index)=>Iterator(part, index, pass, dirty)) + ) + )) + } + + return Div.Part( + DOM.h3("Desk:", desk.name), + work + ) + } + + }), + ), + + ) +} + +function App() +{ + return Div.Plain( + DOM.button({onclick:PickHandle}, "Pick Directory"), + Object.entries(rooms.val).map(([room_id, graphParts])=> + Room(room_id, graphParts) + ) + ) +} + +van.add(document.body, App); diff --git a/graph/types.ts b/graph/types.ts index e35a01b..2008c4f 100644 --- a/graph/types.ts +++ b/graph/types.ts @@ -1,9 +1,10 @@ export type User = {name:string, desk:Set}; export type Role = {name:string, user:User[]}; -export type Desk = {name:string, need:Part[], time:number[], make:Part[], pass:Map, mode:string, role:Role[]}; -export type Work = [time:number, data:string, user:User]; +export type Desk = {name:string, need:Part[], time:number[], make:Part[], pass:Map, mode:string, role:Role[]}; export type Pass = {name:string, path:string, live:boolean, load:()=>Promise, dump:()=>void}; export type Part = {name:string, pass:Mapvoid}>, need:Desk[], make:Desk[]}; +export type Work = [time:number, data:string, user:User]; +export type Flag = {need:number[], make:number[]} export type GraphBuilder= < diff --git a/index.html b/index.html index df2129b..c4acd1d 100644 --- a/index.html +++ b/index.html @@ -12,6 +12,6 @@ .catch(err => console.error('Service Worker registration failed:', err)); } - + \ No newline at end of file diff --git a/mock-user-folder/data/user.js b/mock-user-folder/data/user.js index ee16d25..5523c18 100644 --- a/mock-user-folder/data/user.js +++ b/mock-user-folder/data/user.js @@ -1,4 +1,5 @@ export default { u1:"seth", - u2:"seth2" + u2:"seth2", + u3:"seth3" } \ No newline at end of file diff --git a/mock-user-folder/room/room_01/pass_01/u1.json b/mock-user-folder/room/room_01/pass_01/u1.json index d58e0a7..1eb3a30 100644 --- a/mock-user-folder/room/room_01/pass_01/u1.json +++ b/mock-user-folder/room/room_01/pass_01/u1.json @@ -3,6 +3,7 @@ [ [123, "data"], [456, "more data"], - [789, "even more data"] + [789, "even more data"], + [101112, "even more data"] ] } \ No newline at end of file diff --git a/mock-user-folder/room/room_01/pass_02/u3.json b/mock-user-folder/room/room_01/pass_02/u3.json index d58e0a7..cabbe04 100644 --- a/mock-user-folder/room/room_01/pass_02/u3.json +++ b/mock-user-folder/room/room_01/pass_02/u3.json @@ -1,8 +1,8 @@ { "p1": [ - [123, "data"], - [456, "more data"], - [789, "even more data"] + [123456, "data"], + [4562358723, "more data"], + [789235072367, "even more data"] ] } \ No newline at end of file