8:00 – 4:00 SR
- Back from CA and YUI class. It was 72-76 and clear blue skies out there. Here it’s 40 with sprinkles and gloomy clouds. But our bad traffic is way better than their bad traffic.
- Backups
- Need to do status for Tangie. Done.
- Composing email to Jenny Donnelly about YUI
- Adding Typescript (Cool Typescript Playground)
- Following directions on the JetBrains site
- Downloading and installing node.js
- added NODE_JS_HOME as a path variable
- installed the typescript package. Note that it gets installed to the user directory, not the node dir: C:\Users\Phil\AppData\Roaming\npm
- Pressed the “Configure” button, which downloaded sources
- Poked at the “set scope” link, which doesn’t have an obvious effect.
- Clicked on “Add Watcher” in the pop-up alert (shown below) that appeared when I tried to save “typescriptTest.ts”
- Added the C:\Users\Phil\AppData\Roaming\npm\tsc.cmp path to the watcher config dialog and then clicked “OK”
- Ok, so now Typescript works. However, integrating it looks to be a pain..? But at the same time, it looks like there is a GitHub project that has set up all the interfaces?
- Ok, the typescript runs, the watcher converts it, and a small HTML file launches it.
TypeScript:
class Greeter {
greeting: string;
constructor(message: string) {
this.greeting = message;
}
greet() {
return "Hello, " + this.greeting;
}
}
var greeter = new Greeter("typescript");
var button = document.createElement('button');
button.textContent = "Say Hello";
button.onclick = function() {
alert(greeter.greet());
}
document.body.appendChild(button);
Transpiled JavaScript:
var Greeter = (function () {
function Greeter(message) {
this.greeting = message;
}
Greeter.prototype.greet = function () {
return "Hello, " + this.greeting;
};
return Greeter;
})();
var greeter = new Greeter("typescript");
var button = document.createElement('button');
button.textContent = "Say Hello";
button.onclick = function () {
alert(greeter.greet());
};
document.body.appendChild(button);
//# sourceMappingURL=typescriptTest.js.map
HTML (Calling JavaScript)
<!DOCTYPE html> <html> <title>TypeScript test</title> <body> <script type="text/javascript" src="typescriptTest.js"> </script> </body> </html>
viztales 
You must be logged in to post a comment.