ui tweaks

app.js

@@ -59,106 +59,27 @@ async function LoadHandleFiles()
     }
 }
 
-
 /** @type {Van.State<Record<string, TYPES.GraphParts>>} */
 const rooms = van.state({});
 let handle = await FSHandle.getDirectoryHandle();
 await LoadHandleFiles();
 
-/** @type {(path:string[], part:string, time:number, data:string)=>void} */
-async function WRITE(path, part, time, data)
-{
-    const fileHandle = await FSHandle.Dig(handle, path, true);
-    if(fileHandle)
-    {
-        const file  = await fileHandle.getFile();
-        const text = await file.text();
-        let json = {};
-        if(text)
-        {
-            json = JSON.parse(text);
-        }
-        let partProp = json[part];
-        if(!partProp)
-        {
-            partProp = [];
-            json[part] = partProp;
-        }
-        partProp.push([time, data]);
 
-        const writeable = await fileHandle.createWritable();
-        await writeable.write(JSON.stringify(json, null, 2));
-        await writeable.close();
-    }
-
-}
 
 /** @type {Van.State<TYPES.User|false>} */
 const loggedIn = van.state(false);
 
 const blocking = van.state(false);
 
-/** @type {(room_id:string, graphParts:TYPES.GraphParts)=>HTMLElement} */
+const showDesks = van.state(true);
-function Room(room_id, graphParts)
+
+/** @type {(inParts:Record<string, TYPES.Part>)=>HTMLElement} */
+function Parts(inParts)
 {
-    const rerender = van.state(0);
-    blocking.val;
-
     return Div.Plain(
-
-        Div.Plain("Users:"),
-        Div.PartGroup(
-            Object.entries(graphParts.User).map(([user_id, user])=>{
-                return ()=>{
-
-                    //rerender.val;
-
-                    return Div.Part(
-                        DOM.div.Plain(user.name),
-                        ()=>{
-                            return DOM.button.Plain(
-                                {onclick(){
-                                    loggedIn.val = (loggedIn.val == user) ? false : user;
-                                }},
-                                loggedIn.val == user ? "this is me" : "impersonate"
-                            )
-                        },
-                    )
-                }
-            })
-        ),
-
-        Div.Plain("Passes:"),
-        Div.PartGroup(
-            Object.entries(graphParts.Pass).map(([pass_id, pass])=>{
-                return ()=>{
-                    console.log("rerendering...", rerender.rawVal);
-
-                    rerender.val;
-
-                    return Div.Part(
-                        DOM.div.Plain(pass.name),
-                        ()=>{
-                            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])=>{
+            Object.entries(inParts).map(([part_id, part])=>{
-
-                return ()=>{
-
-                    rerender.val;
 
                 const work = []
                 for(const [pass, data] of part.pass)
@@ -174,14 +95,10 @@ function Room(room_id, graphParts)
                         )),
                         Div.Plain(
                             loggedIn.val ? DOM.button({onclick(){
-                                    if(loggedIn.val)
-                                    {
                                 blocking.val = true;
-                                        data.make(loggedIn.val, "NEW").then(()=>{
+                                loggedIn.val && data.make(loggedIn.val, "NEW").then(()=>{
                                     blocking.val = false;
-                                            rerender.val++;
                                 });
-                                    }
                             }}, "Add work!")
                             : null
                         )
@@ -192,18 +109,32 @@ function Room(room_id, graphParts)
                     DOM.h3(part.name),
                     ...work,
                 );
-                }
 
             }),
-        ),
+        )
+    )
+}
 
+/** @type {(inDesks:Record<string, TYPES.Desk>)=>HTMLElement} */
+function Desks(inDesks)
+{
+    return Div.Plain(
         Div.Plain("Desks"),
         Div.PartGroup(
-            Object.entries(graphParts.Desk).map(([desk_id, desk])=>{
+            Object.entries(inDesks).map(([desk_id, desk])=>{
 
-                return ()=>{
+                loggedIn.val;
 
-                    rerender.val;
+                if(loggedIn.val)
+                {
+                    for(const role of desk.role)
+                    {
+                        if(!role.user.includes(loggedIn.val))
+                        {
+                            return null;
+                        }
+                    }
+                }
 
                 /** @type {(part:TYPES.Part, index:number, pass:TYPES.Pass, dirty:number[])=>HTMLElement|null} */
                 const Iterator = (part, index, pass, dirty)=>{
@@ -246,11 +177,76 @@ function Room(room_id, graphParts)
                     DOM.h3(desk.name),
                     work
                 )
-                }
+
 
             }),
+        )
+    )
+}
+
+/** @type {(room_id:string, graphParts:TYPES.GraphParts)=>HTMLElement} */
+function Room(room_id, graphParts)
+{
+    const rerender = van.state(0);
+    blocking.val;
+
+    return Div.Plain(
+
+        Div.Plain("Users:"),
+        Div.PartGroup(
+            Object.entries(graphParts.User).map(([user_id, user])=>{
+                return ()=>{
+                    return Div.Part(
+                        DOM.div.Plain(user.name),
+                        ()=>{
+                            return DOM.button.Plain(
+                                {onclick(){
+                                    loggedIn.val = (loggedIn.val == user) ? false : user;
+                                }},
+                                loggedIn.val == user ? "this is me" : "impersonate"
+                            )
+                        },
+                    )
+                }
+            })
         ),
 
+        Div.Plain("Passes:"),
+        Div.PartGroup(
+            Object.entries(graphParts.Pass).map(([pass_id, pass])=>{
+                return ()=>{
+                    console.log("rerendering...", rerender.rawVal);
+
+                    rerender.val;
+
+                    return Div.Part(
+                        DOM.div.Plain(pass.name),
+                        ()=>{
+                            return DOM.button.Plain(
+                                {async onclick(){
+                                    await pass[pass.live ? "dump" : "load"]();
+                                    rerender.val++
+                                }},
+                                pass.live ? "Dump" : "Load"
+                            )
+                        },
+                    )
+                }
+            })
+        ),
+
+        ()=>{
+            return DOM.button({onclick(){
+                showDesks.val = !showDesks.val;
+            }}, showDesks.val ? "Show Parts" : "Show Desks")
+        },
+
+        ()=>{
+            rerender.val;
+            return showDesks.val ? Desks(graphParts.Desk) : Parts(graphParts.Part);
+        },
+
+
         ()=>{
             return blocking.val ? Div.BlockScreen() : null
         }

mock-user-folder/graph/room.js

@@ -6,7 +6,8 @@ export default Rooms({
     room_01:Room({
         user:User,
         role:{
-            dev:["Development", "u1"]
+            dev:["Development", "u1"],
+            write:["Writing", "u2", "u3"],
         },
         part:{
             p1:"Page title",
@@ -14,12 +15,13 @@ export default Rooms({
             p3:"Page preview",
         },
         desk:{
-            d1:["Write page metas", ["dev"], "all", {}, "p1", "p2"],
+            d1:["Write page metas", ["write"], "all", {}, "p1", "p2"],
             d2:["Build Page preview", ["dev"], "all", {p1:1, p2:1}, "p3"]
         },
         pass:{
             pass_01:["January"],
-            pass_02:["February"]
+            pass_02:["February"],
+            pass_03:["March"],
         }
     })
 });