cargdev/angular
1
0
Fork 0
Code Issues 16 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(WebWorker): Expose MessageBroker API

Browse Source 
Closes #3942
This commit is contained in:
Jason Teplitz
2015-09-01 10:55:11 -07:00
parent 6532171997
commit 358908e605
31 changed files with 267 additions and 275 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
modules/examples/src/message_broker/background_index.dart
View File

@ -1,29 +0,0 @@
library angular2.examples.message_broker.background_index;
import "package:angular2/src/web_workers/shared/client_message_broker.dart"
show ClientMessageBroker, UiArguments;
import "package:angular2/src/web_workers/shared/serializer.dart"
show Serializer;
import "package:angular2/src/web_workers/shared/isolate_message_bus.dart";
import "package:angular2/src/web_workers/worker/application.dart"
show WebWorkerMessageBusSink;
import "package:angular2/src/core/facade/async.dart";
import "dart:isolate";
main(List<String> args, SendPort replyTo) {
ReceivePort rPort = new ReceivePort();
var sink = new WebWorkerMessageBusSink(replyTo, rPort);
var source = new IsolateMessageBusSource(rPort);
IsolateMessageBus bus = new IsolateMessageBus(sink, source);
ObservableWrapper.subscribe(bus.from("echo"), (value) {
ObservableWrapper.callNext(bus.to("echo"), value);
});
ClientMessageBroker broker =
new ClientMessageBroker(bus, new Serializer(null, null, null), "test");
var args = new UiArguments("tester");
broker.runOnUiThread(args, String).then((data) {
ObservableWrapper.callNext(bus.to("result"), data);
});
}

33
modules/examples/src/message_broker/background_index.ts
View File

@ -1,33 +0,0 @@
import {
PostMessageBus,
PostMessageBusSink,
PostMessageBusSource
} from 'angular2/src/web_workers/shared/post_message_bus';
import {ObservableWrapper} from 'angular2/src/core/facade/async';
import {
ClientMessageBroker,
UiArguments
} from "angular2/src/web_workers/shared/client_message_broker";
import {Serializer} from "angular2/src/web_workers/shared/serializer";
interface PostMessageInterface {
(message: any, transferrables?:[ArrayBuffer]): void;
}
var _postMessage: PostMessageInterface = <any>postMessage;
export function main() {
var sink = new PostMessageBusSink({
postMessage:
(message: any, transferrables?:[ArrayBuffer]) => { _postMessage(message, transferrables); }
});
var source = new PostMessageBusSource();
var bus = new PostMessageBus(sink, source);
ObservableWrapper.subscribe(bus.from("echo"),
(value) => { ObservableWrapper.callNext(bus.to("echo"), value); });
var broker = new ClientMessageBroker(bus, new Serializer(null, null, null), "test");
var args = new UiArguments("tester");
broker.runOnUiThread(args, String)
.then((data: string) => { ObservableWrapper.callNext(bus.to("result"), data); });
}

30
modules/examples/src/message_broker/index.dart
View File

@ -1,30 +0,0 @@
library angular2.examples.message_broker.index;
import "package:angular2/src/web_workers/ui/application.dart"
show spawnWebWorker;
import "package:angular2/src/core/facade/async.dart";
import "dart:html";
main() {
var VALUE = 5;
spawnWebWorker(Uri.parse("background_index.dart")).then((bus) {
querySelector("#send_echo").addEventListener("click", (e) {
var val = (querySelector("#echo_input") as InputElement).value;
ObservableWrapper.callNext(bus.to("echo"), val);
});
ObservableWrapper.subscribe(bus.from("echo"), (message) {
querySelector("#echo_result")
.appendHtml("<span class='response'>${message}</span>");
});
ObservableWrapper.subscribe(bus.from("result"), (message) {
querySelector("#ui_result")
.appendHtml("<span class='result'>${message}</span>");
});
ObservableWrapper.subscribe(bus.from("test"),
(Map<String, dynamic> message) {
ObservableWrapper.callNext(bus.to("test"),
{'id': message['id'], 'type': "result", 'value': VALUE});
});
});
}

28
modules/examples/src/message_broker/index.ts
View File

@ -1,28 +0,0 @@
import {
PostMessageBus,
PostMessageBusSink,
PostMessageBusSource
} from 'angular2/src/web_workers/shared/post_message_bus';
import {ObservableWrapper} from 'angular2/src/core/facade/async';
var webWorker = new Worker("loader.js");
var sink = new PostMessageBusSink(webWorker);
var source = new PostMessageBusSource(webWorker);
var bus = new PostMessageBus(sink, source);
const VALUE = 5;
document.getElementById("send_echo")
.addEventListener("click", (e) => {
var val = (<HTMLInputElement>document.getElementById("echo_input")).value;
ObservableWrapper.callNext(bus.to("echo"), val);
});
ObservableWrapper.subscribe(bus.from("echo"), (message) => {
document.getElementById("echo_result").innerHTML = `<span class='response'>${message}</span>`;
});
ObservableWrapper.subscribe(bus.from("result"), (message) => {
document.getElementById("ui_result").innerHTML = `<span class='result'>${message}</span>`;
});
ObservableWrapper.subscribe(bus.from("test"), (message: StringMap<string, any>) => {
ObservableWrapper.callNext(bus.to("test"), {id: message['id'], type: "result", value: VALUE});
});

38
modules/examples/src/message_broker/loader.js
View File

@ -1,38 +0,0 @@
$SCRIPTS$
//importScripts("math_worker.js").execute();
//System.import("examples/src/web_workers/math_worker").then(function(m){console.log("got", m)});
//importScripts("rx.js");
// TODO: do this correctly with lang facade
window = {
setTimeout: setTimeout,
Map: Map,
Set: Set,
Array: Array,
Reflect: Reflect,
RegExp: RegExp,
Promise: Promise,
Date: Date
};
assert = function(){};
System.config({
baseURL: '/',
defaultJSExtensions: true,
paths: {
'rx': 'examples/src/message_broker/rx.js'
}
});
System.import("examples/src/message_broker/background_index").then(function(m){
console.log("running main");
try{
m.main();
} catch (e){
console.error(e);
}
}, function(error){
console.error("error loading background", error);
});

12
modules/examples/src/web_workers/message_broker/background_index.dart Normal file
View File

@ -0,0 +1,12 @@
library angular2.examples.message_broker.background_index;
import "package:angular2/web_worker/worker.dart";
import "package:angular2/src/core/reflection/reflection_capabilities.dart";
import "package:angular2/src/core/reflection/reflection.dart";
import "index_common.dart" show App;
import "dart:isolate";
main(List<String> args, SendPort replyTo) {
reflector.reflectionCapabilities = new ReflectionCapabilities();
bootstrapWebWorker(replyTo, App).catchError((error) => throw error);
}

6
modules/examples/src/web_workers/message_broker/background_index.ts Normal file
View File

@ -0,0 +1,6 @@
import {bootstrapWebWorker} from "angular2/web_worker/worker";
import {App} from "./index_common";
export function main() {
bootstrapWebWorker(App);
}

22
modules/examples/src/web_workers/message_broker/index.dart Normal file
View File

@ -0,0 +1,22 @@
library angular2.examples.message_broker.index;
import "package:angular2/web_worker/ui.dart";
import "package:angular2/src/core/reflection/reflection_capabilities.dart";
import "package:angular2/src/core/reflection/reflection.dart";
import "dart:html";
main() {
reflector.reflectionCapabilities = new ReflectionCapabilities();
const ECHO_CHANNEL = "ECHO";
bootstrap("background_index.dart").then((instance) {
var broker = instance.app.createClientMessageBroker(ECHO_CHANNEL);
querySelector("#send_echo").addEventListener("click", (e) {
var val = (querySelector("#echo_input") as InputElement).value;
var args = new UiArguments("echo", [new FnArg(val, PRIMITIVE)]);
broker.runOnService(args, PRIMITIVE).then((echo_result) {
querySelector("#echo_result")
.appendHtml("<span class='response'>${echo_result}</span>");
});
});
});
}

1
modules/examples/src/message_broker/index.html → modules/examples/src/web_workers/message_broker/index.html
View File

@ -2,6 +2,7 @@
<html>
<title>Message Broker Example</title>
<body>
<app></app>
<input type="text" id="echo_input" />
<button type="button" id="send_echo">Send Echo</button>
<p id="echo_result"></p>

25
modules/examples/src/web_workers/message_broker/index.ts Normal file
View File

@ -0,0 +1,25 @@
import {bootstrap, UiArguments, FnArg, PRIMITIVE} from "angular2/web_worker/ui";
const ECHO_CHANNEL = "ECHO";
var instance = bootstrap("loader.js");
var broker = instance.app.createClientMessageBroker(ECHO_CHANNEL);
document.getElementById("send_echo")
.addEventListener("click", (e) => {
var val = (<HTMLInputElement>document.getElementById("echo_input")).value;
// TODO(jteplitz602): Replace default constructors with real constructors
// once they're in the .d.ts file (#3926)
var args = new UiArguments();
args.method = "echo";
var fnArg = new FnArg();
fnArg.value = val;
fnArg.type = PRIMITIVE;
args.args = [fnArg];
broker.runOnService(args, PRIMITIVE)
.then((echo_result: string) => {
document.getElementById("echo_result").innerHTML =
`<span class='response'>${echo_result}</span>`;
});
});

17
modules/examples/src/web_workers/message_broker/index_common.ts Normal file
View File

@ -0,0 +1,17 @@
import {PromiseWrapper} from "angular2/src/core/facade/async";
import {Component, View, ServiceMessageBrokerFactory, PRIMITIVE} from "angular2/web_worker/worker";
const ECHO_CHANNEL = "ECHO";
@Component({selector: 'app', viewBindings: [ServiceMessageBrokerFactory]})
@View({template: "<h1>WebWorker MessageBroker Test</h1>"})
export class App {
constructor(private _serviceBrokerFactory: ServiceMessageBrokerFactory) {
var broker = _serviceBrokerFactory.createMessageBroker(ECHO_CHANNEL);
broker.registerMethod("echo", [PRIMITIVE], this._echo, PRIMITIVE);
}
private _echo(val: string) {
return PromiseWrapper.wrap(() => { return val; });
}
}

19
modules/examples/src/web_workers/message_broker/loader.js Normal file
View File

@ -0,0 +1,19 @@
$SCRIPTS$
System.config({
baseURL: '/',
defaultJSExtensions: true,
paths: {'rx': 'examples/src/web_workers/message_broker/rx.js'}
});
System.import("examples/src/web_workers/message_broker/background_index")
.then(
function(m) {
console.log("running main");
try {
m.main();
} catch (e) {
console.error(e);
}
},
function(error) { console.error("error loading background", error); });