Bundle all (Bower) dependencies with Webpack

Build a separate bundle for "global" dependencies shared between the
classic Rails application and Angular app.

Signed-off-by: Alex Coles <alex@alexbcoles.com>

app/assets/javascripts/application.js.erb

@@ -10,21 +10,10 @@
 // WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
 // GO AFTER THE REQUIRES BELOW.
 //
-//= require jquery
+
-//= require jquery-migrate/jquery-migrate
+//= require ./bundles/openproject-global
-//= require jquery-ujs
+
-//= require jquery-ui
+//# require jquery_noconflict
-//= require jquery-ui/ui/i18n/jquery.ui.datepicker-en-GB.js
-//= require jquery-ui/ui/i18n/jquery.ui.datepicker-de.js
-//= require momentjs
-//= require momentjs/lang/en-gb.js
-//= require momentjs/lang/de.js
-//= require moment-timezone/moment-timezone.js
-//= require moment-timezone/moment-timezone-data.js
-
-//= require jquery.atwho/dist/js/jquery.atwho.js
-//= require Caret.js/src/jquery.caret.js
-//= require jquery_noconflict
 //= require prototype
 //= require effects
 //= require dragdrop
@@ -33,8 +22,6 @@
 //= require lib/jquery.colorcontrast
 //= require lib/jquery.trap
 
-//= require select2
-
 //= require top_menu
 //= require action_menu
 //= require openproject

app/assets/stylesheets/external.sass.erb

@@ -27,8 +27,8 @@
  */
 
 @import reset
-@import css/jquery.atwho
+//@import css/jquery.atwho
 
-@import "<%= asset_path("select2/select2.css") %>"
+//@import "<%= asset_path("select2/select2.css") %>"
-@import "<%= asset_path("jquery-ui/themes/base/jquery-ui.css") %>"
+//@import "<%= asset_path("jquery-ui/themes/base/jquery-ui.css") %>"
-@import "<%= asset_path("angular-busy/dist/angular-busy.css") %>"
+//@import "<%= asset_path("angular-busy/dist/angular-busy.css") %>"

config/application.rb

@@ -107,11 +107,6 @@ module OpenProject
     # Enable the asset pipeline
     config.assets.enabled = true
 
-    bower_assets_path    = Rails.root.join(*%w(vendor assets components))
-    config.assets.paths << bower_assets_path.join(*%w(select2)).to_s
-    config.assets.paths << bower_assets_path.join(*%w(jquery-ui themes base)).to_s
-    config.assets.paths << bower_assets_path.join(*%w(jquery.atwho dist)).to_s
-
     # Whitelist assets to be precompiled.
     #
     # This is a workaround for an issue where the precompilation process will
@@ -127,12 +122,6 @@ module OpenProject
     config.assets.precompile.unshift -> (path) {
       (extension = File.extname(path)).present? and extension.in?(precompile_whitelist)
     }
-    config.assets.precompile += %w(
-      jquery-ui/themes/base/jquery-ui.css
-      select2/select2.css
-      angular-busy/dist/angular-busy.css
-      angular-busy/angular-busy.html
-    )
 
     # Enable escaping HTML in JSON.
     config.active_support.escape_html_entities_in_json = true

frontend/app/global.js

@@ -0,0 +1,50 @@
+//-- copyright
+// OpenProject is a project management system.
+// Copyright (C) 2012-2014 the OpenProject Foundation (OPF)
+//
+// This program is free software; you can redistribute it and/or
+// modify it under the terms of the GNU General Public License version 3.
+//
+// OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows:
+// Copyright (C) 2006-2013 Jean-Philippe Lang
+// Copyright (C) 2010-2013 the ChiliProject Team
+//
+// This program is free software; you can redistribute it and/or
+// modify it under the terms of the GNU General Public License
+// as published by the Free Software Foundation; either version 2
+// of the License, or (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with this program; if not, write to the Free Software
+// Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+//
+// See doc/COPYRIGHT.rdoc for more details.
+//++
+
+// 'Global' dependencies
+//
+// dependencies required by classic (Rails) and Angular application.
+
+require('jquery');
+require('jquery-migrate/jquery-migrate');
+require('jquery-ujs');
+require('jquery-ui/ui/jquery-ui.js');
+require('jquery-ui/ui/i18n/jquery.ui.datepicker-en-GB.js');
+require('jquery-ui/ui/i18n/jquery.ui.datepicker-de.js');
+
+require('momentjs');
+require('momentjs/lang/en-gb.js');
+require('momentjs/lang/de.js');
+
+require('moment-timezone/moment-timezone.js');
+require('moment-timezone/moment-timezone-data.js');
+
+require('jquery.atwho/dist/js/jquery.atwho.js');
+require('Caret.js/src/jquery.caret.js');
+
+require('select2/select2.js');

frontend/karma.conf.js

@@ -48,12 +48,7 @@ module.exports = function(config) {
 
     // list of files / patterns to load in the browser
     files: [
-      "bower_components/jquery/dist/jquery.js",
+      'app/global.js',
-      "bower_components/momentjs/moment.js",
-      "bower_components/moment-timezone/moment-timezone.js",
-      'bower_components/select2/select2.js',
-      "../vendor/assets/javascripts/moment-timezone/moment-timezone-data.js",
-
       'app/openproject-app.js',
       "bower_components/angular-mocks/angular-mocks.js",
 

frontend/tests/integration/index.html

@@ -19,13 +19,7 @@
   gon.settings = {};
   </script>
 
-  <!-- Sprockets-managed assets -->
+  <script src="/assets/bundles/openproject-global.js"></script>
-  <script src="/bower_components/jquery/dist/jquery.js"></script>
-  <script src="/bower_components/momentjs/moment.js"></script>
-  <script src="/bower_components/moment-timezone/moment-timezone.js"></script>
-  <script src="/bower_components/select2/select2.js"></script>
-
-  <!-- <script src="vendor/assets/javascripts/moment-timezone/moment-timezone-data.js"></script> -->
 
   <script src="/assets/lib/jquery.trap.js"></script>
   <script src="/assets/autocompleter.js"></script>

frontend/webpack.config.js

@@ -17,6 +17,7 @@ module.exports = {
   context: __dirname + '/app',
 
   entry: _.merge({
+    'global':   './global.js',
     'core-app': './openproject-app.js'
   }, pluginEntries),
 
@@ -28,6 +29,8 @@ module.exports = {
   module: {
     loaders: [
       { test: /[\/]angular\.js$/,         loader: 'exports?angular' },
+      { test: /[\/]jquery\.js$/,          loader: 'expose?jQuery' },
+      { test: /[\/]moment\.js$/,          loader: 'expose?moment' },
       { test: /[\/]vendor[\/]i18n\.js$/,  loader: 'expose?I18n' },
       { test: /js-[\w|-]{2,5}\.yml$/,     loader: 'json!yaml' }
     ]
@@ -38,7 +41,8 @@ module.exports = {
 
     modulesDirectories: [
       'node_modules',
-      'bower_components'
+      'bower_components',
+      'vendor'
     ].concat(pathConfig.pluginDirectories),
 
     alias: _.merge({
@@ -58,8 +62,6 @@ module.exports = {
     root: __dirname + '/node_modules'
   },
 
-  externals: { jquery: 'jQuery' },
-
   plugins: [
     new webpack.ProvidePlugin({
       '_':            'lodash',