Readme

Injects the "Code on Val Town" ribbon on an HTML string stream

Usage

  • new InjectCodeOnValTownStream({ handle: "andre", name: "foo" }) - define which val to link to;
  • new InjectCodeOnValTownStream() - infer the val from the call stack.

Example: @andreterron/openable_stream

import { InjectCodeOnValTownStream } from "https://esm.town/v/andreterron/InjectCodeOnValTownStream"; import { blob } from "https://esm.town/v/std/blob?v=11"; import { html } from "https://esm.town/v/stevekrouse/html?v=5"; export default async (req: Request): Promise<Response> => { await blob.set( "openable_test", `<h2>Hello world!</h2> <style>* { font-family: sans-serif }</style>`, ); const value = await blob.get("openable_test"); return html( value.body .pipeThrough(new TextDecoderStream()) .pipeThrough(new InjectCodeOnValTownStream()) .pipeThrough(new TextEncoderStream()), ); };
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import { ribbonElement } from "https://esm.town/v/andreterron/codeOnVT_ribbonElement?v=7";
import { InjectHTMLElementStream } from "https://esm.town/v/andreterron/InjectHTMLElementStream?v=9";
import { rootValRef } from "https://esm.town/v/andreterron/rootValRef?v=3";
import { ValRef } from "https://esm.town/v/andreterron/ValRef?v=1";
/**
* @param val Define which val should open. Defaults to the root reference.
*/
export class InjectCodeOnValTownStream extends InjectHTMLElementStream {
constructor({ val, style }: { val?: ValRef; style?: string } = {}) {
const valRef = val?.handle && val?.name ? val : rootValRef();
const element = valRef ? ribbonElement({ val: valRef, style }) : "";
super(element);
}
}
Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
Comments
Nobody has commented on this val yet: be the first!
v4
February 29, 2024