pinokiod 3.18.2 → 3.18.4

package/kernel/api/index.js

@@ -73,10 +73,13 @@ class Api {
     meta.icon = meta.icon ? `/api/${api_name}/${meta.icon}?raw=true` : "/pinokio-black.png"
     meta.path = api_path
     meta.name = meta.title
-    meta.link = `/pinokio/browser/${api_name}/dev#n1`
+    //meta.link = `/pinokio/browser/${api_name}/dev#n1`
+    meta.link = `/p/${api_name}/dev#n1`
     meta.web_path = `/api/${api_name}`
-    meta.ui = `/pinokio/browser/${api_name}`
-    meta.browse = `/pinokio/browser/${api_name}/dev`
+    //meta.ui = `/pinokio/browser/${api_name}`
+    meta.ui = `/p/${api_name}`
+    //meta.browse = `/pinokio/browser/${api_name}/dev`
+    meta.browse = `/p/${api_name}/dev`
     if (!pinokio && !pinokio2 && !pinokio3 ) {
       meta.init_required = true
     }

package/kernel/index.js

@@ -191,11 +191,13 @@ class Kernel {
     let result
     if (type === "web") {
       if (chunks[0] === "api") {
-        result = "/pinokio/browser/" + chunks.slice(1).join("/")
+        //result = "/pinokio/browser/" + chunks.slice(1).join("/")
+        result = "/p/" + chunks.slice(1).join("/")
       }
     } else if (type === "browse" || type === "dev") {
       if (chunks[0] === "api") {
-        result = "/pinokio/browser/" + chunks.slice(1).join("/") + "/dev"
+        //result = "/pinokio/browser/" + chunks.slice(1).join("/") + "/dev"
+        result = "/p/" + chunks.slice(1).join("/") + "/dev"
       }
 //    } else if (type === "web") {
 //      result = "/" + chunks.join("/")
@@ -354,6 +356,8 @@ class Kernel {
       await this.router.remote()
 //      console.timeEnd("> 7. Router Remote"+ts)
 
+      await this.router.custom_domain()
+
       // 8. update caddy config
 //      console.time("> 8. Router Update"+ts)
       await this.router.update()

package/kernel/router/custom_domain_router.js

@@ -0,0 +1,21 @@
+const path = require('path')
+const Common = require('./common')
+const Processor = require('./processor')
+class CustomDomainRouter extends Processor {
+  constructor(router) {
+    super()
+    this.router = router
+    this.common = new Common(router)
+  }
+  handle (peer) {
+    for(let domain in this.router.custom_domains) {
+      let port = this.router.custom_domains[domain]
+      this.common.handle({
+        match: `${domain}.localhost`,
+        dial: `127.0.0.1:${port}`,
+        host: this.router.kernel.peer.host,
+      })
+    }
+  }
+}
+module.exports = CustomDomainRouter

package/kernel/router/index.js

@@ -9,6 +9,7 @@ const PeerHomeRouter = require('./peer_home_router')
 const PeerVariableRouter = require('./peer_variable_router')
 const PeerPortRouter = require('./peer_port_router')
 const PeerPeerRouter = require('./peer_peer_router')
+const CustomDomainRouter = require('./custom_domain_router')
 const Environment = require("../environment")
 class Router {
   constructor(kernel) {
@@ -20,6 +21,7 @@ class Router {
     this.peer_variable_router = new PeerVariableRouter(this)
     this.peer_port_router = new PeerPortRouter(this)
     this.peer_peer_router = new PeerPeerRouter(this)
+    this.custom_domain_router = new CustomDomainRouter(this)
     this.default_prefix = "pinokio"
     this.default_suffix = "localhost"
     this.default_match = this.default_prefix + "." + this.default_suffix
@@ -55,18 +57,41 @@ class Router {
 
     // create a custom_map that maps port to custom router declarations
     /*
+
       custom_routers = {
-        PORT1: <caddy handler>,
-        PORT2: <caddy handler>,
+        ports: {
+          PORT1: <caddy handler>,
+          PORT2: <caddy handler>,
+        }
+        ...
+      }
+
+      custom_domains = {
+        domains: {
+          NAME1: PORT1,
+          NAME2: PORT2,
+          ...
+        }
         ...
       }
+
     */
     this.custom_routers = {}
+    this.custom_domains = {}
     for(let router_path of router_paths) {
       let router_abs_path = this.kernel.path("network", router_path)
       let config = await this.kernel.require(router_abs_path)
-      for(let port in config) {
-        this.custom_routers[port] = config[port]
+      if (config.ports) {
+        let ports = config.ports
+        for(let key in ports) {
+          this.custom_routers[key] = ports[key]
+        }
+      }
+      if (config.domains) {
+        let domains = config.domains
+        for(let key in domains) {
+          this.custom_domains[key] = domains[key]
+        }
       }
     }
 
@@ -204,6 +229,14 @@ class Router {
     this.mapping = this._mapping
     this.info = this._info()
   }
+  async custom_domain() {
+    for(let host in this.kernel.peer.info) {
+      let peer = this.kernel.peer.info[host]
+      this.custom_domain_router.handle(peer)
+    }
+    //await this.fill()
+    this.mapping = this._mapping
+  }
 
   // update caddy config
   async update() {

package/package.json

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

package/server/index.js

@@ -277,7 +277,8 @@ class Server {
       if (x.run) {
         browser_url = "/env/api/" + x.name
       } else {
-        browser_url = "/pinokio/browser/" + x.name
+        //browser_url = "/pinokio/browser/" + x.name
+        browser_url = "/p/" + x.name
       }
       let browser_browse_url = browser_url + "/dev"
       return {
@@ -333,6 +334,30 @@ class Server {
       }
     }
   }
+  async current_urls(current_path) {
+    let router_running = await this.check_router_up()
+    let u = new URL("http://localhost:42000")
+
+    let current_urls = {}
+
+    // http
+    if (current_path) {
+      u.pathname = current_path
+    }
+    current_urls.http = u.toString()
+
+    // https
+    if (router_running.success) {
+      let u = new URL("https://pinokio.localhost")
+      if (current_path) {
+        u.pathname = current_path
+      }
+      current_urls.https = u.toString()
+    }
+
+    return current_urls
+  }
+
   async chrome(req, res, type) {
 
     let { requirements, install_required, requirements_pending, error } = await this.kernel.bin.check({
@@ -487,6 +512,7 @@ class Server {
       feed = this.newsfeed(gitRemote)
     }
 
+
     await this.kernel.plugin.init()
     let plugin = await this.getPlugin(name)
     let plugin_menu = null
@@ -494,7 +520,12 @@ class Server {
       let running_dynamic = this.running_dynamic(name, plugin.menu)
       plugin_menu = plugin.menu.concat(running_dynamic)
     }
+
+
+    let current_urls = await this.current_urls(req.originalUrl.slice(1))
+
     const result = {
+      current_urls,
       path: this.kernel.path("api", name),
       plugin_menu,
       portal: this.portal,
@@ -529,9 +560,9 @@ class Server {
     if (!this.kernel.proto.config) {
       await this.kernel.proto.init()
     }
-    if (!this.kernel.plugin.config) {
-      await this.kernel.plugin.init()
-    }
+//    if (!this.kernel.plugin.config) {
+//      await this.kernel.plugin.init()
+//    }
     res.render("app", result)
   }
   getVariationUrls(req) {
@@ -1398,7 +1429,8 @@ class Server {
           //url: p + "/" + x.name,
           url: _p + "/" + x.name,
 //            url: `${U}/${x.name}`,
-          browser_url: "/pinokio/browser/" + x.name
+          //browser_url: "/pinokio/browser/" + x.name
+          browser_url: "/p/" + x.name
         }
       })
 
@@ -1456,9 +1488,12 @@ class Server {
         }
       }
 
+      let current_urls = await this.current_urls()
+
       if (meta) {
         items = running.concat(notRunning)
         res.render("index", {
+          current_urls,
           portal: this.portal,
           install: this.install,
           folders: null,
@@ -2374,6 +2409,7 @@ class Server {
     }
   }
   async getPlugin(name) {
+    console.log("getPlugin", name)
     if (this.kernel.plugin.config) {
       try {
         let info = new Info(this.kernel)
@@ -2398,6 +2434,46 @@ class Server {
       
     }
   }
+  async check_router_up() {
+    console.log("/check_router_up")
+    // check if caddy is runnign properly
+    //    try https://pinokio.localhost
+    //    if it works, proceed
+    //    if not, redirect
+    let https_running = false
+    try {
+      let res = await axios.get(`http://127.0.0.1:2019/config/`, {
+        timeout: 2000
+      })
+      let test = /pinokio\.localhost/.test(JSON.stringify(res.data))
+      if (test) {
+        https_running = true
+      }
+    } catch (e) {
+      console.log(e)
+    }
+    console.log({ https_running })
+    if (!https_running) {
+      return { error: "pinokio.host not yet available" }
+    }
+
+
+    // check if pinokio.localhost router is running
+    let router_running = false
+    let router = this.kernel.router.published()
+    for(let ip in router) {
+      let domains = router[ip]
+      if (domains.includes("pinokio.localhost")) {
+        router_running = true
+        break
+      }
+    }
+    if (!router_running) {
+      return { error: "pinokio.localhost not yet available" }
+    }
+
+    return { success: true }
+  }
 
   async start(options) {
     this.debug = false
@@ -2490,12 +2566,15 @@ class Server {
         await fse.remove(p)
         console.log(`[DONE] reset ${p}`)
 
-        let p2 = path.resolve(home, "prototype")
+        let p2 = path.resolve(home, "prototype/system")
         await fse.remove(p2)
 
         let p3 = path.resolve(home, "plugin")
         await fse.remove(p3)
 
+        let p4 = path.resolve(home, "network/system")
+        await fse.remove(p4)
+
         let gitconfig = path.resolve(home, "gitconfig")
         await fse.remove(gitconfig)
         
@@ -2826,51 +2905,8 @@ class Server {
     }))
 
     this.app.get("/check_router_up", ex(async (req, res) => {
-      console.log("/check_router_up")
-      // check if caddy is runnign properly
-      //    try https://pinokio.localhost
-      //    if it works, proceed
-      //    if not, redirect
-      let https_running = false
-      try {
-        let res = await axios.get(`http://127.0.0.1:2019/config/`, {
-          timeout: 2000
-        })
-        let test = /pinokio\.localhost/.test(JSON.stringify(res.data))
-        if (test) {
-          https_running = true
-        }
-      } catch (e) {
-        console.log(e)
-      }
-      console.log({ https_running })
-      if (!https_running) {
-        res.json({ error: "pinokio.host not yet available" })
-//        res.redirect("/setup/connect?callback=/connect/" + req.params.provider)
-        return
-      }
-
-
-      // check if pinokio.localhost router is running
-      let router_running = false
-      let router = this.kernel.router.published()
-      for(let ip in router) {
-        let domains = router[ip]
-        if (domains.includes("pinokio.localhost")) {
-          router_running = true
-          break
-        }
-      }
-      console.log({ router_running })
-      if (!router_running) {
-        res.json({ error: "pinokio.localhost not yet available" })
-//        res.redirect("/setup/connect?callback=/connect/" + req.params.provider)
-        return
-      }
-
-      console.log("router is up")
-
-      res.json({ success: true })
+      let response = await this.check_router_up()
+      res.json(response)
     }))
 
     /*
@@ -3442,6 +3478,10 @@ class Server {
       await rimraf(caddy_path)
       let caddy_path2 = this.kernel.path("cache/XDG_CONFIG_HOME/caddy")
       await rimraf(caddy_path2)
+
+      let custom_network_path = path.resolve(home, "network/system")
+      await fse.remove(custom_network_path)
+
       res.json({ success: true })
     }))
     this.app.get("/requirements_check/:name", ex(async (req, res) => {
@@ -3613,7 +3653,8 @@ class Server {
 //        await fs.promises.writeFile(meta_path, JSON.stringify(meta, null, 2))
 
         res.json({
-          success: "/pinokio/browser/"+folder
+          //success: "/pinokio/browser/"+folder
+          success: "/p/"+folder
         })
       } catch (e) {
         res.json({
@@ -3627,7 +3668,8 @@ class Server {
       try {
         await fs.promises.cp(src_path, dest_path, { recursive: true })
         res.json({
-          success: "/pinokio/browser/"+ req.body.dest + "/dev"
+          //success: "/pinokio/browser/"+ req.body.dest + "/dev"
+          success: "/p/"+ req.body.dest + "/dev"
         })
       } catch (e) {
         res.json({
@@ -4100,7 +4142,8 @@ class Server {
         }
       } else {
         // if pinokio.js doesn't exist, send to /browser/:name
-        res.redirect(`/pinokio/browser/${req.params.name}`)
+        //res.redirect(`/pinokio/browser/${req.params.name}`)
+        res.redirect(`/p/${req.params.name}`)
       }
     }))
     this.app.get("/share/:name", ex(async (req, res) => {
@@ -4282,7 +4325,7 @@ class Server {
       }
     }))
     this.app.get("/pinokio/dynamic/:name", ex(async (req, res) => {
-      await this.kernel.plugin.init()
+  //    await this.kernel.plugin.init()
       let plugin = await this.getPlugin(req.params.name)
       let html = ""
       if (plugin && plugin.menu && Array.isArray(plugin.menu)) {
@@ -4433,6 +4476,7 @@ class Server {
       res.json({ success: true })
     }))
     this.app.get("/pinokio/browser", ex(async (req, res) => {
+      console.log("GET /pinokio/browser")
       if (req.query && req.query.uri) {
         let uri = req.query.uri
         let p = this.kernel.api.resolveBrowserPath(uri)
@@ -4456,6 +4500,18 @@ class Server {
       console.log("run mode")
       this.chrome(req, res, "run")
     }))
+    this.app.get("/p/:name/dev", ex(async (req, res) => {
+      console.log("browse mode")
+      this.chrome(req, res, "browse")
+    }))
+    this.app.get("/p/:name/browse", ex(async (req, res) => {
+      console.log("browse mode")
+      this.chrome(req, res, "browse")
+    }))
+    this.app.get("/p/:name", ex(async (req, res) => {
+      console.log("run mode")
+      this.chrome(req, res, "run")
+    }))
     this.app.post("/pinokio/delete", ex(async (req, res) => {
       try {
         if (req.body.type === 'bin') {

package/server/public/electron.css

@@ -26,7 +26,10 @@ aside {
   cursor: auto !important;
 }
 header.grabbable {
+/*
   padding: 32px 10px 0 !important;
+  */
+  padding: 22px 10px 0 !important;
 }
 /*
 header {

package/server/public/style.css

@@ -104,6 +104,8 @@ body.dark *::-webkit-scrollbar-thumb {
   border-radius: 0 !important;
   border: 2px dotted silver !important;
 }
+.app-btns {
+}
 .drawer {
   max-height: 100000px;
   overflow: hidden;
@@ -143,6 +145,48 @@ body.dark .dynamic.selected {
   */
 }
 
+.url-bar {
+  font-family: verdana;
+  font-size: 13px;
+  line-height: 15px;
+  padding: 0 10px;
+  font-weight: normal;
+  flex-grow: 1;
+}
+.url-bar .http-url:hover {
+  color: firebrick;
+  border-color: firebrick;
+}
+.url-bar .https-url:hover {
+  color: firebrick;
+  border-color: firebrick;
+}
+.url-bar .https-url {
+  cursor: pointer;
+  display: block;
+  text-decoration: none;
+  /*
+  color: #83ab32;
+  */
+  color: silver;
+  /*
+  padding-left: 5px;
+  border-left: 10px solid #83ab32;
+  */
+}
+.url-bar .http-url {
+  cursor: pointer;
+  display: block;
+  text-decoration: none;
+  /*
+  color: royalblue;
+  */
+  color: silver;
+  /*
+  padding-left: 5px;
+  border-left: 10px solid royalblue;
+  */
+}
 
 .loader-container {
   background: rgba(0,0,0,0.2) !important;
@@ -587,7 +631,11 @@ 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;
@@ -595,6 +643,7 @@ form.search {
   margin: 0;
   display: flex;
   flex-grow: 1;
+  padding: 10px;
 }
 .input-form {
   padding: 10px;

package/server/views/app.ejs

@@ -747,13 +747,21 @@ body.dark .appcanvas {
 <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>
-<a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
+<div class='url-bar'>
+  <% if (current_urls.https) { %>
+    <a class='https-url' target="_blank" href="<%=current_urls.https%>"><i class="fa-solid fa-square-arrow-up-right"></i> <%=current_urls.https%></a>
+  <% } %>
+  <% if (current_urls.http) { %>
+    <a class='http-url' target="_blank" href="<%=current_urls.http%>"><i class="fa-solid fa-square-arrow-up-right"></i> <%=current_urls.http%></a>
+  <% } %>
+</div>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>
 <a href="/connect" class='btn2'><div><i class="fa-solid fa-circle-user"></i></div><div>Connect</div></a>
+<!--
 <input type='url' id='location' readonly value="<%=execUrl%>">
 <a id='open-location' target="_blank" features="browser"><i class="fa-solid fa-arrow-up-right-from-square"></i></a>
+-->
 <div class='nav-btns'>
-  <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
   <a class='btn2' href="<%=portal%>" target="_blank"><div><i class="fa-solid fa-question"></i></div><div>Help</div></a>
   <button class='btn2' id='genlog'><div><i class="fa-solid fa-laptop-code"></i></div><div>Logs</div></button>
   <a id='downloadlogs' download class='hidden btn2' href="/pinokio/logs.zip"><div><i class="fa-solid fa-download"></i></div><div>Download logs</div></a>
@@ -1106,14 +1114,14 @@ body.dark .appcanvas {
 
         //document.querySelector("#location").value = url
 
-        document.querySelector("#open-location").setAttribute('href', target.href)
-        if (target.pathname.startsWith("/run")) {
-          document.querySelector("#location").value = target.pathname.slice(4)
-        } else if (target.pathname.startsWith("/api")) {
-          document.querySelector("#location").value = target.pathname
-        } else {
-          document.querySelector("#location").value = target.href
-        }
+//        document.querySelector("#open-location").setAttribute('href', target.href)
+//        if (target.pathname.startsWith("/run")) {
+//          document.querySelector("#location").value = target.pathname.slice(4)
+//        } else if (target.pathname.startsWith("/api")) {
+//          document.querySelector("#location").value = target.pathname
+//        } else {
+//          document.querySelector("#location").value = target.href
+//        }
 
 
         // select the selected target element (tab)

package/server/views/connect/x.ejs

@@ -195,12 +195,10 @@ pre {
 <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>
-<a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
+<div class='flexible'></div>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>
 <a href="/connect" class='btn2'><div><i class="fa-solid fa-circle-user"></i></div><div>Connect</div></a>
-<div class='flexible'></div>
 <div class='nav-btns'>
-  <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
   <a class='btn2' href="<%=portal%>" target="_blank"><div><i class="fa-solid fa-question"></i></div><div>Help</div></a>
   <a class='btn2' href="/?mode=settings"><div><i class="fa-solid fa-gear"></i></div><div>Settings</div></a>
   <button id='new-window' title='open a new window' class='btn2' data-agent="<%=agent%>"><div><i class="fa-solid fa-plus"></i></div><div>Window</div></button>

package/server/views/connect.ejs

@@ -222,6 +222,7 @@ body.dark .config {
 <script src="/sweetalert2.js"></script>
 <script src="/common.js"></script>
 <script src="/opener.js"></script>
+<script src="/nav.js"></script>
 </head>
 <body class='<%=theme%>' data-agent="<%=agent%>">
 <header class='navheader grabbable'>
@@ -230,12 +231,10 @@ body.dark .config {
 <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>
-<a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
+<div class='flexible'></div>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>
 <a href="/connect" class='btn2'><div><i class="fa-solid fa-circle-user"></i></div><div>Connect</div></a>
-<div class='flexible'></div>
 <div class='nav-btns'>
-  <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
   <a class='btn2' href="<%=portal%>" target="_blank"><div><i class="fa-solid fa-question"></i></div><div>Help</div></a>
   <button class='btn2' id='genlog'><div><i class="fa-solid fa-laptop-code"></i></div><div>Logs</div></button>
   <a id='downloadlogs' download class='hidden btn2' href="/pinokio/logs.zip"><div><i class="fa-solid fa-download"></i></div><div>Download logs</div></a>

package/server/views/download.ejs

@@ -115,12 +115,10 @@ body.frozen {
 <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>
-<a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>
 <a href="/connect" class='btn2'><div><i class="fa-solid fa-circle-user"></i></div><div>Connect</div></a>
 <div class='flexible'></div>
 <div class='nav-btns'>
-  <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
   <a class='btn2' href="<%=portal%>" target="_blank"><div><i class="fa-solid fa-question"></i></div><div>Help</div></a>
   <button class='btn2' id='genlog'><div><i class="fa-solid fa-laptop-code"></i></div><div>Logs</div></button>
   <a id='downloadlogs' download class='hidden btn2' href="/pinokio/logs.zip"><div><i class="fa-solid fa-download"></i></div><div>Download logs</div></a>

package/server/views/env_editor.ejs

@@ -247,7 +247,8 @@ document.addEventListener("DOMContentLoaded", async () => {
     })
     console.log("res" ,res)
     <% if (init && name) { %>
-      location.href = "/pinokio/browser/<%=name%>"
+      //location.href = "/pinokio/browser/<%=name%>"
+      location.href = "/p/<%=name%>"
     <% } else { %>
       n.Noty({
         text: `Updated!`

package/server/views/explore.ejs

@@ -124,12 +124,10 @@ body main iframe {
 <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>
-<a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
+<div class='flexible'></div>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>
 <a href="/connect" class='btn2'><div><i class="fa-solid fa-circle-user"></i></div><div>Connect</div></a>
-<div class='flexible'></div>
 <div class='nav-btns'>
-  <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
   <a class='btn2' href="<%=portal%>" target="_blank"><div><i class="fa-solid fa-question"></i></div><div>Help</div></a>
   <button class='btn2' id='genlog'><div><i class="fa-solid fa-laptop-code"></i></div><div>Logs</div></button>
   <a id='downloadlogs' download class='hidden btn2' href="/pinokio/logs.zip"><div><i class="fa-solid fa-download"></i></div><div>Download logs</div></a>

package/server/views/file_explorer.ejs

@@ -182,7 +182,6 @@ body.dark .browser-options-row {
 </form>
 <% if (ishome) { %>
   <div class='nav-btns'>
-    <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
     <a class='btn2' href="<%=portal%>" target="_blank"><div><i class="fa-solid fa-question"></i></div><div>Help</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>

package/server/views/github.ejs

@@ -209,12 +209,10 @@ hr {
 <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>
-<a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>
 <a href="/connect" class='btn2'><div><i class="fa-solid fa-circle-user"></i></div><div>Connect</div></a>
 <div class='flexible'></div>
 <div class='nav-btns'>
-  <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
   <a class='btn2' href="<%=portal%>" target="_blank"><div><i class="fa-solid fa-question"></i></div><div>Help</div></a>
   <button class='btn2' id='genlog'><div><i class="fa-solid fa-laptop-code"></i></div><div>Logs</div></button>
   <a id='downloadlogs' download class='hidden btn2' href="/pinokio/logs.zip"><div><i class="fa-solid fa-download"></i></div><div>Download logs</div></a>

package/server/views/help.ejs

@@ -257,10 +257,8 @@ body.dark .item .tile .badge {
 <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>
-<a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
 <div class='flexible'></div>
 <div class='nav-btns'>
-  <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
   <a class='btn2' href="/?mode=help"><div><i class="fa-regular fa-face-smile"></i></div><div>Community</div></a>
   <a class='btn2' href="/?mode=settings"><div><i class="fa-solid fa-gear"></i></div><div>Settings</div></a>
   <button id='new-window' title='open a new window' class='btn2' data-agent="<%=agent%>"><div><i class="fa-solid fa-plus"></i></div><div>Window</div></button>

package/server/views/index.ejs

@@ -117,7 +117,6 @@ a.badge {
 }
 body.dark .btn {
   color: white;
-  border: 1px solid rgba(255,255,255,0.3);
 }
 body.dark .badge {
   background: rgba(255,255,255,0.1);
@@ -247,10 +246,14 @@ body.dark .open-menu, body.dark .browse {
 <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>
-<a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
-<!--
-<a href="/new" class='btn2'><div><i class='fa-solid fa-folder-plus'></i></div><div>Create</div></a>
--->
+<div class='url-bar'>
+  <% if (current_urls.https) { %>
+    <a class='https-url' target="_blank" href="<%=current_urls.https%>"><i class="fa-solid fa-square-arrow-up-right"></i> <%=current_urls.https%></a>
+  <% } %>
+  <% if (current_urls.http) { %>
+    <a class='http-url' target="_blank" href="<%=current_urls.http%>"><i class="fa-solid fa-square-arrow-up-right"></i> <%=current_urls.http%></a>
+  <% } %>
+</div>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>
 <a href="/connect" class='btn2'><div><i class="fa-solid fa-circle-user"></i></div><div>Connect</div></a>
 <!--
@@ -264,15 +267,8 @@ body.dark .open-menu, body.dark .browse {
     <a class='path' href="<%=path.path%>"><%-path.name%></a>
   <% } %>
 <% }) %>
-<form class='search'>
-  <% if (display.includes("form")) { %>
-    <input type='search' class="flexible" placeholder='Filter downloaded apps'>
-  <% } else { %>
-  <% } %>
-</form>
 <% if (ishome) { %>
   <div class='nav-btns'>
-    <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
     <a class='btn2' href="<%=portal%>" target="_blank"><div><i class="fa-solid fa-question"></i></div><div>Help</div></a>
     <button class='btn2' id='genlog'><div><i class="fa-solid fa-laptop-code"></i></div><div>Logs</div></button>
     <a id='downloadlogs' download class='hidden btn2' href="/pinokio/logs.zip"><div><i class="fa-solid fa-download"></i></div><div>Download logs</div></a>
@@ -306,51 +302,16 @@ body.dark .open-menu, body.dark .browse {
 <div id='terminal' class='hidden'></div>
 <div class='container'>
 <% if (ishome) { %>
-  <% if (running.length === 0 && notRunning.length === 0) { %>
-  <% } else { %>
-    <% if (false) { %>
-    <div class='browser-options'>
-      <% if (agent === "electron") { %>
-        <div class='browser-options-row'>
-          <% if (agent === "electron") { %>
-            <a href="/" target="_blank" class='btn' features="browser"><div><i class="fa-solid fa-square-up-right"></i> Open</div></a>
-          <% } else { %>
-            <a href="/" target="_blank" class='btn'><div><i class="fa-solid fa-square-up-right"></i> Open</div></a>
-          <% } %>
-          <div class='flexible'>
-            <h3><i class="fa-solid fa-bolt"></i> Instant Launch</h3>
-            <div>(Experimental) Directly open pinokio apps from your favorite browser address bar at localhost. If an app you're trying to use is already running, it will instantly load. If it's not, the app will first launch and then load the website.</div>
-          </div>
-        </div>
-      <% } %>
-      <div class='browser-options-row'>
-        <a href="/network" class='btn'><div><i class="fa-solid fa-gauge"></i> Configure</div></a>
-        <div class='flexible'>
-          <h3><i class="fa-solid fa-wifi"></i> Local Sharing</h3>
-          <div>Serve Pinokio, installed apps, and even external apps (example: Ollama) to 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-play"></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>
+  <form class='search'>
+  <div class='app-btns'>
+    <a class='btn create-new' id='create-new-folder'><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'>
+    <% } else { %>
     <% } %>
-  <% } %>
+  </form>
   <% if (running.length > 0) { %>
     <div class='running-apps'>
     <!--

package/server/views/network.ejs

@@ -302,8 +302,13 @@ body.dark .config {
 .config-row input[type=text] {
   padding: 7px;
 }
-.btn.save {
+.btn {
   padding: 8px;
+  margin-right: 10px;
+}
+.btn.reset {
+  background: firebrick;
+  color: white !important;
 }
 .switcher {
   position: relative;
@@ -408,6 +413,7 @@ table h3 {
 <script src="/sweetalert2.js"></script>
 <script src="/common.js"></script>
 <script src="/opener.js"></script>
+<script src="/nav.js"></script>
 </head>
 <body class='<%=theme%>' data-agent="<%=agent%>">
 <header class='navheader grabbable'>
@@ -416,12 +422,10 @@ table h3 {
 <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>
-<a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
+<div class='flexible'></div>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>
 <a href="/connect" class='btn2'><div><i class="fa-solid fa-circle-user"></i></div><div>Connect</div></a>
-<div class='flexible'></div>
 <div class='nav-btns'>
-  <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
   <a class='btn2' href="<%=portal%>" target="_blank"><div><i class="fa-solid fa-question"></i></div><div>Help</div></a>
   <button class='btn2' id='genlog'><div><i class="fa-solid fa-laptop-code"></i></div><div>Logs</div></button>
   <a id='downloadlogs' download class='hidden btn2' href="/pinokio/logs.zip"><div><i class="fa-solid fa-download"></i></div><div>Download logs</div></a>
@@ -457,7 +461,7 @@ table h3 {
     <div class='advanced'>
       <div class='row'>
         <div id='advanced-label' class='link-label label'>Advanced</div>
-        <div id='reset-label' class='link-label label'>Reset HTTPS Certificates</div>
+        <div id='reset-label' class='link-label label'>Reset</div>
       </div>
     </div>
   </div>
@@ -554,7 +558,7 @@ table h3 {
 document.querySelector("#reset-label").addEventListener("click", async (e) => {
   e.preventDefault()
   e.stopPropagation()
-  let ok = confirm("are you sure you want to re-generate http certificates?")
+  let ok = confirm("Are you sure you want to reset the network config? (The peer router will be updated to the latest version; 2. A new HTTPS certificate will be generated)")
   if (ok) {
     let r = await fetch("/network/reset", {
       method: "post",

package/server/views/settings.ejs

@@ -278,9 +278,6 @@ body.dark .keys pre {
 <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>
-<a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
-<a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>
-<a href="/connect" class='btn2'><div><i class="fa-solid fa-circle-user"></i></div><div>Connect</div></a>
 <% paths.forEach((path) => { %>
   <% if (path.action) { %>
     <a class='path nav-button' id="<%=path.id%>" onclick="<%=path.action%>"><%-path.name%></a>
@@ -289,8 +286,9 @@ body.dark .keys pre {
   <% } %>
 <% }) %>
 <div class='flexible'></div>
+<a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>
+<a href="/connect" class='btn2'><div><i class="fa-solid fa-circle-user"></i></div><div>Connect</div></a>
 <div class='nav-btns'>
-  <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
   <a class='btn2' href="<%=portal%>" target="_blank"><div><i class="fa-solid fa-question"></i></div><div>Help</div></a>
   <button class='btn2' id='genlog'><div><i class="fa-solid fa-laptop-code"></i></div><div>Logs</div></button>
   <a id='downloadlogs' download class='hidden btn2' href="/pinokio/logs.zip"><div><i class="fa-solid fa-download"></i></div><div>Download logs</div></a>