Merge pull request #22 from ianmstew/production-readiness

Production ready

Author: Curtis

.gitignore

@@ -2,5 +2,6 @@ node_modules
 bower_components
 dist
 temp
+vendor
 .DS_Store
 *.log

Gruntfile.js

@@ -3,37 +3,48 @@ module.exports = function (grunt) {
 
   grunt.initConfig({
 
+    pkg: grunt.file.readJSON('package.json'),
+
     path: {
       // Source folders
       app: 'app',
-      app_js: 'app/app-js',
-      less: 'app/less',
+      app_appjs: 'app/app-js',
+      app_style: 'app/less',
+      app_vendor: 'app/vendor',
 
       // Intermediate folders (transient)
       temp: 'temp',
+      bower: 'bower_components',
 
       // Output folders (transient)
       dist: 'dist',
+      dist_appjs: 'dist/app-js',
       dist_style: 'dist/style',
       dist_vendor: 'dist/vendor'
     },
 
     clean: {
-      dist: ['<%- path.dist %>', '<%- path.temp %>']
+      all: [
+        '<%- path.app_vendor %>',
+        '<%- path.dist %>',
+        '<%- path.temp %>',
+        '<%- path.bower %>'
+      ]
     },
 
     less: {
       options: {
         paths: [
-          '<%- path.dist_vendor %>',
+          '<%- path.app_vendor %>',
           '<%- path.temp %>'
-        ]
+        ],
+        cleancss: false
       },
 
       precompile: {
         files: {
           '<%- path.temp %>/engine-ui-grid-precompile.less':
-              '<%- path.less %>/engine-ui-grid.less'
+              '<%- path.app_style %>/engine-ui-grid.less'
         }
       },
 
@@ -45,16 +56,15 @@ module.exports = function (grunt) {
         },
         files: {
           '<%- path.dist_style %>/hosted-apis.css':
-              '<%- path.less %>/hosted-apis.less'
+              '<%- path.app_style %>/hosted-apis.less'
         }
       }
     },
 
     bower: {
       install: {
         options: {
-          targetDir: '<%- path.dist_vendor %>',
-          verbose: true,
+          targetDir: '<%- path.app_vendor %>',
           layout: 'byComponent',
           bowerOptions: {
             production: true
@@ -63,20 +73,47 @@ module.exports = function (grunt) {
       }
     },
 
+    copy: {
+      prod: {
+        expand: true,
+        cwd: '<%- path.app %>',
+        src: [
+          'img/**/*',
+          '**/font/**/*'
+        ],
+        dest: '<%- path.dist %>'
+      },
+
+      prod_versioned: {
+        expand: true,
+        cwd: '<%- path.app %>',
+        src: ['index.html'],
+        dest: '<%- path.dist %>',
+        options: {
+          process: function (content) {
+            return content
+              .replace(/\{version\}/g, grunt.config.data.pkg.version)
+              .replace('src="vendor/requirejs/require.js" data-main="app-js/app-require.js"',
+                       'src="app.js?v=' + grunt.config.data.pkg.version + '"');
+          }
+        }
+      }
+    },
+
     shell: {
       options: {
         stdout: true,
         stderr: true,
         failOnError: true
       },
 
-      sync_app: {
+      sync_dev: {
         command: [
           'cwd=$(pwd)',
           'cd <%- path.app %>',
           'rsync . $cwd/<%- path.dist %> ' +
               '--update --delete --verbose --recursive ' +
-              '--exclude less --exclude style --exclude vendor' 
+              '--exclude ./less --exclude ./style' 
         ].join('&&') 
       },
 
@@ -90,20 +127,40 @@ module.exports = function (grunt) {
       }
     },
 
+    requirejs: {
+      prod: {
+        options: {
+          baseUrl: '<%- path.app_appjs %>',
+          out: '<%- path.dist %>/app.js',
+          mainConfigFile: '<%- path.app_appjs %>/app-require.js',
+          name: '../vendor/almond/almond',
+          include: ['app-start'],
+          stubModules: ['text', 'hgn'],
+          optimize: 'uglify2',
+          preserveLicenseComments: false,
+          insertRequire: ['app-start'],
+          paths: {
+            'lib/logger':        'lib/logger-prod',
+            'lib/eventDebugger': 'lib/eventDebugger-prod'
+          }
+        }
+      }
+    },
+
     jshint: {
       options: {
         jshintrc: true
       },
 
-      app: ['Gruntfile.js', '<%- path.app_js %>/**/*.js']
+      app: ['Gruntfile.js', '<%- path.app_appjs %>/**/*.js']
     },
 
     jscs: {
       options: {
-        config: '<%- path.app_js %>/.jscsrc'
+        config: '<%- path.app_appjs %>/.jscsrc'
       },
 
-      app: ['Gruntfile.js', '<%- path.app_js %>/**/*.js']
+      app: ['Gruntfile.js', '<%- path.app_appjs %>/**/*.js']
     },
 
     watch: {
@@ -114,14 +171,14 @@ module.exports = function (grunt) {
       app: {
         files: [
           '<%- path.app %>/**/*',
-          '!<%- path.less %>/**/*'
+          '!<%- path.app_style %>/**/*'
         ],
-        tasks: ['shell:sync_app']
+        tasks: ['shell:sync_dev']
       },
 
       less: {
         files: [
-          '<%- path.less %>/**/*',
+          '<%- path.app_style %>/**/*',
           '<%- path.dist_vendor %>/engine-ui/less/**/*'
         ],
         tasks: ['less:app']
@@ -146,12 +203,26 @@ module.exports = function (grunt) {
   // bring in all grunt plugins from package.json
   require('load-grunt-tasks')(grunt);
 
-  grunt.registerTask('dist-dev', [
-    'shell:sync_app',
+  grunt.registerTask('set-prod', function () {
+    grunt.config.data.less.options.cleancss = true;
+    grunt.config.data.less.app.options.sourceMap = false;
+  });
+
+  grunt.registerTask('build-dev', [
     'bower',
+    'shell:sync_dev',
     'less',
     'shell:sourcemap_links'
   ]);
 
-  grunt.registerTask('default', ['dist-dev']);
+  grunt.registerTask('build-prod', [
+    'set-prod',
+    'clean',
+    'bower',
+    'copy',
+    'less',
+    'requirejs'
+  ]);
+
+  grunt.registerTask('default', ['build-dev']);
 };

app/app-js/modules/loading/loading.controller.js

@@ -15,16 +15,13 @@ define(function (require) {
       }
     },
 
-    initialize: function () {
-      console.log('HERE!');
-      // this.loadingView = new LoadingView();
-      // appChannel.commands.execute('showin:loadingRegion', this.loadingView);
-    },
-
     loadingData: function (modalData) {
+      this.loadingView = new LoadingView();
+      appChannel.commands.execute('showin:loadingRegion', this.loadingView);
     },
 
     loadedData: function () {
+      appChannel.commands.execute('close:loadingRegion', this.loadingView);
     }
   });
 

app/app-js/modules/loading/loading.view.html

@@ -0,0 +1 @@
+

app/app-js/modules/loading/loading.view.js

@@ -1,7 +1,33 @@
 define(function (require) {
-  // require anything you need
+  var Marionette = require('marionette'),
+      template = require('hgn!modules/loading/loading.view'),
+      Spinner = require('spinner'),
+      LoadingView;
 
-  // build the view
-  
-  return 'The view :)';
+  LoadingView = Marionette.ItemView.extend({
+    template: template,
+    className: 'loading-modal',
+
+    onShow: function() {
+      var opts = {
+        lines: 10,
+        length: 12,
+        width: 8,
+        radius: 15,
+        corners: 1,
+        rotate: 0,
+        direction: 1,
+        color: '#007bb6',
+        speed: 1,
+        trail: 60,
+        className: 'spinner'
+      };
+
+      var spinner = new Spinner(opts).spin();
+      this.$el.append(spinner.el);
+    }
+
+  });
+
+  return LoadingView;
 });

app/app-js/modules/welcome/welcome.view.js

@@ -6,35 +6,6 @@ define(function (require) {
   StartView = Marionette.ItemView.extend({
     template: template
     // className: 'container-fluid'
-
-    /*
-    onShow: function () {
-      _.defer(function() {
-        var totalHeight = '100%',
-        $uriField = $('.js-input-expand');
-
-        $uriField.each(function() {
-          $(this).data('height', $(this).height());
-        });
-
-        $('.js-input-expand')
-          .focus(function() {
-              $(this).animate({
-                height: 100
-              },
-              'slow'
-            );
-          })
-
-          .blur(function() {
-              $(this).animate({
-                height: totalHeight
-              },
-              'slow'
-            );
-          });
-      });
-    }*/
   });
 
   return StartView;

app/img/placeholder

@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8" />
     <title>Engine Hosted APIs</title>
-    <link href="style/hosted-apis.css" rel="stylesheet" />
+    <link href="style/hosted-apis.css?v={version}" rel="stylesheet" />
   </head>
   <body>
 
@@ -14,8 +14,6 @@
     </div>
     <div id="loading-region"></div>
 
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
     <script src="vendor/requirejs/require.js" data-main="app-js/app-require.js" type="text/javascript"></script>
-    <!-- <script src="lib/js-input-expand" type="text/javascript"></script> -->
   </body>
 </html>