[
  {
    "path": ".gitignore",
    "content": "/node_modules/\n.DS_Store\nnpm-debug.log\n/typings/\n**/bower_packages\n\n# all generated JS\nsrc/js\nsrc/app/**/*.js\nsrc/app/**/*.js.map\n"
  },
  {
    "path": "README.md",
    "content": "# AngularIn20TypeScript\n\nSimple AngularJS Application with TypeScript, you can view video about typescript and angular in 20 minutes at ngconf 2015 on [youtube](https://www.youtube.com/watch?list=PLOETEcp3DkCoNnlhE-7fovYvqwVPrRiY7&feature=player_embedded&v=U7NYTKgkZgo)\n\n# Usage\n\n- Install global dependencies **if necessary**\n\n  ```\n    npm install -g gulp-cli typings superstatic\n  ```\n\n- Install node packages:\n\n  ```\n   npm install\n  ```\n\n- Launch the server\n\n  ```\n   npm start\n  ```\n"
  },
  {
    "path": "gulpfile.config.js",
    "content": "'use strict';\nvar GulpConfig = (function () {\n    function gulpConfig() {\n        //Got tired of scrolling through all the comments so removed them\n        //Don't hurt me AC :-)\n        this.source = './src/';\n        this.sourceApp = this.source + 'app/';\n\n        this.tsOutputPath = this.source + '/js';\n        this.allJavaScript = [this.source + '/js/**/*.js'];\n        this.allTypeScript = this.sourceApp + '/**/*.ts';\n\n        this.typings = './typings/';\n        this.libraryTypeScriptDefinitions = './typings/main/**/*.ts';\n    }\n    return gulpConfig;\n})();\nmodule.exports = GulpConfig;\n"
  },
  {
    "path": "gulpfile.js",
    "content": "'use strict';\n\nvar gulp = require('gulp'),\n    debug = require('gulp-debug'),\n    inject = require('gulp-inject'),\n    tsc = require('gulp-typescript'),\n    tslint = require('gulp-tslint'),\n    sourcemaps = require('gulp-sourcemaps'),\n    del = require('del'),\n    Config = require('./gulpfile.config'),\n    tsProject = tsc.createProject('tsconfig.json'),\n    browserSync = require('browser-sync'),\n    superstatic = require( 'superstatic' );\n\nvar config = new Config();\n\n/**\n * Generates the app.d.ts references file dynamically from all application *.ts files.\n */\n// gulp.task('gen-ts-refs', function () {\n//     var target = gulp.src(config.appTypeScriptReferences);\n//     var sources = gulp.src([config.allTypeScript], {read: false});\n//     return target.pipe(inject(sources, {\n//         starttag: '//{',\n//         endtag: '//}',\n//         transform: function (filepath) {\n//             return '/// <reference path=\"../..' + filepath + '\" />';\n//         }\n//     })).pipe(gulp.dest(config.typings));\n// });\n\n/**\n * Lint all custom TypeScript files.\n */\ngulp.task('ts-lint', function () {\n    return gulp.src(config.allTypeScript).pipe(tslint()).pipe(tslint.report('prose'));\n});\n\n/**\n * Compile TypeScript and include references to library and app .d.ts files.\n */\ngulp.task('compile-ts', function () {\n    var sourceTsFiles = [config.allTypeScript,                //path to typescript files\n                         config.libraryTypeScriptDefinitions]; //reference to library .d.ts files\n                        \n\n    var tsResult = gulp.src(sourceTsFiles)\n                       .pipe(sourcemaps.init())\n                       .pipe(tsc(tsProject));\n\n        tsResult.dts.pipe(gulp.dest(config.tsOutputPath));\n        return tsResult.js\n                        .pipe(sourcemaps.write('.'))\n                        .pipe(gulp.dest(config.tsOutputPath));\n});\n\n/**\n * Remove all generated JavaScript files from TypeScript compilation.\n */\ngulp.task('clean-ts', function (cb) {\n  var typeScriptGenFiles = [\n                              config.tsOutputPath +'/**/*.js',    // path to all JS files auto gen'd by editor\n                              config.tsOutputPath +'/**/*.js.map', // path to all sourcemap files auto gen'd by editor\n                              '!' + config.tsOutputPath + '/lib'\n                           ];\n\n  // delete the files\n  del(typeScriptGenFiles, cb);\n});\n\ngulp.task('watch', function() {\n    gulp.watch([config.allTypeScript], ['ts-lint', 'compile-ts']);\n});\n\ngulp.task('serve', ['compile-ts', 'watch'], function() {\n  process.stdout.write('Starting browserSync and superstatic...\\n');\n  browserSync({\n    port: 3000,\n    files: ['index.html', '**/*.js'],\n    injectChanges: true,\n    logFileChanges: false,\n    logLevel: 'silent',\n    logPrefix: 'angularin20typescript',\n    notify: true,\n    reloadDelay: 0,\n    server: {\n      baseDir: './src',\n      middleware: superstatic({ debug: false})\n    }\n  });\n});\n\ngulp.task('default', ['ts-lint', 'compile-ts']);\n"
  },
  {
    "path": "package.json",
    "content": "{\n  \"name\": \"angularjs-typescript-in20\",\n  \"version\": \"1.0.0\",\n  \"description\": \"AngularJS and TypeScript\",\n  \"contributors\": [\n    {\n      \"name\": \"Dan Wahlin\"\n    }\n  ],\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"https://github.com/DanWahlin/AngularIn20TypeScript\"\n  },\n  \"scripts\": {\n    \"postinstall\": \"npm run typings install && gulp\",\n    \"start\": \"gulp serve\",\n    \"typings\": \"typings\"\n  },\n  \"keywords\": [\n    \"angularjs\",\n    \"typescript\"\n  ],\n  \"license\": \"ISC\",\n  \"dependencies\": {\n\n  },\n  \"devDependencies\": {\n    \"browser-sync\": \"^2.12.5\",\n    \"del\": \"^2.2.0\",\n    \"gulp\": \"^3.9.1\",\n    \"gulp-debug\": \"^2.1.2\",\n    \"gulp-inject\": \"^4.0.0\",\n    \"gulp-sourcemaps\": \"^1.6.0\",\n    \"gulp-tslint\": \"^5.0.0\",\n    \"gulp-typescript\": \"^2.13.0\",\n    \"typescript\": \"^1.8.10\",\n    \"typings\": \"^0.8.1\",\n    \"superstatic\": \"^4.0.2\",\n    \"tslint\": \"^3.8.1\"\n  }\n}\n"
  },
  {
    "path": "src/app/app.module.ts",
    "content": "((): void => {\n\n    var app = angular.module('demoApp', ['ngRoute', 'ngAnimate']);\n\n    app.config(['$routeProvider', ($routeProvider) => {\n        $routeProvider.when('/',\n        {\n            controller: 'demoApp.CustomersController',\n            templateUrl: 'app/views/customers.html',\n            controllerAs: 'vm'\n        })\n        .when('/orders/:customerId',\n        {\n            controller: 'demoApp.OrdersController',\n            templateUrl: 'app/views/orders.html',\n            controllerAs: 'vm'\n        });\n    }]);\n\n})();\n"
  },
  {
    "path": "src/app/controllers/customers.controller.ts",
    "content": "module demoApp {\n    'use strict';\n\n    class CustomersController {\n        customers: ICustomer[] = null;\n\n        static $inject = ['demoApp.dataService'];\n        constructor(dataService: DataService) {\n            dataService.getCustomers()\n              .then((custs: ICustomer[]) => {\n                 this.customers = custs;\n              });\n        }\n    }\n\n    angular.module('demoApp')\n           .controller('demoApp.CustomersController', CustomersController);\n\n}\n"
  },
  {
    "path": "src/app/controllers/orders.controller.ts",
    "content": "module demoApp {\n\n    class OrdersController {\n\n        customerId: number;\n        orders: IOrder[];\n\n        static $inject = ['$routeParams', 'demoApp.dataService'];\n        constructor($routeParams, dataService: DataService) {\n            this.customerId = $routeParams.customerId;\n\n            dataService.getOrder(this.customerId)\n              .then((orders: IOrder[]) => {\n                 this.orders = orders;\n              });\n        }\n    }\n\n    angular.module('demoApp')\n        .controller('demoApp.OrdersController', OrdersController);\n\n}\n"
  },
  {
    "path": "src/app/directives/filterTextbox.directive.ts",
    "content": "module demoApp.directives {\n\n    class FilterTextbox implements ng.IDirective {\n\n        static instance() : ng.IDirective {\n            return new FilterTextbox();\n        }\n\n        template = 'Search: <input type=\"text\" ng-model=\"vm.filter\" /> {{ vm.message }}';\n        restrict = 'E';\n        scope = {\n            filter: '='\n        };\n        controller: ($scope: ng.IScope) => void;\n        controllerAs = 'vm';\n        bindToController = true;\n\n        constructor() {\n            this.controller = function ($scope: ng.IScope) {\n                var vm = this;\n                vm.message = 'Hello';\n\n                $scope.$watch('vm.filter', (newVal, oldVal) => {\n                    if (oldVal !== '' && newVal === '') {\n                        vm.message = 'Please enter a value';\n                    } else {\n                        vm.message = '';\n                    }\n                });\n            };\n        }\n    }\n\n    angular.module('demoApp').directive('filterTextbox', FilterTextbox.instance);\n\n}\n"
  },
  {
    "path": "src/app/services/data.service.ts",
    "content": "module demoApp {\n\n    export interface ICustomer {\n        id: number;\n        name: string;\n        total: number;\n    }\n\n    export interface IOrder {\n        product: string;\n        total: number;\n    }\n\n    export class DataService {\n\n        static $inject = ['$http'];\n        constructor(private $http: ng.IHttpService) {}\n\n        getCustomers(): ng.IPromise<ICustomer[]> {\n            return this.$http.get('customers.json').then(response => {\n                return response.data;\n            });\n        }\n\n        getOrder(id: number): ng.IPromise<IOrder[]> {\n            return this.$http.get('orders.json', {data: { id: id }}).then(response => {\n               return response.data;\n            });\n        }\n    }\n\n    angular.module('demoApp')\n        .service('demoApp.dataService', DataService);\n\n}\n"
  },
  {
    "path": "src/app/views/customers.html",
    "content": "<div>\n    <filter-textbox filter=\"vm.filter\"></filter-textbox>\n    <br />\n    <h3>Customers:</h3>\n    <table class=\"table table-striped\">\n        <thead>\n            <tr>\n                <th>Name</th>\n                <th>Total</th>\n            </tr>\n        </thead>\n        <tr ng-repeat=\"cust in vm.customers |  filter:vm.filter | orderBy:'name'\">\n            <td><a href=\"#/orders/{{ cust.id }}\">{{ cust.name  }}</a></td>\n            <td>{{ cust.total | currency }}</td>\n        </tr>\n    </table>\n</div>\n"
  },
  {
    "path": "src/app/views/orders.html",
    "content": "<h3>Orders</h3>\n<br />\nCustomerID: {{ vm.customerId }}\n<br /><br />\n<table class=\"table table-striped\">\n    <tr>\n        <th>Product</th>\n        <th>Total</th>\n    </tr>\n    <tr ng-repeat=\"order in vm.orders\">\n        <td>{{order.product}}</td>\n        <td>{{order.total}}</td>\n    </tr>\n</table>\n\n<br />\n\n<a href=\"#/\">Customers</a>\n"
  },
  {
    "path": "src/customers.json",
    "content": "[\n    {\"id\": 1, \"name\":\"Ted\", \"total\": 5.996}, \n    {\"id\": 2, \"name\":\"Michelle\", \"total\": 10.994}, \n    {\"id\": 3, \"name\":\"Zed\", \"total\": 10.99}, \n    {\"id\": 4, \"name\":\"Tina\", \"total\": 15.994}\n]"
  },
  {
    "path": "src/index.html",
    "content": "<!--\n   AngularJS with TypeScript in 20-ish Minutes\n   Dan Wahlin\n\n   @DanWahlin\n   http://weblogs.asp.net/dwahlin\n   http://github.com/danwahlin\n\n   1. Data Binding and Directives\n   2. Filters\n   3. Modules and Controllers\n   4. Routes\n   5. Factories\n-->\n<!DOCTYPE html>\n<html ng-app=\"demoApp\">\n<head>\n    <title>Angular App</title>\n    <link href=\"//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css\" rel=\"stylesheet\" />\n    <link href=\"styles/animations.css\" rel=\"stylesheet\" />\n</head>\n<body>\n    <h1>AngularJS and TypeScript</h1>\n    <br />\n\n    <div ng-view class=\"slide-animation\"></div>\n\n    <script src=\"//ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.js\"></script>\n    <script src=\"//ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.js\"></script>\n    <script src=\"//ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-animate.js\"></script>\n    <script src=\"js/app.module.js\"></script>\n    <script src=\"js/controllers/customers.controller.js\"></script>\n    <script src=\"js/controllers/orders.controller.js\"></script>\n    <script src=\"js/services/data.service.js\"></script>\n    <script src=\"js/directives/filterTextbox.directive.js\"></script>\n</body>\n</html>\n"
  },
  {
    "path": "src/orders.json",
    "content": "[\n\t{ \"product\": \"Golf Balls\", \"total\": 19.99},\n\t{ \"product\": \"Driver\", \"total\": 219.99}\n]"
  },
  {
    "path": "src/styles/animations.css",
    "content": "/* Animations */\r\n.slide-animation-container {\r\n    position:relative;\r\n}\r\n\r\n.slide-animation.ng-enter, .slide-animation.ng-leave {\r\n    -webkit-transition: 0.5s linear all;\r\n    -moz-transition: 0.5s linear all;\r\n    -o-transition: 0.5s linear all;\r\n    transition: 0.5s linear all;\r\n    position:relative;\r\n    /*top: 0;\r\n    left: 0;\r\n    right: 0;*/\r\n    height: 1000px;\r\n}\r\n\r\n.slide-animation.ng-enter {\r\n  z-index:100;\r\n  left:100px;\r\n  opacity:0;\r\n}\r\n\r\n.slide-animation.ng-enter.ng-enter-active {\r\n  left:0;\r\n  opacity:1;\r\n}\r\n\r\n.slide-animation.ng-leave {\r\n  z-index:101;\r\n  opacity:1;\r\n  left:0;\r\n}\r\n\r\n.slide-animation.ng-leave.ng-leave-active {\r\n  left:-100px;\r\n  opacity:0;\r\n}\r\n\r\nbody.skip-animations * {\r\n  -webkit-transition:none!important;\r\n  -moz-transition:none!important;\r\n  -o-transition:none!important;\r\n  transition:none!important;\r\n}\r\n\r\n.show-hide-animation.ng-hide-add, \r\n.show-hide-animation.ng-hide-remove {\r\n  -webkit-transition:all linear 0.3s;\r\n  -moz-transition:all linear 0.3s;\r\n  -o-transition:all linear 0.3s;\r\n  transition:all linear 0.3s;\r\n  display:block!important;\r\n  height: 1000px;\r\n}\r\n \r\n.show-hide-animation.ng-hide-remove {\r\n  opacity:0;\r\n}\r\n.show-hide-animation.ng-hide-remove.ng-hide-remove-active {\r\n  opacity:1;\r\n}\r\n.show-hide-animation.ng-hide-add {\r\n  opacity:1;\r\n}\r\n.show-hide-animation.ng-hide-add.ng-hide-add-active {\r\n  opacity:0;\r\n}\r\n\r\n.repeat-animation.ng-enter, \r\n.repeat-animation.ng-leave, \r\n.repeat-animation.ng-move {\r\n  -webkit-transition: 0.5s linear all;\r\n  -moz-transition: 0.5s linear all;\r\n  -o-transition: 0.5s linear all;\r\n  transition: 0.5s linear all;\r\n  position:relative;\r\n}\r\n\r\n.repeat-animation.ng-enter {\r\n  left:10px;\r\n  opacity:0;\r\n}\r\n.repeat-animation.ng-enter.ng-enter-active {\r\n  left:0;\r\n  opacity:1;\r\n}\r\n\r\n.repeat-animation.ng-leave {\r\n  left:10px;\r\n  opacity:1;\r\n}\r\n.repeat-animation.ng-leave.ng-leave-active {\r\n  left:-10px;\r\n  opacity:0;\r\n}\r\n\r\n.repeat-animation.ng-move {\r\n  opacity:0.5;\r\n}\r\n.repeat-animation.ng-move.ng-move-active {\r\n  opacity:1;\r\n}\r\n\r\nbody {\r\n  margin-left: 20px;   \r\n}\r\n\r\ntable {\r\n    width: 300px;\r\n}"
  },
  {
    "path": "superstatic.json",
    "content": "{\n  \"root\": \"src\"\n}\n"
  },
  {
    "path": "tsconfig.json",
    "content": "{\n    \"compilerOptions\": {\n        \"target\": \"es5\",\n        \"sourceMap\": true\n    }\n}"
  },
  {
    "path": "tslint.json",
    "content": "{\n  \"rules\": {\n    \"class-name\": true,\n    \"curly\": true,\n    \"eofline\": false,\n    \"forin\": true,\n    \"indent\": [true, 4],\n    \"label-position\": true,\n    \"label-undefined\": true,\n    \"max-line-length\": [true, 140],\n    \"no-arg\": true,\n    \"no-bitwise\": true,\n    \"no-console\": [true,\n      \"debug\",\n      \"info\",\n      \"time\",\n      \"timeEnd\",\n      \"trace\"\n    ],\n    \"no-construct\": true,\n    \"no-debugger\": true,\n    \"no-duplicate-key\": true,\n    \"no-duplicate-variable\": true,\n    \"no-empty\": true,\n    \"no-eval\": true,\n    \"no-string-literal\": false,\n    \"no-trailing-whitespace\": true,\n    \"no-unused-variable\": false,\n    \"no-unreachable\": true,\n    \"no-use-before-declare\": true,\n    \"one-line\": [true,\n      \"check-open-brace\",\n      \"check-catch\",\n      \"check-else\",\n      \"check-whitespace\"\n    ],\n    \"quotemark\": [true, \"single\"],\n    \"radix\": true,\n    \"semicolon\": true,\n    \"triple-equals\": [true, \"allow-null-check\"],\n    \"variable-name\": false,\n    \"whitespace\": [true,\n      \"check-branch\",\n      \"check-decl\",\n      \"check-operator\",\n      \"check-separator\"\n    ]\n  }\n}\n"
  },
  {
    "path": "typings.json",
    "content": "{\n  \"ambientDependencies\": {\n    \"angular\": \"registry:dt/angular#1.5.0+20160412133217\",\n    \"angular-animate\": \"registry:dt/angular-animate#1.5.0+20160407085121\",\n    \"angular-route\": \"registry:dt/angular-route#1.3.0+20160317120654\",\n    \"jquery\": \"registry:dt/jquery#1.10.0+20160417213236\"\n  }\n}\n"
  }
]