pinokiod 3.85.0 → 3.87.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (88) hide show
  1. package/Dockerfile +61 -0
  2. package/docker-entrypoint.sh +75 -0
  3. package/kernel/api/hf/index.js +1 -1
  4. package/kernel/api/index.js +8 -1
  5. package/kernel/api/shell/index.js +6 -0
  6. package/kernel/api/terminal/index.js +166 -0
  7. package/kernel/bin/caddy.js +10 -4
  8. package/kernel/bin/conda.js +3 -2
  9. package/kernel/bin/index.js +53 -2
  10. package/kernel/bin/setup.js +32 -0
  11. package/kernel/bin/vs.js +11 -2
  12. package/kernel/index.js +42 -2
  13. package/kernel/info.js +36 -0
  14. package/kernel/peer.js +42 -18
  15. package/kernel/prototype.js +1 -0
  16. package/kernel/router/index.js +23 -15
  17. package/kernel/router/localhost_static_router.js +0 -3
  18. package/kernel/router/pinokio_domain_router.js +333 -0
  19. package/kernel/shell.js +43 -2
  20. package/kernel/shells.js +21 -1
  21. package/kernel/util.js +4 -2
  22. package/package.json +2 -1
  23. package/pipe/views/login.ejs +1 -1
  24. package/script/install-mode.js +33 -0
  25. package/script/pinokio.json +7 -0
  26. package/server/index.js +636 -246
  27. package/server/public/Socket.js +48 -0
  28. package/server/public/common.js +1956 -257
  29. package/server/public/fseditor.js +71 -12
  30. package/server/public/install.js +1 -1
  31. package/server/public/layout.js +740 -0
  32. package/server/public/modalinput.js +0 -1
  33. package/server/public/opener.js +12 -11
  34. package/server/public/serve/style.css +1 -1
  35. package/server/public/style.css +122 -129
  36. package/server/public/tab-idle-notifier.js +629 -0
  37. package/server/public/terminal_input_tracker.js +63 -0
  38. package/server/public/urldropdown.css +780 -45
  39. package/server/public/urldropdown.js +806 -156
  40. package/server/public/window_storage.js +97 -28
  41. package/server/socket.js +40 -9
  42. package/server/views/404.ejs +1 -1
  43. package/server/views/500.ejs +3 -3
  44. package/server/views/app.ejs +3146 -1381
  45. package/server/views/bookmarklet.ejs +197 -0
  46. package/server/views/bootstrap.ejs +1 -1
  47. package/server/views/columns.ejs +2 -13
  48. package/server/views/connect/x.ejs +4 -4
  49. package/server/views/connect.ejs +13 -14
  50. package/server/views/container.ejs +3 -4
  51. package/server/views/d.ejs +225 -55
  52. package/server/views/download.ejs +1 -1
  53. package/server/views/editor.ejs +2 -2
  54. package/server/views/env_editor.ejs +3 -3
  55. package/server/views/explore.ejs +2 -2
  56. package/server/views/file_explorer.ejs +3 -3
  57. package/server/views/git.ejs +7 -7
  58. package/server/views/github.ejs +3 -3
  59. package/server/views/help.ejs +2 -2
  60. package/server/views/index.ejs +17 -16
  61. package/server/views/index2.ejs +7 -7
  62. package/server/views/init/index.ejs +15 -79
  63. package/server/views/install.ejs +4 -4
  64. package/server/views/keys.ejs +2 -2
  65. package/server/views/layout.ejs +105 -0
  66. package/server/views/mini.ejs +2 -2
  67. package/server/views/net.ejs +45 -13
  68. package/server/views/network.ejs +41 -27
  69. package/server/views/network2.ejs +11 -11
  70. package/server/views/old_network.ejs +10 -10
  71. package/server/views/partials/dynamic.ejs +3 -5
  72. package/server/views/partials/menu.ejs +3 -5
  73. package/server/views/partials/running.ejs +1 -1
  74. package/server/views/pro.ejs +369 -0
  75. package/server/views/prototype/index.ejs +3 -3
  76. package/server/views/required_env_editor.ejs +2 -2
  77. package/server/views/review.ejs +15 -27
  78. package/server/views/rows.ejs +2 -13
  79. package/server/views/screenshots.ejs +298 -142
  80. package/server/views/settings.ejs +6 -7
  81. package/server/views/setup.ejs +3 -4
  82. package/server/views/setup_home.ejs +2 -2
  83. package/server/views/share_editor.ejs +4 -4
  84. package/server/views/shell.ejs +280 -29
  85. package/server/views/start.ejs +2 -2
  86. package/server/views/task.ejs +2 -2
  87. package/server/views/terminal.ejs +326 -52
  88. package/server/views/tools.ejs +461 -17
@@ -0,0 +1,369 @@
1
+ <html>
2
+ <head>
3
+ <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
4
+ <script src="/hotkeys.min.js"></script>
5
+ <script src="/ace/ace.js"></script>
6
+ <script src="/noty.js"></script>
7
+ <script src="/notyq.js"></script>
8
+ <script src="/xterm.js"></script>
9
+ <script src="/xterm-addon-fit.js"></script>
10
+ <script src="/xterm-addon-web-links.js"></script>
11
+ <script src="/xterm-theme.js"></script>
12
+ <script src="/xterm-addon-search.js"></script>
13
+ <script src="/xterm-addon-search-bar.js"></script>
14
+ <script src="/sweetalert2.js"></script>
15
+ <script src="/Socket.js"></script>
16
+ <script src="/common.js"></script>
17
+ <script src="/he.js"></script>
18
+ <script src="/opener.js"></script>
19
+ <!--
20
+ <script src="/nav.js"></script>
21
+ -->
22
+ <script src="/autoexpand.js"></script>
23
+ <script src="/modalinput.js"></script>
24
+ <script src="/simplemodal.js"></script>
25
+ <script src="/waitmodal.js"></script>
26
+ <script src="/notifyinput.js"></script>
27
+ <script src="/report.js"></script>
28
+ <script src="/mark.min.js"></script>
29
+ <link href="/xterm.min.css" rel="stylesheet" />
30
+ <link href="/css/fontawesome.min.css" rel="stylesheet">
31
+ <link href="/css/solid.min.css" rel="stylesheet">
32
+ <link href="/css/regular.min.css" rel="stylesheet">
33
+ <link href="/css/brands.min.css" rel="stylesheet">
34
+ <link href="/style.css" rel="stylesheet"/>
35
+ <link href="/noty.css" rel="stylesheet"/>
36
+ <!--
37
+ <link rel="preconnect" href="https://fonts.googleapis.com">
38
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
39
+ <link href="https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
40
+ <link rel="preconnect" href="https://fonts.googleapis.com">
41
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
42
+ <link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
43
+ -->
44
+
45
+
46
+ <% if (agent === "electron") { %>
47
+ <link href="/electron.css" rel="stylesheet"/>
48
+ <% } %>
49
+ <style>
50
+ .stopped-btn {
51
+ background: silver;
52
+ }
53
+ html {
54
+ scroll-behavior: smooth;
55
+ height: 100%;
56
+ overflow: hidden;
57
+ }
58
+ body {
59
+ height: 100%;
60
+ overflow: hidden;
61
+ display: flex;
62
+ flex-direction: column;
63
+ }
64
+ #table > table {
65
+ border-left: 2px solid black;
66
+ padding-left: 5px;
67
+ margin: 10px 0;
68
+ }
69
+ .highlight {
70
+ background: yellow;
71
+ width: 100px;
72
+ }
73
+ th {
74
+ background: rgba(0,0,0,0.1);
75
+ padding: 10px;
76
+ font-size: 12px;
77
+ }
78
+ td {
79
+ font-size: 12px;
80
+ padding: 10px;
81
+ }
82
+ td.val {
83
+ background: rgba(0,0,0,0.06);
84
+ }
85
+ td.key {
86
+ background: rgba(0,0,0,0.1);
87
+ }
88
+ .button {
89
+ cursor: pointer;
90
+ background: rgba(0,0,0,0.8);
91
+ color: white;
92
+ padding: 5px 10px;
93
+ border-radius: 4px;
94
+ }
95
+ header {
96
+ position: relative;
97
+ padding: 10px 0;
98
+ }
99
+ .button:hover {
100
+
101
+ }
102
+ .terminal {
103
+ box-sizing: border-box;
104
+ }
105
+ .xterm .xterm-viewport {
106
+ width: initial !important;
107
+ }
108
+ .navheader3 {
109
+ padding: 10px;
110
+ }
111
+ .navheader {
112
+ padding-bottom: 0;
113
+ }
114
+ .navheader h1 {
115
+ align-items: center;
116
+ }
117
+ /*
118
+ .navheader {
119
+ background: var(--dark-bg);
120
+ }
121
+ */
122
+ /*
123
+ .btn {
124
+ background: rgba(127, 91, 243, 0.9);
125
+ }
126
+ */
127
+ #del-bin {
128
+ color: rgba(127, 91, 243, 0.9);
129
+ cursor: pointer;
130
+ font-weight: bold;
131
+ padding: 0 5px;
132
+ text-decoration: underline;
133
+ }
134
+ body.frozen {
135
+ overflow: auto !important;
136
+ }
137
+ .terminal-container {
138
+ padding: 0;
139
+ }
140
+ #status-window {
141
+ display: flex;
142
+ align-items: center;
143
+ font-size: 14px;
144
+ /*
145
+ flex-grow: 1;
146
+ text-align: right;
147
+ */
148
+ padding: 0 10px;
149
+ }
150
+ #status-window strong {
151
+ color: rgba(127, 91, 243, 0.9);
152
+ }
153
+ #status-window b {
154
+ color: black;
155
+ font-weight: normal;
156
+ }
157
+ body.dark #status-window b {
158
+ color: white;
159
+ }
160
+ #progress-window {
161
+ flex-shrink: 0;
162
+ width: 100px;
163
+ background: #eee;
164
+ height: 15px;
165
+ /*
166
+ border-radius: 5px;
167
+ */
168
+ overflow: hidden;
169
+ }
170
+ #progress-bar {
171
+ width: 0%;
172
+ height: 100%;
173
+ background: rgba(127, 91, 243, 0.9);
174
+ transition: width 0.2s;
175
+ }
176
+ </style>
177
+ <link href="/terminal.css" rel="stylesheet"/>
178
+ </head>
179
+ <body class='<%=theme%>' data-agent="<%=agent%>">
180
+ <% if (target === "_top") { %>
181
+ <header class='navheader grabbable'>
182
+ <% } else { %>
183
+ <header class='navheader3'>
184
+ <% } %>
185
+ <h1>
186
+ <% if (target === "_top") { %>
187
+ <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
188
+ <% } %>
189
+ <div class='hidden btn run play-btn'>
190
+ <span class='play'><i class="fa-solid fa-play"></i> Start</span>
191
+ </div>
192
+ <div class='hidden btn run starting-btn'>
193
+ <span class='starting'><i class="fa-solid fa-circle-notch fa-spin"></i> Starting...</span>
194
+ </div>
195
+ <div class='hidden btn run stop-btn'>
196
+ <span class='stop'><i class="fa-solid fa-stop"></i> Stop</span>
197
+ </div>
198
+ <div class='hidden btn stopped-btn'>
199
+ <span class='stopped'><i class="fa-solid fa-hand"></i> Stopped</span>
200
+ </div>
201
+ <div id='status-window'></div>
202
+ <div id='progress-window' class='hidden'><div id='progress-bar'></div></div>
203
+ </h1>
204
+ </header>
205
+ <div class='terminal-container'>
206
+ <div id='terminal'></div>
207
+ </div>
208
+ <footer><b>Ready</b></footer>
209
+ <script>
210
+ let shell_id
211
+ let socket = new Socket()
212
+ const createTerm = async (_theme) => {
213
+ const theme = Object.assign({ }, _theme, {
214
+ selectionBackground: "red",
215
+ selectionForeground: "white"
216
+ })
217
+ <% if (theme !== "dark") { %>
218
+ theme.foreground = "black"
219
+ <% } %>
220
+ let config = {
221
+ scrollback: 9999999,
222
+ fontSize: 12,
223
+ theme,
224
+ }
225
+ let res = await fetch("/xterm_config").then((res) => {
226
+ return res.json()
227
+ })
228
+ if (res && res.config) {
229
+ config = res.config
230
+ }
231
+ const term = new Terminal(config)
232
+ term.open(document.querySelector("#terminal"))
233
+
234
+ term.attachCustomKeyEventHandler(event => {
235
+ if (event.ctrlKey && event.key === 'c' && term.hasSelection()) {
236
+ return false;
237
+ }
238
+ if (event.ctrlKey && event.key === 'v' && this._options.pasteWithCtrlV) {
239
+ return false;
240
+ }
241
+ return true;
242
+ });
243
+
244
+ fitAddon = new FitAddon.FitAddon();
245
+ term.loadAddon(fitAddon);
246
+ <% if (agent === "electron") { %>
247
+ term.loadAddon(new WebLinksAddon.WebLinksAddon((event, uri) => {
248
+ window.open(uri, "_blank")
249
+ }))
250
+ <% } else { %>
251
+ term.loadAddon(new WebLinksAddon.WebLinksAddon());
252
+ <% } %>
253
+ fitAddon.fit();
254
+
255
+ term.onKey(({ key }) => {
256
+ console.log({ key, shell_id })
257
+ if (socket) {
258
+ if (shell_id) {
259
+ socket.run({
260
+ key,
261
+ id: shell_id
262
+ })
263
+ }
264
+ }
265
+ });
266
+
267
+ let observer = new ResizeObserver(() => {
268
+ fitAddon.fit()
269
+ console.log(`Resized to ${term.cols}x${term.rows}`);
270
+ // Trigger your custom handler here
271
+ if (socket) {
272
+ if (shell_id) {
273
+ console.log("RESIZE", { shell_id, cols: term.cols, rows: term.rows })
274
+ socket.run({
275
+ resize: {
276
+ cols: term.cols,
277
+ rows: term.rows,
278
+ },
279
+ id: shell_id
280
+ })
281
+ }
282
+ }
283
+ });
284
+ observer.observe(document.body)
285
+
286
+ term.focus()
287
+ console.log(`Resized to ${term.cols}x${term.rows}`);
288
+ return term
289
+ }
290
+
291
+ async function displayResults(config) {
292
+ <% if (theme === "dark") { %>
293
+ let term = await createTerm(xtermTheme.FrontEndDelight)
294
+ <% } else { %>
295
+ let term = await createTerm(xtermTheme.Tomorrow)
296
+ <% } %>
297
+ const write = (text) => {
298
+ if (text !== "\u0007") {
299
+ term.write(text)
300
+ }
301
+ }
302
+ socket.run({
303
+ id: "kernel.proto.create",
304
+ method: "kernel.proto.create",
305
+ cwd: config.cwd,
306
+ client: {
307
+ cols: term.cols,
308
+ rows: term.rows,
309
+ },
310
+ params: config
311
+ }, async (packet) => {
312
+ console.log('packet', packet)
313
+ if (packet.type === 'start') {
314
+ document.querySelector(".play-btn").classList.add("hidden")
315
+ document.querySelector(".starting-btn").classList.add("hidden")
316
+ document.querySelector(".stop-btn").classList.remove("hidden")
317
+ } else if (packet.type === "result") {
318
+ if (packet.data.success) {
319
+ location.href = packet.data.success
320
+ } else if (packet.data.error) {
321
+ alert(packet.data.error)
322
+ location.href = location.href
323
+ }
324
+ } else if (packet.type === "stream") {
325
+ // set the current shell id
326
+ if (packet.data.id) {
327
+ shell_id = packet.data.id
328
+ }
329
+ if (packet.data.raw) {
330
+ write(packet.data.raw)
331
+ } else if (packet.data.json) {
332
+ write(JSON.stringify(packet.data.json).replace(/\n/g, "\r\n"))
333
+ write("\r\n")
334
+ } else if (packet.data.json2) {
335
+ write(JSON.stringify(packet.data.json2, null, 2).replace(/\n/g, "\r\n"))
336
+ write("\r\n")
337
+ }
338
+ document.querySelector("#end").scrollIntoView({ behavior: 'smooth' });
339
+ } else if (packet.type === 'disconnect') {
340
+ term.write("\r\nDisconnected...\r\n")
341
+ socket.close()
342
+ } else if (packet.type === 'connect') {
343
+ if (packet.data) {
344
+ if (packet.data.shell) {
345
+ shell_id = packet.data.shell
346
+ }
347
+ }
348
+ }
349
+ }).then((res) => {
350
+ console.log("Ended", res)
351
+ })
352
+ }
353
+ const url = new URL(window.location.href);
354
+ const searchParams = url.searchParams;
355
+ let cwd = searchParams.get("cwd")
356
+ let name = searchParams.get("name")
357
+ let tool = searchParams.get("tool")
358
+ let aiPrompt = searchParams.get("message")
359
+ displayResults({
360
+ cwd: "<%-JSON.stringify(cwd).slice(1, -1)%>",
361
+ name: name,
362
+ startType: "new",
363
+ projectType: "ai",
364
+ aiPrompt,
365
+ tool
366
+ })
367
+ </script>
368
+ </body>
369
+ </html>
@@ -633,8 +633,8 @@ body.dark .frame-link.selected {
633
633
  */
634
634
  }
635
635
  .loader .btn:hover {
636
- color: royalblue;
637
- border-color: royalblue;
636
+ color: rgba(127, 91, 243, 0.9);
637
+ border-color: rgba(127, 91, 243, 0.9);
638
638
  }
639
639
  .loader .btn {
640
640
  padding: 4px 8px;
@@ -1589,7 +1589,7 @@ async function displayResults(config) {
1589
1589
 
1590
1590
  let term_config = {
1591
1591
  scrollback: 9999999,
1592
- fontSize: 14,
1592
+ fontSize: 12,
1593
1593
  theme,
1594
1594
  }
1595
1595
  let res = await fetch("/xterm_config").then((res) => {
@@ -107,7 +107,7 @@ body.dark .env-item label {
107
107
  color: cornflowerblue;
108
108
  }
109
109
  .env-item label {
110
- color: royalblue;
110
+ color: rgba(127, 91, 243, 0.9);
111
111
  display: block;
112
112
  margin-bottom: 5px;
113
113
  font-weight: bold;
@@ -133,7 +133,7 @@ body.dark .comment {
133
133
  padding-left: 10px;
134
134
  }
135
135
  #save {
136
- background: royalblue;
136
+ background: rgba(127, 91, 243, 0.9);
137
137
  width: 100%;
138
138
  box-sizing: border-box;
139
139
  text-align: center;
@@ -30,7 +30,7 @@ body.dark .mode-display {
30
30
  background: rgba(0,0,0,0.04);
31
31
  /*
32
32
  text-align: center;
33
- color: royalblue;
33
+ color: rgba(127, 91, 243, 0.9);
34
34
  */
35
35
  color: rgba(0, 0, 0, 0.7);
36
36
  font-size: 12px;
@@ -109,12 +109,6 @@ body.dark aside {
109
109
  background: var(--dark-bg);
110
110
  border-right: 1px solid rgba(255,255,255,0.04);
111
111
  }
112
- /*
113
- aside #collapse {
114
- text-align: center;
115
- padding: 5px;
116
- }
117
- */
118
112
  aside {
119
113
  /*
120
114
  display: flex;
@@ -439,8 +433,8 @@ body.dark .frame-link.selected {
439
433
  flex-shrink: 0;
440
434
  }
441
435
  .loader .btn:hover {
442
- color: royalblue;
443
- border-color: royalblue;
436
+ color: rgba(127, 91, 243, 0.9);
437
+ border-color: rgba(127, 91, 243, 0.9);
444
438
  }
445
439
  .loader .btn {
446
440
  padding: 4px 8px;
@@ -645,7 +639,7 @@ nav .logo {
645
639
  .error-message {
646
640
  width: 100%;
647
641
  /*
648
- background: royalblue !important;
642
+ background: rgba(127, 91, 243, 0.9) !important;
649
643
  */
650
644
  color: white;
651
645
  display: flex;
@@ -817,11 +811,13 @@ body .app-icon {
817
811
  display: none;
818
812
  margin-right: 10px;
819
813
  }
820
- body.minimized .app-icon {
821
- display: block;
822
- }
823
- body.minimized aside {
824
- display: none;
814
+ @media only screen and (max-width: 768px) {
815
+ .app-icon {
816
+ display: block;
817
+ }
818
+ aside {
819
+ display: none;
820
+ }
825
821
  }
826
822
  .top-menu {
827
823
  padding: 10px;
@@ -839,22 +835,13 @@ body.dark .top-menu .btn2.selected {
839
835
  background: black;
840
836
  color: white;
841
837
  }
842
- body.dark.minimized #collapse {
843
- color: white;
844
- }
845
- body.minimized #collapse {
846
- border: none !important;
847
- color: black;
848
- }
849
- #collapse {
850
- border-bottom: 5px solid royalblue;
851
- color: royalblue;
852
- border-radius: 0;
853
- }
854
838
  #browserview-container {
855
839
  flex-grow: 1;
856
840
  position: relative;
857
841
  }
842
+ #hidden-placeholder {
843
+ visibility: hidden;
844
+ }
858
845
 
859
846
  @media only screen and (max-width: 1000px) {
860
847
  .url-bar {
@@ -956,6 +943,7 @@ body.minimized #collapse {
956
943
  <button class='btn2' id='forward' data-tippy-content="forward"><div><i class="fa-solid fa-chevron-right"></i></div></button>
957
944
  <button class='btn2' id='refresh-page' data-tippy-content="refresh"><div><i class="fa-solid fa-rotate-right"></i></div></button>
958
945
  <button class='btn2' id='screenshot' data-tippy-content="take a screenshot"><i class="fa-solid fa-camera"></i></button>
946
+ <button class='btn2' id='hidden-placeholder'><i class="fa-solid fa-bars"></i></button>
959
947
  <div class='mode-selector'>
960
948
  <a class="btn2 <%=type === 'review' ? 'selected' : ''%>" href="<%=review_tab%>"><div><i class="fa-regular fa-message"></i></div><div>Community</div></a>
961
949
  <a class="btn2 <%=type === 'browse' ? 'selected' : ''%>" href="<%=dev_tab%>"><div><i class="fa-solid fa-code"></i></div><div>Dev</div></a>
@@ -82,9 +82,9 @@ body[data-agent='electron'] {
82
82
  </head>
83
83
  <body class='<%=theme%>' data-agent="<%=agent%>">
84
84
  <div id='dragger'></div>
85
- <iframe id='row0' data-src="<%=src%>"></iframe>
85
+ <iframe id='row0' data-src="<%= originSrc || '/' %>"></iframe>
86
86
  <div id="gutter" class="gutter" tabindex="0" role="separator" aria-orientation="horizontal" aria-label="Resize panels" aria-valuemin="120" aria-valuemax="0" aria-valuenow="0"></div>
87
- <iframe id='row1' data-src="<%=src%>"></iframe>
87
+ <iframe id='row1' data-src="<%= targetSrc || originSrc || '/' %>"></iframe>
88
88
 
89
89
  <script>
90
90
  if (window !== window.top) {
@@ -384,17 +384,6 @@ body[data-agent='electron'] {
384
384
  }
385
385
  })
386
386
  })();
387
- if (document.querySelector("#collapse") && window.windowStorage) {
388
- document.querySelector("#collapse").addEventListener("click", (e) => {
389
- document.body.classList.toggle("minimized")
390
- let frame_key = window.frameElement?.name || "";
391
- if (document.body.classList.contains("minimized")) {
392
- windowStorage.setItem(frame_key + ":window_mode", "minimized")
393
- } else {
394
- windowStorage.setItem(frame_key + ":window_mode", "full")
395
- }
396
- })
397
- }
398
387
  </script>
399
388
  </body>
400
389
  </html>