[SDC-29] Amdocs OnBoard 1707 initial commit.
[sdc.git] / openecomp-ui / gulpfile.js
index 57885ec..2cad6d8 100644 (file)
-/*-
- * ============LICENSE_START=======================================================
- * SDC
- * ================================================================================
- * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
- * ================================================================================
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- * ============LICENSE_END=========================================================
- */
-
 'use strict';
 
-var path = require('path');
-var gulp = require('gulp');
-var gulpHelpers = require('gulp-helpers');
-var taskMaker = gulpHelpers.taskMaker(gulp);
-var _ = gulpHelpers.framework('_');
-var runSequence = gulpHelpers.framework('run-sequence');
-var i18nTask = require('./tools/gulp/tasks/i18n');
-var prodTask = require('./tools/gulp/tasks/prod');
-var gulpCssUsage = require('gulp-css-usage').default;
-var webpack = require('webpack');
-var WebpackDevServer = require('webpack-dev-server');
+let gulp = require('gulp');
+let gulpHelpers = require('gulp-helpers');
+let replace = require('gulp-replace');
+let taskMaker = gulpHelpers.taskMaker(gulp);
+let runSequence = gulpHelpers.framework('run-sequence');
+let i18nTask = require('./tools/gulp/tasks/i18n');
+let prodTask = require('./tools/gulp/tasks/prod');
+let gulpCssUsage = require('gulp-css-usage').default;
+let jsonConfig = {
+       "appContextPath" : "/onboarding"
+};
 
-var localDevConfig = {};
 try {
-       localDevConfig = require('./devConfig');
+       jsonConfig = require('./src/sdc-app/config/config.json');
 } catch (e) {
+       console.log('could not load config. using deault value instead');
 }
-var devConfig = Object.assign({}, require('./devConfig.defaults'), localDevConfig);
-var webpackConfig = require('./webpack.config');
-
-function defineTasks(mode) {
-       let appName = 'onboarding';
-       let dist = 'dist/' + mode + '/';
-
-       let path = {
-               locales: 'i18n/',
-               jssource: 'src/**/*.js',
-               jsxsource: 'src/**/*.jsx',
-               html: '**/*.html',
-               output: dist,
-               assets: './resources/**/*.{css,png,svg,eot,ttf,woff,woff2,otf}',
-               json: './src/**/*.json',
-               index: './src/index.html',
-               heat: './src/heat.html',
-               watch: ['./src/**'],
-               scss: './resources/scss/**/*.scss',
-               css: dist + '/css',
-               war: [dist + 'index.html', dist + 'punch-outs_en.js', dist + '**/*.{css,png,svg,eot,ttf,woff,woff2,otf}', dist + '**/*(config.json|locale.json)', 'tools/gulp/deployment/**', 'webapp-onboarding/**'],
-               heatWar: [dist + 'heat.html', dist + 'heat-validation_en.js', dist + '**/*.{css,png,svg,eot,ttf,woff,woff2,otf}', dist + '**/*(config.json|locale.json)', 'webapp-heat-validation/**'],
-               wardest: 'dist/'
-       };
-
-       taskMaker.defineTask('clean', {taskName: 'clean', src: path.output});
-       taskMaker.defineTask('copy', {taskName: 'copy-assets', src: path.assets, dest: path.output});
-       taskMaker.defineTask('copy', {
-               taskName: 'copy-json',
-               src: path.json,
-               dest: path.output,
-               changed: {extension: '.json'}
-       });
-       taskMaker.defineTask('copy', {
-               taskName: 'copy-index.html',
-               src: path.index,
-               dest: path.output,
-               rename: 'index.html'
-       });
-       taskMaker.defineTask('copy', {
-               taskName: 'copy-heat.html',
-               src: path.heat,
-               dest: path.output,
-               rename: 'heat.html'
-       });
-       taskMaker.defineTask('sass', {
-               taskName: 'sass',
-               src: path.scss,
-               dest: path.css,
-               config: {outputStyle: 'compressed'}
-       });
-       taskMaker.defineTask('compress', {
-               taskName: 'compress-war',
-               src: path.war,
-               filename: appName + '.war',
-               dest: path.wardest
-       });
-       taskMaker.defineTask('compress', {
-               taskName: 'compress-heat-war',
-               src: path.heatWar,
-               filename: 'heat-validation.war',
-               dest: path.wardest
-       });
-       taskMaker.defineTask('watch', {
-               taskName: 'watch-stuff',
-               src: [path.assets, path.json, path.index, path.heat],
-               tasks: ['copy-stuff']
-       });
-       taskMaker.defineTask('watch', {taskName: 'watch-sass', src: path.scss, tasks: ['sass']});
-
-       gulp.task('copy-stuff', callback => {
-               return runSequence(['copy-assets', 'copy-json', 'copy-index.html', 'copy-heat.html'], callback);
-       });
-
-       gulp.task('i18n', () => {
-               return i18nTask({
-                       outputPath: path.output,
-                       localesPath: path.locales,
-                       lang: 'en'
-               }).catch(err => {
-                       console.log('i18n Task : Error! ', err);
-                       throw err;
-               });
-       });
-
-
-       gulp.task('dependencies', () => {
-               //TODO:
-       });
-
-}
-
-gulp.task('dev', callback => {
-       defineTasks('dev');
-       return runSequence('clean', ['i18n', 'copy-stuff'], 'webpack-dev-server', ['watch-stuff'], callback);
-});
-
-// Production build
-gulp.task('build', callback => {
-       defineTasks('prod');
-       return runSequence('clean', ['copy-stuff', 'i18n'], 'prod', ['compress-war', 'compress-heat-war'], callback);
-});
-
-gulp.task('default', ['dev']);
 
-gulp.task('prod', () => {
-
-       // configure webpack for production
-       let webpackProductionConfig = Object.create(webpackConfig);
-
-       for (let name in webpackProductionConfig.entry) {
-               webpackProductionConfig.entry[name] = webpackProductionConfig.entry[name].filter(path => !path.startsWith('webpack'));
-       }
-
-       webpackProductionConfig.cache = true;
-       webpackProductionConfig.output = {
-               path: path.join(__dirname, 'dist/prod'),
-               publicPath: '/onboarding/',
-               filename: '[name].js'
-       };
-       webpackProductionConfig.resolveLoader = {
-               root: [path.resolve('.')],
-               alias: {
-                       'config-json-loader': 'tools/webpack/config-json-loader/index.js'
-               }
-       };
-
-       // remove source maps
-       webpackProductionConfig.devtool = undefined;
-       webpackProductionConfig.module.preLoaders = webpackProductionConfig.module.preLoaders.filter(preLoader => preLoader.loader != 'source-map-loader');
-       webpackProductionConfig.module.loaders.forEach(loader => {
-               if (loader.loaders && loader.loaders[0] === 'style') {
-                       loader.loaders = loader.loaders.map(loaderName => loaderName.replace('?sourceMap', ''));
-               }
-       });
-
-       webpackProductionConfig.module.loaders.push({test: /config.json$/, loaders: ['config-json-loader']});
-       webpackProductionConfig.eslint = {
-               configFile: './.eslintrc',
-               failOnError: true
-       };
-       webpackProductionConfig.babel = {//TODO: remove this when UglifyJS will support user or
-               // Webpack 2.0
-               presets: ['es2015', 'stage-0', 'react']
-       }
-       webpackProductionConfig.plugins = [
-               new webpack.DefinePlugin({
-                       'process.env': {
-                               // This has effect on the react lib size
-                               'NODE_ENV': JSON.stringify('production')
-                       },
-                       DEBUG: false,
-                       DEV: false
-               }),
-               new webpack.optimize.DedupePlugin(),
-               new webpack.optimize.UglifyJsPlugin()
-       ];
-
-       // run production build
-       return prodTask({
-               webpackProductionConfig,
-               outDir: 'dist/prod'
-       })
-               .then(() => {
+const appName = 'onboarding';
+const dist = 'dist';
+
+const path = {
+       jetty: './webapp-onboarding/WEB-INF/jetty-web.xml',
+       appinf: './webapp-onboarding/**/*.*',
+       appinf_output: dist + '/webapp-onboarding',
+       locales: dist + '/i18n/',
+       output: dist,
+       json: './src/**/*.json',
+       index: './src/index.html',
+       heat: './src/heat.html',
+       scss: './resources/scss/**/*.scss',
+       css: dist + '/css',
+       svgSrc: './resources/images/svg/*.svg',
+       svg: dist + '/resources/images/svg',
+       war: [dist + '/index.html', dist + '/punch-outs_en.js', dist + '/**/*.{css,png,svg,eot,ttf,woff,woff2,otf}', dist + '/**/*(config.json|locale.json)', 'tools/gulp/deployment/**', dist + '/webapp-onboarding/**'],
+       heatWar: [dist + '/heat.html', dist + '/heat-validation_en.js', dist + '/**/*.{css,png,svg,eot,ttf,woff,woff2,otf}', dist + '/**/*(config.json|locale.json)', 'webapp-heat-validation/**'],
+       wardest: dist,
+       storybookFonts: './.storybook/fonts/*',
+       storybookDist: './.storybook-dist',
+       storybookResources: './.storybook/resources/onboarding/resources/images/svg',
+       storybookDistResources: './.storybook-dist/onboarding/resources/images/svg'
+};
+
+taskMaker.defineTask('clean', {taskName: 'clean', src: path.output});
+taskMaker.defineTask('copy', {taskName: 'copy-json', src: path.json, dest: path.output, changed: {extension: '.json'}});
+taskMaker.defineTask('copy', {taskName: 'copy-index.html', src: path.index, dest: path.output, rename: 'index.html'});
+taskMaker.defineTask('copy', {taskName: 'copy-heat.html', src: path.heat, dest: path.output, rename: 'heat.html'});
+taskMaker.defineTask('copy', {taskName: 'copy-svg', src: path.svgSrc, dest: path.svg});
+//TODO: delete this task after gulp-css-usage support for SCSS files
+taskMaker.defineTask('sass', {taskName: 'sass', src: path.scss, dest: path.css, config: {outputStyle: 'compressed'}});
+taskMaker.defineTask('compress', {taskName: 'compress-war', src: path.war, filename: appName + '.war', dest: path.wardest});
+taskMaker.defineTask('compress', {taskName: 'compress-heat-war', src: path.heatWar, filename: 'heat-validation.war', dest: path.wardest});
+taskMaker.defineTask('watch', {taskName: 'watch-stuff', src: [path.json, path.index, path.heat], tasks: ['copy-stuff']});
+taskMaker.defineTask('copy', {taskName: 'copy-storybook-fonts', src: path.storybookFonts, dest: path.storybookDist});
+taskMaker.defineTask('copy', {taskName: 'copy-storybook-resources', src: path.svgSrc, dest: path.storybookResources});
+taskMaker.defineTask('copy', {taskName: 'copy-storybook-resources-prod', src: path.svgSrc, dest: path.storybookDistResources});
+
+gulp.task('app-context', function(){
+       gulp.src([path.appinf])
+               .pipe(gulp.dest(path.appinf_output))
+               .on('end', function () {
+                       gulp.src([path.jetty])
+                               .pipe(replace(/<Set name="contextPath">.*<\/Set>/g, '<Set name="contextPath">'+jsonConfig.appContextPath+'</Set>'))
+                               .pipe(gulp.dest(path.appinf_output + '/WEB-INF'));
                })
-               .catch(err => {
-                       if (err && err.stack) {
-                               console.error(err, err.stack);
-                       }
-                       throw new Error('Webpack build FAILED');
-               });
 });
 
-gulp.task('webpack-dev-server', () => {
-       // modify some webpack config options for development
-       let myConfig = Object.create(webpackConfig);
-
-       myConfig.devServer.setup = server => {
-               let fixture = require('./fixture/fixture');
-               let proxy = require('http-proxy-middleware');
-               let proxyConfigDefaults = {
-                       changeOrigin: true,
-                       secure: false,
-                       onProxyRes: (proxyRes, req, res) => {
-                               let setCookie = proxyRes.headers['set-cookie'];
-                               if (setCookie) {
-                                       setCookie[0] = setCookie[0].replace(/\bSecure\b(; )?/, '');
-                               }
-                       }
-               };
+gulp.task('copy-stuff', callback => runSequence(['copy-json', 'copy-index.html', 'copy-heat.html', 'copy-svg', 'app-context'], callback));
 
-               let middlewares = [
-                       (req, res, next) => {
-                               let match = req.url.match(/^(.*)_en.js$/);
-                               let newUrl = match && match[1] + '.js';
-                               if (newUrl) {
-                                       console.log(`REWRITING URL: ${req.url} -> ${newUrl}`);
-                                       req.url = newUrl;
-                               }
-                               next();
-                       },
-                       fixture({
-                               enabled: devConfig.useFixture
-                       })
-               ];
+gulp.task('i18n', () =>
+       i18nTask({outputPath: path.output, localesPath: path.locales, lang: 'en'}).catch(err => {
+               console.log('i18n Task : Error! ', err);
+               throw err;
+       })
+);
 
-               // standalon back-end (proxyTarget) has higher priority, so it should be first
-               if (devConfig.proxyTarget) {
-                       middlewares.push(
-                               proxy(['/api', '/onboarding-api', '/sdc1/feProxy/onboarding-api'], Object.assign({}, proxyConfigDefaults, {
-                                       target: devConfig.proxyTarget,
-                                       pathRewrite: {
-                                               '/sdc1/feProxy/onboarding-api': '/onboarding-api'
-                                       }
-                               }))
-                       )
-               }
+gulp.task('dev', callback => runSequence('clean', ['i18n', 'copy-stuff'], callback));
+gulp.task('build', callback => runSequence('clean', ['copy-stuff', 'i18n'], 'prod', ['compress-war', 'compress-heat-war'], callback));
 
-               // Ecorp environment (proxyATTTarget) has lower priority, so it should be second
-               if (devConfig.proxyATTTarget) {
-                       middlewares.push(
-                               proxy(['/sdc1', '/onboarding-api'], Object.assign({}, proxyConfigDefaults, {
-                                       target: devConfig.proxyATTTarget,
-                                       pathRewrite: {
-                                               // Workaround for some weird proxy issue
-                                               '/sdc1/feProxy/onboarding-api': '/sdc1/feProxy/onboarding-api',
-                                               '/onboarding-api': '/sdc1/feProxy/onboarding-api'
-                                       }
-                               }))
-                       )
-               }
-               server.use(middlewares);
-       };
+gulp.task('default', ['dev']);
 
-       // Start a webpack-dev-server
-       let server = new WebpackDevServer(webpack(myConfig), myConfig.devServer);
-       server.listen(myConfig.devServer.port, '0.0.0.0', err => {
-               if (err) {
-                       throw new Error('webpack-dev-server' + err);
+gulp.task('prod', () => prodTask({outDir: path.output})
+       .catch(err => {
+               if (err && err.stack) {
+                       console.error(err, err.stack);
                }
-       });
-});
+               throw new Error('Webpack build FAILED');
+       })
+);
 
 
-gulp.task('gulp-css-usage', callback => {
-       return gulp.src('src/**/*.jsx').pipe(gulpCssUsage({css: 'dist/dev/css/style.css', babylon: ['objectRestSpread']}));
+gulp.task('gulp-css-usage', () => {
+       return gulp.src('src/**/*.jsx').pipe(gulpCssUsage({css: path.css + '/style.css', babylon: ['objectRestSpread']}));
 });
 
-gulp.task('css-usage', callback => {
-       defineTasks('dev');
+gulp.task('css-usage', () => {
        runSequence('sass', 'gulp-css-usage');
 });