pinokiod 3.9.0 → 3.9.2

package/server/views/editor.ejs

@@ -95,9 +95,11 @@ td.key {
 .button:hover {
   
 }
+/*
 #editor {
   background: var(--dark-bg);
 }
+*/
 header .runner {
   padding: 10px 0 0;
 }
@@ -113,6 +115,7 @@ body.frozen {
 }
 </style>
 <script>
+let shell_id
 document.addEventListener("DOMContentLoaded", async () => {
   <% if (error) { %>
     document.querySelector(".requirements .content").innerHTML = '<div class="loading"><i class="fa-solid fa-circle-exclamation"></i> <%=error%></div>'
@@ -152,13 +155,14 @@ document.addEventListener("DOMContentLoaded", async () => {
   <% } %>
   <% if (!install_required) { %>
     let editor = ace.edit("editor");
-    //editor.setTheme("ace/theme/tomorrow");
+    editor.setTheme("ace/theme/tomorrow");
+    //editor.setTheme("ace/theme/github_light_default");
     //editor.setTheme("ace/theme/ambiance");
     //editor.setTheme("ace/theme/idle_fingers");
-    editor.setTheme("ace/theme/nord_dark");
+    //editor.setTheme("ace/theme/nord_dark");
     //editor.setTheme("ace/theme/textmate");
     editor.setOptions({
-      maxLines: Infinity, // set to a large number
+//      maxLines: Infinity, // set to a large number
       minLines: 1 // set to a small number
     });
     console.log("location.pathname", location.pathname)
@@ -329,10 +333,37 @@ document.addEventListener("DOMContentLoaded", async () => {
             document.querySelector(".run .play").classList.remove("hidden")
             document.querySelector(".run .stop").classList.add("hidden")
 
+            <% if (kill_message) { %>
+              n.Noty({
+                text: "<%-kill_message%>",
+  //              timeout: 3000,
+                <% if (callback) { %>
+                callbacks: {
+                  onClose: () => {
+                    location.href = "<%=callback%>"
+                  }
+                }
+                <% } %>
+              })
+            <% } else { %>
+              <% if (callback) { %>
+              location.href = "<%=callback%>"
+              <% } %>
+            <% } %>
+
           } else if (packet.type === 'connect') {
 //            document.querySelector(".terminal-container").classList.remove("hidden")
-            const message = "..........Connected!\r\n"
-            this.term.write(message)
+            if (packet.data.id) {
+              shell_id = packet.data.id
+            }
+            if (packet.data) {
+              if (packet.data.shell) {
+                shell_id = packet.data.shell
+              }
+              if (packet.data.state) {
+                this.write(packet.data.state)
+              }
+            }
             /*
             for(let i=0; i<message.length; i++) {
               await new Promise((r, reject) => {
@@ -391,6 +422,25 @@ document.addEventListener("DOMContentLoaded", async () => {
             */
           } else if (packet.type === "tab.open") {
 //            refreshParent(packet)
+          } else if (packet.type === "web.open") {
+          /*
+            {
+              "method": "web.open",
+              "params": {
+                "uri",
+                "target": "_self (default)"|"_blank"|"_parent"|"_top",
+                "features"
+              }
+            }
+            */
+
+            refreshParent()
+            let params = packet.data
+            window.open(
+              params.uri,
+              (params.target || "_self"),
+              params.features
+            )
           } else if (packet.type === "browser.open") {
           /*
             {
@@ -578,14 +628,23 @@ document.addEventListener("DOMContentLoaded", async () => {
 //        })
 //      }
 
-      await this.createTerm()
+      <% if (theme === "dark") { %>
+      await this.createTerm(xtermTheme.FrontEndDelight)
+      <% } else { %>
+      await this.createTerm(xtermTheme.Tomorrow)
+      <% } %>
       await this.start(mode)
     }
-    async createTerm () {
+    async createTerm (_theme) {
       if (!this.term) {
+        const theme = Object.assign({ }, _theme, {
+          selectionBackground: "red",
+          selectionForeground: "white"
+        })
         let config = {
-          fontSize: 12,
-          theme: xtermTheme.FrontEndDelight
+          scrollback: 9999999,
+          fontSize: 14,
+          theme,
         }
         let res = await fetch("/xterm_config").then((res) => {
           return res.json()

package/server/views/explore.ejs

@@ -120,20 +120,23 @@ body main iframe {
 <header class='navheader grabbable'>
 <h1>
 <a class='home' href="/"><i class="fa-solid fa-house"></i></a>
-<button class='btn2' id='back'><i class="fa-solid fa-chevron-left"></i></button>
-<button class='btn2' id='forward'><i class="fa-solid fa-chevron-right"></i></button>
-<% paths.forEach((path) => { %>
-  <% if (path.action) { %>
-    <a class='path nav-button' id="<%=path.id%>" onclick="<%=path.action%>"><%-path.name%></a>
-  <% } else if (path.path) { %>
-    <a class='path' href="<%=path.path%>"><%-path.name%></a>
-  <% } %>
-<% }) %>
+<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>
+<a class='btn2 create-new' id='create-new-folder'><div><i class='fa-solid fa-plus'></i></div><div>New</div></a>
+<a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-globe"></i></div><div>Discover</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-globe"></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>
   <a class='btn2' href="/?mode=settings"><div><i class="fa-solid fa-gear"></i></div><div>Settings</div></a>
+  <% if (agent === "electron") { %>
+    <a href="/" target="_blank" class='btn2' features="browser"><div><i class="fa-solid fa-square-up-right"></i></div><div>Open</div></a>
+  <% } else { %>
+    <a href="/" target="_blank" class='btn2'><div><i class="fa-solid fa-square-up-right"></i></div><div>Open</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>
 <!--

package/server/views/file_explorer.ejs

@@ -3,7 +3,6 @@
 <title>Pinokio</title>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
-<link href="/xterm.min.css" rel="stylesheet" />
 <link href="/css/fontawesome.min.css" rel="stylesheet">
 <link href="/css/solid.min.css" rel="stylesheet">
 <link href="/css/regular.min.css" rel="stylesheet">
@@ -141,10 +140,6 @@ body.dark .browser-options-row {
 <script src="/sweetalert2.js"></script>
 <script src="/noty.js"></script>
 <script src="/notyq.js"></script>
-<script src="/xterm.js"></script>
-<script src="/xterm-addon-fit.js"></script>
-<script src="/xterm-addon-web-links.js"></script>
-<script src="/xterm-theme.js"></script>
 <script src="/Socket.js"></script>
 <script src="/install.js"></script>
 <script src="/common.js"></script>
@@ -158,7 +153,7 @@ body.dark .browser-options-row {
 <nav class='error-message'>
   <div><%=error%></div>
   <div class='flexible'></div>
-  <a class='btn' target="_blank" href="<%=install%> Download</a>
+  <a class='btn' target="_blank" href="<%=install%>">Download</a>
 </nav>
 <% } %>
 <!--
@@ -191,7 +186,7 @@ body.dark .browser-options-row {
     <% if (agent === "electron") { %>
       <a class='btn2' data-filepath="<%=filepath%>"><div><i class="fa-regular fa-folder-open"></i></div><div>Files</div></a>
     <% } %>
-    <button class='btn2' id='genlog'><div><i class="fa-solid fa-laptop-code"></i></div><div>Debug</div></button>
+    <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>
     <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'><div><i class="fa-solid fa-plus"></i></div><div>Window</div></button>
@@ -240,7 +235,7 @@ body.dark .browser-options-row {
         </div>
       <% } %>
       <div class='browser-options-row'>
-        <a href="/proxy" class='btn'><div><i class="fa-solid fa-gauge"></i> Configure</div></a>
+        <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>
@@ -460,9 +455,15 @@ var term
 const n = new N()
 let socket = new Socket()
 const pull = async () => {
-  if (!term) term = createTerm()
   socket.close()
   await new Promise((resolve, reject) => {
+    if (!term) {
+      <% if (theme === "dark") { %>
+      await createTerm(xtermTheme.FrontEndDelight)
+      <% } else { %>
+      await createTerm(xtermTheme.Tomorrow)
+      <% } %>
+    }
     let cwd
     let chunks = location.pathname.split("/").filter((x) => { return x })
     if (chunks.length > 0) {
@@ -1042,34 +1043,6 @@ if (document.querySelector("#cloudflare")) {
   })
 }
 <% } %>
-if (document.querySelector("#back")) {
-  document.querySelector("#back").addEventListener("click", (e) => {
-    history.back()
-  })
-}
-if (document.querySelector("#forward")) {
-  document.querySelector("#forward").addEventListener("click", (e) => {
-    history.forward()
-  })
-}
-if (document.querySelector("#genlog")) {
-  document.querySelector("#genlog").addEventListener("click", (e) => {
-    e.preventDefault()
-    e.stopPropagation()
-    e.target.innerHTML = '<i class="fa-solid fa-circle-notch fa-spin"></i>'
-    fetch("/pinokio/log", {
-      method: "post",
-    }).then((res) => {
-      console.log("RES", res)
-      let btn = document.querySelector("#genlog")
-      let btn2 = document.querySelector("#downloadlogs")
-      btn2.classList.remove("hidden") 
-      btn.classList.add("hidden")
-      btn.innerHTML = '<i class="fa-solid fa-circle-check"></i> Generated!'
-      //btn.classList.add("hidden")
-    })
-  })
-}
 
 </script>
 </body>

package/server/views/github.ejs

@@ -0,0 +1,218 @@
+<html>
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1" />
+<link href="/xterm.min.css" rel="stylesheet" />
+<link href="/css/fontawesome.min.css" rel="stylesheet">
+<link href="/css/solid.min.css" rel="stylesheet">
+<link href="/css/regular.min.css" rel="stylesheet">
+<link href="/css/brands.min.css" rel="stylesheet">
+<link href="/markdown.css" rel="stylesheet"/>
+<link href="/noty.css" rel="stylesheet"/>
+<link href="/style.css" rel="stylesheet"/>
+<% if (agent === "electron") { %>
+  <link href="/electron.css" rel="stylesheet"/>
+<% } %>
+<style>
+html {
+  scroll-behavior: smooth;
+  height: 100%;
+  overflow: hidden;
+}
+body {
+  height: 100%;
+  overflow: auto;
+  display: flex;
+  flex-direction: column;
+}
+.line2 {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  background: rgba(0,0,100,0.04);
+}
+.line2 a {
+  text-decoration: none;
+  color: black;
+}
+.status {
+  padding: 10px;
+  margin: 10px;
+  border-radius: 10px;
+}
+.status.offline {
+  background: silver;
+}
+.status.online {
+  background: yellowgreen;
+}
+.switch {
+  padding: 10px;
+  margin: 10px 0;
+}
+.switch[data-online=true] {
+  color: yellowgreen;
+}
+.button {
+  padding: 10px;
+}
+.on, .off {
+  display: flex;
+  align-items: center;
+}
+.btn {
+  margin: 5px;
+  width: 100px;
+  text-align: center;
+  padding: 10px;
+  background: black;
+  color: white;
+  text-decoration: none;
+  font-weight: normal;
+}
+.item {
+  display: flex;
+  align-items: flex-start;
+  margin: 10px;
+  background: rgba(0,0,0,0.04);
+}
+.item img {
+  width: 100px;
+}
+.item .title {
+  text-decoration: none;
+  color: royalblue;
+}
+.item .col {
+  padding: 10px;
+}
+.item .col > * {
+  margin: 5px 0;
+}
+.item .stat {
+  color: rgba(0,0,0,0.8);
+  display: flex;
+}
+.item .stat > * {
+  margin-right: 15px;
+}
+.timestamp {
+  color: rgba(0,0,0,0.5);
+}
+main {
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+}
+.setup-items {
+  display: flex;
+  justify-content: center;
+  margin: 0 auto;
+  max-width: 800px;
+  width: 100%;
+}
+.head {
+  padding: 80px;
+  text-align: center;
+}
+.head .desc {
+  opacity: 0.7;
+  padding: 10px;
+}
+.head h3 {
+  font-size: 20px;
+  text-transform: uppercase;
+  margin: 0;
+}
+.head h3 i {
+  font-size: 80px;
+}
+body.dark .card {
+  color: white;
+}
+.card {
+  text-decoration: none;
+  width: 200px;
+  color: rgba(0,0,0,0.9);
+  text-align: center;
+  margin: 20px;
+}
+.card:hover {
+  color: royalblue !important;
+}
+.card .desc {
+  opacity: 0.7;
+}
+.card h3 {
+  font-size: 30px;
+  letter-spacing: -1px;
+}
+.card i {
+  font-size: 50px;
+}
+a {
+  color: royalblue;
+}
+body.dark hr {
+  background: rgba(255,255,255,0.05);
+}
+hr {
+  background: rgba(0,0,0,0.05);
+  height: 4px;
+  border: none;
+  margin: 40px 0;
+}
+#readme {
+  flex-grow: 1;
+  padding: 30px;
+}
+</style>
+<script src="/hotkeys.min.js"></script>
+<script src="/common.js"></script>
+<script src="/opener.js"></script>
+</head>
+<body class='<%=theme%>'>
+<header class='navheader grabbable'>
+<h1>
+<a class='home' href="/"><i class="fa-solid fa-house"></i></a>
+<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>
+<a class='btn2 create-new' id='create-new-folder'><div><i class='fa-solid fa-plus'></i></div><div>New</div></a>
+<a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-globe"></i></div><div>Discover</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' 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>
+  <a class='btn2' href="/?mode=settings"><div><i class="fa-solid fa-gear"></i></div><div>Settings</div></a>
+  <% if (agent === "electron") { %>
+    <a href="/" target="_blank" class='btn2' features="browser"><div><i class="fa-solid fa-square-up-right"></i></div><div>Open</div></a>
+  <% } else { %>
+    <a href="/" target="_blank" class='btn2'><div><i class="fa-solid fa-square-up-right"></i></div><div>Open</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>
+</h1>
+</h1>
+</header>
+<main>
+  <div class='head'>
+    <h3><i class="fa-brands fa-github"></i><br><br>Connect with Github</h3>
+  </div>
+  <div class='setup-items'>
+    <% items.forEach((item) => { %>
+      <a class='card' href="<%=item.url%>">
+        <i class="<%=item.icon%>"></i>
+        <h3><%=item.title%></h3>
+        <div class='desc'><%=item.description%></div>
+      </a>
+    <% }) %>
+  </div>
+  <div class='setup-items'>
+    <div id='readme'><%-readme%></div>
+  </div>
+</main>
+</body>
+</html>

package/server/views/help.ejs

@@ -255,11 +255,12 @@ body.dark .item .tile .badge {
 <header class='navheader grabbable'>
 <h1>
 <a class='home' href="/"><i class="fa-solid fa-house"></i></a>
-<button class='btn2' id='back'><i class="fa-solid fa-chevron-left"></i></button>
-<button class='btn2' id='forward'><i class="fa-solid fa-chevron-right"></i></button>
+<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>
+<a class='btn2 create-new' id='create-new-folder'><div><i class='fa-solid fa-plus'></i></div><div>New</div></a>
+<a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-globe"></i></div><div>Discover</div></a>
 <div class='flexible'></div>
 <div class='nav-btns'>
-  <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-globe"></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'><div><i class="fa-solid fa-plus"></i></div><div>Window</div></button>