pinokiod 1.3.42 → 1.3.43

package/kernel/api/cloudflare/index.js

@@ -53,6 +53,10 @@ class C {
     return { uri: cloudflare_url }
   }
   async stop (req, ondata, kernel) {
+    const message = `cloudflared tunnel --url ${req.params.uri}`
+    await kernel.shell.kill({
+      id: message
+    })
   }
 }
 module.exports = C

package/kernel/shells.js

@@ -222,6 +222,7 @@ class Shells {
       for(let i=0; i<shells.length; i++) {
         let shell = shells[i]
         if (shell.id === request.id) {
+          console.log("FOUND SHELL TO KILL", shell.id)
           shell.kill(message, true)
         }
       }
@@ -234,6 +235,7 @@ class Shells {
       for(let i=0; i<shells.length; i++) {
         let shell = shells[i]
         if (shell.group === request.group) {
+          console.log("kill shell ", request.group, i, shell)
           shell.kill(message, true)
         }
       }

package/package.json

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

package/server/index.js

@@ -35,6 +35,7 @@ const Socket = require('./socket')
 const Kernel = require("../kernel")
 const packagejson = require("../package.json")
 const Environment = require("../kernel/environment")
+const Cloudflare = require("../kernel/api/cloudflare")
 class Server {
   constructor(config) {
     this.tabs = {}
@@ -48,6 +49,7 @@ class Server {
     }
     this.kernel.version = this.version
     this.upload = multer();
+    this.cf = new Cloudflare()
 
     // sometimes the C:\Windows\System32 is not in PATH, need to add
     let platform = os.platform()
@@ -206,9 +208,33 @@ class Server {
       await this.renderMenu(uri, name, config, [])
     }
     let platform = os.platform()
+
+
+    // get all memory variable stied to the current repository
+    let api_path = this.kernel.path("api", name)
+    let mem = {}
+    for(let type in this.kernel.memory) {
+      // type := local|global
+      let vars = this.kernel.memory[type]
+      for(let k in vars) {
+        if (k.includes(api_path)) {
+          if (mem[k]) {
+            mem[k][type] = vars[k]
+          } else {
+            mem[k] = {
+              [type]: vars[k]
+            }
+          }
+        }
+      }
+    }
+    console.log("M", mem)
+
+
     //res.render("browser", {
     res.render("browser-experimental", {
       port: this.port,
+      mem,
       type,
       platform,
       running:this.kernel.api.running,
@@ -1111,19 +1137,31 @@ class Server {
  //     console.log("*******", { filepath, pathComponents, U })
 
       let pinokio_proxy = this.kernel.api.proxies["/"]
+      let pinokio_cloudflare = this.cloudflare_pub
 
       let qr = null
+      let qr_cloudflare = null
+      let home_proxy = null
       if (pinokio_proxy && pinokio_proxy.length > 0) {
         qr = await QRCode.toDataURL(pinokio_proxy[0].proxy)
+        home_proxy = pinokio_proxy[0]
+      }
+
+      if (this.cloudflare_pub) {
+        qr_cloudflare = await QRCode.toDataURL(this.cloudflare_pub)
       }
 
 
+
       console.log("running", JSON.stringify(running, null, 2))
 
 
       res.render("index", {
-        proxy: pinokio_proxy[0],
+        home_url: `http://localhost:${this.port}`,
+        proxy: home_proxy,
+        cloudflare_pub: this.cloudflare_pub,
         qr,
+        qr_cloudflare,
         error: error,
         logo: this.logo,
 //        memory: mem,
@@ -1819,7 +1857,7 @@ class Server {
     await this.kernel.init({ port: this.port})
 
     // start proxy for Pinokio itself
-    await this.kernel.api.startProxy("/", `http://127.0.0.1:${this.port}`, "/")
+//    await this.kernel.api.startProxy("/", `http://127.0.0.1:${this.port}`, "/")
 
 //    if (!debug) {
 //      let logsdir = path.resolve(this.kernel.homedir, "logs")
@@ -2020,6 +2058,58 @@ class Server {
 //      }
     })
 
+    this.app.post("/unpublish", async (req, res) => {
+      /*
+        req.body := {
+          type: "local"|"cloudflare"
+        }
+      */
+      if (req.body.type) {
+        if (req.body.type === "local") {
+          await this.kernel.api.stopProxy({
+            uri: `http://127.0.0.1:${this.port}`
+          })
+        } else if (req.body.type === "cloudflare") {
+          console.log("STOP CLOUDFLARE")
+          await this.cf.stop({
+            params: {
+              uri: `http://127.0.0.1:${this.port}`
+            }
+          }, (e) => {
+            process.stdout.write(e.raw)
+          }, this.kernel)
+          this.cloudflare_pub = null
+        }
+        res.json({ success: true })
+      } else {
+        res.json({ error: "type must be 'local' or 'cloudflare'" })
+      }
+    })
+    this.app.post("/publish", async (req, res) => {
+      /*
+        req.body := {
+          type: "local"|"cloudflare"
+        }
+      */
+      if (req.body.type) {
+        if (req.body.type === "local") {
+          await this.kernel.api.startProxy("/", `http://127.0.0.1:${this.port}`, "/")
+        } else if (req.body.type === "cloudflare") {
+          let { uri } = await this.cf.tunnel({
+            params: {
+              uri: `http://127.0.0.1:${this.port}`
+            }
+          }, (e) => {
+            process.stdout.write(e.raw)
+          }, this.kernel)
+          console.log("cloudflare started at " + uri)
+          this.cloudflare_pub = uri
+        }
+        res.json({ success: true })
+      } else {
+        res.json({ error: "type must be 'local' or 'cloudflare'" })
+      }
+    })
     this.app.get("/edit/*", async (req, res) => {
       let pathComponents = req.params[0].split("/")
       let filepath = path.resolve(this.kernel.homedir, req.params[0])

package/server/views/explore.ejs

@@ -116,7 +116,7 @@ body main iframe {
 <script src="/hotkeys.min.js"></script>
 </head>
 <body class='<%=theme%>'>
-<header class='grabbable'>
+<header class='navheader grabbable'>
 <h1>
 <a class='home' href="/"><i class="fa-solid fa-house"></i></a>
 <% paths.forEach((path) => { %>
@@ -135,12 +135,14 @@ body main iframe {
 </form>
 -->
 <div class='flexible'></div>
+<!--
 <div class='nav-btns'>
   <a class='btn2' href='https://discord.gg/TQdNwadtE4' target="_blank"><div><i class="fa-brands fa-discord"></i></div><div>Discord</div></a>
   <a class='btn2' href='https://twitter.com/cocktailpeanut' target="_blank"><div><i class="fa-brands fa-twitter"></i></div><div>Twitter</div></a>
   <a class='btn2' href="/?mode=settings"><div><i class="fa-solid fa-gear"></i></div><div>Settings</div></a>
 </div>
 <button id='new-window' title='open a new window' class='btn2'><i class="fa-solid fa-plus"></i></button>
+-->
 </h1>
 </header>
 <main>

package/server/views/index.ejs

@@ -65,6 +65,54 @@ header .runner {
   background: black;
   color: white;
 }
+.browser-options-btns {
+  display: flex;
+  padding-top: 5px;
+}
+.browser-options-row {
+  display: flex;
+  padding: 5px 0;
+  align-items: flex-start;
+}
+.browser-options-row h3 {
+  margin: 0;
+}
+.browser-options-row .btn.disabled {
+  opacity: 0.7;
+}
+.browser-options-row .btn {
+  font-weight: bold;
+  width: 100px;
+  text-align: center;
+  display: block;
+  margin-right: 10px;
+  flex-shrink: 0;
+  padding: 5px;
+}
+.badge {
+  font-size: 12px;
+  padding: 5px 10px;
+  background: rgba(0,0,100,0.1);
+  border-radius: 5px;
+  display: inline-block;
+  margin-top: 5px;
+}
+a.badge {
+  color: royalblue;
+  text-decoration: none;
+  cursor: pointer;
+}
+.badge a {
+  color: royalblue;
+  text-decoration: none;
+}
+body.dark .btn {
+  color: cornflowerblue;
+  border: 1px solid rgba(255,255,255,0.15);
+}
+body.dark .badge {
+  background: rgba(255,255,255,0.1);
+}
 @media only screen and (max-width: 480px) {
   .btn2 {
     padding: 5px;
@@ -72,6 +120,8 @@ header .runner {
   }
   .nav-btns {
     flex-grow: 1;
+    justify-content: center;
+    padding: 0;
   }
 }
 </style>
@@ -126,9 +176,10 @@ header .runner {
     <a class='btn2' href="/?mode=help"><div><i class="fa-regular fa-face-smile"></i></div><div>Community</div></a>
     <% if (agent === "electron") { %>
       <a class='btn2' data-filepath="<%=filepath%>"><div><i class="fa-regular fa-folder-open"></i></div><div>Files</div></a>
+      <!--
       <a href="/" target="_blank" class='btn2' features="browser"><div><i class="fa-solid fa-arrow-up-right-from-square"></i></div><div>Popout</div></a>
+      -->
     <% } %>
-    <a id='wifi' data-proxy="<%=proxy.proxy%>" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>WiFi Share</div></a>
     <!--
     <a class='btn2' id='report'><div><i class="fa-solid fa-bug"></i></div><div>Report Bug</div></a>
     <a class='btn2' href='https://discord.gg/TQdNwadtE4' target="_blank"><div><i class="fa-brands fa-discord"></i></div><div>Discord</div></a>
@@ -139,8 +190,8 @@ header .runner {
     <!--
     <a class='btn2' id='report'><div><i class="fa-solid fa-question"></i></div><div>Help</div></a>
     -->
+    <button id='new-window' title='open a new window' class='btn2'><div><i class="fa-solid fa-plus"></i></div><div>Window</div></button>
   </div>
-  <button id='new-window' title='open a new window' class='btn2'><i class="fa-solid fa-plus"></i></button>
 <% } %>
 <!--
 <a class='nav-button path' href='https://discord.gg/TQdNwadtE4' target="_blank"><i class="fa-brands fa-discord"></i></a>
@@ -173,12 +224,53 @@ header .runner {
 <div id='terminal' class='hidden'></div>
 <div class='container'>
 <% if (ishome) { %>
-<!--
   <div class='browser-options'>
-    <a href="/" target="_blank" class='btn'><div><i class="fa-solid fa-arrow-up-right-from-square"></i> Open in Browser</div></a>
-    <a id='wifi' data-proxy="<%=proxy.proxy%>" class='btn'><div><i class="fa-solid fa-wifi"></i> WiFi Sharing</div></a>
+    <% if (agent !== "electron") { %>
+      <div class='browser-options-row'>
+        <a href="/" target="_blank" class='btn' features="browser"><div><i class="fa-solid fa-arrow-up-right-from-square"></i> Offline Web</div></a>
+        <div class='flexible'>
+          <h3>Instant Launch</h3>
+          <div>Launch Pinokio and its apps directly from any web browser at <%=home_url%> (Use Pinokio local apps like regular websites)</div>
+        </div>
+      </div>
+    <% } %>
+    <div class='browser-options-row'>
+      <% if (proxy) { %>
+        <a id='wifi-stop' data-proxy="<%=proxy.proxy%>" class='btn'><div><i class="fa-solid fa-stop"></i> Stop</div></a>
+        <div class='flexible'>
+          <h3>Local Share</h3>
+          <div>Access Pinokio from any device on the same network</div>
+          <span class='badge'><i class="fa-solid fa-circle-notch fa-spin"></i> Running at <a href="<%=proxy.proxy%>" target="_blank" features="browser"><%=proxy.proxy%></a></span>
+          <a id='wifi-qr' class='badge'><i class="fa-solid fa-qrcode"></i> Scan QR Code</a>
+        </div>
+      <% } else { %>
+        <a id='wifi' class='btn'><div><i class="fa-solid fa-wifi"></i> Start</div></a>
+        <a id='wifi-starting' class='btn disabled hidden'><div><i class="fa-solid fa-circle-notch fa-spin"></i> Starting</div></a>
+        <div class='flexible'>
+          <h3>Local Share</h3>
+          <div>Access Pinokio from any device on the same network</div>
+        </div>
+      <% } %>
+    </div>
+    <div class='browser-options-row hidden'>
+      <% if (cloudflare_pub) { %>
+        <a id='cloudflare-stop' class='btn'><div><i class="fa-solid fa-stop"></i> Stop</div></a>
+        <div class='flexible'>
+          <h3>Public Share</h3>
+          <div>Open up your Pinokio server to the open internet (anyone with the URL can access)</div>
+          <span class='badge'><i class="fa-solid fa-circle-notch fa-spin"></i> Running at <a href="<%=cloudflare_pub%>" target="_blank" features="browser"><%=cloudflare_pub%></a></span>
+          <a id='cloudflare-qr' class='badge'><i class="fa-solid fa-qrcode"></i> Scan QR Code</a>
+        </div>
+      <% } else { %>
+        <a id='cloudflare' class='btn'><div><i class="fa-solid fa-globe"></i> Start</div></a>
+        <a id='cloudflare-starting' class='btn disabled hidden'><div><i class="fa-solid fa-circle-notch fa-spin"></i> Starting</div></a>
+        <div class='flexible'>
+          <h3>Public Share</h3>
+          <div>Open up your Pinokio server to the open internet (anyone with the URL can access)</div>
+        </div>
+      <% } %>
+    </div>
   </div>
-  -->
   <% if (running.length > 0) { %>
     <div class='running-apps'>
       <div class='header-label'>Running</div>
@@ -707,6 +799,7 @@ document.addEventListener("click", (e) => {
 
 
 
+/*
   target = (e.target.classList.contains(".btn") ? e.target : e.target.closest(".btn"))
   if (target) {
     target.classList.add("clicked")   
@@ -717,13 +810,14 @@ document.addEventListener("click", (e) => {
     target.closest(".line").classList.add("selected")
     return
   }
+  */
 
 
 })
-<% if (qr) { %>
-  document.querySelector("#wifi").addEventListener("click", async (e) => {
+<% if (proxy) { %>
+  document.querySelector("#wifi-qr").addEventListener("click", async (e) => {
     await Swal.fire({
-      title: "Wifi Sharing",
+      title: "Local Share",
       customClass: {
         popup: "min-popup",
         title: "min-title"
@@ -737,7 +831,93 @@ document.addEventListener("click", (e) => {
   </div>`
     })
   })
+  document.querySelector("#wifi-stop").addEventListener("click", async (e) => {
+    let res = await fetch("/unpublish", {
+      method: "post",
+      headers: {
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify({
+        type: "local"
+      })
+    }).then((res) => {
+      return res.json()
+    })
+    console.log(res)
+    location.href = location.href
+  })
+<% } %>
+<% if (cloudflare_pub) { %>
+  document.querySelector("#cloudflare-qr").addEventListener("click", async (e) => {
+    await Swal.fire({
+      title: "Public Share",
+      customClass: {
+        popup: "min-popup",
+        title: "min-title"
+      },
+      showConfirmButton: false,
+      html: `<div class='min-modal'>
+      <div>Access Pinokio from anywhere</div>
+      <div>(powered by cloudflare tunnel)</div>
+      <div><img src="<%=qr_cloudflare%>"></div>
+  <a href="<%=cloudflare_pub%>" target="_blank"><%=cloudflare_pub%></a>
+  </div>`
+    })
+  })
+  document.querySelector("#cloudflare-stop").addEventListener("click", async (e) => {
+    let res = await fetch("/unpublish", {
+      method: "post",
+      headers: {
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify({
+        type: "cloudflare"
+      })
+    }).then((res) => {
+      return res.json()
+    })
+    console.log(res)
+    location.href = location.href
+  })
 <% } %>
+if (document.querySelector("#wifi")) { 
+  document.querySelector("#wifi").addEventListener("click", async (e) => {
+    document.querySelector("#wifi").classList.add("hidden")
+    document.querySelector("#wifi-starting").classList.remove("hidden")
+    let res = await fetch("/publish", {
+      method: "post",
+      headers: {
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify({
+        type: "local"
+      })
+    }).then((res) => {
+      return res.json()
+    })
+    console.log(res)
+    location.href = location.href
+  })
+}
+if (document.querySelector("#cloudflare")) {
+  document.querySelector("#cloudflare").addEventListener("click", async (e) => {
+    document.querySelector("#cloudflare").classList.add("hidden")
+    document.querySelector("#cloudflare-starting").classList.remove("hidden")
+    let res = await fetch("/publish", {
+      method: "post",
+      headers: {
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify({
+        type: "cloudflare"
+      })
+    }).then((res) => {
+      return res.json()
+    })
+    console.log(res)
+    location.href = location.href
+  })
+}
 <% } %>
 
 </script>

package/server/views/settings.ejs

@@ -215,7 +215,7 @@ hr {
   <a class='logo' href="/">dal</a>
 </nav>
   -->
-<header class='grabbable'>
+<header class='navheader grabbable'>
 <h1>
 <a class='home' href="/"><i class="fa-solid fa-house"></i></a>
 <% paths.forEach((path) => { %>