write blocking

app.js

@@ -16,6 +16,15 @@ const {Div, DOM} = Gale({
         border: `1px solid black`,
         borderRadius: `5px`,
         padding: `1rem`
+    },
+    BlockScreen:{
+        position: "fixed",
+        zIndex: "9999",
+        top: "0",
+        left: "0",
+        width: "100%",
+        height: "100%",
+        background: "rgba(128, 128, 128, 0.5)"
     }
 });
 
@@ -87,10 +96,13 @@ async function WRITE(path, part, time, data)
 /** @type {Van.State<TYPES.User|false>} */
 const loggedIn = van.state(false);
 
+const blocking = van.state(false);
+
 /** @type {(room_id:string, graphParts:TYPES.GraphParts)=>HTMLElement} */
 function Room(room_id, graphParts)
 {
     const rerender = van.state(0);
+    blocking.val;
 
     return Div.Plain(
 
@@ -99,15 +111,14 @@ function Room(room_id, graphParts)
             Object.entries(graphParts.User).map(([user_id, user])=>{
                 return ()=>{
 
-                    rerender.val;
+                    //rerender.val;
 
                     return Div.Part(
                         DOM.div.Plain(user.name),
                         ()=>{
                             return DOM.button.Plain(
-                                {async onclick(){
+                                {onclick(){
-                                    rerender.val++
+                                    loggedIn.val = (loggedIn.val == user) ? false : user;
-                                    loggedIn.val = user;
                                 }},
                                 loggedIn.val == user ? "this is me" : "impersonate"
                             )
@@ -162,11 +173,14 @@ function Room(room_id, graphParts)
                                 DOM.strong(data),
                             )),
                             Div.Plain(
-                                loggedIn.val ? DOM.button({async onclick(){
+                                loggedIn.val ? DOM.button({onclick(){
                                     if(loggedIn.val)
                                     {
-                                        await data.make(loggedIn.val, "NEW");
+                                        blocking.val = true;
+                                        data.make(loggedIn.val, "NEW").then(()=>{
+                                            blocking.val = false;
                                             rerender.val++;
+                                        });
                                     }
                                 }}, "Add work!")
                                 : null
@@ -237,6 +251,10 @@ function Room(room_id, graphParts)
             }),
         ),
 
+        ()=>{
+            return blocking.val ? Div.BlockScreen() : null
+        }
+
     )
 }
 

graph/graph.js

@@ -106,7 +106,6 @@ export function Room({user, role, part, desk, pass})
                         const handle = await FSAccess.getDirectoryHandle();
                         const path = ["store", context.Path, passID, user.id+".json"];
                         let text = await FSAccess.Read(handle, path) || "{}";
-                        console.log("json loaded", text);
                         /** @type {TYPES.UserPassFile} */
                         const json = JSON.parse(text);
 
@@ -140,7 +139,6 @@ export function Room({user, role, part, desk, pass})
                     {   
                         const handle = await FSAccess.getDirectoryHandle();
                         const text = await FSAccess.Read(handle, ["store", context.Path, passID, userID+".json"]);
-                        console.log("json loaded", text);
                         /** @type {TYPES.UserPassFile} */
                         const json = JSON.parse(text);
                         
@@ -174,7 +172,6 @@ export function Room({user, role, part, desk, pass})
                     }
 
                 }
-                console.log("load complete", PartList);
 
                 // update the graph
                 Object.values(DeskList).forEach((deskObj)=>Scan(deskObj, passObj));

graph/types.ts

@@ -2,7 +2,7 @@ export type User = {name:string, id:string, desk:Set<Desk>};
 export type Role = {name:string, id:string, user:User[]};
 export type Desk = {name:string, id:string, need:Part[], time:number[], make:Part[], pass:Map<Pass, Flag>, mode:string, role:Role[]};
 export type Pass = {name:string, id:string, path:string, live:boolean, load:()=>Promise<void>, dump:()=>void};
-export type Part = {name:string, id:string, pass:Map<Pass, {time:number, work:Work[], make:(user:User, data:string)=>void}>, need:Desk[], make:Desk[]};
+export type Part = {name:string, id:string, pass:Map<Pass, {time:number, work:Work[], make:(user:User, data:string)=>Promise<void>}>, need:Desk[], make:Desk[]};
 export type Work = [time:number, data:string, user:User];
 export type Flag = {need:number[], make:number[]}