refactor(): use strict, consolidate material.core, interimElement chaining

Closes #643. Closes #650. Closes #597. Closes #596. Closes #525.

Author: rschmukler

config/karma.conf.js

@@ -1,42 +1,24 @@
 
 module.exports = function(config) {
-  
-  var UNCOMPILED_SRC = [
-      'config/test-utils.js',
-      'src/core/**/*.js',
-
-      // Test utilities, source, and specifications.
-      // We are explicit like this because we don't want to put
-      // demos in the tests, and Karma doesn't support advanced
-      // globbing.
-      'src/components/*/*.js',
-      'src/components/tabs/js/*.js'
-  ];
-
-  var COMPILED_SRC = [
-    // Minified source
-    'dist/angular-material.min.js',
-
-    // Test utilties and specifications
-    'config/test-utils.js',
-    'src/**/*.spec.js'
-  ];
-  
-  // releaseMode is a custom configuration option.
-  var testSrc = config.releaseMode ? COMPILED_SRC : UNCOMPILED_SRC;
-
   config.set({
 
     basePath: __dirname + '/..',
     frameworks: ['jasmine'],
     files: [
-      // Dependencies
       'bower_components/angular/angular.js',
       'bower_components/angular-animate/angular-animate.js',
       'bower_components/angular-aria/angular-aria.js',
       'bower_components/angular-mocks/angular-mocks.js',
-      'bower_components/hammerjs/hammer.js'
-    ].concat(testSrc),
+      'bower_components/hammerjs/hammer.js',
+      'config/test-utils.js',
+      'src/core/**/*.js',
+
+      // We are explicit like this because we don't want to put
+      // demos in the tests, and Karma doesn't support advanced
+      // globbing.
+      'src/components/*/*.js',
+      'src/components/tabs/js/*.js',
+    ],
 
     port: 9876,
     reporters: ['progress'],

gulpfile.js

@@ -7,6 +7,7 @@ var glob = require('glob').sync;
 var gulp = require('gulp');
 var karma = require('karma').server;
 var pkg = require('./package.json');
+var exec = require('child_process').exec;
 var mergeStream = require('merge-stream');
 
 var argv = require('minimist')(process.argv.slice(2));
@@ -24,7 +25,7 @@ var ngAnnotate = require('gulp-ng-annotate');
 var rename = require('gulp-rename');
 var sass = require('gulp-sass');
 var through2 = require('through2');
-var closureCompiler = require('gulp-closure-compiler');
+var uglify = require('gulp-uglify');
 var webserver = require('gulp-webserver');
 
 var karma = require('karma').server;
@@ -44,24 +45,11 @@ var config = {
     ' * Angular Material Design\n' +
     ' * https://github.com/angular/material\n' +
     ' * @license MIT\n' +
-    ' * v' + VERSION + '\n' +
+    ' * v' + pkg.version + '\n' +
     ' */\n',
-  jsBaseFiles: [
-    'src/core/**/*.js',
-    '!src/core/**/*.spec.js'
-  ],
-  themeBaseFiles: [
-    'src/core/style/color-palette.scss',
-    'src/core/style/variables.scss',
-    'src/core/style/mixins.scss'
-  ],
-  scssBaseFiles: [
-    'src/core/style/color-palette.scss',
-    'src/core/style/variables.scss',
-    'src/core/style/mixins.scss',
-    'src/core/style/structure.scss',
-    'src/core/style/layout.scss'
-  ],
+  jsBaseFiles: ['src/core/**/*.js', '!src/core/**/*.spec.js'],
+  themeBaseFiles: ['src/core/style/color-palette.scss', 'src/core/style/variables.scss', 'src/core/style/mixins.scss'],
+  scssBaseFiles: ['src/core/style/color-palette.scss', 'src/core/style/variables.scss', 'src/core/style/mixins.scss', 'src/core/style/{structure,layout}.scss'],
   paths: 'src/{components,services}/**',
   outputDir: 'dist/'
 };
@@ -89,33 +77,31 @@ var buildModes = {
 IS_DEMO_BUILD && (BUILD_MODE="demos");
 BUILD_MODE = buildModes[BUILD_MODE] || buildModes['default'];
 
-
 if (IS_RELEASE_BUILD) {
   console.log(
     gutil.colors.red('--release:'),
-    'Building release version (minified)...'
+    'Building release version (minified, debugs stripped)...'
   );
 }
 
 require('./docs/gulpfile')(gulp, IS_RELEASE_BUILD);
 
-
-
 gulp.task('default', ['build']);
+//gulp.task('build', ['scripts', 'sass', 'sass-src']);
 gulp.task('validate', ['jshint', 'karma']);
 gulp.task('changelog', function(done) {
   changelog({
     repository: 'https://github.com/angular/material',
-    version: VERSION,
+    version: pkg.version,
     file: 'CHANGELOG.md'
   }, function(err, log) {
     fs.writeFileSync(__dirname + '/CHANGELOG.md', log);
   });
 });
 gulp.task('jshint', function() {
   return gulp.src(
-    buildConfig.paths.js.concat(buildConfig.paths.test)
-  )
+      buildConfig.paths.js.concat(buildConfig.paths.test)
+    )
     .pipe(jshint('.jshintrc'))
     .pipe(jshint.reporter(require('jshint-summary')({
       fileColCol: ',bold',
@@ -126,30 +112,19 @@ gulp.task('jshint', function() {
     .pipe(jshint.reporter('fail'));
 });
 
-
 /** *****************************************
  *
  * Tasks for Karma Test
  *
  ** ***************************************** */
 
 gulp.task('karma', function(done) {
-  var karmaConfig = {
-    singleRun: true,
-    autoWatch: false,
+  karma.start({
+    singleRun:true,
+    autoWatch:false,
     browsers : argv.browsers ? argv.browsers.trim().split(',') : ['Chrome'],
     configFile: __dirname + '/config/karma.conf.js'
-  };
-
-  gutil.log('Running unit tests on unminified source.');
-  karma.start(karmaConfig, testMinified);
-
-  function testMinified() {
-    gutil.log('Running unit tests on minified source.');
-    buildJs(true);
-    karmaConfig.releaseMode = true;
-    karma.start(karmaConfig, done);
-  }
+  },done);
 });
 
 gulp.task('karma-watch', function(done) {
@@ -189,10 +164,7 @@ gulp.task('build-all-modules', function() {
         stream = buildModule(moduleId, false);
       }
 
-      stream.on('end', function() {
-        next();
-      });
-    }));
+gulp.task('build', ['build-themes', 'build-scss', 'build-js'], function() {
 });
 
 function buildModule(module, isRelease) {
@@ -289,7 +261,6 @@ gulp.task('server', function() {
     }));
 });
 
-
 /** *****************************************
  *
  * Tasks and functions for module Javascript
@@ -343,12 +314,14 @@ function buildJs(isRelease) {
   return gulp.src(config.jsBaseFiles.concat([jsGlob]))
     .pipe(filterNonCodeFiles())
     .pipe(utils.buildNgMaterialDefinition())
+    .pipe(insert.wrap('(function() {\n', '})();\n'))
     .pipe(concat('angular-material.js'))
     .pipe(insert.prepend(config.banner))
     .pipe(ngAnnotate())
     .pipe(gulp.dest(config.outputDir))
-    .pipe(gulpif(isRelease, lazypipe()
-      .pipe(minifyJs, 'angular-material.min.js')
+    .pipe(gulpif(IS_RELEASE_BUILD, lazypipe()
+      .pipe(uglify)
+      .pipe(rename, {extname: '.min.js'})
       .pipe(gulp.dest, config.outputDir)
       ()
     ));
@@ -388,7 +361,7 @@ gulp.task('build-module-demo', function() {
   var demoIndexTemplate = fs.readFileSync(
     __dirname + '/docs/demos/demo-index.template.html', 'utf8'
   ).toString();
-
+  
   gutil.log('Building demos for', mod, '...');
 
   return utils.readModuleDemos(mod, function() {

package.json

@@ -10,20 +10,19 @@
     "dgeni": "^0.4.1",
     "dgeni-packages": "^0.10.3",
     "esprima": "^1.2.2",
-    "event-stream": "^3.1.5",
     "glob": "~4.0.2",
     "gulp": "^3.6.2",
     "gulp-autoprefixer": "^1.0.1",
-    "gulp-closure-compiler": "^0.2.7",
     "gulp-concat": "^2.2.0",
     "gulp-filter": "^1.0.2",
     "gulp-if": "^1.2.0",
     "gulp-insert": "^0.4.0",
     "gulp-jshint": "^1.5.5",
     "gulp-minify-css": "^0.3.4",
-    "gulp-ng-annotate": "^0.3.5",
+    "gulp-ng-annotate": "^0.3.4",
     "gulp-ng-html2js": "^0.1.8",
     "gulp-rename": "^1.2.0",
+    "gulp-replace": "^0.3.0",
     "gulp-sass": "ajoslin/gulp-sass#master",
     "gulp-uglify": "^0.3.0",
     "gulp-util": "^3.0.1",

src/components/dialog/dialog.js

@@ -43,114 +43,24 @@ function MdDialogDirective($$rAF, $mdTheming) {
  *   an element with class `md-actions` for the dialog's actions.
  *
  * @usage
- * ##### HTML
- *
  * <hljs lang="html">
- * <div  ng-app="demoApp" ng-controller="EmployeeController">
- *   <md-button ng-click="showAlert()" class="md-raised md-warn">
- *     Employee Alert!
- *   </md-button>
- *   <md-button ng-click="closeAlert()" ng-disabled="!hasAlert()" class="md-raised">
- *     Close Alert
- *   </md-button>
- *   <md-button ng-click="showGreeting($event)" class="md-raised md-primary" >
- *     Greet Employee
+ * <div ng-controller="MyController">
+ *   <md-button ng-click="openDialog($event)">
+ *     Open a Dialog from this button!
  *   </md-button>
  * </div>
  * </hljs>
  *
- * ##### JavaScript
- *
  * <hljs lang="js">
- * (function(angular, undefined){
- *   "use strict";
- *
- *   angular
- *     .module('demoApp', ['ngMaterial'])
- *     .controller('EmployeeController', EmployeeEditor)
- *     .controller('GreetingController', GreetingController);
- *
- *   // Fictitious Employee Editor to show how to use simple and complex dialogs.
- *
- *   function EmployeeEditor($scope, $mdDialog) {
- *     var alert;
- *
- *     $scope.showAlert = showAlert;
- *     $scope.closeAlert = closeAlert;
- *     $scope.showGreeting = showCustomGreeting;
- *
- *     $scope.hasAlert = function() { return !!alert };
- *     $scope.userName = $scope.userName || 'Bobby';
- *
- *     // Dialog #1 - Show simple alert dialog and cache
- *     // reference to dialog instance
- *
- *     function showAlert() {
- *       alert = $mdDialog.alert()
- *         .title('Attention, ' + $scope.userName)
+ * var app = angular.module('app', ['ngMaterial']);
+ * app.controller('MyController', function($scope, $mdDialog) {
+ *   $scope.openDialog = function($event) {
+ *     $mdDialog.show(
+ *       $mdDialog.alert()
+ *         .title('Hello, ' + $scope.userName)
  *         .content('This is an example of how easy dialogs can be!')
- *         .ok('Close');
- *
- *       $mdDialog
- *           .show( alert )
- *           .finally(function() {
- *             alert = undefined;
- *           });
- *     }
- *
- *     // Close the specified dialog instance and resolve with 'finished' flag
- *     // Normally this is not needed, just use '$mdDialog.hide()' to close
- *     // the most recent dialog popup.
- *
- *     function closeAlert() {
- *       $mdDialog.hide( alert, "finished" );
- *       alert = undefined;
- *     }
- *
- *     // Dialog #2 - Demonstrate more complex dialogs construction and popup.
- *
- *     function showCustomGreeting($event) {
- *         $mdDialog.show({
- *           targetEvent: $event,
- *           template:
- *             '<md-dialog>' +
- *
- *             '  <md-content>Hello {{ employee }}!</md-content>' +
- *
- *             '  <div class="md-actions">' +
- *             '    <md-button ng-click="closeDialog()">' +
- *             '      Close Greeting' +
- *
- *             '    </md-button>' +
- *             '  </div>' +
- *             '</md-dialog>',
- *           controller: 'GreetingController',
- *           onComplete: afterShowAnimation,
- *           locals: { employee: $scope.userName }
- *         });
- *
- *         // When the 'enter' animation finishes...
- *
- *         function afterShowAnimation(scope, element, options) {
- *            // post-show code here: DOM element focus, etc.
- *         }
- *     }
- *   }
- *
- *   // Greeting controller used with the more complex 'showCustomGreeting()' custom dialog
- *
- *   function GreetingController($scope, $mdDialog, employee) {
- *     // Assigned from construction <code>locals</code> options...
- *     $scope.employee = employee;
- *
- *     $scope.closeDialog = function() {
- *       // Easily hides most recent dialog shown...
- *       // no specific instance reference is needed.
- *       $mdDialog.hide();
- *     };
- *   }
- *
- * })(angular);
+ *     );
+ *   });
  * </hljs>
  */