Skip to content

Instantly share code, notes, and snippets.

@felladrin

felladrin/index.html

Created February 6, 2022 02:51
Show Gist options
  • Save felladrin/5d256a83331ac8722cbbe6f3a34cd01e to your computer and use it in GitHub Desktop.
Save felladrin/5d256a83331ac8722cbbe6f3a34cd01e to your computer and use it in GitHub Desktop.
Download ZIP
Loading TypeScript module directly in the browser using 'ts-browser-klesun'. You can try it at https://mrdoob.com/projects/htmleditor/
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/webextensions/console-panel/src/console-panel.css" />
<script src="https://cdn.jsdelivr.net/gh/webextensions/console-panel/src/console-panel.js"></script>
<script>
window.consolePanel.enable();
</script>
<script type="module">
import {loadModule} from 'https://cdn.jsdelivr.net/gh/klesun/ts-browser/src/ts-browser.js';
const {createPubSub} = await loadModule('https://cdn.jsdelivr.net/gh/felladrin/create-pubsub/src/main.ts');
const [setValue, watchValue, getValue] = createPubSub(0);
const [dispatchIncremented, onIncremented] = createPubSub();
const [dispatchDecremented, onDecremented] = createPubSub();
onIncremented(() => setValue(getValue() + 1));
onDecremented(() => setValue(getValue() - 1));
watchValue((state) => console.log(state));
dispatchIncremented(); // Prints 1.
dispatchIncremented(); // Prints 2.
dispatchDecremented(); // Prints 1.
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment