pinokiod 1.3.61 → 1.3.63

package/kernel/api/cloudflare/index.js

@@ -12,6 +12,7 @@ class C {
 
       => cloudflared tunnel --url http://localhost:8080
     */
+    console.log("TUNNEL", req)
     const message = `cloudflared tunnel --url ${req.params.uri}`
     let params = {
       id: message,
@@ -25,6 +26,7 @@ class C {
     if (req.cwd) options.cwd = req.cwd
     if (req.parent && req.parent.path) options.group = req.parent.path
     let pattern = /(https:.+?trycloudflare\.com)/
+    console.log("params", params)
     let cloudflare_url = await new Promise((resolve, reject) => {
       kernel.shell.start(params, options, (e) => {
         ondata(e)

package/kernel/environment.js

@@ -66,6 +66,11 @@ const ENVS = [{
   val: (home) => {
     return path.resolve(home, "drive")
   }
+}, {
+  key: "PINOKIO_SCRIPT_DEFAULT",
+  val: (home) => {
+    return "true"
+  }
 }];
 const folders = ENVS.filter((env) => {
   return env.type === "cache_folder" || env.type === "folder"
@@ -141,6 +146,15 @@ const APP_ENV = () => {
     "#",
     "##########################################################################",
     "PINOKIO_SHARE_CLOUDFLARE=false",
+    "",
+    "##########################################################################",
+    "#",
+    "# PINOKIO_SCRIPT_DEFAULT",
+    "# If this variable is false, 'default': true menu items in pinokio.js",
+    "# will NOT automatically run",
+    "#",
+    "##########################################################################",
+    "PINOKIO_SCRIPT_DEFAULT=true",
   ]
   return items.join("\n")
 }

package/kernel/index.js

@@ -43,6 +43,24 @@ class Kernel {
     this.exposed = {}
     this.envs = {}
   }
+  /*
+    kernel.env() => return the system environment
+    kernel.env("api/stablediffusion") => returns the full environment object
+  */
+  async env(...args) {
+    let folderpath
+    if (args) {
+      folderpath = path.resolve(this.homedir, ...args)
+    } else {
+      folderpath = this.homedir
+    }
+    console.log({ args , folderpath,homedir: this.homedir })
+    let api_path = await Util.api_path(folderpath, this)
+    let current_env = await Environment.get(api_path)
+    let default_env = await Environment.get(this.homedir)
+    console.log({ api_path, current_env, default_env })
+    return Object.assign(process.env, default_env, current_env)
+  }
   resumeprocess(uri) {
     let proc = this.procs[uri]
     if (proc && proc.resolve) {

package/kernel/shell.js

@@ -71,6 +71,8 @@ class Shell {
     this.cols = params.cols ? params.cols : 100;
     this.rows = params.rows ? params.rows : 30;
 
+    console.log({ cols: this.cols, rows: this.rows })
+
     this.vt = new Terminal({
       allowProposedApi: true,
       cols: this.cols,

package/package.json

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

package/server/index.js

@@ -234,8 +234,10 @@ class Server {
     let current = this.kernel.path("api", name, "ENVIRONMENT")
       // if environment.json doesn't exist, 
     let exists = await this.exists(current)
+    console.log("exists", exists)
     if (!exists) {
       let content = await Environment.APP_ENV()
+      console.log("write", content)
       await fs.promises.writeFile(current, content)
     }
 
@@ -245,8 +247,12 @@ class Server {
       mode = req.query.mode
     }
 
+    const env = await this.kernel.env("api/" + name)
+    console.log("env", env)
+
     //res.render("browser", {
     res.render("browser-experimental", {
+      env,
       mode,
       port: this.port,
       mem,
@@ -2152,8 +2158,10 @@ class Server {
     this.app.get("/env/*", async (req, res) => {
       let pathComponents = req.params[0].split("/")
       let filepath = path.resolve(this.kernel.homedir, req.params[0])
+      let editorpath = "/edit/" + req.params[0]
       const items = await Util.parse_env_detail(filepath)
       res.render("env_editor", {
+        editorpath,
         items,
         theme: this.theme,
         filepath,

package/server/socket.js

@@ -106,9 +106,17 @@ class Socket {
       //const subscribers = this.subscriptions.get(e.id) || new Set();
       subscribers.forEach((subscriber) => {
         if (subscriber.readyState === WebSocket.OPEN) {
-          delete e.rpc
-          delete e.rawrpc
-          subscriber.send(JSON.stringify(e))
+          let res = Object.assign({}, e)
+          delete res.rpc
+          delete res.rawrpc
+          if (res.data && res.data.id && res.data.raw) {
+            res.data = {
+              id: res.data.id,
+              raw: res.data.raw
+            }
+          }
+          console.log("*** res1", res)
+          subscriber.send(JSON.stringify(res))
         }
       });
     }
@@ -126,9 +134,19 @@ class Socket {
       if (subscribers.size > 0) {
         subscribers.forEach((subscriber) => {
           if (subscriber.readyState === WebSocket.OPEN) {
-            delete e.rpc
-            delete e.rawrpc
-            subscriber.send(JSON.stringify(e))
+
+            let res = Object.assign({}, e)
+            delete res.rpc
+            delete res.rawrpc
+            if (res.data && res.data.id && res.data.raw) {
+              res.data = {
+                id: res.data.id,
+                raw: res.data.raw
+              }
+            }
+            console.log("*** res2", res)
+            subscriber.send(JSON.stringify(res))
+
           }
         });
       }

package/server/views/browser-experimental.ejs

@@ -265,9 +265,11 @@ body.dark .frame-link.selected {
 }
 .loader .btn:hover {
   color: royalblue;
+  border-color: royalblue;
 }
 .loader .btn {
   padding: 4px 8px;
+  border: 1px solid rgba(255,255,255,0.3);
 }
 .frame-link .tab {
   flex-grow: 1;
@@ -348,9 +350,16 @@ body.dark nav {
 }
 .container:hover nav {
   display: block;
+  max-height: 200px;
 }
 nav {
+  overflow: hidden;
+  max-height: 0;
+  transition: max-height 0.4s ease-out;
+
+  /*
   display: none;
+  */
   background: white;
   /*
   position: absolute;
@@ -610,7 +619,7 @@ body.dark .loader-container {
       <button class='btn2' id='clone-tab'><i class='fa-regular fa-copy'></i> Clone</button>
       <a class='btn2' id='open-browser' target="_blank" href="" features="browser"><i class="fa-solid fa-square-arrow-up-right"></i> Popout</a>
       <button class='btn2' id='reload'><i class="fa-solid fa-rotate-right"></i> Refresh</button>
-      <div id='new-tab' class='btn2'><i class="fa-solid fa-plus"></i> New</div>
+      <div id='new-tab' class='btn2'><i class="fa-solid fa-plus"></i> Tab</div>
       <!--
       <button class='btn2 logo' id='reload'><i class="fa-solid fa-rotate-right"></i></button>
       -->
@@ -723,7 +732,7 @@ const renderSelection = (e, force) => {
   console.log("# 1")
   // if the menu has a default item, or if the url specifies a selection
   let selection = null;
-  <% if (type === "run") { %>
+  <% if (type === "run" && env.PINOKIO_SCRIPT_DEFAULT && env.PINOKIO_SCRIPT_DEFAULT.toString().toLowerCase() === "true") { %>
     selection = document.querySelector("[data-default]")
   <% } %>
   if (selection || location.hash && location.hash.length > 0) {
@@ -935,6 +944,9 @@ const renderSelection = (e, force) => {
               targetFrame.src = target.href
             }
           }
+          targetFrame.contentWindow.postMessage({
+            action: "foreground"
+          }, "*")
         }
       } else {
         console.log("# 12")

package/server/views/env_editor.ejs

@@ -162,6 +162,7 @@ document.addEventListener("DOMContentLoaded", async () => {
     <div id='save' class='btn'>
       <span class='save'><i class="fa-solid fa-check"></i> Save</span>
     </div>
+    <a class='btn' href="<%=editorpath%>"><i class="fa-solid fa-pen-to-square"></i> Edit file</a>
     <button class='btn' id='open-fs' data-filepath="<%=filepath%>"><i class="fa-solid fa-eye"></i> Open in File Explorer</button>
   </div>
   </header>

package/server/views/fullscreen_editor.ejs

@@ -139,6 +139,10 @@ document.addEventListener("DOMContentLoaded", async () => {
     constructor() {
       this.socket = new Socket()
     }
+    write(text) {
+      this.term.write(text)
+      this.dirty = true
+    }
     finished() {
     /*
       n.Noty({
@@ -201,7 +205,11 @@ document.addEventListener("DOMContentLoaded", async () => {
             rows: this.term.rows,
           }
         }, async (packet) => {
-//          console.log("packet", packet)
+          
+          console.log("packet", packet.type, packet)
+          if (packet.data) {
+            console.log("packet.data.raw", packet.data.raw)
+          }
           if (packet.type === 'start') {
             refreshParent(packet)
             reloadMemory()
@@ -233,14 +241,15 @@ document.addEventListener("DOMContentLoaded", async () => {
 //              </div>`
             }
           } else if (packet.type === "stream") {
+            console.log({ cols: this.term.cols, rows: this.term.rows })
             if (packet.data.raw) {
-              this.term.write(packet.data.raw)
+              this.write(packet.data.raw)
             } else if (packet.data.json) {
-              this.term.write(JSON.stringify(packet.data.json).replace(/\n/g, "\r\n"))
-              this.term.write("\r\n")
+              this.write(JSON.stringify(packet.data.json).replace(/\n/g, "\r\n"))
+              this.write("\r\n")
             } else if (packet.data.json2) {
-              this.term.write(JSON.stringify(packet.data.json2, null, 2).replace(/\n/g, "\r\n"))
-              this.term.write("\r\n")
+              this.write(JSON.stringify(packet.data.json2, null, 2).replace(/\n/g, "\r\n"))
+              this.write("\r\n")
             }
             document.querySelector(".run .play").classList.add("hidden")
             document.querySelector(".run .starting").classList.add("hidden")
@@ -248,14 +257,14 @@ document.addEventListener("DOMContentLoaded", async () => {
           } else if (packet.type === 'disconnect') {
             refreshParent(packet)
             reloadMemory()
-            this.term.write("\r\nDisconnected...\r\n")
+            //this.term.write("\r\nDisconnected...\r\n")
             document.querySelector("footer").innerHTML = "<b>Ready</b>"
             this.socket.close()
             document.querySelector(".run .play").classList.remove("hidden")
             document.querySelector(".run .stop").classList.add("hidden")
           } else if (packet.type === 'connect') {
             const message = "..........Connected!\r\n"
-            this.term.write(message)
+            this.write(message)
             /*
             for(let i=0; i<message.length; i++) {
               await new Promise((r, reject) => {
@@ -527,6 +536,7 @@ document.addEventListener("DOMContentLoaded", async () => {
     createTerm () {
       if (!this.term) {
         const term = new Terminal({
+          scrollback: 9999999,
           //theme: xtermTheme.Piatto_Light,
           //theme: xtermTheme.Spring,
 
@@ -597,6 +607,41 @@ document.addEventListener("DOMContentLoaded", async () => {
     <% if (mod && runnable) { %>
       window.addEventListener('message', function(event) {
         console.log("Message received from the parent: ", event.data); // Message received from parent
+        //  "foreground" message adds a newline to the terminal
+        // Needed to fix the issue where the terminal won't write anything when in background
+        // so when coming back from background, need to refresh by just adding a newline.
+        if (event.data && event.data.action === "foreground") {
+          
+
+          // if dirty, update
+          // if not dirty, don't update
+          const delimiter = "\r\n"
+          if (rpc.dirty) {
+            rpc.term.write(delimiter)
+            rpc.dirty = false
+          } else {
+          }
+
+          //console.log("buffer", rpc.term.buffer)
+          //if (rpc.term.buffer) {
+          //  const lastRow = rpc.term.buffer.active.baseY;
+          //  const lastLine = rpc.term.buffer.active.getLine(lastRow);
+          //  const lastLine2 = rpc.term.buffer.active.getLine(lastRow-1);
+          //  const cell = lastLine.getCell().getChars()
+          //  const cell2 = lastLine.getCell().getChars()
+          //  console.log({ lastLine, lastLine2, cell, cell2 })
+          //  const lastStr = cell[cell.length - 3];
+          //  console.log({ lastRow, lastLine, lastStr })
+
+          //  const delimiter = "\r\n█"
+          //  if (lastStr === delimiter) {
+          //    console.log("don't update") 
+          //  } else {
+          //    console.log("update")
+          //    rpc.term.write(delimiter)
+          //  }
+          //}
+        }
       });
 
       document.querySelector(".stop").addEventListener("click", async (e) => {

package/server/views/index.ejs

@@ -283,9 +283,6 @@ body.dark .browser-options-row {
               <div class='title'><%=item.name%></div>
               <div class='description'><%=item.description%></div>
               <div>
-                <button class='btn browse' data-src="<%=item.browser_url%>/browse">
-                  <i class="fa-regular fa-folder-open"></i>
-                </button>
                 <% if (item.running_scripts) { %>
                   <% item.running_scripts.forEach((s) => { %>
                       <button class='btn shutdown' data-src="<%=s.path%>">
@@ -333,9 +330,6 @@ body.dark .browser-options-row {
               <div class='uri'><i class="fa-regular fa-folder"></i><%=item.url%></div>
               <div class='title'><%=item.name%></div>
               <div class='description'><%=item.description%></div>
-              <button class='btn browse' data-src="<%=item.browser_url%>/browse">
-                <i class="fa-regular fa-folder-open"></i>
-              </button>
               <% if (item.shortcuts && item.shortcuts.length > 0) { %>
                 <div class='btns'>
                   <% item.shortcuts.forEach((btn) => { %>
@@ -758,7 +752,6 @@ document.addEventListener("click", (e) => {
   }
 
 
-  debugger
   if (e.target.classList.contains("browse")) {
     target = e.target
   } else {
@@ -783,7 +776,6 @@ document.addEventListener("click", (e) => {
       }
 
       console.log("EL", el)
-      debugger
 
       if (el) {
         e.preventDefault()

package/server/views/settings.ejs

@@ -302,7 +302,7 @@ hr {
       <br>
       <div>Edit the system ENVIRONMENT file to customize pinokio system wide settings, such as where files are stored, terminal behavior, etc.</div>
       <br>
-      <a class='btn' href="/env/ENVIRONMENT">Edit ENVIRONMENT</a>
+      <a class='btn' href="/env/ENVIRONMENT"><i class="fa-regular fa-pen-to-square"></i> Edit ENVIRONMENT</a>
     </div>
     <hr/>
     <div class='troubleshoot'>

package/server/views/share_editor.ejs

@@ -109,6 +109,11 @@ body.dark .env-item label {
   display: inline-block;
   margin-bottom: 5px;
   font-weight: bold;
+  font-size: 20px;
+  letter-spacing: -1px;
+}
+.env-item ul {
+  margin: 5px 0;
 }
 .env-item {
   padding-top: 10px;
@@ -173,8 +178,14 @@ document.addEventListener("DOMContentLoaded", async () => {
         <% } else { %>
           <input type="checkbox" id="PINOKIO_SHARE_CLOUDFLARE" name="cloudflare" />
         <% } %>
-        <label for="cloudflare">Share Publicly</label>
-        <div>This will set the PINOKIO_SHARE_CLOUDFLARE environment variable to true, and share your local app to the public internet, powered by <a href="https://www.cloudflare.com/products/tunnel/" target="_blank" features="browser">Cloudflare Tunnel</a></div>
+        <label for="cloudflare"><i class="fa-brands fa-cloudflare"></i> Start a Public Node</label>
+        <ul>
+          <li>This will turn this local app into a public node.</li>
+          <li>Anyone with a URL can access a public node.</li>
+          <li>Users can't access Pinokio itself, only can access each app's UI.</li>
+          <li>Powered by <a href="https://www.cloudflare.com/products/tunnel/" target="_blank" features="browser">Cloudflare Tunnel</a></li>
+          <li>You can manually configure this in through the Configure menu (set PINOKIO_SHARE_CLOUDFLARE to true)</li>
+        </ul>
       </div>
       <div class='env-item'>
         <% if (config.PINOKIO_SHARE_LOCAL.toString() === "true") { %>
@@ -182,8 +193,12 @@ document.addEventListener("DOMContentLoaded", async () => {
         <% } else { %>
           <input type="checkbox" id="PINOKIO_SHARE_LOCAL" name="local" />
         <% } %>
-        <label for="local">Share with Local Network Devices</label>
-        <div>This will set the PINOKIO_SHARE_LOCAL environment variable to true, and share your local app to any device on the same local network</div>
+        <label for="local"><i class="fa-solid fa-network-wired"></i> Share with Local Network</label>
+        <ul>
+          <li>This will allow any device on the same local network to access the app.</li>
+          <li>A new IP will be provided when local sharing is on, which can be used to access from any device on the same network.</li>
+          <li>You can manually configure this through the Configure menu (set PINOKIO_SHARE_LOCAL to true)</li>
+        </ul>
       </div>
       <div class='runner'>
         <div id='save' class='btn'>