pinokiod 3.20.3 → 3.20.5

package/kernel/api/index.js

@@ -730,6 +730,7 @@ class Api {
         uri: request.uri,
         path: request.path,
         git: this.parentGitURI(request.path),
+        cwd,
         origin: request.origin,
         body: script 
       }

package/kernel/environment.js

@@ -435,7 +435,7 @@ const get_raw = async (homedir) => {
   return current_env
 }
 
-const requirements = async (script, filepath, kernel) => {
+const requirements = async (script, cwd, kernel) => {
   let pre_items = []
   let requires_instantiation = false
   if (script) {
@@ -446,7 +446,7 @@ const requirements = async (script, filepath, kernel) => {
       pre = script.env
     }
     if (pre) {
-      let env = await get2(filepath, kernel)
+      let env = await get2(cwd, kernel)
       for(let item of pre) {
         let env_key
         if (item.env) {

package/kernel/prototype.js

@@ -59,14 +59,25 @@ class Proto {
       console.log({ projectType, startType })
 
       let cwd = req.cwd
-      let name = req.name
+      let name = req.params.name
+//      let name = req.name
       let payload = {}
       payload.cwd = path.resolve(cwd, name)
       payload.input = req.params
 
+
+      await fs.promises.mkdir(payload.cwd)
+
+      let default_icon_path = path.resolve(__dirname, "../server/public/pinokio-black.png")
+      let icon_path = path.resolve(payload.cwd, "icon.png")
+      await fs.promises.cp(default_icon_path, icon_path)
+
       let mod_path = this.kernel.path("prototype/system", projectType, startType)
       let mod = await this.kernel.require(mod_path)
 
+      console.log({ mod_path, projectType, startType })
+      console.log("payload", payload)
+
       await mod(payload, ondata, this.kernel)
 
       // copy readme

package/kernel/shell.js

@@ -114,7 +114,12 @@ class Shell {
     // if the shell is running from a script file, the params.$parent will include the path to the parent script
     // this means we need to apply app environment as well
     if (params.$parent) {
-      let api_path = Util.api_path(params.$parent.path, this.kernel)
+      let api_path
+      if (params.$parent.cwd) {
+        api_path = Util.api_path(params.$parent.cwd, this.kernel)
+      } else {
+        api_path = Util.api_path(params.$parent.path, this.kernel)
+      }
 
       // initialize folders
       await Environment.init_folders(api_path)
@@ -352,7 +357,6 @@ class Shell {
 //    return this.id
   }
   resize({ cols, rows }) {
-    console.log("RESIZE", { cols, rows })
     this.ptyProcess.resize(cols, rows)
     this.vt.resize(cols, rows)
   }
@@ -384,7 +388,6 @@ class Shell {
     }
   }
   emit(message) {
-    //console.log("emit", { message, input: this.input, pty: this.ptyProcess })
     if (this.input) {
       if (this.ptyProcess) {
         if (message.length > 1024) {
@@ -1017,7 +1020,6 @@ class Shell {
   async exec(params) {
     params = await this.activate(params)
     this.cmd = this.build(params)
-    console.log("build", this.cmd)
     let res = await new Promise((resolve, reject) => {
       this.resolve = resolve
       this.reject = reject
@@ -1104,7 +1106,7 @@ class Shell {
     }
     this.vt.dispose()
     this.queue.killAndDrain()
-    console.log("KILL PTY", this.id)
+//    console.log("KILL PTY", this.id)
     if (this.ptyProcess) {
       if (cb) {
         kill(this.ptyProcess.pid, "SIGKILL", true)

package/kernel/shells.js

@@ -85,6 +85,13 @@ class Shells {
     // iterate through all the envs
     params.env = this.kernel.bin.envs(params.env)
 
+    // set $parent for scripts stored globally but run locally (git, prototype, plugin, etc)
+    if (params.path && !params.$parent) {
+      params.$parent = {
+        path: params.path
+      }
+    }
+
     let exec_path = (params.path ? params.path : ".")                         // use the current path if not specified
     let cwd = (options && options.cwd ? options.cwd : this.kernel.homedir)   // if cwd exists, use it. Otherwise the cwd is pinokio home folder (~/pinokio)              
     params.path = this.kernel.api.resolvePath(cwd, exec_path)
@@ -339,7 +346,6 @@ class Shells {
       }
     */
     let session = this.get(params.id)
-    console.log({ session })
     if (session) {
       session.resize(params.resize)
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pinokiod",
-  "version": "3.20.3",
+  "version": "3.20.5",
   "description": "",
   "main": "index.js",
   "scripts": {

package/server/index.js

@@ -60,6 +60,8 @@ function normalize(str) {
 
 class Server {
   constructor(config) {
+    this.menu_hidden = {}
+    this.selected = {}
     this.tabs = {}
     this.agent = config.agent
     this.port = DEFAULT_PORT
@@ -579,7 +581,14 @@ class Server {
       this.running_dynamic(name, plugin.menu)
       plugin_menu = plugin.menu
     }
+
+        
+    let menu_hidden = false
+    if (this.menu_hidden[name] && this.menu_hidden[name][type]) {
+      menu_hidden = true
+    }
     const result = {
+      minimized: menu_hidden,
 //      repos,
       current_urls,
       path: this.kernel.path("api", name),
@@ -651,7 +660,6 @@ class Server {
     return shell_id
   }
   async render(req, res, pathComponents, meta) {
-    console.log("######## RENDER", { pathComponents })
     let base_path = req.base || this.kernel.path("api")
     let full_filepath = path.resolve(base_path, ...pathComponents)
 
@@ -1049,13 +1057,17 @@ class Server {
         let { editorUrl, prevUrl } = this.getVariationUrls(req)
 
 
-        let env_requirements = await Environment.requirements(resolved, filepath, this.kernel)
+        //let cwd = req.query.cwd ? req.query.cwd : path.dirname(filepath)
+        let cwd = req.query.cwd ? req.query.cwd : filepath
+        let env_requirements = await Environment.requirements(resolved, cwd, this.kernel)
         if (env_requirements.requires_instantiation) {
-          let p = Util.api_path(filepath, this.kernel)
+          //let p = Util.api_path(filepath, this.kernel)
+          let p = Util.api_path(cwd, this.kernel)
           let platform = os.platform()
           if (platform === "win32") {
             p = p.replace(/\\/g, '\\\\')
           }
+          console.log({ p, cwd })
           res.render("required_env_editor", {
             portal: this.portal,
             agent: this.agent,
@@ -3029,8 +3041,9 @@ class Server {
 //      }
     }))
 
-    this.app.get("/init/:name", ex(async (req, res) => {
-      console.log("Rnder init", req.params.name)
+//    this.app.get("/init/:name", ex(async (req, res) => {
+//      console.log("Rnder init", req.params.name)
+    this.app.get("/init", ex(async (req, res) => {
       /*
         option 1: new vs. clone
         - new|clone
@@ -3060,7 +3073,8 @@ class Server {
 //      await this.kernel.proto.init()
       res.render("init/index", {
         cwd: this.kernel.path("api"),
-        name: req.params.name,
+        name: null,
+//        name: req.params.name,
         portal: this.portal,
 //        items,
         logo: this.logo,
@@ -3829,6 +3843,48 @@ class Server {
       let str = await fs.promises.readFile(req.query.logpath, "utf8")
       res.send(str)
     }))
+    this.app.get("/state/:type/:name", ex(async (req,res) => {
+      let selected = null
+      try {
+        selected = this.selected[req.params.name][req.params.type]
+      } catch (e) {
+      }
+      res.json({
+        selected,
+      })
+    }))
+    this.app.post("/state", ex(async (req, res) => {
+      console.log("POST /state", req.body)
+      /*
+      req.body := {
+        name: <name>, 
+        type: "browse"|"run",
+        method: "toggleMenu"|"select",
+        params: {
+          <url>,
+        }
+      }
+      */
+      if (req.body.method === "select") {
+        if (!this.selected[req.body.name]) {
+          this.selected[req.body.name] = {}
+        }
+        this.selected[req.body.name][req.body.type] = req.body.params.url
+      } else if (req.body.method === "toggleMenu") {
+        if (!this.menu_hidden[req.body.name]) {
+          this.menu_hidden[req.body.name] = {}
+        }
+        if (this.menu_hidden[req.body.name][req.body.type]) {
+          this.menu_hidden[req.body.name][req.body.type] = false
+        } else {
+          this.menu_hidden[req.body.name][req.body.type] = true
+        }
+      }
+      console.log("select", req.body)
+      res.json({
+        success: true
+      })
+    }))
     this.app.post("/mkdir", ex(async (req, res) => {
       let folder = req.body.folder
       let folder_path = path.resolve(this.kernel.api.userdir, req.body.folder)
@@ -4194,6 +4250,7 @@ class Server {
       let fullpath = path.resolve(this.kernel.homedir, req.body.filepath, "ENVIRONMENT")
       let updated = req.body.vals
       let hosts = req.body.hosts
+      console.log("Util.update_env", { fullpath, filepath: req.body.filepath, updated })
       await Util.update_env(fullpath, updated)
       // for all environment variables that have hosts, save the key as well
       // hosts := { env_key: host }

package/server/public/style.css

@@ -637,19 +637,22 @@ form.search > * {
   margin: 10px;
   */
 }
+/*
 body.dark form.search {
   border-left: 10px solid rgba(255,255,255,0.1);
 }
+*/
 form.search {
+/*
   border-left: 10px solid rgba(0,0,0,0.04);
-  padding: 0px;
+  */
   /*
   background: #F5F4FA;
   */
   margin: 0;
   display: flex;
   flex-grow: 1;
-  padding: 10px;
+  padding: 0 10px 20px;
 }
 .input-form {
   padding: 10px;
@@ -996,7 +999,7 @@ header {
   padding: 10px;
   top: 0;
   box-sizing: border-box;
-  z-index: 100000;
+  z-index: 1000;
 }
 #reinstall {
   padding: 10px 20px;

package/server/socket.js

@@ -158,7 +158,6 @@ class Socket {
               paste: req.paste
             })
           } else if (req.resize && req.id) {
-            console.log("RESIZE", req)
             this.parent.kernel.shell.resize({
               id: req.id,
               resize: req.resize

package/server/views/app.ejs

@@ -178,7 +178,7 @@ body.dark .header-item.btn {
   color: var(--dark-color);
 }
 .header-item.btn {
-  padding: 6px 8px;
+  padding: 5px 8px;
   background: none !important;
   color: var(--light-color);
 }
@@ -210,7 +210,7 @@ body.dark #new-window {
 }
 */
 .app-info-card img {
-  padding: 10px;
+  margin-right: 10px;
 }
 .app-info {
   
@@ -219,7 +219,6 @@ body.dark #new-window {
   */
   box-sizing: border-box;
   text-align: center;;
-  font-weight: bold;
   align-items: center;
   /*
   background: rgba(0,0,0,0.04);
@@ -316,8 +315,32 @@ body.dark .app-info .mode-section .btn {
 body.dark .app-info-card > * {
   color: var(--dark-color);
 }
+.app-info-container {
+  padding: 10px 0;
+  min-width: 0;
+  text-overflow: ellipsis;
+}
 .app-info-title {
+  width: 100%;
+  font-weight: bold;
+  /*
   padding: 15px 0;
+  */
+}
+.app-info-description.collapsed {
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+
+  display: box;         /* For the future */
+  line-clamp: 3;        /* For future spec */
+  box-orient: vertical;
+
+  overflow: hidden;
+}
+.app-info-description {
+  word-wrap: break-word;
+  width: 100%;
 }
 .footer {
 /*
@@ -457,15 +480,18 @@ body.dark .grid-btns .btn2 {
   margin-right: 10px;
 }
 .tab i {
-  margin-right: 10px;
+  margin-right: 6px;
   font-size: 14px;
-  width: 14px;
+  padding: 2px;
+  border-radius: 4px;
 }
 .menu-item-image {
-  width: 16px !important;
-  height: 16px !important;
-  margin-right: 10px;
+  width: 18px !important;
+  height: 18px !important;
+  margin-right: 6px;
   background: white;
+  padding: 2px;
+  border-radius: 20px;
 }
 .temp-menu {
 /*
@@ -733,6 +759,28 @@ body.dark .top-menu .btn2.selected {
   background: black;
   color: white;
 }
+body.minimized #collapse {
+  background: none;
+}
+body.dark #collapse {
+  background: rgba(255,255,255,0.07);
+}
+#collapse {
+  background: rgba(0,0,0,0.04);
+}
+body.dark .mode-selector .btn2.selected {
+  background: rgba(255,255,255,0.07);
+}
+.mode-selector .btn2.selected {
+  background: rgba(0,0,0,0.04);
+}
+.mode-selector {
+  display: flex;
+}
+.mode-selector .btn2 {
+  padding: 10px 0;
+  min-width: 40px;
+}
 
 @media only screen and (max-width: 1000px) {
   .url-bar {
@@ -815,12 +863,13 @@ body.dark .top-menu .btn2.selected {
 <script src="/popper.min.js"></script>
 <script src="/tippy-bundle.umd.min.js"></script>
 </head>
-<body class='<%=theme%>' data-platform="<%=platform%>" data-agent="<%=agent%>">
+<body class='<%=theme%> <%=minimized ? "minimized" : ""%>' data-platform="<%=platform%>" data-agent="<%=agent%>">
 <header class='navheader grabbable'>
 <h1>
 <a class='home' href="/">
   <img class='icon' src="/pinokio-black.png">
 </a>
+<!--
 <div class='app-icon'>
   <% if (config.icon) { %>
     <img src="<%=config.icon%>"/>
@@ -828,9 +877,20 @@ body.dark .top-menu .btn2.selected {
     <i class="fa-regular fa-circle-dot"></i>
   <% } %>
 </div>
+-->
 <button class='btn2' id='back'><div><i class="fa-solid fa-chevron-left"></i></div><div>Prev</div></button>
 <button class='btn2' id='forward'><div><i class="fa-solid fa-chevron-right"></i></div><div>Next</div></button>
 <button class='btn2' id='refresh-page'><div><i class="fa-solid fa-rotate-right"></i></div><div>Refresh</div></button>
+<div class='mode-selector'>
+  <button id='collapse' class='btn2'><div><i class="fa-solid fa-bars"></i></div><div id='collapse-text'>menu</div></button>
+  <% if (type === "run") { %>
+    <a id='switch-dev' class='btn2' href="<%=home.endsWith("/") ? home : home + "/" %>dev"><div><i class="fa-solid fa-code"></i></div><div>dev</div></a>
+    <a class='btn2 selected'><div><i class="fa-solid fa-circle-play"></i></div><div>run</div></a>
+  <% } else { %>
+    <a id='switch-dev' class='btn2 selected'><div><i class="fa-solid fa-code"></i></div><div>dev</div></a>
+    <a class='btn2' href="."><div><i class="fa-solid fa-circle-play"></i></div><div>run</div></a>
+  <% } %>
+</div>
 <div class='flexible filler'></div>
 <div class='url-bar'>
   <% if (current_urls.https) { %>
@@ -857,18 +917,6 @@ body.dark .top-menu .btn2.selected {
 </header>
 <div class='appcanvas'>
 <aside class='active'>
-  <div class='header-top header-item header-menu'>
-    <div class='top-menu'>
-      <button id='collapse' class='btn2'><i class="fa-solid fa-chevron-up"></i> hide</button>
-      <% if (type === "run") { %>
-        <a id='switch-dev' class='btn2' href="<%=home.endsWith("/") ? home : home + "/" %>dev"><i class="fa-solid fa-code"></i> dev</a>
-        <a class='btn2 selected'><i class="fa-solid fa-circle-play"></i> run</a>
-      <% } else { %>
-        <a id='switch-dev' class='btn2 selected'><i class="fa-solid fa-code"></i> dev</a>
-        <a class='btn2' href="."><i class="fa-solid fa-circle-play"></i> run</a>
-      <% } %>
-    </div>
-  </div>
   <div class='header-top header-item'>
     <div class='app-info'>
       <div class='app-info-card'>
@@ -877,7 +925,10 @@ body.dark .top-menu .btn2.selected {
         <% } else { %>
           <i class="fa-regular fa-circle-dot"></i>
         <% } %>
-        <div class='app-info-title'><%=config.title%></div>
+        <div class='app-info-container'>
+          <div class='app-info-title'><%=config.title%></div>
+          <div class='app-info-description collapsed'><%=config.description%></div>
+        </div>
       </div>
       <div class='header-btns <%=type === 'run' ? 'hidden' : ''%>'>
         <div class='btn header-item frame-link revealer' id='edit-toggle' data-group='.edit-group'>
@@ -1066,11 +1117,20 @@ body.dark .top-menu .btn2.selected {
   let loaded = {}
   let cursorIndex = 0;
   let interacted = false
-  document.querySelector(".app-icon").addEventListener("click", (e) => {
-    document.body.classList.toggle("minimized")
-  })
   document.querySelector("#collapse").addEventListener("click", (e) => {
     document.body.classList.toggle("minimized")
+    fetch("/state", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify({
+        name: "<%=name%>",
+        type: "<%=type%>",
+        method: "toggleMenu"
+      })
+    }).then((res) => {
+    })
   })
   document.addEventListener("click", (e) => {
     interacted = true
@@ -1085,13 +1145,15 @@ body.dark .top-menu .btn2.selected {
   });
   <% } %>
   <% if (type === "run" && config.meta_required) { %>
-  tippy('#switch-dev', {
-    arrow: true,
-    showOnCreate: true,
-    theme: "pointer",
-    placement: "bottom-end",
-    content: "Switch to dev mode to make changes to the app"
-  });
+  setTimeout(() => {
+    tippy('#switch-dev', {
+      arrow: true,
+      showOnCreate: true,
+      theme: "pointer",
+      placement: "bottom-end",
+      content: "Switch to dev mode to make changes to the app"
+    });
+  }, 500)
   <% } %>
   const n = new N()
   const getTarget = (href) => {
@@ -1177,7 +1239,7 @@ body.dark .top-menu .btn2.selected {
   //    */
   //  }
   }
-  const renderSelection = (e, force) => {
+  const renderSelection = async (e, force) => {
     let selection = null
     <% if (type === "run" && env.PINOKIO_SCRIPT_DEFAULT && env.PINOKIO_SCRIPT_DEFAULT.toString().toLowerCase() === "true") { %>
       selection = document.querySelector("[data-default]")
@@ -1277,6 +1339,26 @@ body.dark .top-menu .btn2.selected {
         })
         target.classList.add("selected")
 
+        // save target.href
+        <% if (type !== "run") { %>
+          let _url = new URL(target.href)
+          fetch("/state", {
+            method: "POST",
+            headers: {
+              "Content-Type": "application/json"
+            },
+            body: JSON.stringify({
+              name: "<%=name%>",
+              type: "<%=type%>",
+              method: "select",
+              params: {
+                url: _url.pathname + _url.search + _url.hash,
+              }
+            })
+          }).then((res) => {
+          })
+        <% } %>
+
         // hide all frames
         document.querySelectorAll("iframe").forEach((el) => {
           el.classList.add("hidden")
@@ -1681,6 +1763,11 @@ body.dark .top-menu .btn2.selected {
     }
     */
   })
+  document.querySelector(".app-info-description").addEventListener("click", (e) => {
+    e.preventDefault()
+    e.stopPropagation()
+    e.target.classList.toggle("collapsed")
+  })
   document.querySelector("#delete").addEventListener("click", async (e) => {
     e.preventDefault()
     e.stopPropagation()
@@ -1953,14 +2040,7 @@ body.dark .top-menu .btn2.selected {
           <% } %>
           return
         } else {
-          //location.hash = target.target
-
 
-  //        let id = getTarget(target.getAttribute("href"))
-  //        console.log("ID", id, target.href)
-  //        location.hash = id
-
-          //location.hash = target.getAttribute("href")
 
           if (target.closest(".h")) {
             if (target.target) {
@@ -2097,7 +2177,9 @@ body.dark .top-menu .btn2.selected {
     // render the selected frame only if not silent
     if (silent) {
     } else {
+      <% if (type === 'run') { %>
       renderSelection()
+      <% } %>
     }
   }
   if (document.querySelector("#genlog")) {
@@ -2204,6 +2286,14 @@ body.dark .top-menu .btn2.selected {
   });
   refresh_du()
   refresh_du("logs")
+  fetch("/state/<%=type%>/<%=name%>").then((res) => {
+    return res.json()
+  }).then((res) => {
+    if (res.selected) {
+      let selection = document.querySelector(`[href='${res.selected}']`)
+      selection.click()
+    }
+  })
   <% if (type !== 'run') { %>
     fetch("<%=repos%>").then((res) => {
       return res.text()

package/server/views/git.ejs

@@ -660,8 +660,11 @@ document.querySelector(".changes").addEventListener("click", (e) => {
     }
   }
   if (href) {
-    document.querySelector("#term").classList.remove("hidden")
-    window.open(href, "terminal")
+    let c = confirm("are you sure? this will reset the file to the previous version.")
+    if (c) {
+      document.querySelector("#term").classList.remove("hidden")
+      window.open(href, "terminal")
+    }
   }
 })
 document.querySelector("aside").addEventListener("click", (e) => {
@@ -689,7 +692,6 @@ document.querySelector("aside").addEventListener("click", (e) => {
     let href = target.getAttribute("data-href")
 
     let ref = document.querySelector("aside").getAttribute("data-ref")
-    debugger
 
     fetch(href).then((res) => {
       return res.json()
@@ -730,8 +732,6 @@ document.querySelector("aside").addEventListener("click", (e) => {
   }
 })
 window.addEventListener('message', (event) => {
-  console.log(">> EVENT", event)
-  debugger
   if (event.data) {
     if (event.data.callback) {
       if (event.data.callback.startsWith("$")) {

package/server/views/index.ejs

@@ -155,6 +155,11 @@ body.dark .context-menu-wrapper {
   text-align: left;
   color: black;
 }
+.app-btns .btn {
+  border-radius: 20px;
+  width: 70px;
+  text-align: center;
+}
 body.dark .context-menu .btn {
   color: white;
 }
@@ -304,14 +309,20 @@ body.dark .open-menu, body.dark .browse {
 <% if (ishome) { %>
   <form class='search'>
   <div class='app-btns'>
-    <a class='btn create-new' id='create-new-folder'><i class="fa-solid fa-plus"></i> New</a>
+    <a class='btn create-new' href="/init"><i class="fa-solid fa-plus"></i> Build</a>
+    <!--
+    <a class='btn create-new' id='create-new-folder'><i class="fa-solid fa-plus"></i> Create</a>
+    -->
+
+
+
     <!--
     <a class='btn create-new' href="/create"><i class="fa-solid fa-folder-plus"></i> Create</a>
     -->
     <a class='btn' id='explore' href="/?mode=explore"><i class="fa-solid fa-magnifying-glass"></i> Discover</a>
   </div>
     <% if (display.includes("form")) { %>
-      <input type='search' class="flexible" placeholder='Filter downloaded apps'>
+      <input type='search' class="flexible" placeholder='Filter apps'>
     <% } else { %>
     <% } %>
   </form>