Prototype of a directly-embedded WebWorker.

This commit is contained in:
Joshua A. Horton 2018-11-15 09:37:19 +07:00
parent fdf55f8701
commit ba11ccbd23
7 changed files with 179 additions and 0 deletions

View file

@ -21,5 +21,6 @@
<body>
<h1>Language-Modeling Layer module testing</h1>
<h2><a href="./simple-webworker">A simple basic WebWorker.</a></h2> Designed as a baseline functionality test we can run against various platforms as a first-stage canary of sorts.
<h2><a href="./one-stage-embedded-webworker">A simple basic WebWorker.</a></h2> A prototype for directly embedding a WebWorker's code within a "master" script.
</body>
</html>

View file

@ -0,0 +1,2 @@
main.js
main.js.map

View file

@ -0,0 +1,65 @@
#! /bin/bash
#
# Compiles the Language Modeling Layer for common use in predictive text and autocorrective applications.
# Designed for optimal compatibility with the Keyman Suite.
#
display_usage ( ) {
echo "build.sh [-clean]"
echo
echo " -clean to erase pre-existing build products before a re-build"
}
# Fails the build if a specified file does not exist.
assert ( ) {
if ! [ -f $1 ]; then
fail "Build failed."
exit 1
fi
}
# Prints a nice, common error message.
fail ( ) {
FAILURE_MSG="$1"
if [[ "$FAILURE_MSG" == "" ]]; then
FAILURE_MSG="Unknown failure."
fi
echo "${ERROR_RED}$FAILURE_MSG${NORMAL}"
exit 1
}
SOURCE="testing/one-stage-embedded-webworker"
echo "Node.js + dependencies check"
npm install --no-optional
if [ $? -ne 0 ]; then
fail "Build environment setup error detected! Please ensure Node.js is installed!"
fi
# A nice, extensible method for -clean operations. Add to this as necessary.
clean ( ) {
rm -rf "./*.js"
if [ $? -ne 0 ]; then
fail "Failed to erase the prior build."
fi
}
# Process command-line arguments
while [[ $# -gt 0 ]] ; do
key="$1"
case $key in
-clean)
clean
;;
esac
shift # past the processed argument
done
npm run tsc -- -p $SOURCE/tsconfig.json
if [ $? -ne 0 ]; then
fail "Compilation failed."
fi
echo "Typescript compilation successful."

View file

@ -0,0 +1,42 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<!-- Set the viewport width to match phone and tablet device widths -->
<meta name="viewport" content="width=device-width,user-scalable=no" />
<!-- Allow KeymanWeb to be saved to the iPhone home screen -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<!-- Enable IE9 Standards mode -->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Embedded WebWorker test</title>
<!-- Your page CSS -->
<style type='text/css'>
body {font-family: Tahoma,helvetica;}
h3 {font-size: 1em;font-weight:normal;color: darkred; margin-bottom: 4px}
.test {font-size: 1.5em; width:80%; min-height:30px; border: 1px solid gray;}
#KeymanWebControl {width:50%;min-width:600px;}
</style>
<script src="main.js"></script>
</head>
<!-- Sample page HTML -->
<body>
<h2>LM Layer Testing - One-Stage Embedded WebWorkers</h2>
<p>This page serves as a prototype for embedding a WebWorker's code within its "master" script
across the TypeScript transpilation boundary.</p>
<input type='text' id='txtFeedback' value="No clicks yet." readonly></input> <br>
<script>
var txtFeedback = document.getElementById("txtFeedback");
txtFeedback.value = "No clicks yet.";
</script>
<input type='button' id='btnInput' onclick='canaryWorker.postMessage("Hello.");' value='Message the WebWorker.' />
<h3><a href="../index.html">Return to testing home page</a></h3>
</body>
</html>

View file

@ -0,0 +1,52 @@
// Useful for passing class constructors
type Workable<T> = {
new (...args: any[]): T;
// Requires a static implementation.
onmessage(e: any): void;
};
class A {
a(x: number, y: number):number {
return x + y;
}
}
var WorkerGlobals = {
counter: 0,
a: A
}
class WorkerCore {
static WorkerGlobals = WorkerGlobals;
//static counter: number;
static onmessage(e: any) {
WorkerGlobals.counter++;
console.log("Message received from main page: ", e.data);
// Forces TypeScript to interpret this line as plain JavaScript, as it uses a non-Worker definition.
// @ts-ignore
postMessage(WorkerGlobals.counter);
}
}
function createWorkerFromClasses(globals: object, fn: Workable<object>): Worker {
var sep = ";\n";
let glb = "var WorkerGlobals = " + JSON.stringify(globals);
let wc = "var onmessage = " + fn.onmessage.toString();
var blob = new Blob([glb, sep, wc], { type: 'text/javascript' });
let url = URL.createObjectURL(blob);
return new Worker(url);
}
var canaryWorker = createWorkerFromClasses(WorkerGlobals, WorkerCore);
canaryWorker.onmessage = function(e) {
var counter = e.data; // Number of times the WebWorker has been messaged.
console.log("Received message from the WebWorker: " + e.data);
var txtFeedback = <HTMLInputElement>document.getElementById("txtFeedback");
txtFeedback.value = counter + " click(s)";
}

View file

@ -0,0 +1,13 @@
{
"compilerOptions": {
"allowJs": false,
"module": "none",
"outDir": "./",
"inlineSources": true,
"sourceMap": true,
"target": "es5"
},
"files" : [
"main.ts"
]
}

View file

@ -10,5 +10,9 @@
},
"include" : [
"./*.ts"
],
"exclude" : [
"node_modules",
"testing"
]
}