added react

Author: ichub

gulpfile.js

@@ -29,7 +29,7 @@ let cli = commandLineArgs([
 let options = cli.parse();
 
 let sassGlob = './sass/**/*.scss';
-let tsGlob = "./src/**/*.ts";
+let tsGlob = "./src/**/*.@(ts|tsx)";
 
 let sassOutputGlob = './css/**/*.css';
 let tsOutputGlob = './dist/**/*.js';
@@ -46,12 +46,13 @@ gulp.task("browserfiy", ["ts"], function () {
 });
 
 gulp.task('ts', function () {
-    return gulp.src('src/**/*.ts')
+    return gulp.src(tsGlob)
         .pipe(ts({
             declaration: false,
             module: "commonjs",
             target: "es6",
-            experimentalDecorators: true
+            experimentalDecorators: true,
+            jsx: "react"
         }))
         .js
         .pipe(babel({

index.html

@@ -13,5 +13,6 @@
 <div id="assembler-output"></div>
 <div id="assembler-error-output"></div>
 <div id="graphics"></div>
+<div id="app-container"></div>
 </body>
 </html>

package.json

@@ -4,6 +4,8 @@
   "description": "",
   "main": "gulpfile.js",
   "dependencies": {
+    "react": "^0.14.7",
+    "react-dom": "^0.14.7"
   },
   "devDependencies": {
     "browserify": "^13.0.0",

src/Main.ts renamed to src/Main.tsx

@@ -2,6 +2,9 @@ import {Computer} from "./computer";
 import {Interface} from "./Interface";
 import {RAM} from "./RAM";
 import {TextInitializer} from "./TextInitializer";
+import * as ReactDom from "react-dom";
+import * as React from "react";
+import {TestComponent} from "./components/TestComponent";
 
 const computer = new Computer();
 const webInterface = new Interface(computer);
@@ -33,4 +36,7 @@ computer.loadProgram([
 window.addEventListener("load", () => {
     webInterface.bind();
     computer.cpu.run();
+
+    ReactDom.render(<TestComponent/>, document.getElementById("app-container"));
 });
+

src/components/TestComponent.tsx

@@ -0,0 +1,7 @@
+import * as React from "react";
+
+export class TestComponent extends React.Component<any, any> {
+    public render() {
+        return <div>Hello World</div>
+    }
+}

tsd.json

@@ -7,6 +7,12 @@
   "installed": {
     "jasmine/jasmine.d.ts": {
       "commit": "dade4414712ce84e3c63393f1aae407e9e7e6af7"
+    },
+    "react/react.d.ts": {
+      "commit": "d22516f9f089de107d7e7d5938566377370631f6"
+    },
+    "react/react-dom.d.ts": {
+      "commit": "d22516f9f089de107d7e7d5938566377370631f6"
     }
   }
 }