build: separate demo-app in its own directory.

Author: hansl

.gitignore

@@ -25,6 +25,7 @@
 /.idea
 
 # misc
+.DS_Store
 /.sass-cache
 /connect.lock
 /coverage/*

angular-cli-build.js

@@ -5,20 +5,66 @@ const path = require('path');
 // Import the require hook. Enables us to require TS files natively.
 require('ts-node/register');
 
-
 const Angular2App = require('angular-cli/lib/broccoli/angular2-app');
 const Funnel = require('broccoli-funnel');
 const MergeTree = require('broccoli-merge-trees');
 const autoPrefixerTree = require('broccoli-autoprefixer');
 
 
 module.exports = function(defaults) {
-  var angularAppTree = new Angular2App(defaults, {
-    sourceDir: 'src/',
+  const appTree = buildAppTree(defaults);
+  const cssAutoprefixed = autoPrefixerTree(new Funnel(appTree, {
+    include: [ '**/*.css' ]
+  }));
+
+  return new MergeTree([
+    new Funnel('src/demo-app', { include: ['**/*.scss'] }),
+    appTree,
+    cssAutoprefixed
+  ], { overwrite: true });
+};
+
+
+function buildAppTree(defaults) {
+  let inputNode = new MergeTree([
+    new Funnel('typings', {
+      destDir: 'typings'
+    }),
+    new Funnel('src', {
+      include: ['components/**/*', 'core/**/*'],
+      destDir: 'src'
+    }),
+    new Funnel('src/demo-app', {
+      destDir: 'src/demo-app'
+    })
+  ]);
+
+  const getCoreAndComponentPath = function(name) {
+    if (name.startsWith('src/core')) {
+      return name.replace(/^src\/core/, 'src/demo-app/core');
+    } else if (name.startsWith('src/components')) {
+      return name.replace(/^src\/components/, 'src/demo-app/components');
+    }
+    return name;
+  };
+
+  return new Angular2App(defaults, inputNode, {
+    assets: {
+      getDestinationPath: getCoreAndComponentPath
+    },
+    sourceDir: 'src/demo-app',
+    tsCompiler: {
+      additionalFiles: [
+        'src/core/**/*.ts',
+        'src/components/**/*.ts'
+      ],
+      getDestinationPath: getCoreAndComponentPath
+    },
     sassCompiler: {
       includePaths: [
         'src/core/style'
-      ]
+      ],
+      getDestinationPath: getCoreAndComponentPath
     },
     vendorNpmFiles: [
       'systemjs/dist/system-polyfills.js',
@@ -30,14 +76,4 @@ module.exports = function(defaults) {
       '@angular/**/*.js',
     ]
   });
-
-  const cssAutoprefixed = autoPrefixerTree(new Funnel(angularAppTree, {
-    include: [ '**/*.css' ]
-  }));
-
-  return new MergeTree([
-    new Funnel('src', { include: ['**/*.scss']}),
-    angularAppTree,
-    cssAutoprefixed,
-  ], { overwrite: true });
-};
+}

config/environment.dev.ts

@@ -0,0 +1,3 @@
+export const environment = {
+  production: false
+};

config/environment.prod.ts

@@ -0,0 +1,3 @@
+export const environment = {
+  production: true
+};

package.json

@@ -28,10 +28,10 @@
     "@angular/common": "2.0.0-rc.0",
     "@angular/compiler": "2.0.0-rc.0",
     "@angular/core": "2.0.0-rc.0",
-    "@angular/router": "2.0.0-rc.0",
     "@angular/http": "2.0.0-rc.0",
     "@angular/platform-browser": "2.0.0-rc.0",
     "@angular/platform-browser-dynamic": "2.0.0-rc.0",
+    "@angular/router": "2.0.0-rc.0",
     "es6-promise": "^3.0.2",
     "es6-shim": "^0.35.0",
     "reflect-metadata": "0.1.3",
@@ -41,7 +41,7 @@
   },
   "devDependencies": {
     "add-stream": "^1.0.0",
-    "angular-cli": "0.0.37",
+    "angular-cli": "^1.0.0-beta.1",
     "broccoli-autoprefixer": "^4.1.0",
     "broccoli-funnel": "^1.0.1",
     "broccoli-merge-trees": "^1.1.1",
@@ -68,7 +68,7 @@
     "symlink-or-copy": "^1.0.1",
     "ts-node": "^0.5.5",
     "tslint": "^3.5.0",
-    "typescript": "^1.8.0",
+    "typescript": "^1.9.0-dev",
     "typings": "^0.8.1",
     "which": "^1.2.4"
   }

src/components/button/button.ts

@@ -14,6 +14,7 @@ import {
 
 
 @Component({
+  moduleId: module.id,
   selector: 'button[md-button], button[md-raised-button], button[md-icon-button], ' +
             'button[md-fab], button[md-mini-fab]',
   inputs: ['color'],
@@ -23,8 +24,8 @@ import {
     '(focus)': 'setKeyboardFocus()',
     '(blur)': 'removeKeyboardFocus()',
   },
-  templateUrl: './components/button/button.html',
-  styleUrls: ['./components/button/button.css'],
+  templateUrl: 'button.html',
+  styleUrls: ['button.css'],
   encapsulation: ViewEncapsulation.None,
   changeDetection: ChangeDetectionStrategy.OnPush,
 })

src/components/card/card.ts

@@ -21,9 +21,10 @@ it also provides a number of preset styles for common card sections, including:
 */
 
 @Component({
+  moduleId: module.id,
   selector: 'md-card',
-  templateUrl: './components/card/card.html',
-  styleUrls: ['./components/card/card.css'],
+  templateUrl: 'card.html',
+  styleUrls: ['card.css'],
   encapsulation: ViewEncapsulation.None,
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
@@ -45,8 +46,9 @@ TODO(kara): update link to demo site when it exists
 */
 
 @Component({
+  moduleId: module.id,
   selector: 'md-card-header',
-  templateUrl: './components/card/card-header.html',
+  templateUrl: 'card-header.html',
   encapsulation: ViewEncapsulation.None,
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
@@ -64,8 +66,9 @@ TODO(kara): update link to demo site when it exists
 */
 
 @Component({
+  moduleId: module.id,
   selector: 'md-card-title-group',
-  templateUrl: './components/card/card-title-group.html',
+  templateUrl: 'card-title-group.html',
   encapsulation: ViewEncapsulation.None,
   changeDetection: ChangeDetectionStrategy.OnPush,
 })

src/components/checkbox/checkbox.ts

@@ -55,9 +55,10 @@ enum TransitionCheckState {
  * See: https://www.google.com/design/spec/components/selection-controls.html
  */
 @Component({
+  moduleId: module.id,
   selector: 'md-checkbox',
-  templateUrl: './components/checkbox/checkbox.html',
-  styleUrls: ['./components/checkbox/checkbox.css'],
+  templateUrl: 'checkbox.html',
+  styleUrls: ['checkbox.css'],
   host: {
     'role': 'checkbox',
     '[id]': 'id',

src/components/grid-list/grid-list.ts

@@ -1,8 +1,9 @@
 import {Component} from '@angular/core';
 
 @Component({
+  moduleId: module.id,
   selector: 'md-grid-list',
-  templateUrl: './components/grid-list/grid-list.html',
-  styleUrls: ['./components/grid-list/grid-list.css'],
+  templateUrl: 'grid-list.html',
+  styleUrls: ['grid-list.css'],
 })
 export class MdGridList {}

src/components/icon/icon.ts

@@ -55,9 +55,10 @@ export class MdIconInvalidNameError extends Error {
  *     <md-icon fontSet="fa" fontIcon="alarm"></md-icon>
  */
 @Component({
+  moduleId: module.id,
   template: '<ng-content></ng-content>',
   selector: 'md-icon',
-  styleUrls: ['./components/icon/icon.css'],
+  styleUrls: ['icon.css'],
   host: {
     'role': 'img',
   },