Skip to content

Commit f8b3cd9

Browse files
reillyeonreillyeon
committed
Initial commit
0 parents  commit f8b3cd9

10 files changed

+7623
-0
lines changed

‎.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
dist/
2+
node_modules/

‎package-lock.json

+7,424
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
{
2+
"name": "serial-terminal",
3+
"version": "0.0.1",
4+
"description": "A demonstration of the Serial API providing an interactive serial console.",
5+
"dependencies": {
6+
"xterm": "^3.14.5"
7+
},
8+
"devDependencies": {
9+
"clean-webpack-plugin": "^3.0.0",
10+
"css-loader": "^3.1.0",
11+
"html-loader": "^0.5.5",
12+
"html-webpack-plugin": "^3.2.0",
13+
"style-loader": "^0.23.1",
14+
"ts-loader": "^6.0.4",
15+
"typescript": "^3.5.3",
16+
"webpack": "^4.38.0",
17+
"webpack-cli": "^3.3.6",
18+
"webpack-dev-server": "^3.7.2",
19+
"webpack-merge": "^4.2.1",
20+
"workbox-webpack-plugin": "^4.3.1"
21+
},
22+
"scripts": {
23+
"start": "webpack-dev-server --config webpack.dev.js",
24+
"build": "webpack --config webpack.prod.js"
25+
}
26+
}

‎src/index.html

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<html>
2+
<body>
3+
<button id="connect">Connect</button>
4+
<div id="terminal"></div>
5+
</body>
6+
</html>

‎src/index.ts

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import { Terminal } from 'xterm';
2+
import 'xterm/dist/xterm.css';
3+
4+
if ('serviceWorker' in navigator) {
5+
window.addEventListener('load', async () => {
6+
try {
7+
const registration = await navigator.serviceWorker.register('/service-worker.js');
8+
console.log('SW registered: ', registration);
9+
} catch (registrationError) {
10+
console.log('SW registration failed: ', registrationError);
11+
}
12+
});
13+
}
14+
15+
document.addEventListener('DOMContentLoaded', () => {
16+
const connectButton = document.getElementById("connect");
17+
18+
const term = new Terminal();
19+
term.open(document.getElementById("terminal"));
20+
21+
connectButton.addEventListener("click", async () => {
22+
const port = await navigator.serial.requestPort({});
23+
await port.open({ baudrate: 9600 });
24+
25+
const encoder = new TextEncoder();
26+
term.on('data', data => {
27+
const writer = port.writable.getWriter();
28+
writer.write(encoder.encode(data));
29+
writer.releaseLock();
30+
});
31+
32+
const reader = port.readable.getReader();
33+
const decoder = new TextDecoder();
34+
while (true) {
35+
const { value, done } = await reader.read();
36+
term.writeUtf8(value);
37+
if (done) {
38+
break;
39+
}
40+
}
41+
});
42+
});

‎src/serial.d.ts

+38
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
type ParityType = "none" | "even" | "odd";
2+
3+
interface SerialOptions {
4+
baudrate: number;
5+
databits?: number;
6+
stopbits?: number;
7+
parity?: ParityType;
8+
buffersize?: number;
9+
rtscts?: boolean;
10+
}
11+
12+
declare class SerialPort {
13+
readonly readable: ReadableStream<Uint8Array>;
14+
readonly writable: WritableStream<Uint8Array>;
15+
16+
open(options?: SerialOptions): Promise<void>;
17+
close(): void;
18+
}
19+
20+
interface SerialPortRequestOptions {
21+
}
22+
23+
declare class Serial extends EventTarget {
24+
onconnect(): (this: this, ev: Event) => any;
25+
ondisconnect(): (this: this, ev: Event) => any;
26+
getPorts(): Promise<SerialPort[]>;
27+
requestPort(options?: SerialPortRequestOptions): Promise<SerialPort>;
28+
addEventListener(type: "connect" | "disconnect", listener: (this: this, ev: Event) => any, useCapture?: boolean): void;
29+
addEventListener(type: string, listener: EventListenerOrEventListenerObject | null, options?: boolean | AddEventListenerOptions): void;
30+
}
31+
32+
interface Navigator {
33+
readonly serial: Serial;
34+
}
35+
36+
interface WorkerNavigator {
37+
readonly serial: Serial;
38+
}

‎tsconfig.json

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"compilerOptions": {
3+
"module": "commonjs",
4+
"lib": ["dom", "es2015"],
5+
"outDir": "./dist/",
6+
"sourceMap": true,
7+
"noImplicitAny": true,
8+
"target": "es5"
9+
}
10+
}

‎webpack.common.js

+59
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
const path = require('path');
2+
const HtmlWebpackPlugin = require('html-webpack-plugin');
3+
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
4+
const WorkboxPlugin = require('workbox-webpack-plugin');
5+
6+
module.exports = {
7+
entry: './src/index.ts',
8+
module: {
9+
rules: [
10+
{
11+
test: /\.ts$/,
12+
use: 'ts-loader',
13+
exclude: /node_modules/
14+
},
15+
{
16+
test: /\.html$/,
17+
loader: 'html-loader'
18+
},
19+
{
20+
test: /\.css$/,
21+
use: [
22+
'style-loader',
23+
'css-loader'
24+
]
25+
}
26+
],
27+
},
28+
plugins: [
29+
new CleanWebpackPlugin(),
30+
new HtmlWebpackPlugin({
31+
template: 'src/index.html'
32+
}),
33+
new WorkboxPlugin.GenerateSW({
34+
// these options encourage the ServiceWorkers to get in there fast
35+
// and not allow any straggling "old" SWs to hang around
36+
clientsClaim: true,
37+
skipWaiting: true
38+
})
39+
],
40+
resolve: {
41+
extensions: [ '.ts', '.js' ]
42+
},
43+
output: {
44+
filename: '[name].[contenthash].js',
45+
path: path.resolve(__dirname, 'dist')
46+
},
47+
optimization: {
48+
runtimeChunk: 'single',
49+
splitChunks: {
50+
cacheGroups: {
51+
vendor: {
52+
test: /[\\/]node_modules[\\/]/,
53+
name: 'vendors',
54+
chunks: 'all'
55+
}
56+
}
57+
}
58+
}
59+
};

‎webpack.dev.js

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
const merge = require('webpack-merge');
2+
const common = require('./webpack.common.js');
3+
4+
module.exports = merge(common, {
5+
mode: 'development',
6+
devtool: 'inline-source-map',
7+
devServer: {
8+
contentBase: './dist'
9+
}
10+
});

‎webpack.prod.js

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
const merge = require('webpack-merge');
2+
const common = require('./webpack.common.js');
3+
4+
module.exports = merge(common, {
5+
mode: 'production',
6+
});

0 commit comments

Comments
 (0)