neil/silverbullet
1
0
Fork 0
Code Activity

Lots of tweaks

Browse Source
This commit is contained in:
Zef Hemel
2022-05-09 14:59:12 +02:00
parent 35dc75d94e
commit f6758dbbaf
25 changed files with 336 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/web/components/panel.tsx
+10 -1
View File
@@ -2,7 +2,15 @@ import { useEffect, useRef } from "react";
// @ts-ignore
import iframeHtml from "bundle-text:./panel.html";
export function Panel({ html, flex }: { html: string; flex: number }) {
export function Panel({
html,
script,
flex,
}: {
html: string;
script?: string;
flex: number;
}) {
const iFrameRef = useRef<HTMLIFrameElement>(null);
useEffect(() => {
function loadContent() {
@@ -10,6 +18,7 @@ export function Panel({ html, flex }: { html: string; flex: number }) {
iFrameRef.current.contentWindow.postMessage({
type: "html",
html: html,
script: script,
});
}
}
packages/web/components/panel_page.ts
+7
View File
@@ -3,6 +3,13 @@ window.addEventListener("message", (message) => {
switch (data.type) {
case "html":
document.body.innerHTML = data.html;
if (data.script) {
try {
eval(data.script);
} catch (e: any) {
console.error("Error evaling script", e);
}
}
break;
}
});
packages/web/editor.tsx
+23 -9
View File
@@ -58,6 +58,7 @@ import {
import { FilterList } from "./components/filter";
import { FilterOption } from "@silverbulletmd/common/types";
import { syntaxTree } from "@codemirror/language";
import sandboxSyscalls from "@plugos/plugos/syscalls/sandbox";
class PageState {
constructor(
@@ -120,15 +121,16 @@ export class Editor {
});
this.pageNavigator = new PathPageNavigator();
this.system.registerSyscalls([], editorSyscalls(this));
this.system.registerSyscalls([], spaceSyscalls(this));
this.system.registerSyscalls([], indexerSyscalls(this.space));
this.system.registerSyscalls([], systemSyscalls(this));
this.system.registerSyscalls(
[],
markdownSyscalls(buildMarkdown(this.mdExtensions))
editorSyscalls(this),
spaceSyscalls(this),
indexerSyscalls(this.space),
systemSyscalls(this),
markdownSyscalls(buildMarkdown(this.mdExtensions)),
clientStoreSyscalls(),
sandboxSyscalls(this.system)
);
this.system.registerSyscalls([], clientStoreSyscalls());
}
get currentPage(): string | undefined {
@@ -636,16 +638,28 @@ export class Editor {
/>
<div id="main">
{!!viewState.showLHS && (
<Panel html={viewState.lhsHTML} flex={viewState.showLHS} />
<Panel
html={viewState.lhsHTML}
script={viewState.lhsScript}
flex={viewState.showLHS}
/>
)}
<div id="editor" />
{!!viewState.showRHS && (
<Panel html={viewState.rhsHTML} flex={viewState.showRHS} />
<Panel
html={viewState.rhsHTML}
script={viewState.rhsScript}
flex={viewState.showRHS}
/>
)}
</div>
{!!viewState.showBHS && (
<div id="bhs">
<Panel html={viewState.bhsHTML} flex={1} />
<Panel
html={viewState.bhsHTML}
script={viewState.bhsScript}
flex={1}
/>
</div>
)}
<StatusBar editorView={editor.editorView} />
packages/web/reducer.ts
+7 -1
View File
@@ -72,7 +72,7 @@ export default function reducer(
case "show-notification":
return {
...state,
notifications: [action.notification, ...state.notifications],
notifications: [...state.notifications, action.notification],
};
case "dismiss-notification":
return {
@@ -84,36 +84,42 @@ export default function reducer(
...state,
showRHS: action.flex,
rhsHTML: action.html,
rhsScript: action.script,
};
case "hide-rhs":
return {
...state,
showRHS: 0,
rhsHTML: "",
rhsScript: undefined,
};
case "show-lhs":
return {
...state,
showLHS: action.flex,
lhsHTML: action.html,
lhsScript: action.script,
};
case "hide-lhs":
return {
...state,
showLHS: 0,
lhsHTML: "",
lhsScript: undefined,
};
case "show-bhs":
return {
...state,
showBHS: action.flex,
bhsHTML: action.html,
bhsScript: action.script,
};
case "hide-bhs":
return {
...state,
showBHS: 0,
bhsHTML: "",
bhsScript: undefined,
};
case "show-filterbox":
return {
packages/web/styles/main.scss
+14 -10
View File
@@ -73,13 +73,18 @@ body {
font-size: 28px;
padding: 10px 20px;
.status {
float: right;
position: absolute;
font-family: "iA-Mono";
bottom: 45px;
left: 5px;
right: 5px;
background-color: rgb(187, 221, 247);
border: rgb(41, 41, 41) 1px solid;
border-radius: 5px;
padding: 3px;
font-size: 14px;
font-size: 15px;
z-index: 100;
}
.current-page {
@@ -113,13 +118,10 @@ body {
font-size: 80%;
}
}
}
.panel {
flex: 1;
}
}
@@ -141,10 +143,8 @@ body {
margin: 0;
}
}
}
#editor {
overflow-y: scroll;
flex: 2;
@@ -152,10 +152,13 @@ body {
}
#bhs {
height: 200px;
height: 300px;
width: 100%;
border-top: rgb(193, 193, 193) 1px solid;
.panel {
height: 100%;
.panel {
iframe {
border: 0;
width: 100%;
@@ -173,4 +176,5 @@ body {
text-align: right;
background-color: rgb(213, 213, 213);
border-top: rgb(193, 193, 193) 1px solid;
font-family: "iA-Mono";
}
packages/web/syscalls/editor.ts
+6 -3
View File
@@ -71,11 +71,12 @@ export function editorSyscalls(editor: Editor): SysCallMapping {
): Promise<FilterOption | undefined> => {
return editor.filterBox(label, options, helpText, placeHolder);
},
"editor.showRhs": (ctx, html: string, flex: number) => {
"editor.showRhs": (ctx, html: string, script: string, flex: number) => {
editor.viewDispatch({
type: "show-rhs",
flex,
html,
script,
});
},
"editor.hideRhs": (ctx) => {
@@ -83,11 +84,12 @@ export function editorSyscalls(editor: Editor): SysCallMapping {
type: "hide-rhs",
});
},
"editor.showLhs": (ctx, html: string, flex: number) => {
"editor.showLhs": (ctx, html: string, script: string, flex: number) => {
editor.viewDispatch({
type: "show-lhs",
flex,
html,
script,
});
},
"editor.hideLhs": (ctx) => {
@@ -95,11 +97,12 @@ export function editorSyscalls(editor: Editor): SysCallMapping {
type: "hide-lhs",
});
},
"editor.showBhs": (ctx, html: string, flex: number) => {
"editor.showBhs": (ctx, html: string, script: string, flex: number) => {
editor.viewDispatch({
type: "show-bhs",
flex,
html,
script,
});
},
"editor.hideBhs": (ctx) => {
packages/web/syscalls/system.ts
+4
View File
@@ -22,5 +22,9 @@ export function systemSyscalls(editor: Editor): SysCallMapping {
"system.reloadPlugs": async () => {
return editor.reloadPlugs();
},
"sandbox.getServerLogs": async (ctx) => {
return editor.space.proxySyscall(ctx.plug, "sandbox.getLogs", []);
},
};
}
packages/web/types.ts
+6 -3
View File
@@ -27,6 +27,9 @@ export type AppViewState = {
rhsHTML: string;
lhsHTML: string;
bhsHTML: string;
rhsScript?: string;
lhsScript?: string;
bhsScript?: string;
allPages: Set<PageMeta>;
commands: Map<string, AppCommand>;
notifications: Notification[];
@@ -78,11 +81,11 @@ export type Action =
| { type: "hide-palette" }
| { type: "show-notification"; notification: Notification }
| { type: "dismiss-notification"; id: number }
| { type: "show-rhs"; html: string; flex: number }
| { type: "show-rhs"; html: string; flex: number; script?: string }
| { type: "hide-rhs" }
| { type: "show-lhs"; html: string; flex: number }
| { type: "show-lhs"; html: string; flex: number; script?: string }
| { type: "hide-lhs" }
| { type: "show-bhs"; html: string; flex: number }
| { type: "show-bhs"; html: string; flex: number; script?: string }
| { type: "hide-bhs" }
| {
type: "show-filterbox";