Merge pull request microsoft#16 from Microsoft/umdSample

vladima · vladima · commit 710c81ae2d96 · 2015-08-08T19:52:17.000-07:00
initial version of UMD/TypeScript sample
diff --git a/umd/.gitignore b/umd/.gitignore
@@ -0,0 +1,4 @@
+node_modules
+shared/timeReporter.js
+browser/app.js
+node/app.js
diff --git a/umd/README.md b/umd/README.md
@@ -0,0 +1,36 @@
+**Fetch dependencies:**
+```
+npm install
+```
+
+**Compile TypeScript source code**
+
+```
+node node_modules/typescript/bin/tsc.js
+```
+
+**Start browser version of the sample using http-server on custom port (code should be compiled prior to this step)**
+```
+node node_modules/http-server/bin/http-server -p 8080 -o
+```
+'-p' sets the port to use, default port is 8080. If it is taken pick any port that is free. 
+After server is started open 'localhost:8080' in a browser.
+
+
+**Run example using Node (code should be compiled prior to this step)**
+
+```
+node node/app.js
+```
+
+Shortcuts for doing compile\run steps from above:
+
+*Browser*
+```
+npm run browser
+```
+
+*Node*
+```
+npm run node
+```
diff --git a/umd/browser/app.css b/umd/browser/app.css
@@ -0,0 +1,8 @@
+﻿body
+{
+    font-family: 'Segoe UI', sans-serif
+}
+
+span {
+    font-style: italic
+}
diff --git a/umd/browser/app.ts b/umd/browser/app.ts
@@ -0,0 +1,13 @@
+import { TimeReporter } from '../shared/timeReporter'
+
+let element = document.getElementById("content");
+element.innerText += "The time is: ";
+let span = document.createElement("span");
+element.appendChild(span);
+
+function printer(s: string): void {
+    span.innerText = s;
+}
+
+let timeReporter = new TimeReporter(printer);
+timeReporter.start();
diff --git a/umd/index.html b/umd/index.html
@@ -0,0 +1,15 @@
+﻿<!DOCTYPE html>
+
+<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
+<head>
+    <meta charset="utf-8" />
+    <title>TypeScript HTML App</title>
+    <link rel="stylesheet" href="browser/app.css" type="text/css" />
+    <script data-main="browser/app" type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.1/require.min.js"></script>
+</head>
+<body>
+    <h1>UMD/TypeScript sample</h1>
+
+    <div id="content"></div>
+</body>
+</html>
diff --git a/umd/node/app.ts b/umd/node/app.ts
@@ -0,0 +1,8 @@
+import { TimeReporter } from '../shared/timeReporter'
+import { EOL } from 'os';
+function printer(s): void {
+    console.log("The time is: " +  s + EOL);
+}
+
+let timeReporter = new TimeReporter(printer);
+timeReporter.start();
diff --git a/umd/node/os.d.ts b/umd/node/os.d.ts
@@ -0,0 +1,3 @@
+declare module "os" {
+    export var EOL: string;
+}
diff --git a/umd/package.json b/umd/package.json
@@ -0,0 +1,19 @@
+{
+    "name": "typescript-umd",
+    "version": "1.0.0",
+    "description": "UMD/TypeScript demo",
+    "repository": {
+        "type": "git",
+        "url": "https://github.com/Microsoft/TypeScriptSamples.git"
+    },
+    "dependencies": {
+        "http-server": "0.8.0"
+    },
+    "devDependencies": {
+        "typescript": "^1.5.3"
+    },
+    "scripts": {
+        "browser": "node node_modules/typescript/bin/tsc.js && node node_modules/http-server/bin/http-server -o",
+        "node": "node node_modules/typescript/bin/tsc.js && node node/app.js"
+    }
+}
diff --git a/umd/shared/timeReporter.ts b/umd/shared/timeReporter.ts
@@ -0,0 +1,23 @@
+export type Printer = (s: string) => void;
+
+export class TimeReporter
+{
+    printer: Printer
+    timerToken: number;
+
+    constructor (printer: Printer)
+    {
+        this.printer = printer;
+        this.printer(new Date().toUTCString());
+    }
+
+    start()
+    {
+        this.timerToken = setInterval(() => this.printer(new Date().toUTCString()), 500);
+    }
+
+    stop()
+    {
+        clearTimeout(this.timerToken);
+    }
+}
diff --git a/umd/tsconfig.json b/umd/tsconfig.json
@@ -0,0 +1,12 @@
+{
+    "compilerOptions": {
+        "module": "UMD",
+        "target": "es5"
+    },
+    "files": [
+        "shared/timeReporter.ts",
+        "browser/app.ts",
+        "node/os.d.ts",
+        "node/app.ts"
+    ]
+}

-Original file line number
+Diff line change
@@ @@ -0,0 +1,8 @@ @@
 +body
 +{
 +    font-family: 'Segoe UI', sans-serif
 +}
++
 +span {
 +    font-style: italic
 +}
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+declare module "os" {`
	`2`	`+ export var EOL: string;`
	`3`	`+}`