update: added example-typescript-project

.gitignore

@@ -4,4 +4,5 @@ dist
 package-lock.json
 .DS_Store
 prettiercache
-.npmrc
+.npmrc
+bin

example-typescript-project/README.md

@@ -0,0 +1,39 @@
+# TypeScript Template Project
+
+This template directory holds all files needed to begin your BrightSign Typescript project. Use these BrightSign-recommended typescript workflows to make on-player development incredibly easy.
+
+## Build Process
+
+BrightSign uses [`tsc`](https://www.npmjs.com/package/tsc), [`tsup`](https://www.npmjs.com/package/tsup) and [`webpack`](https://www.npmjs.com/package/webpack) to build our typescript projects. These three build steps are combined into one npm command: `npm run build`. 
+
+### Build Outputs
+
+The build results will be compiled into two directories: `dist/` and `bin/`. The output of `tsup` is in `dist/` and the output of `webpack` is in `bin/`. This means that the code you want to deploy to the player is contained in `bin/`. 
+
+### SD File Structure
+
+```bash
+SD .
++-- bundle.js
++-- autorun.brs
+`-- misc
+  +-- media.jpg
+  +-- supportingData.json
+```
+
+__Uploading with the CLI__:
+
+v1:
+
+```bash
+bsc putfile playerName bin/bundle.js
+bsc putfile playerName src/autorun.brs
+```
+
+v2:
+
+```bash
+bslc file --upload --player playerName -d SD/ -f bin/bundle.js
+bslc file --upload --player playerName -d SD/ -f src/autorun.brs
+```
+

example-typescript-project/jest.config.js

@@ -0,0 +1,6 @@
+const config = {
+    verbose: true,
+    testRegex: "(test|spec)\\.[jt]sx?$",
+};
+
+module.exports = config;

example-typescript-project/package.json

@@ -0,0 +1,63 @@
+{
+  "name": "bs-template-typescript",
+  "version": "1.0.0",
+  "description": "",
+  "main": "dist/index.ts",
+  "scripts": {
+    "start": "IS_DESKTOP=true NODE_PATH=./dist node dist/bundle.js",
+    "build": "npm run clean; tsc && tsup --external '@brightsign/deviceinfo'; webpack --mode development",
+    "build:prod": "npm run clean; tsc && tsup; webpack --mode production --node-env=production",
+    "clean": "rm -rf dist; rm -rf bin",
+    "reinstall": "npm run clean && rm -rf node_modules && npm install",
+    "lint": "eslint --no-error-on-unmatched-pattern --config ../.eslintrc src/**/*.{ts,tsx}",
+    "lint:fix": "eslint --fix src --ext js,jsx,ts,tsx,json",
+    "format:check": "prettier 'src/**/*.{js,jsx,ts,tsx,css,md,json}' --check --config ../.prettierrc.js --cache --cache-location=../prettiercache",
+    "format": "prettier --write 'src/**/*.{js,jsx,ts,tsx,css,md,json}' --config ../.prettierrc.js && npm run lint",
+    "test": "jest --config jest.config.js src/ --passWithNoTests",
+    "publish": "npm publish"
+  },
+  "repository": {
+    "url": "https://github.com/brightsign/dev-cookbook.git",
+    "type": "git",
+    "directory": "template-html5-app/"
+  },
+  "publishConfig": {
+      "registry": "https://registry.npmjs.org"
+  },
+  "author": "BrightSign LLC",
+  "license": "ISC",
+  "dependencies": {
+    "digest-fetch": "^3.1.1",
+    "express": "^4.19.2",
+    "form-data": "^4.0.0",
+    "http-status-codes": "^2.3.0",
+    "lodash": "^4.17.21",
+    "node-fetch": "^2.7.0",
+    "socket.io-client": "^4.7.5"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.24.5",
+    "@babel/core": "^7.24.5",
+    "@babel/preset-typescript": "^7.24.1",
+    "@types/express": "^4.17.21",
+    "@types/lodash": "^4.17.0",
+    "@types/node": "^14.18.63",
+    "@types/node-fetch": "^2.6.11",
+    "@typescript-eslint/eslint-plugin": "^5.62.0",
+    "@typescript-eslint/parser": "^5.62.0",
+    "eslint": "^7.24.0",
+    "eslint-config-prettier": "^9.1.0",
+    "html-webpack-plugin": "^5.6.0",
+    "jest": "^29.7.0",
+    "prettier": "^3.2.5",
+    "ts-loader": "^9.5.1",
+    "ts-node": "^10.9.2",
+    "typescript": "5.1.6",
+    "webpack": "^5.33.2",
+    "webpack-cli": "^4.6.0",
+    "tsup": "5.0.0"
+  },
+  "engine": {
+    "node": "14.17.6"
+  }
+}

example-typescript-project/src/autorun.brs

@@ -0,0 +1,82 @@
+function main()
+
+	mp = CreateObject("roMessagePort") 
+	'Enable lDWS
+	EnableLDWS()
+	' Enable SSH
+	EnableSSH()
+	' Create HTML Widget
+	node = createobject("roNodeJs", "bundle.js", {message_port:mp})
+
+	'Event Loop
+	while true
+		msg = wait(0,mp)
+		print "msg received - type=";type(msg)
+
+		if type(msg) = "roHtmlWidgetEvent" then
+			print "msg: ";msg
+		end if
+	end while
+
+end function
+
+function CreateHTMLWidget(mp as object) as object
+	' Enable Web Inspector
+	reg = CreateObject("roRegistrySection","html")
+	reg.Write("enable_web_inspector","1")
+	reg.Flush()
+
+	' Get Screen Resolution
+	vidmode = CreateObject("roVideoMode")
+	width = vidmode.GetResX()
+	height = vidmode.GetResY()
+
+	r = CreateObject("roRectangle",0,0,width,height)
+
+	' Create HTML Widget config
+	config = {
+		nodejs_enabled: true
+		inspector_server: {
+			port: 3000
+		}
+		url: "file:///sd:/dist/index.html"
+		port: mp
+	}
+
+	' Create HTML Widget
+	h = CreateObject("roHtmlWidget",r,config)
+	return h
+
+end function
+
+function EnableLDWS()
+
+	registrySection = CreateObject("roRegistrySection", "networking")
+
+	if type(registrySection) = "roRegistrySection" then 
+
+		registrySection.Write("http_server", "80")
+
+	end if
+
+	registrySection.Flush()
+
+end function
+
+function EnableSSH()
+
+	regSSH = CreateObject("roRegistrySection", "networking")
+
+	if type(regSSH) = "roRegistrySection" then
+
+		regSSH.Write("ssh","22")
+
+	endif
+
+	n = CreateObject("roNetworkConfiguration", 0)
+	n.SetLoginPassword("password")
+	n.Apply()
+
+	regSSH.Flush()
+
+end function

example-typescript-project/src/brightsign-device-info.d.ts

@@ -0,0 +1 @@
+declare module "@brightsign/deviceinfo";

example-typescript-project/src/index.ts

@@ -0,0 +1,26 @@
+import http, { IncomingMessage, ServerResponse } from "http";
+import diClass from "@brightsign/deviceinfo";
+
+function main() {
+    const di = new diClass();
+
+    const server = http.createServer(
+        (req: IncomingMessage, res: ServerResponse) => {
+            // Set the response header with the appropriate content type for JSON
+            res.setHeader("Content-Type", "application/json");
+
+            // Convert the object to a JSON-formatted string
+            const jsonResponse: string = JSON.stringify(di);
+
+            // Send the JSON response
+            res.end(jsonResponse);
+        }
+    );
+
+    const port = 13131;
+    server.listen(port, () => {
+        console.log(`Server running at http://localhost:${port}`);
+    });
+}
+
+main();

example-typescript-project/tsconfig.json

@@ -0,0 +1,18 @@
+{
+  "compilerOptions": {
+    "module": "es2022",
+    "moduleResolution": "node",
+    "esModuleInterop": true,
+    "target": "es6",
+    "outDir": "./dist",
+    "rootDir": "src",
+    "sourceMap": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true
+  },
+  "include": ["src/**/*"],
+  "exclude": ["tmp", "dist", "coverage", "node_modules"],
+  "watchOptions": {
+    "excludeDirectories": ["tmp", "dist", "coverage", "**/node_modules"]
+  }
+}

example-typescript-project/tsup.config.ts

@@ -0,0 +1,10 @@
+import { defineConfig } from 'tsup';
+
+export default defineConfig({
+  entryPoints: ['src/index.ts'],
+  format: ['cjs', 'esm'],
+  splitting: false,
+  clean: true,
+  dts: true,
+  target: 'node14',
+});

example-typescript-project/webpack.config.js

@@ -0,0 +1,34 @@
+const path = require('path');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+
+const isProduction = process.env.NODE_ENV === 'production';
+
+module.exports = {
+  entry: './dist/index.js',
+  module: {
+    rules: [
+      {
+        test: /\.tsx?$/,
+        use: 'ts-loader',
+        exclude: /node_modules/,
+      },
+    ],
+  },
+  resolve: {
+    extensions: ['.tsx', '.ts', '.js', '.jsx'],
+  },
+  output: {
+    filename: 'bundle.js',
+    path: path.resolve(__dirname, 'bin'),
+  },
+  target: 'node',
+  plugins: [],
+  externals: ({ request }, callback) => {
+    if (/^@brightsign\//.test(request)) {
+      return callback(null, 'commonjs ' + request);
+    }
+    callback();
+  },
+  mode: isProduction ? 'production' : 'development',
+  devtool: isProduction ? 'source-map' : 'eval-source-map',
+};