Phil 11.12.13

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”

watcher_prompt

  • 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>