feat(WebWorkers) Add DOM event support

closes #3046
This commit is contained in:
Jason Teplitz
2015-07-10 16:09:18 -07:00
parent 8e960d4052
commit 7b834e02ec
27 changed files with 556 additions and 165 deletions

View File

@ -9,5 +9,5 @@ import "package:angular2/src/reflection/reflection.dart";
main(List<String> args, SendPort replyTo) {
reflector.reflectionCapabilities = new ReflectionCapabilities();
bootstrapWebworker(replyTo, HelloCmp);
bootstrapWebworker(replyTo, HelloCmp).catchError((error) => throw error);
}

View File

@ -1,11 +0,0 @@
<!doctype html>
<html>
<title>Hello Angular 2.0</title>
<body>
<hello-app>
Loading...
</hello-app>
$SCRIPTS$
</body>
</html>

View File

@ -0,0 +1,26 @@
<!doctype html>
<html>
<title>Hello Angular 2.0</title>
<style>
.sample-area {
text-align: center;
margin: 5px;
height: 50px;
line-height: 50px;
border-radius: 5px;
border: 1px solid #d0d0d0;
}
.sample-area:focus {
border: 1px solid blue;
color: blue;
font-weight: bold;
}
</style>
<body>
<hello-app>
Loading...
</hello-app>
$SCRIPTS$
</body>
</html>

View File

@ -1,4 +1,5 @@
import {ElementRef, Component, Directive, View, Injectable, Renderer} from 'angular2/angular2';
import {StringWrapper} from 'angular2/src/facade/lang';
// A service available to the Injector, used by the HelloCmp component.
@Injectable()
@ -37,7 +38,8 @@ class RedDec {
// Expressions in the template (like {{greeting}}) are evaluated in the
// context of the HelloCmp class below.
template: `<div class="greeting">{{greeting}} <span red>world</span>!</div>
<button class="changeButton">change greeting</button>`,
<button class="changeButton" (click)="changeGreeting()">change greeting</button>
<div (keydown)="onKeyDown($event)" class="sample-area" tabindex="0">{{lastKey}}</div><br>`,
// All directives used in the template need to be specified. This allows for
// modularity (RedDec can only be used in this template)
// and better tooling (the template can be invalidated if the attribute is
@ -46,8 +48,11 @@ class RedDec {
})
export class HelloCmp {
greeting: string;
lastKey: string = '(none)';
constructor(service: GreetingService) { this.greeting = service.greeting; }
changeGreeting(): void { this.greeting = 'howdy'; }
onKeyDown(event): void { this.lastKey = StringWrapper.fromCharCode(event['keyCode']); }
}

View File

@ -1,27 +1,24 @@
$SCRIPTS$
$SCRIPTS$ window = {
setTimeout: setTimeout,
Map: Map,
Set: Set,
Array: Array,
Reflect: Reflect,
RegExp: RegExp,
Promise: Promise,
Date: Date,
zone: zone
};
assert = function() {};
// TODO (jteplitz) Monkey patch this from within angular (#3207)
window = {
setTimeout: setTimeout,
Map: Map,
Set: Set,
Array: Array,
Reflect: Reflect,
RegExp: RegExp,
Promise: Promise,
Date: Date
};
assert = function() {}
System.import("examples/src/web_workers/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); });
System.import("examples/src/web_workers/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); });