kuba/strona-czynna
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Support for automatically refreshing CSS

Browse Source
This commit is contained in:
Kuba Orlik 2024-02-10 20:14:16 +01:00
parent 6e634e5d64
commit c4fee4b0cf
5 changed files with 51 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
package-lock.json generated
View File

@ -15,7 +15,7 @@
"@koa/router": "^12.0.1", "@koa/router": "^12.0.1",
"@playwright/test": "^1.36.1", "@playwright/test": "^1.36.1",
"@sealcode/jdd": "^0.2.10", "@sealcode/jdd": "^0.2.10",
"@sealcode/sealgen": "^0.11.6", "@sealcode/sealgen": "^0.11.7",
"@sealcode/ts-predicates": "^0.4.3", "@sealcode/ts-predicates": "^0.4.3",
"@types/kill-port": "^2.0.0", "@types/kill-port": "^2.0.0",
"get-port": "^7.0.0", "get-port": "^7.0.0",
@ -1304,9 +1304,9 @@
} }
}, },
"node_modules/@sealcode/sealgen": { "node_modules/@sealcode/sealgen": {
"version": "0.11.6", "version": "0.11.7",
"resolved": "https://registry.npmjs.org/@sealcode/sealgen/-/sealgen-0.11.6.tgz", "resolved": "https://registry.npmjs.org/@sealcode/sealgen/-/sealgen-0.11.7.tgz",
"integrity": "sha512-6GGZi59aia7ou2bDmejQedDNLyzfoo05bFnGVlsWXuCOMCUhBXuWGlFe3wqkSr+340iyvZiXJvBSfXg3DatX2Q==", "integrity": "sha512-JpvVkBCaO2eNTvdRB3J6gs6enYCzMWByaDAj+KmLSifOUqcN1M4DQ5nzF6mAA8q0Aabwe7KDxSHb3b9rPMtYnw==",
"dependencies": { "dependencies": {
"@koa/router": "^12.0.1", "@koa/router": "^12.0.1",
"@sealcode/ts-predicates": "^0.4.3", "@sealcode/ts-predicates": "^0.4.3",
@ -1322,6 +1322,7 @@
"recursive-readdir": "^2.2.3", "recursive-readdir": "^2.2.3",
"tempstream": "^0.3.0", "tempstream": "^0.3.0",
"tiny-glob": "^0.2.9", "tiny-glob": "^0.2.9",
"ws": "^8.16.0",
"yargs": "^17.6.2" "yargs": "^17.6.2"
}, },
"bin": { "bin": {
@ -11504,6 +11505,26 @@
"typedarray-to-buffer": "^3.1.5" "typedarray-to-buffer": "^3.1.5"
} }
}, },
"node_modules/ws": {
"version": "8.16.0",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.16.0.tgz",
"integrity": "sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==",
"engines": {
"node": ">=10.0.0"
},
"peerDependencies": {
"bufferutil": "^4.0.1",
"utf-8-validate": ">=5.0.2"
},
"peerDependenciesMeta": {
"bufferutil": {
"optional": true
},
"utf-8-validate": {
"optional": true
}
}
},
"node_modules/y18n": { "node_modules/y18n": {
"version": "5.0.8", "version": "5.0.8",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz", "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",

2
package.json
View File

@ -36,7 +36,7 @@
"@koa/router": "^12.0.1", "@koa/router": "^12.0.1",
"@playwright/test": "^1.36.1", "@playwright/test": "^1.36.1",
"@sealcode/jdd": "^0.2.10", "@sealcode/jdd": "^0.2.10",
"@sealcode/sealgen": "^0.11.6", "@sealcode/sealgen": "^0.11.7",
"@sealcode/ts-predicates": "^0.4.3", "@sealcode/ts-predicates": "^0.4.3",
"@types/kill-port": "^2.0.0", "@types/kill-port": "^2.0.0",
"get-port": "^7.0.0", "get-port": "^7.0.0",

22
src/back/html.ts
View File

@ -15,13 +15,14 @@ export type HTMLOptions = {
preserveScroll?: boolean; preserveScroll?: boolean;
morphing?: boolean; morphing?: boolean;
navbar?: (ctx: BaseContext) => FlatTemplatable; navbar?: (ctx: BaseContext) => FlatTemplatable;
autoRefreshCSS?: boolean;
}; };
export default function html( export default function html(
ctx: BaseContext, ctx: BaseContext,
title: string, title: string,
body: Templatable, body: Templatable,
{ preserveScroll, morphing, navbar }: HTMLOptions = {}, { preserveScroll, morphing, navbar, autoRefreshCSS }: HTMLOptions = {},
makeHead: (ctx: BaseContext, title: string) => Templatable = defaultHead makeHead: (ctx: BaseContext, title: string) => Templatable = defaultHead
): Readable { ): Readable {
ctx.set("content-type", "text/html;charset=utf-8"); ctx.set("content-type", "text/html;charset=utf-8");
@ -36,6 +37,25 @@ export default function html(
</head> </head>
<body> <body>
${(navbar || default_navbar)(ctx)} ${body} ${(navbar || default_navbar)(ctx)} ${body}
${autoRefreshCSS
? /* HTML */ `<script>
function refresh_css() {
Array.from(document.querySelectorAll("link"))
.filter(
(e) =>
new URL(e.href).pathname == "/dist/main.css"
)
.forEach((e) => {
const url = new URL(e.href);
url.search =
"?" + Math.random() + "" + Math.random();
e.href = url.toString();
});
}
const socket = new WebSocket("ws://localhost:60808");
socket.onmessage = refresh_css;
</script>`
: ""}
</body> </body>
</html>`; </html>`;
} }

3
src/back/jdd-components/components.ts
View File

@ -5,3 +5,6 @@ export const registry = new Registry();
import { NiceBox } from "./nice-box/nice-box.jdd.js"; import { NiceBox } from "./nice-box/nice-box.jdd.js";
registry.add("nice-box", NiceBox); registry.add("nice-box", NiceBox);
import { MyAwesomeComponent } from "./my-awesome-component/my-awesome-component.jdd.js";
registry.add("my-awesome-component", MyAwesomeComponent);

1
src/back/routes/components.sreact.tsx
View File

@ -65,6 +65,7 @@ export default new (class ComponentsPage extends StatefulPage<State, typeof acti
return html(ctx, "Components", content, { return html(ctx, "Components", content, {
morphing: true, morphing: true,
preserveScroll: true, preserveScroll: true,
autoRefreshCSS: true,
navbar: () => ``, navbar: () => ``,
}); });
} }