diff --git a/.travis.yml b/.travis.yml index af61aecadf..8706cecaae 100644 --- a/.travis.yml +++ b/.travis.yml @@ -38,7 +38,7 @@ cache: directories: - $HOME/.npm -# Not needed since we use Puppeteer in karma.conf.typescript.ci.js +# Not needed since we use Puppeteer in karma.conf.ci.js # It downloads Chrome itself and works with or without Travis #addons: # chrome: stable diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 2aae110041..69fe23ff39 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -203,6 +203,7 @@ If you want to build Stark from source, you need to... ### Executing Stark's main build script Anytime you make modifications to a Stark package (e.g., stark-build, stark-core, ...), you'll need to * execute `npm run build` from the root directory of Stark +* execute `npm install` again on the showcase to get those changes * execute `npm install` again on the starter to get those changes Stark's main build script is a fun Bash shell script heavily inspired by Angular's that @@ -214,9 +215,23 @@ Stark's main build script is a fun Bash shell script heavily inspired by Angular * generates releasable versions of each package * adds license banners to the generated code * generates temporary tar.gz files for local testing +* adapts the showcase's dependencies to point to the local tar.gz files * adapts the starter's dependencies to point to the local tar.gz files * ... +### Hacking the showcase +If you want to modify the showcase: +* go to the showcase's folder: `cd showcase` +* install dependencies: `npm install` +* run it: `npm start` +* open up your browser at http://localhost:3000 +* make your changes + +If you make modifications, they'll be applied automatically after a Webpack rebuild. + +By default the showcase depends on published Stark packages over at npm. +But once the main build script at Stark's root (cfr previous section) is executed (e.g., using `npm install` or `npm run build` at the root), then the showcase will depend on the contents of the dist folder. + ### Hacking the starter If you want to modify the starter: * go to the starter's folder: `cd starter` @@ -236,7 +251,7 @@ If you want to modify Stark packages (e.g., stark-build, stark-core, ...): * install its dependencies: `npm install` * make your changes * execute `npm run build` at Stark's root -* update the Starter and test in it +* update the Showcase and add examples to it / adapt existing code if needed Start hacking :) @@ -245,11 +260,20 @@ If you want to test/validate your changes against the starter, then you can use * update the starter: `npm run update-starter` * run the starter: `npm run starter` +If you want to integrate examples or update code in the showcase and validate your changes, then you can use the following scripts from the root: +* rebuild: `npm run build` +* update the showcase: `npm run update-showcase` +* run the showcase: `npm run showcase` + If you only want to build a subset of stark then you can * execute one of the `build:stark-` npm scripts; for example: `npm run build:stark-core` or `npm run build:stark-build` * execute the `build` script through npm with the list of packages to build: `npm run build -- --packages=stark-core` * execute the build script from the command line: `bash ./build.sh --packages=stark-core` +## Executing test suites +Anytime you integrate or modify features, you need to make sure the relevant test suites still pass. +You can execute the tests for all Stark parts using the following command at the root: `npm test` + ## Cleaning up the project / packages ### Cleaning up dist folders If you want to clean up the generated dist folders, you can @@ -321,6 +345,7 @@ Must be one of the following: * **stark-build** * **stark-core** * **stark-demo** +* **stark-showcase** * **stark-starter** * **stark-rbac** * **stark-ui** diff --git a/README.md b/README.md index 189c35f0bc..915ad1001f 100644 --- a/README.md +++ b/README.md @@ -16,13 +16,13 @@ Stark provides main building blocks for accelerating front-end development: * a solid reusable build based on Webpack -* a starter inspired by [Angular Starter](https://github.com/gdi2290/angular-starter) by [AngularClass](https://angularclass.com) and Google's [Web Starterk Kit](https://github.com/google/web-starter-kit) +* a starter project inspired by [Angular Starter](https://github.com/gdi2290/angular-starter) by [AngularClass](https://angularclass.com) and Google's [Web Starterk Kit](https://github.com/google/web-starter-kit) * core modules providing reusable APIs (e.g., reactive client for RESTful APIs based on [NBB's RESTful API Design Guide](https://github.com/NationalBankBelgium/REST-API-Design-Guide/wiki), routing, logging, log shipping, ...) * UI modules providing reusable UI components (e.g., data table, message pane, ...) and themes -* a demo application containing +* a showcase application containing * our [living style guide](https://www.smashingmagazine.com/2016/05/creating-a-living-style-guide-case-study/) - * a showcase of all components/services along with their API - * our developer guide + * a showcase of all components/services along with their API + * our developer guide Stark modules are like LEGO blocks: add what you need, no less, no more. If you don't like our defaults then you may replace/override/ignore anything you fancy. diff --git a/build.sh b/build.sh index 5a10c87124..341196247b 100644 --- a/build.sh +++ b/build.sh @@ -337,9 +337,14 @@ do logInfo "Generate npm package (tgz file)" generateNpmPackage ${NPM_DIR} + logInfo "Adapt showcase dependencies" + adaptNpmPackageDependencies $PACKAGE $VERSION "./showcase/package.json" 1 + adaptNpmPackageLockDependencies $PACKAGE $VERSION "./showcase/package-lock.json" 1 + logInfo "Adapt starter dependencies" adaptNpmPackageDependencies $PACKAGE $VERSION "./starter/package.json" 1 adaptNpmPackageLockDependencies $PACKAGE $VERSION "./starter/package-lock.json" 1 + fi travisFoldEnd "general tasks: ${PACKAGE}" diff --git a/docs/PRETTIER.md b/docs/PRETTIER.md index 3676a25439..89048ae2fa 100644 --- a/docs/PRETTIER.md +++ b/docs/PRETTIER.md @@ -10,7 +10,7 @@ $ npm run prettier-check ``` ## Prettier configuration The main Prettier configuration file is located in `stark-build`. -The one located in `starter` and the other one located in the root just reference the `stark-build` configuration file +The ones located in `starter`, `showcase` and the other one located in the root just reference the `stark-build` configuration file ## Conflicts with TSLint and Stylelint The configurations of `TSLint` and `Stylelint` can conflict with `Prettier`. It's why we use [tslint-config-prettier](https://github.com/alexjoverm/tslint-config-prettier) and diff --git a/package.json b/package.json index 14e8cbb302..8fd9affa8b 100644 --- a/package.json +++ b/package.json @@ -66,74 +66,90 @@ "build:stark-testing": "npm run build -- --packages=stark-testing", "build:stark-ui": "npm run build -- --packages=stark-ui", "clean": "npx rimraf ./dist", - "clean:all": "npm run clean && npm run clean:stark-build && npm run clean:stark-core && npm run clean:stark-ui && npm run clean:stark-testing && npm run clean:starter", + "clean:all": "npm run clean && npm run clean:stark-build && npm run clean:stark-core && npm run clean:stark-ui && npm run clean:stark-testing && npm run clean:starter && npm run clean:showcase", "clean:stark-build": "cd packages/stark-build && npm run clean && cd ../..", "clean:stark-core": "cd packages/stark-core && npm run clean && cd ../..", "clean:stark-testing": "cd packages/stark-testing && npm run clean && cd ../..", "clean:stark-ui": "cd packages/stark-ui && npm run clean && cd ../..", + "clean:showcase": "cd showcase && npx rimraf ./dist && npx rimraf ./node_modules/@nationalbankbelgium && cd ..", + "clean:slate": "npm run clean:all && npm run clean:modules:all && npm install && npm run install:all", "clean:starter": "cd starter && npx rimraf ./dist && npx rimraf ./node_modules/@nationalbankbelgium && cd ..", "clean:modules": "npx rimraf ./node_modules package-lock.json", - "clean:modules:all": "npm run clean:modules && npm run clean:modules:stark-build && npm run clean:modules:stark-core && npm run clean:modules:stark-testing && npm run clean:modules:stark-ui && npm run clean:modules:starter", + "clean:modules:all": "npm run clean:modules && npm run clean:modules:stark-build && npm run clean:modules:stark-core && npm run clean:modules:stark-testing && npm run clean:modules:stark-ui && npm run clean:modules:starter && npm run clean:modules:showcase", "clean:modules:stark-build": "cd packages/stark-build && npm run clean:modules && cd ../..", "clean:modules:stark-core": "cd packages/stark-core && npm run clean:modules && cd ../..", "clean:modules:stark-testing": "cd packages/stark-testing && npm run clean:modules && cd ../..", "clean:modules:stark-ui": "cd packages/stark-ui && npm run clean:modules dist && cd ../..", + "clean:modules:showcase": "cd showcase && npm run clean:modules && cd ..", "clean:modules:starter": "cd starter && npm run clean:modules && cd ..", "commit": "./node_modules/.bin/git-cz", "commitmsg": "commitlint -e $GIT_PARAMS", "docs": "npm run docs:clean && npm run docs:all", "docs:all": "npm run docs:stark-core && npm run docs:stark-ui", "docs:clean": "npx rimraf reports/api-docs", - "docs:coverage": "npm run docs:stark-core:coverage && npm run docs:stark-ui:coverage && npm run docs:starter:coverage", + "docs:coverage": "npm run docs:stark-core:coverage && npm run docs:stark-ui:coverage && npm run docs:starter:coverage && npm run docs:showcase:coverage", "docs:stark-core:coverage": "cd packages/stark-core && npm run docs:coverage && cd ../..", "docs:stark-core:generate": "cd packages/stark-core && npm run docs && cd ../..", "docs:stark-core:serve": "cd packages/stark-core && npm run docs:serve && cd ../..", "docs:stark-ui:coverage": "cd packages/stark-ui && npm run docs:coverage && cd ../..", "docs:stark-ui:generate": "cd packages/stark-ui && npm run docs && cd ../..", "docs:stark-ui:serve": "cd packages/stark-ui && npm run docs:serve && cd ../..", + "docs:showcase:coverage": "cd showcase && npm run docs:coverage && cd ..", "docs:starter:coverage": "cd starter && npm run docs:coverage && cd ..", + "docs:showcase:generate": "cd showcase && npm run docs && cd ..", "docs:starter:generate": "cd starter && npm run docs && cd ..", + "docs:showcase:serve": "cd showcase && npm run docs:serve && cd ..", "docs:starter:serve": "cd starter && npm run docs:serve && cd ..", "generate:changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0", "generate:changelog-recent": "conventional-changelog -p angular | tail -n +3", "lint": "tslint --config ./tslint.json --project ./packages/tsconfig.json --format codeFrame", "lint:stark-core": "cd packages/stark-core && npm run lint && cd ../..", "lint:stark-ui": "cd packages/stark-ui && npm run lint && cd ../..", + "lint:showcase": "cd showcase && npm run lint && cd ..", "lint:starter": "cd starter && npm run lint && cd ..", - "lint:all": "npm run lint && npm run lint:stark-core && npm run lint:stark-ui && npm run lint:starter", - "install:all": "npm run install:stark-build && npm run install:stark-testing && npm run install:stark-core && npm run install:stark-ui && npm run build && npm run update:starter", + "lint:all": "npm run lint && npm run lint:stark-core && npm run lint:stark-ui && npm run lint:starter && npm run lint:showcase", + "install:all": "npm run install:stark-build && npm run install:stark-testing && npm run install:stark-core && npm run install:stark-ui && npm run build && npm run install:starter && npm run install:showcase", "install:stark-build": "cd packages/stark-build && npm install && cd ../..", "install:stark-core": "cd packages/stark-core && npm install && cd ../..", "install:stark-testing": "cd packages/stark-testing && npm install && cd ../..", "install:stark-ui": "cd packages/stark-ui && npm install && cd ../..", - "install:ci:all": "npm run install:ci:stark-build && npm run install:ci:stark-testing && npm run install:ci:stark-core && npm run install:ci:stark-ui && npm run build:trace && npm run install:ci:starter", + "install:showcase": "cd showcase && npm install && cd ..", + "install:starter": "cd starter && npm install && cd ..", + "install:ci:all": "npm run install:ci:stark-build && npm run install:ci:stark-testing && npm run install:ci:stark-core && npm run install:ci:stark-ui && npm run build:trace && npm run install:ci:starter && npm run install:ci:showcase", "install:ci:stark-build": "cd packages/stark-build && npm ci && cd ../..", "install:ci:stark-core": "cd packages/stark-core && npm ci && cd ../..", "install:ci:stark-testing": "cd packages/stark-testing && npm ci && cd ../..", "install:ci:stark-ui": "cd packages/stark-ui && npm ci && cd ../..", + "install:ci:showcase": "cd showcase && npm ci && cd ..", "install:ci:starter": "cd starter && npm ci && cd ..", - "install:travis:all": "npm run install:stark-build && npm run install:stark-testing && npm run install:stark-core && npm run install:stark-ui && npm run build:trace && npm run update:starter", + "install:travis:all": "npm run install:stark-build && npm run install:stark-testing && npm run install:stark-core && npm run install:stark-ui && npm run build:trace && npm run update:starter && npm run update:showcase", "ngc": "ngc", "precommit": "lint-staged", "prettier-check": "prettier **/*.{css,js,json,pcss,scss,ts} --write", + "preupdate:showcase": "npm run clean:showcase", "preupdate:starter": "npm run clean:starter", "release": "release-it", "release:publish": "bash ./release-publish.sh --trace", + "showcase": "cd showcase && npm start && cd ..", "starter": "cd starter && npm start && cd ..", "stylelint-check": "stylelint-config-prettier-check", + "test": "npm run test:ci:all", + "test:all": "npm run test:stark-core && npm run test:stark-ui && npm run test:starter && npm run test:showcase", "test:stark-core": "cd packages/stark-core && npm run test-fast && cd ../..", "test:stark-ui": "cd packages/stark-ui && npm run test-fast && cd ../..", + "test:showcase": "cd showcase && npm run test-fast && cd ../..", "test:starter": "cd starter && npm run test-fast && cd ../..", - "test:all": "npm run test:stark-core && npm run test:stark-ui && npm run test:starter", + "test:ci:all": "npm run test:ci:stark-core && npm run test:ci:stark-ui && npm run test:ci:starter && npm run test:ci:showcase", "test:ci:stark-core": "cd packages/stark-core && npm run test-fast:ci && cd ../..", "test:ci:stark-ui": "cd packages/stark-ui && npm run test-fast:ci && cd ../..", + "test:ci:showcase": "cd showcase && npm run test-fast:ci && cd ../..", "test:ci:starter": "cd starter && npm run test-fast:ci && cd ../..", - "test:ci:all": "npm run test:ci:stark-core && npm run test:ci:stark-ui && npm run test:ci:starter", "test:ci:coveralls:combined": "node combine-packages-coverage.js | packages/stark-testing/node_modules/coveralls/bin/coveralls.js", "tsc": "tsc", "tslint": "tslint", "tslint-check": "tslint-config-prettier-check ./tslint.json", - "update:starter": "cd starter && npm install && cd .." + "update:showcase": "npm run clean:showcase && npm run install:showcase", + "update:starter": "npm run clean:starter && npm run install:starter" }, "lint-staged": { "*.{css,js,json,pcss,scss,ts}": [ diff --git a/packages/stark-build/config-stark/karma.conf.ci.js b/packages/stark-build/config-stark/karma.conf.ci.js deleted file mode 100644 index 7792537e0f..0000000000 --- a/packages/stark-build/config-stark/karma.conf.ci.js +++ /dev/null @@ -1,133 +0,0 @@ -"use strict"; - -// Helpers -const helpers = require("./helpers"); - -// Karma configuration -// reference: http://karma-runner.github.io/0.13/config/configuration-file.html -module.exports = config => { - const testWebpackConfig = require("./webpack.test.ci.js"); - config.set({ - // base path that will be used to resolve all patterns (e.g. files, exclude) - basePath: "", - - // frameworks to use - // available frameworks: https://npmjs.org/browse/keyword/karma-adapter - frameworks: ["jasmine"], - - // list of files to exclude - exclude: [], - - // client configuration - client: { - // can be used to pass arguments to tests (see spec-bundle.ts) - args: [ - { - // path to the subset of the tests to consider (used to filter the unit tests to execute (see spec-bundle.ts) - testPath: helpers.getTestPath(process.argv) - } - ], - - // other client-side config - captureConsole: true - }, - - // list of files / patterns to load in the browser - files: [ - { - pattern: helpers.rootStark("config/spec-bundle.ts"), - watched: false - } - ], - - // list of paths mappings - // can be used to map paths served by the Karma web server to /base/ content - // knowing that /base corresponds to the project root folder (i.e., where this config file is located) - proxies: {}, - - // preprocess matching files before serving them to the browser - // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor - preprocessors: { - "node_modules/@nationalbankbelgium/stark/config/spec-bundle.ts": ["webpack", "sourcemap"] - }, - - // Webpack Config - webpack: testWebpackConfig, - - // test coverage - coverageIstanbulReporter: { - dir: helpers.root("reports/coverage"), - reports: [ - "text-summary", - "json", - "html", - "lcov", // format supported by Sonar, - "clover" - ], - // Workaround to fix webpack source input paths on windows - // see https://github.com/mattlewis92/karma-coverage-istanbul-reporter/issues/9 - fixWebpackSourcePaths: true - }, - - // Webpack please don"t spam the console when running in karma! - webpackServer: { - noInfo: true - }, - - // test results reporter to use - // possible values: "dots", "progress", "spec", "junit", "mocha", "coverage" (others if you import reporters) - // available reporters: https://npmjs.org/browse/keyword/karma-reporter - // https://www.npmjs.com/package/karma-junit-reporter - // https://www.npmjs.com/package/karma-spec-reporter - reporters: ["mocha", "progress", "coverage-istanbul", "junit", "bamboo"], - - bambooReporter: { - filename: "reports/util.mocha.json" //optional, defaults to "mocha.json" - }, - - // Give a type to files, otherwise it will not work with Chrome > 55 - mime: { - "text/x-typescript": ["ts", "tsx"] - }, - - // web server port - port: 9876, - - // enable / disable colors in the output (reporters and logs) - colors: true, - - // level of logging - // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG - logLevel: config.LOG_WARN, - - // start these browsers - // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher - browsers: [ - "Chrome" - //"Firefox", - //"IE", - ], - - // enable / disable watching file and executing tests whenever any file changes - autoWatch: true, - - // Continuous Integration mode - // if true, Karma captures browsers, runs the tests and exits - singleRun: false, - - // Timeout settings - browserNoActivityTimeout: 30000, - browserDisconnectTolerance: 1, - browserDisconnectTimeout: 30000, - - // JUnit reporter configuration - junitReporter: { - outputDir: helpers.root("reports/coverage/"), - //outputFile: "tests-unit/unit.xml", - suite: "unit" - } - - // How many browsers should be started simultaneously - //concurrency: Infinity, - }); -}; diff --git a/packages/stark-build/config-stark/karma.conf.js b/packages/stark-build/config-stark/karma.conf.js deleted file mode 100644 index da5ba1d290..0000000000 --- a/packages/stark-build/config-stark/karma.conf.js +++ /dev/null @@ -1,117 +0,0 @@ -"use strict"; - -// Helpers -const helpers = require("./helpers"); - -// Karma configuration -// reference: http://karma-runner.github.io/0.13/config/configuration-file.html -module.exports = config => { - const testWebpackConfig = require("./webpack.test.js"); - config.set({ - // base path that will be used to resolve all patterns (e.g. files, exclude) - basePath: "", - - // frameworks to use - // available frameworks: https://npmjs.org/browse/keyword/karma-adapter - frameworks: ["jasmine"], - - // list of files to exclude - exclude: [], - - // client configuration - client: { - // can be used to pass arguments to tests (see spec-bundle.ts) - args: [ - { - // path to the subset of the tests to consider (used to filter the unit tests to execute (see spec-bundle.ts) - testPath: helpers.getTestPath(process.argv) - } - ], - - // other client-side config - captureConsole: true - }, - - // list of files / patterns to load in the browser - files: [ - { - pattern: helpers.rootStark("config/spec-bundle.ts"), - watched: false - }, - // paths to support debugging with source maps in dev tools - { - pattern: helpers.root("src/**/*.ts"), - included: false, - watched: false - } - ], - - // list of paths mappings - // can be used to map paths served by the Karma web server to /base/ content - // knowing that /base corresponds to the project root folder (i.e., where this config file is located) - proxies: {}, - - // preprocess matching files before serving them to the browser - // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor - preprocessors: { - "node_modules/@nationalbankbelgium/stark/config/spec-bundle.ts": ["webpack", "sourcemap"] - }, - - // Webpack Config - webpack: testWebpackConfig, - - // Webpack please don"t spam the console when running in karma! - webpackServer: { - noInfo: true - }, - - // test results reporter to use - // possible values: "dots", "progress", "spec", "junit", "mocha", "coverage" (others if you import reporters) - // available reporters: https://npmjs.org/browse/keyword/karma-reporter - // https://www.npmjs.com/package/karma-junit-reporter - // https://www.npmjs.com/package/karma-spec-reporter - reporters: ["mocha", "progress", "bamboo"], - - bambooReporter: { - filename: "reports/util.mocha.json" //optional, defaults to "mocha.json" - }, - - // Give a type to files, otherwise it will not work with Chrome > 55 - mime: { - "text/x-typescript": ["ts", "tsx"] - }, - - // web server port - port: 9876, - - // enable / disable colors in the output (reporters and logs) - colors: true, - - // level of logging - // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG - logLevel: config.LOG_WARN, - - // start these browsers - // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher - browsers: [ - "Chrome" - //"Firefox", - //"IE", - ], - - // enable / disable watching file and executing tests whenever any file changes - autoWatch: true, - - // Continuous Integration mode - // if true, Karma captures browsers, runs the tests and exits - singleRun: false, - - // Timeout settings - browserNoActivityTimeout: 30000, - browserDisconnectTolerance: 1, - browserDisconnectTimeout: 30000 - - // How many browsers should be started simultaneously - //concurrency: Infinity, - }); -}; diff --git a/packages/stark-build/config-stark/karma.conf.stark.ci.js b/packages/stark-build/config-stark/karma.conf.stark.ci.js deleted file mode 100644 index be754b3fe3..0000000000 --- a/packages/stark-build/config-stark/karma.conf.stark.ci.js +++ /dev/null @@ -1,41 +0,0 @@ -"use strict"; - -// Helpers -const helpers = require("./helpers"); - -let loadedConfiguration = null; - -// this object is just useful to retrieve the karma configuration object returned by our default Karma config -// we need this since the karma configuration returns a function and not -let configExtractor = { - set: configuration => { - loadedConfiguration = configuration; - } -}; - -// load our default karma configuration -let defaultKarmaConfig = require("./karma.conf.ci.js"); - -// get the configuration object out -defaultKarmaConfig(configExtractor); - -// start customizing the configuration for stark -let starkSpecificConfiguration = loadedConfiguration; - -// the spec-bundle.ts file is in a different location in stark -starkSpecificConfiguration.files = [ - { - pattern: helpers.root("config/spec-bundle-stark.ts"), - watched: false - } -]; - -// the spec-bundle.ts file is in a different location in stark -starkSpecificConfiguration.preprocessors = { - "config/spec-bundle-stark.ts": ["webpack", "sourcemap"] -}; - -// export the configuration function that karma expects and simply return the stark configuration -module.exports = config => { - return config.set(starkSpecificConfiguration); -}; diff --git a/packages/stark-build/config-stark/karma.conf.stark.js b/packages/stark-build/config-stark/karma.conf.stark.js deleted file mode 100644 index 778eea1050..0000000000 --- a/packages/stark-build/config-stark/karma.conf.stark.js +++ /dev/null @@ -1,47 +0,0 @@ -"use strict"; - -// Helpers -const helpers = require("./helpers"); - -let loadedConfiguration = null; - -// this object is just useful to retrieve the karma configuration object returned by our default Karma config -// we need this since the karma configuration returns a function and not -let configExtractor = { - set: configuration => { - loadedConfiguration = configuration; - } -}; - -// load our default karma configuration -let defaultKarmaConfig = require("./karma.conf.js"); - -// get the configuration object out -defaultKarmaConfig(configExtractor); - -// start customizing the configuration for stark -let starkSpecificConfiguration = loadedConfiguration; - -// the spec-bundle.ts file is in a different location in stark -starkSpecificConfiguration.files = [ - { - pattern: helpers.root("config/spec-bundle-stark.ts"), - watched: false - }, - // paths to support debugging with source maps in dev tools - { - pattern: helpers.root("src/**/*.ts"), - included: false, - watched: false - } -]; - -// the spec-bundle.ts file is in a different location in stark -starkSpecificConfiguration.preprocessors = { - "config/spec-bundle-stark.ts": ["webpack", "sourcemap"] -}; - -// export the configuration function that karma expects and simply return the stark configuration -module.exports = config => { - return config.set(starkSpecificConfiguration); -}; diff --git a/packages/stark-build/config/karma.conf.js b/packages/stark-build/config/karma.conf.js deleted file mode 100644 index 8366178166..0000000000 --- a/packages/stark-build/config/karma.conf.js +++ /dev/null @@ -1,180 +0,0 @@ -// Helpers -const helpers = require("./helpers"); - -module.exports = function(config) { - const testWebpackConfig = require("./webpack.test.js")(); - - const configuration = { - /** - * Base path that will be used to resolve all patterns (e.g. files, exclude). - */ - basePath: "", - - /** - * Frameworks to use - * - * available frameworks: https://npmjs.org/browse/keyword/karma-adapter - */ - frameworks: ["jasmine"], - - /** - * List of files to exclude. - */ - exclude: [], - - // client configuration - client: { - // can be used to pass arguments to tests (see spec-bundle.ts) - args: [ - { - // path to the subset of the tests to consider (used to filter the unit tests to execute (see spec-bundle.ts) - testPath: helpers.getTestPath(process.argv) - } - ], - - // other client-side config - captureConsole: true - }, - - /** - * List of files / patterns to load in the browser - * - * we are building the test environment in ./spec-bundle.js - */ - files: [ - { - pattern: helpers.rootStark("./config/spec-bundle.js"), - watched: false - }, - // paths to support debugging with source maps in dev tools - { - pattern: "./src/assets/**/*", - watched: false, - included: false, - served: true, - nocache: false - } - ], - - /** - * By default all assets are served at http://localhost:[PORT]/base/ - * can be used to map paths served by the Karma web server to /base/ content - * knowing that /base corresponds to the project root folder (i.e., where this config file is located) - */ - proxies: { - "/assets/": "/base/src/assets/" - }, - - /** - * Preprocess matching files before serving them to the browser - * available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor - */ - // TODO Change this absolute path to a relative one (with helpers ?) - preprocessors: { - "./node_modules/@nationalbankbelgium/stark-build/config/spec-bundle.js": ["coverage", "webpack", "sourcemap"] - }, - - /** - * Webpack Config at ./webpack.test.js - */ - webpack: testWebpackConfig, - - coverageReporter: { - type: "in-memory" - }, - - remapCoverageReporter: { - "text-summary": null, - json: "./reports/coverage/coverage.json", - html: "./reports/coverage/html" - }, - - /** - * Webpack please don't spam the console when running in karma! - */ - webpackMiddleware: { - /** - * webpack-dev-middleware configuration - * i.e. - */ - noInfo: true, - /** - * and use stats to turn off verbose output - */ - stats: { - /** - * options i.e. - */ - chunks: false - } - }, - - /** - * Test results reporter to use - * - * possible values: 'dots', 'progress' - * available reporters: https://npmjs.org/browse/keyword/karma-reporter - */ - reporters: ["mocha", "coverage", "progress", "remap-coverage"], - - // Give a type to files, otherwise it will not work with Chrome > 55 - mime: { - "text/x-typescript": ["ts", "tsx"] - }, - - /** - * Web server port. - */ - port: 9876, - - /** - * enable / disable colors in the output (reporters and logs) - */ - colors: true, - - /** - * Level of logging - * possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG - */ - logLevel: config.LOG_WARN, - - /** - * enable / disable watching file and executing tests whenever any file changes - */ - autoWatch: true, - - /** - * start these browsers - * available browser launchers: https://npmjs.org/browse/keyword/karma-launcher - */ - browsers: [ - "Chrome" - //"Firefox", - //"IE", - ], - - customLaunchers: { - ChromeTravisCi: { - base: "Chrome", - flags: ["--no-sandbox"] - } - }, - - /** - * Continuous Integration mode - * if true, Karma captures browsers, runs the tests and exits - */ - singleRun: false, - - // Timeout settings - browserNoActivityTimeout: 30000, - browserDisconnectTolerance: 1, - browserDisconnectTimeout: 30000 - }; - - if (process.env.TRAVIS) { - configuration.browsers = ["ChromeTravisCi"]; - } - - config.set(configuration); -}; diff --git a/packages/stark-build/config/webpack.test.js b/packages/stark-build/config/webpack.test.js deleted file mode 100644 index 02a39f6cd4..0000000000 --- a/packages/stark-build/config/webpack.test.js +++ /dev/null @@ -1,342 +0,0 @@ -"use strict"; - -const helpers = require("./helpers"); -const buildUtils = require("./build-utils"); - -const commonData = require("./webpack.common-data.js"); - -/** - * Webpack Plugins - */ -const DefinePlugin = require("webpack/lib/DefinePlugin"); -const LoaderOptionsPlugin = require("webpack/lib/LoaderOptionsPlugin"); -const SourceMapDevToolPlugin = require("webpack/lib/SourceMapDevToolPlugin"); -const ContextReplacementPlugin = require("webpack/lib/ContextReplacementPlugin"); - -/** - * Webpack Constants - */ -const ENV = (process.env.ENV = process.env.NODE_ENV = "test"); - -/** - * Webpack configuration - * - * See: https://webpack.js.org/configuration/ - */ -module.exports = function() { - return { - /** - * Options affecting the resolving of modules. - * - * See: https://webpack.js.org/configuration/resolve/ - */ - resolve: { - /** - * An array of extensions that should be used to resolve modules. - * - * See: https://webpack.js.org/configuration/resolve/#resolve-extensions - */ - extensions: [".ts", ".js"], - - /** - * Make sure root is src - */ - modules: [helpers.root(buildUtils.ANGULAR_APP_CONFIG.sourceRoot), "node_modules"] - }, - - /** - * Options affecting the normal modules. - * - * See: https://webpack.js.org/configuration/module/ - * - * 'use:' revered back to 'loader:' as a temp. workaround for #1188 - * See: https://github.com/AngularClass/angular-starter/issues/1188#issuecomment-262872034 - */ - module: { - rules: [ - /** - * Source map loader support for *.js files - * Extracts SourceMaps for source files that as added as sourceMappingURL comment. - * - * See: https://github.com/webpack/source-map-loader - */ - { - enforce: "pre", - test: /\.js$/, - loader: "source-map-loader", - exclude: [ - /** - * These packages have problems with their sourcemaps - */ - helpers.root("node_modules/rxjs"), - helpers.root("node_modules/@angular") - ] - }, - - /** - * Typescript loader support for .ts and Angular 2 async routes via .async.ts - * - * See: https://github.com/s-panferov/awesome-typescript-loader - */ - { - test: /\.ts$/, - use: [ - { - loader: "awesome-typescript-loader", - query: { - /** - * Use inline sourcemaps for "karma-remap-coverage" reporter - */ - sourceMap: false, - inlineSourceMap: true, - compilerOptions: { - /** - * Remove TypeScript helpers to be injected - * below by DefinePlugin - */ - removeComments: true - }, - configFileName: "tsconfig.spec.json" - } - }, - "angular2-template-loader" - ], - exclude: [/\.e2e\.ts$/] - }, - - /** - * Raw loader support for *.css files - * Returns file content as string - * - * See: https://github.com/webpack/raw-loader - */ - { - test: /\.css$/, - loader: [ - "to-string-loader", - { - loader: "css-loader", - options: { - //modules: true, // to check if needed - //minimize: true, - // even if disabled, sourceMaps gets generated - sourceMap: false, // true - autoprefixer: false, - // see https://github.com/webpack-contrib/css-loader#importloaders) - importLoaders: 1 // 1 => postcss-loader - } - }, - { - loader: "postcss-loader", - options: { - sourceMap: true, - plugins: commonData.postcssPlugins - } - } - ], - exclude: [helpers.root("src/index.html")] - }, - - /** - * Raw loader support for *.scss files - * - * See: https://github.com/webpack/raw-loader - */ - { - test: /\.scss$/, - loader: [ - "raw-loader", - { - loader: "css-loader", - options: { - //modules: true, // to check if needed - //minimize: true, - // even if disabled, sourceMaps gets generated - sourceMap: false, // true - autoprefixer: false, - // see https://github.com/webpack-contrib/css-loader#importloaders) - importLoaders: 2 // 2 => postcss-loader + sass-loader - } - }, - { - loader: "postcss-loader", - options: { - sourceMap: true, - plugins: commonData.postcssPlugins - } - }, - "sass-loader" - ], - exclude: [helpers.root("src/index.html")] - }, - - /** - * To string and css and postcss loader support for *.pcss files - * Returns compiled css content as string - * - */ - { - test: /\.pcss$/, - use: [ - "to-string-loader", - { - loader: "css-loader", - options: { - //modules: true, // to check if needed - //minimize: true, - // even if disabled, sourceMaps gets generated - sourceMap: false, // true - autoprefixer: false, - // see https://github.com/webpack-contrib/css-loader#importloaders) - importLoaders: 1 // 1 => postcss-loader - } - }, - { - loader: "postcss-loader", - options: { - sourceMap: true, - plugins: commonData.postcssPlugins - } - } - ], - exclude: [helpers.root(buildUtils.ANGULAR_APP_CONFIG.sourceRoot, "styles")] - }, - - /** - * Raw loader support for *.html - * Returns file content as string - * - * See: https://github.com/webpack/raw-loader - */ - { - test: /\.html$/, - loader: "raw-loader", - exclude: [helpers.root("src/index.html")] - }, - - /** - * Instruments JS files with Istanbul for subsequent code coverage reporting. - * Instrument only testing sources. - * - * See: https://github.com/deepsweet/istanbul-instrumenter-loader - */ - { - enforce: "post", - test: /\.(js|ts)$/, - loader: "istanbul-instrumenter-loader", - include: helpers.root(buildUtils.ANGULAR_APP_CONFIG.sourceRoot), - exclude: [/\.(e2e|spec)\.ts$/, /node_modules/] - } - ] - }, - - /** - * Add additional plugins to the compiler. - * - * See: https://webpack.js.org/configuration/plugins/ - */ - plugins: [ - /** - * Plugin: SourceMapDevToolPlugin - * Description: enables more fine grained control of source map generation - * See: https://webpack.js.org/plugins/source-map-dev-tool-plugin/ - * - * Do not change, leave as is or it wont work. - * This config gives the same results as using devtool: "devtool: 'inline-source-map'". - * Source map for Karma from the help of karma-sourcemap-loader & karma-webpack - * A SourceMap is added as a DataUrl to the bundle. - * See: https://webpack.js.org/configuration/devtool - * See: https://github.com/webpack/karma-webpack#source-maps - * - * IMPORTANT: this should be used instead of EvalSourceMapDevToolPlugin to avoid using eval() which violates CSP - */ - new SourceMapDevToolPlugin({ - // filename: not provided so the source map will be inlined - moduleFilenameTemplate: "[resource-path]", - fallbackModuleFilenameTemplate: "[resource-path]?[hash]", - module: true, // default: true - columns: true, // default: true - sourceRoot: "webpack:///" - }), - - /** - * Plugin: DefinePlugin - * Description: Define free variables. - * Useful for having development builds with debug logging or adding global constants. - * - * Environment helpers - * - * See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin - * - * NOTE: when adding more properties make sure you include them in custom-typings.d.ts - */ - new DefinePlugin({ - ENV: JSON.stringify(ENV), - HMR: false, - "process.env": { - ENV: JSON.stringify(ENV), - NODE_ENV: JSON.stringify(ENV), - HMR: false - } - }), - - /** - * Plugin: ContextReplacementPlugin - * Description: Provides context to Angular's use of System.import - * - * See: https://webpack.github.io/docs/list-of-plugins.html#contextreplacementplugin - * See: https://github.com/angular/angular/issues/11580 - */ - new ContextReplacementPlugin( - /** - * The (\\|\/) piece accounts for path separators in *nix and Windows - */ - /angular[\\\/]core([\\\/])@angular/, - helpers.root(buildUtils.ANGULAR_APP_CONFIG.sourceRoot), // location of your src - { - /** - * your Angular Async Route paths relative to this root directory - */ - } - ), - - /** - * Plugin LoaderOptionsPlugin (experimental) - * - * See: https://gist.github.com/sokra/27b24881210b56bbaff7 - */ - new LoaderOptionsPlugin({ - debug: false, - options: { - /** - * legacy options go here - */ - } - }) - ], - - /** - * Disable performance hints - * - * See: https://github.com/a-tarasyuk/rr-boilerplate/blob/master/webpack/dev.config.babel.js#L41 - */ - performance: { - hints: false - }, - - /** - * Include polyfills or mocks for various node stuff - * Description: Node configuration - * - * See: https://webpack.github.io/docs/configuration.html#node - */ - node: { - global: true, - process: false, - crypto: "empty", - module: false, - clearImmediate: false, - setImmediate: false - } - }; -}; diff --git a/packages/stark-core/karma.conf.typescript.ci.js b/packages/stark-core/karma.conf.ci.js similarity index 85% rename from packages/stark-core/karma.conf.typescript.ci.js rename to packages/stark-core/karma.conf.ci.js index 7b315fc06b..59f3202de1 100644 --- a/packages/stark-core/karma.conf.typescript.ci.js +++ b/packages/stark-core/karma.conf.ci.js @@ -1,9 +1,9 @@ const helpers = require("./node_modules/@nationalbankbelgium/stark-testing/helpers"); /** - * Look in stark-testing for karma.conf.typescript.ci.js + * Load karma config from Stark */ -const defaultKarmaCIConfig = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.typescript.ci.js").rawKarmaConfig; +const defaultKarmaCIConfig = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.ci.js").rawKarmaConfig; // start customizing the KarmaCI configuration from stark-testing const starkCoreSpecificConfiguration = Object.assign({}, defaultKarmaCIConfig, { diff --git a/packages/stark-core/karma.conf.js b/packages/stark-core/karma.conf.js new file mode 100644 index 0000000000..591912df55 --- /dev/null +++ b/packages/stark-core/karma.conf.js @@ -0,0 +1,4 @@ +/** + * Load karma config from Stark + */ +module.exports = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.js"); diff --git a/packages/stark-core/karma.conf.typescript.js b/packages/stark-core/karma.conf.typescript.js deleted file mode 100644 index 92f71b1eb5..0000000000 --- a/packages/stark-core/karma.conf.typescript.js +++ /dev/null @@ -1,4 +0,0 @@ -/** - * Look in stark-testing for karma.conf.typescript.js - */ -module.exports = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.typescript.js"); diff --git a/packages/stark-core/package.json b/packages/stark-core/package.json index 70398d5af9..1493c37325 100644 --- a/packages/stark-core/package.json +++ b/packages/stark-core/package.json @@ -64,8 +64,10 @@ "docs:serve": "npm run docs -- --watch --serve --port 4321", "ngc": "node ./../node_modules/@angular/compiler-cli/src/main.js -p tsconfig-build.json", "lint": "node ../../node_modules/tslint/bin/tslint --config ./tslint.json --project ./tsconfig.spec.json --format codeFrame", - "test-fast": "node ./node_modules/@nationalbankbelgium/stark-testing/node_modules/karma/bin/karma start ./karma.conf.typescript.js", - "test-fast:ci": "node ./node_modules/@nationalbankbelgium/stark-testing/node_modules/karma/bin/karma start karma.conf.typescript.ci.js", + "test": "npm run lint && npm run test-fast", + "test:ci": "npm run lint && npm run test-fast:ci", + "test-fast": "node ./node_modules/@nationalbankbelgium/stark-testing/node_modules/karma/bin/karma start", + "test-fast:ci": "node ./node_modules/@nationalbankbelgium/stark-testing/node_modules/karma/bin/karma start karma.conf.ci.js", "tsc": "node ../../node_modules/typescript/bin/tsc -p tsconfig-build.json", "tslint": "node ../../node_modules/tslint/bin/tslint" } diff --git a/packages/stark-testing/karma.conf.typescript.ci.js b/packages/stark-testing/karma.conf.ci.js similarity index 100% rename from packages/stark-testing/karma.conf.typescript.ci.js rename to packages/stark-testing/karma.conf.ci.js diff --git a/packages/stark-testing/karma.conf.typescript.js b/packages/stark-testing/karma.conf.js similarity index 100% rename from packages/stark-testing/karma.conf.typescript.js rename to packages/stark-testing/karma.conf.js diff --git a/packages/stark-testing/package.json b/packages/stark-testing/package.json index be713618f4..9f98b2a518 100644 --- a/packages/stark-testing/package.json +++ b/packages/stark-testing/package.json @@ -1,7 +1,7 @@ { "name": "@nationalbankbelgium/stark-testing", "version": "0.0.0-PLACEHOLDER-VERSION", - "main": "karma.conf.typescript.js", + "main": "karma.conf.js", "types": "stark-testing.d.ts", "description": "Stark - Testing", "author": "Stark Team", diff --git a/packages/stark-testing/rollup.config.js b/packages/stark-testing/rollup.config.js index 21a5dc5f47..96e1e4ed55 100644 --- a/packages/stark-testing/rollup.config.js +++ b/packages/stark-testing/rollup.config.js @@ -3,7 +3,7 @@ const commonData = require("../rollup.config.common-data.js"); // common configuration between environments module.exports = { - input: "../../dist/packages-dist/stark-testing/karma.conf.typescript.js", + input: "../../dist/packages-dist/stark-testing/karma.conf.js", external: commonData.external, plugins: commonData.plugins, output: [ diff --git a/packages/stark-ui/karma.conf.typescript.ci.js b/packages/stark-ui/karma.conf.ci.js similarity index 85% rename from packages/stark-ui/karma.conf.typescript.ci.js rename to packages/stark-ui/karma.conf.ci.js index 2f879cce1d..346a95e040 100644 --- a/packages/stark-ui/karma.conf.typescript.ci.js +++ b/packages/stark-ui/karma.conf.ci.js @@ -1,10 +1,10 @@ const helpers = require("./node_modules/@nationalbankbelgium/stark-testing/helpers"); /** - * Look in stark-testing for karma.conf.typescript.ci.js + * Load karma config from Stark */ -const defaultKarmaCIConfig = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.typescript.ci.js").rawKarmaConfig; -const karmaTypescriptBundlerAliasResolution = require("./karma.conf.typescript").karmaTypescriptBundlerAliasResolution; +const defaultKarmaCIConfig = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.ci.js").rawKarmaConfig; +const karmaTypescriptBundlerAliasResolution = require("./karma.conf").karmaTypescriptBundlerAliasResolution; // start customizing the KarmaCI configuration from stark-testing const starkUiSpecificConfiguration = Object.assign( diff --git a/packages/stark-ui/karma.conf.typescript.js b/packages/stark-ui/karma.conf.js similarity index 94% rename from packages/stark-ui/karma.conf.typescript.js rename to packages/stark-ui/karma.conf.js index b268dab390..5047031a70 100644 --- a/packages/stark-ui/karma.conf.typescript.js +++ b/packages/stark-ui/karma.conf.js @@ -1,7 +1,7 @@ /** - * Look in stark-testing for karma.conf.typescript.js + * Load karma config from Stark */ -const defaultKarmaCIConfig = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.typescript.js").rawKarmaConfig; +const defaultKarmaCIConfig = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.js").rawKarmaConfig; const karmaTypescriptBundlerAliasResolution = { resolve: { diff --git a/packages/stark-ui/package.json b/packages/stark-ui/package.json index c0c8797347..e88e0ee401 100644 --- a/packages/stark-ui/package.json +++ b/packages/stark-ui/package.json @@ -51,8 +51,10 @@ "docs:serve": "npm run docs -- --watch --serve --port 4321", "ngc": "node ./../node_modules/@angular/compiler-cli/src/main.js -p tsconfig-build.json", "lint": "node ../../node_modules/tslint/bin/tslint --config tslint.json --project ./tsconfig.spec.json --format codeFrame", - "test-fast": "node ./node_modules/@nationalbankbelgium/stark-testing/node_modules/karma/bin/karma start ./karma.conf.typescript.js", - "test-fast:ci": "node ./node_modules/@nationalbankbelgium/stark-testing/node_modules/karma/bin/karma start karma.conf.typescript.ci.js", + "test": "npm run lint && npm run test-fast", + "test:ci": "npm run lint && npm run test-fast:ci", + "test-fast": "node ./node_modules/@nationalbankbelgium/stark-testing/node_modules/karma/bin/karma start", + "test-fast:ci": "node ./node_modules/@nationalbankbelgium/stark-testing/node_modules/karma/bin/karma start karma.conf.ci.js", "tsc": "node ../../node_modules/typescript/bin/tsc -p tsconfig-build.json", "tslint": "node ../../node_modules/tslint/bin/tslint" } diff --git a/release-publish.sh b/release-publish.sh index 881bc228be..44e0c9f3eb 100644 --- a/release-publish.sh +++ b/release-publish.sh @@ -93,13 +93,6 @@ if [[ ${TRAVIS:-} ]]; then logInfo "Publishing from Travis"; logInfo "=============================================" - # If the previous commands in the `script` section of .travis.yaml failed, then abort. - # The variable is not set in early stages of the build, so we default to 0 there. - # https://docs.travis-ci.com/user/environment-variables/ - if [[ ${TRAVIS_TEST_RESULT=0} == 1 ]]; then - exit 1; - fi - # Don't even try if not running against the official repo # We don't want release to run outside of our own little world if [[ ${TRAVIS_REPO_SLUG} != ${EXPECTED_REPO_SLUG} ]]; then @@ -142,6 +135,14 @@ if [[ ${TRAVIS:-} ]]; then logTrace "Not publishing because the NPM_TOKEN environment variable is is not defined correctly" 1 exit 0; fi + + # If any of the previous commands in the `script` section of .travis.yaml failed, then abort. + # The variable is not set in early stages of the build, so we default to 0 there. + # https://docs.travis-ci.com/user/environment-variables/ + if [[ ${TRAVIS_TEST_RESULT=0} == 1 ]]; then + logInfo "Skipping release because a previous script in the Travis build has failed"; + exit 0; + fi fi travisFoldEnd "publish checks" diff --git a/showcase/.dockerignore b/showcase/.dockerignore new file mode 100644 index 0000000000..24f1eaae6f --- /dev/null +++ b/showcase/.dockerignore @@ -0,0 +1,39 @@ +.git +.github +.vscode +coverage + +# OS generated files # +.DS_Store +ehthumbs.db +Icon? +Thumbs.db + +# Node Files # +node_modules +npm-debug.log +npm-debug.log.* + +# Typing # +src/typings/tsd +typings +tsd_typings + +# Dist # +dist +.awcache +.webpack.json +compiled +dll + +# IDE # +.idea +*.swp + + +# Angular # +*.ngfactory.ts +*.css.shim.ts +*.ngsummary.json +*.shim.ngstyle.ts + diff --git a/showcase/.gitignore b/showcase/.gitignore new file mode 100644 index 0000000000..8e0b5bf19a --- /dev/null +++ b/showcase/.gitignore @@ -0,0 +1,66 @@ +# Build +dist/ +.awcache/ + +# Reports directory +reports/ + +# Logs +logs/ +*.log + +# Runtime data +pids +*.pid +*.seed + +# Coverage directory used by tools like istanbul +coverage + +# Bak +*.bak + +# Node +node_modules/ +npm-debug.log +/npm-debug.log.* + +# NPM +package-lock.json + +# OS generated files # +Desktop.ini +Thumbs.db +.DS_Store +ehthumbs.db +Icon? + +# JetBrains IDEs +*.iml +.idea/ +.webstorm/ +*.swp + +# IDE - VSCode +.vscode/* +!.vscode/settings.json +!.vscode/tasks.json +!.vscode/launch.json +!.vscode/extensions.json + +# Sublime text +.sublime-gulp.cache + +# Runtime data +pids +*.pid +*.seed + +# Patch files +*.patch + +# Angular # +*.ngfactory.ts +*.css.shim.ts +*.ngsummary.json +*.shim.ngstyle.ts diff --git a/showcase/.prettierignore b/showcase/.prettierignore new file mode 100644 index 0000000000..deb795460a --- /dev/null +++ b/showcase/.prettierignore @@ -0,0 +1,10 @@ +.git/ +.github/ +.idea/ +.vscode/ +dist/ +coverage/ +reports/ +node_modules/ +package.json +package-lock.json diff --git a/showcase/.prettierrc.js b/showcase/.prettierrc.js new file mode 100644 index 0000000000..7e1214d015 --- /dev/null +++ b/showcase/.prettierrc.js @@ -0,0 +1 @@ +module.exports = require("./node_modules/@nationalbankbelgium/stark-build/config/.prettierrc.js"); diff --git a/showcase/.stylelintrc b/showcase/.stylelintrc new file mode 100644 index 0000000000..1031f5d2a9 --- /dev/null +++ b/showcase/.stylelintrc @@ -0,0 +1,3 @@ +{ + "extends": "./node_modules/@nationalbankbelgium/stark-build/config/stylelint.config.js" +} diff --git a/showcase/Dockerfile b/showcase/Dockerfile new file mode 100644 index 0000000000..c94a6e984a --- /dev/null +++ b/showcase/Dockerfile @@ -0,0 +1,45 @@ +# Usage (given build times depend on machine): +# +# Build SMALL image (no cache; ~20MB, time for build=rebuild = ~360s): +# docker build --squash="true" -t angular-starter . +# +# Build FAST (rebuild) image (cache; >280MB, build time ~360s, rebuild time ~80s): +# docker build -t angular-starter . +# +# Clean (remove intermidiet images): +# docker rmi -f $(docker images -f "dangling=true" -q) +# +# Run image (on localhost:8080): +# docker run --name angular-starter -p 8080:80 angular-starter & +# +# Run image as virtual host (read more: https://github.com/jwilder/nginx-proxy): +# docker run -e VIRTUAL_HOST=angular-starter.your-domain.com --name angular-starter angular-starter & + +FROM nginx:1.13.0-alpine + +# install console and node +RUN apk add --no-cache bash=4.3.46-r5 &&\ + apk add --no-cache openssl=1.0.2m-r0 &&\ + apk add --no-cache nodejs + +# install npm ( in separate dir due to docker cache) +ADD package.json /tmp/npm_inst/package.json +RUN cd /tmp/npm_inst &&\ + npm install &&\ + mkdir -p /tmp/app &&\ + mv /tmp/npm_inst/node_modules /tmp/app/ + +# build and publish application +ADD . /tmp/app +RUN cd /tmp/app &&\ + npm run build:aot &&\ + mv ./dist/* /usr/share/nginx/html/ + +# clean +RUN rm -Rf /tmp/npm_inst &&\ + rm -Rf /tmp/app &&\ + rm -Rf /root/.npm &&\ + apk del nodejs + +# this is for virtual host purposes +EXPOSE 80 diff --git a/showcase/README.md b/showcase/README.md new file mode 100644 index 0000000000..0fb9a18d3f --- /dev/null +++ b/showcase/README.md @@ -0,0 +1,245 @@ +# Stark Showcase + +## About +This is the showcase of Stark. + +## Showcase structure +TODO doc; see #393 + +## Configuration +Most of the configuration files at the root of the showcase either fully reuse or extend Stark's configuration files. +Most of the time you won't need to change these, but they allow you to customize things when needed. + +## Getting Started + +### System configuration +What you need to run this app: +* `node` and `npm` +* Ensure you're running the latest versions Node `v8.x.x`+ and NPM `5.8.x`+ + +> If you have `nvm` installed, which is highly recommended you can do a `nvm install --lts && nvm use` in `$` to run with the latest Node LTS. You can also have this `zsh` done for you [automatically](https://github.com/creationix/nvm#calling-nvm-use-automatically-in-a-directory-with-a-nvmrc-file) + +### Global dependencies +Once you have those, you should install these globals with `npm install --global`: +* Windows only: `npm install -g node-pre-gyp` + +TODO review/complete; see #34 + +### Installing +First, clone the project: + +```bash +# --depth 1 removes all but one .git commit history +git clone --depth 1 https://github.com/NationalBankBelgum/stark.git +``` + +Then go to the showcase folder (`cd showcase`) and install all dependencies using: `npm install`. + +TODO review/complete; see #34 + +### Running the app +After you have installed all dependencies you can now run the app. +Run `npm run server` to start a local (development) server using `webpack-dev-server` which will watch, build (in-memory), and reload for you. +The port will be displayed to you as `http://0.0.0.0:3000` (or if you prefer IPv6, if you're using `express` server, then it's `http://[::1]:3000/`). + +You may enable Hot Module Replacement (HMR) using: + +```bash +npm run server:dev:hmr +``` + +You may also start the server in production mode using the following: +```bash +npm run build:prod +npm run server:prod +``` + +## Build commands + +### Reference +Refer to the Stark developer guide: https://github.com/NationalBankBelgium/stark + +### Build files +```bash +# development +npm run build:dev +# production (jit) +npm run build:prod +# AoT +npm run build:aot +``` + +### Hot Module Replacement (HMR) mode +```bash +npm run server:dev:hmr +``` + +### Watch mode +```bash +npm run watch +``` + +### Run unit tests +```bash +npm run test +``` + +### Watch and run tests +```bash +npm run watch:test +``` + +### Run end-to-end tests +```bash +# update Webdriver (optional, done automatically by postinstall script) +npm run webdriver:update # cfr #35 +# this will start a test server and launch Protractor +npm run e2e +``` + +### Continuous Integration (CI): run unit tests and e2e tests together +```bash +# this will test both your JIT and AoT builds +npm run ci +``` + +### Run Protractor's elementExplorer (for end-to-end) +```bash +npm run e2e:live +``` + +### Build Docker +```bash +npm run build:docker +``` + +For more details, refer to the deployment section below. + +## Good to know +### AoT Don'ts +The following are some things that will make AoT compile fail. + +- Don’t use require statements for your templates or styles, use styleUrls and templateUrls, the angular2-template-loader plugin will change it to require at build time. +- Don’t use default exports. +- Don’t use `form.controls.controlName`, use `form.get(‘controlName’)` +- Don’t use `control.errors?.someError`, use `control.hasError(‘someError’)` +- Don’t use functions in your providers, routes or declarations, export a function and then reference that function name +- @Inputs, @Outputs, View or Content Child(ren), Hostbindings, and any field you use from the template or annotate for Angular should be public + +### Type definitions +When including 3rd party modules you also need to include the type definition for the module. +When you include a module that doesn't include TypeScript type definitions inside of the module you can include external type definitions with @types + +``` +npm install @types/node +npm install @types/lodash +``` + +If you can't find the type definition in the registry then you can make use of an ambient definition in the custom-typings.d.ts file. + +For example: +```typescript +declare module "my-module" { + export function doesSomething(value: string): string; +} +``` + +If you're prototyping and you will fix the types later you can also declare it as type any: + +```typescript +declare var assert: any; +declare var _: any; +declare var $: any; +``` + +If you're importing a module that uses Node.js modules which are CommonJS you need to import as + +```typescript +import * as _ from 'lodash'; +``` + +### External Stylesheets +TODO explain how stylesheets are loaded. + +## Tools + +### TypeScript-aware editors +We have good experience using these editors: + +* [Visual Studio Code](https://code.visualstudio.com/) +* [IntelliJ IDEA](https://www.jetbrains.com/idea/download/) +* [Webstorm](https://www.jetbrains.com/webstorm/download/) +* [Atom](https://atom.io/) with [TypeScript plugin](https://atom.io/packages/atom-typescript) +* [Sublime Text](http://www.sublimetext.com/3) with [Typescript-Sublime-Plugin](https://github.com/Microsoft/Typescript-Sublime-plugin#installation) + +### Visual Studio Code + Debugger for Chrome +> Install [Debugger for Chrome](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) and see docs for instructions to launch Chrome + +The included `.vscode` automatically connects to the webpack development server on port `3000`. + +## Deployment + +### Docker + +To run project you only need host machine with **operating system** with installed **git** (to clone this repo) +and [docker](https://www.docker.com/) and thats all - any other software is not needed +(other software like node.js etc. will be automatically downloaded and installed inside docker container during build step based on dockerfile). + +#### Install docker + +##### MacOS: + +`brew cask install docker` + +And run docker by Mac bottom menu> launchpad > docker (on first run docker will ask you about password) + +##### Ubuntu: + +``` +sudo apt-get update +sudo apt-key adv --keyserver hkp://p80.pool.sks-keyservers.net:80 --recv-keys 58118E89F3A912897C070ADBF76221572C52609D +sudo apt-add-repository 'deb https://apt.dockerproject.org/repo ubuntu-xenial main' +sudo apt-get update +apt-cache policy docker-engine +sudo apt-get install -y docker-engine +sudo systemctl status docker # test: shoud be ‘active’ +``` +And add your user to docker group (to avoid `sudo` before using `docker` command in future): +``` +sudo usermod -aG docker $(whoami) +``` +and logout and login again. + +#### Build image +Because *node.js* is big memory consumer you need 1-2GB RAM or virtual memory to build docker image. + +Go to the main project folder. To build big (~280MB) image which has cached data and is able to **FAST** rebuild +(this is good for testing or staging environment) type: + +`docker build -t stark-showcase .` + +To build **SMALL** (~20MB) image without cache (so each rebuild will take the same amount of time as first build) +(this is good for production environment) type: + +`docker build --squash="true" -t stark-showcase .` + +The **stark-showcase** name used in above commands is only example image name. +To remove intermediate images created by docker on build process, type: + +`docker rmi -f $(docker images -f "dangling=true" -q)` + +#### Run image + +To run created docker image on [localhost:8080](localhost:8080) type (parameter `-p 8080:80` is host:container port mapping) + +`docker run --name stark-showcase -p 8080:80 stark-showcase &` + +And that's all, you can open browser and go to [localhost:8080](localhost:8080). + +#### Build and Run image using docker-compose + +To create and run docker image on [localhost:8080](localhost:8080) as part of large project you may use **docker-compose**. Type + +`docker-compose up &` + +And that's all, you can open browser and go to [localhost:8080](localhost:8080). diff --git a/showcase/angular.json b/showcase/angular.json new file mode 100644 index 0000000000..0c6a0fb33d --- /dev/null +++ b/showcase/angular.json @@ -0,0 +1,145 @@ +{ + "$schema": "./node_modules/@angular/cli/lib/config/schema.json", + "version": 1, + "newProjectRoot": "projects", + "projects": { + "showcase": { + "root": "", + "sourceRoot": "src", + "projectType": "application", + "architect": { + "build": { + "builder": "@angular-devkit/build-angular:browser", + "options": { + "outputPath": "dist", + "index": "src/index.html", + "main": "src/main.browser.ts", + "tsConfig": "tsconfig.app.json", + "polyfills": "src/polyfills.browser.ts", + "assets": [ + { + "glob": "mdi.svg", + "input": "node_modules/@mdi/angular-material", + "output": "./assets/icons" + }, + { + "glob": "**/*", + "input": "src/assets/img", + "output": "./assets/img" + }, + { + "glob": "**/*", + "input": "assets", + "output": "./assets" + }, + { + "glob": "**/*", + "input": "assets-base", + "output": "./" + } + ], + "styles": ["src/styles.css"], + "scripts": [], + "deployUrl": "", + "baseHref": "/" + }, + "configurations": { + "hmr": { + "fileReplacements": [ + { + "replace": "src/environments/environment.ts", + "with": "src/environments/environment.hmr.ts" + } + ] + }, + "production": { + "optimization": true, + "outputHashing": "all", + "sourceMap": false, + "extractCss": true, + "namedChunks": false, + "aot": true, + "extractLicenses": true, + "vendorChunk": false, + "buildOptimizer": true, + "fileReplacements": [ + { + "replace": "src/environments/environment.ts", + "with": "src/environments/environment.prod.ts" + } + ] + }, + "e2e.prod": { + "optimization": true, + "outputHashing": "all", + "sourceMap": false, + "extractCss": true, + "namedChunks": false, + "aot": true, + "extractLicenses": true, + "vendorChunk": false, + "buildOptimizer": true, + "fileReplacements": [ + { + "replace": "src/environments/environment.ts", + "with": "src/environments/environment.e2e.prod.ts" + } + ] + } + } + }, + "serve": { + "builder": "@angular-devkit/build-angular:dev-server", + "options": { + "browserTarget": "showcase:build" + }, + "configurations": { + "hmr": { + "browserTarget": "showcase:build:hmr" + }, + "production": { + "browserTarget": "showcase:build:production" + }, + "e2e.prod": { + "browserTarget": "showcase:build:e2e.prod" + } + } + }, + "extract-i18n": { + "builder": "@angular-devkit/build-angular:extract-i18n", + "options": { + "browserTarget": "showcase:build" + } + }, + "lint": { + "builder": "@angular-devkit/build-angular:tslint", + "options": { + "tsConfig": ["tsconfig.app.json", "tsconfig.spec.json"], + "exclude": ["**/node_modules/**"] + } + }, + "test": { + "options": { + "main": "base.spec.ts", + "tsConfig": "tsconfig.spec.json" + } + } + } + }, + "showcase-e2e": { + "root": "", + "sourceRoot": "", + "projectType": "application" + } + }, + "defaultProject": "showcase", + "schematics": { + "@schematics/angular:component": { + "prefix": "app", + "styleext": "pcss" + }, + "@schematics/angular:directive": { + "prefix": "app" + } + } +} diff --git a/showcase/assets-base/README.md b/showcase/assets-base/README.md new file mode 100644 index 0000000000..189e356b7c --- /dev/null +++ b/showcase/assets-base/README.md @@ -0,0 +1,6 @@ +This folder should contain all static assets that will be copied to the root of the application. + +Note that all the contents of this folder will be copied to the ROOT of the target folder. +For example, "robots.txt" will be copied to "dist/robots.txt" + +This is done in dev and in production, hence in all cases when you refer to files present in "assets-base", don't include "assets-base" in your paths. diff --git a/showcase/assets-base/browserconfig.xml b/showcase/assets-base/browserconfig.xml new file mode 100644 index 0000000000..93e4833c65 --- /dev/null +++ b/showcase/assets-base/browserconfig.xml @@ -0,0 +1,12 @@ + + + + + + + + + #ffffff + + + diff --git a/showcase/assets-base/crossdomain.xml b/showcase/assets-base/crossdomain.xml new file mode 100644 index 0000000000..818b822573 --- /dev/null +++ b/showcase/assets-base/crossdomain.xml @@ -0,0 +1,15 @@ + + + + + + + + + + + diff --git a/showcase/assets-base/favicon.ico b/showcase/assets-base/favicon.ico new file mode 100644 index 0000000000..927709aad1 Binary files /dev/null and b/showcase/assets-base/favicon.ico differ diff --git a/showcase/assets-base/humans.txt b/showcase/assets-base/humans.txt new file mode 100644 index 0000000000..ddb649ddec --- /dev/null +++ b/showcase/assets-base/humans.txt @@ -0,0 +1,24 @@ +# humanstxt.org/ +# The humans responsible & technology colophon + +# TEAM + + National Bank of Belgium - https://www.nbb.be + +# THANKS + + We need great developers! Check out https://jobs.nbb.be + +# TECHNOLOGY COLOPHON + Angular + TypeScript + RxJS + Redux + Material Design + Angular Material + ES20xy + HTML5 + CSS3 + Webpack + NodeJS + NPM diff --git a/showcase/assets-base/manifest.json b/showcase/assets-base/manifest.json new file mode 100644 index 0000000000..8344cf4155 --- /dev/null +++ b/showcase/assets-base/manifest.json @@ -0,0 +1,44 @@ +{ + "name": "NBB Stark", + "short_name": "Stark", + "start_url": "/", + "display": "standalone", + "icons": [ + { + "src": "/assets/images/favicon/android-icon-36x36.png", + "sizes": "36x36", + "type": "image/png", + "density": "0.75" + }, + { + "src": "/assets/images/favicon/android-icon-48x48.png", + "sizes": "48x48", + "type": "image/png", + "density": "1.0" + }, + { + "src": "/assets/images/favicon/android-icon-72x72.png", + "sizes": "72x72", + "type": "image/png", + "density": "1.5" + }, + { + "src": "/assets/images/favicon/android-icon-96x96.png", + "sizes": "96x96", + "type": "image/png", + "density": "2.0" + }, + { + "src": "/assets/images/favicon/android-icon-144x144.png", + "sizes": "144x144", + "type": "image/png", + "density": "3.0" + }, + { + "src": "/assets/images/favicon/android-icon-192x192.png", + "sizes": "192x192", + "type": "image/png", + "density": "4.0" + } + ] +} diff --git a/showcase/assets-base/robots.txt b/showcase/assets-base/robots.txt new file mode 100644 index 0000000000..d0e5f1be6b --- /dev/null +++ b/showcase/assets-base/robots.txt @@ -0,0 +1,5 @@ +# www.robotstxt.org/ + +# Allow crawling of all content +User-agent: * +Disallow: diff --git a/showcase/assets-base/service-worker.js b/showcase/assets-base/service-worker.js new file mode 100644 index 0000000000..3845a58c82 --- /dev/null +++ b/showcase/assets-base/service-worker.js @@ -0,0 +1,2 @@ +// This file is intentionally without code +// We will leverage this in the future to provide Service Workers diff --git a/showcase/assets/README.md b/showcase/assets/README.md new file mode 100644 index 0000000000..a81d4883d1 --- /dev/null +++ b/showcase/assets/README.md @@ -0,0 +1,4 @@ +This folder should contain all static assets of Stark. + +Note that all the contents of this folder will be copied to the "assets" folder in "dist". +For example, "assets/images" will be copied to "dist/assets/images" diff --git a/showcase/assets/images/app-header.png b/showcase/assets/images/app-header.png new file mode 100644 index 0000000000..a9d50fd52a Binary files /dev/null and b/showcase/assets/images/app-header.png differ diff --git a/showcase/assets/images/content-ghost.png b/showcase/assets/images/content-ghost.png new file mode 100644 index 0000000000..518439c82d Binary files /dev/null and b/showcase/assets/images/content-ghost.png differ diff --git a/showcase/assets/images/empty-state/thinking.svg b/showcase/assets/images/empty-state/thinking.svg new file mode 100644 index 0000000000..c6ec39b677 --- /dev/null +++ b/showcase/assets/images/empty-state/thinking.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/showcase/assets/images/favicon/android-icon-144x144.png b/showcase/assets/images/favicon/android-icon-144x144.png new file mode 100644 index 0000000000..c7e602c0ed Binary files /dev/null and b/showcase/assets/images/favicon/android-icon-144x144.png differ diff --git a/showcase/assets/images/favicon/android-icon-192x192.png b/showcase/assets/images/favicon/android-icon-192x192.png new file mode 100644 index 0000000000..8468510836 Binary files /dev/null and b/showcase/assets/images/favicon/android-icon-192x192.png differ diff --git a/showcase/assets/images/favicon/android-icon-36x36.png b/showcase/assets/images/favicon/android-icon-36x36.png new file mode 100644 index 0000000000..1d72feb82e Binary files /dev/null and b/showcase/assets/images/favicon/android-icon-36x36.png differ diff --git a/showcase/assets/images/favicon/android-icon-48x48.png b/showcase/assets/images/favicon/android-icon-48x48.png new file mode 100644 index 0000000000..cba42d6aa4 Binary files /dev/null and b/showcase/assets/images/favicon/android-icon-48x48.png differ diff --git a/showcase/assets/images/favicon/android-icon-72x72.png b/showcase/assets/images/favicon/android-icon-72x72.png new file mode 100644 index 0000000000..b818c25135 Binary files /dev/null and b/showcase/assets/images/favicon/android-icon-72x72.png differ diff --git a/showcase/assets/images/favicon/android-icon-96x96.png b/showcase/assets/images/favicon/android-icon-96x96.png new file mode 100644 index 0000000000..c072a4063f Binary files /dev/null and b/showcase/assets/images/favicon/android-icon-96x96.png differ diff --git a/showcase/assets/images/favicon/apple-icon-114x114.png b/showcase/assets/images/favicon/apple-icon-114x114.png new file mode 100644 index 0000000000..4f6d2042f3 Binary files /dev/null and b/showcase/assets/images/favicon/apple-icon-114x114.png differ diff --git a/showcase/assets/images/favicon/apple-icon-120x120.png b/showcase/assets/images/favicon/apple-icon-120x120.png new file mode 100644 index 0000000000..cbde8e7731 Binary files /dev/null and b/showcase/assets/images/favicon/apple-icon-120x120.png differ diff --git a/showcase/assets/images/favicon/apple-icon-144x144.png b/showcase/assets/images/favicon/apple-icon-144x144.png new file mode 100644 index 0000000000..c7e602c0ed Binary files /dev/null and b/showcase/assets/images/favicon/apple-icon-144x144.png differ diff --git a/showcase/assets/images/favicon/apple-icon-152x152.png b/showcase/assets/images/favicon/apple-icon-152x152.png new file mode 100644 index 0000000000..42a461f146 Binary files /dev/null and b/showcase/assets/images/favicon/apple-icon-152x152.png differ diff --git a/showcase/assets/images/favicon/apple-icon-180x180.png b/showcase/assets/images/favicon/apple-icon-180x180.png new file mode 100644 index 0000000000..6b079b1e2d Binary files /dev/null and b/showcase/assets/images/favicon/apple-icon-180x180.png differ diff --git a/showcase/assets/images/favicon/apple-icon-57x57.png b/showcase/assets/images/favicon/apple-icon-57x57.png new file mode 100644 index 0000000000..a3229cb9b3 Binary files /dev/null and b/showcase/assets/images/favicon/apple-icon-57x57.png differ diff --git a/showcase/assets/images/favicon/apple-icon-60x60.png b/showcase/assets/images/favicon/apple-icon-60x60.png new file mode 100644 index 0000000000..31ce89c72e Binary files /dev/null and b/showcase/assets/images/favicon/apple-icon-60x60.png differ diff --git a/showcase/assets/images/favicon/apple-icon-72x72.png b/showcase/assets/images/favicon/apple-icon-72x72.png new file mode 100644 index 0000000000..b818c25135 Binary files /dev/null and b/showcase/assets/images/favicon/apple-icon-72x72.png differ diff --git a/showcase/assets/images/favicon/apple-icon-76x76.png b/showcase/assets/images/favicon/apple-icon-76x76.png new file mode 100644 index 0000000000..05ff0767d6 Binary files /dev/null and b/showcase/assets/images/favicon/apple-icon-76x76.png differ diff --git a/showcase/assets/images/favicon/apple-icon-precomposed.png b/showcase/assets/images/favicon/apple-icon-precomposed.png new file mode 100644 index 0000000000..5a7cbe75e9 Binary files /dev/null and b/showcase/assets/images/favicon/apple-icon-precomposed.png differ diff --git a/showcase/assets/images/favicon/apple-icon.png b/showcase/assets/images/favicon/apple-icon.png new file mode 100644 index 0000000000..5a7cbe75e9 Binary files /dev/null and b/showcase/assets/images/favicon/apple-icon.png differ diff --git a/showcase/assets/images/favicon/favicon-16x16.png b/showcase/assets/images/favicon/favicon-16x16.png new file mode 100644 index 0000000000..ca22f37fc4 Binary files /dev/null and b/showcase/assets/images/favicon/favicon-16x16.png differ diff --git a/showcase/assets/images/favicon/favicon-32x32.png b/showcase/assets/images/favicon/favicon-32x32.png new file mode 100644 index 0000000000..b77a6ba474 Binary files /dev/null and b/showcase/assets/images/favicon/favicon-32x32.png differ diff --git a/showcase/assets/images/favicon/favicon-96x96.png b/showcase/assets/images/favicon/favicon-96x96.png new file mode 100644 index 0000000000..c072a4063f Binary files /dev/null and b/showcase/assets/images/favicon/favicon-96x96.png differ diff --git a/showcase/assets/images/favicon/ms-icon-144x144.png b/showcase/assets/images/favicon/ms-icon-144x144.png new file mode 100644 index 0000000000..c7e602c0ed Binary files /dev/null and b/showcase/assets/images/favicon/ms-icon-144x144.png differ diff --git a/showcase/assets/images/favicon/ms-icon-150x150.png b/showcase/assets/images/favicon/ms-icon-150x150.png new file mode 100644 index 0000000000..54acef116f Binary files /dev/null and b/showcase/assets/images/favicon/ms-icon-150x150.png differ diff --git a/showcase/assets/images/favicon/ms-icon-310x310.png b/showcase/assets/images/favicon/ms-icon-310x310.png new file mode 100644 index 0000000000..0d828bd35b Binary files /dev/null and b/showcase/assets/images/favicon/ms-icon-310x310.png differ diff --git a/showcase/assets/images/favicon/ms-icon-70x70.png b/showcase/assets/images/favicon/ms-icon-70x70.png new file mode 100644 index 0000000000..205e8a9f43 Binary files /dev/null and b/showcase/assets/images/favicon/ms-icon-70x70.png differ diff --git a/showcase/assets/images/logo/logo-blue.svg b/showcase/assets/images/logo/logo-blue.svg new file mode 100644 index 0000000000..b48946cf85 --- /dev/null +++ b/showcase/assets/images/logo/logo-blue.svg @@ -0,0 +1,8 @@ + + + + Layer 1 + + + + \ No newline at end of file diff --git a/showcase/assets/images/logo/logo-full-en-white.svg b/showcase/assets/images/logo/logo-full-en-white.svg new file mode 100644 index 0000000000..2d641097cb --- /dev/null +++ b/showcase/assets/images/logo/logo-full-en-white.svg @@ -0,0 +1,3 @@ + + + diff --git a/showcase/assets/images/logo/logo-nbb-en.gif b/showcase/assets/images/logo/logo-nbb-en.gif new file mode 100644 index 0000000000..91ef840bd3 Binary files /dev/null and b/showcase/assets/images/logo/logo-nbb-en.gif differ diff --git a/showcase/assets/images/logo/logo-white.svg b/showcase/assets/images/logo/logo-white.svg new file mode 100644 index 0000000000..eb4aff7928 --- /dev/null +++ b/showcase/assets/images/logo/logo-white.svg @@ -0,0 +1,8 @@ + + + + Layer 1 + + + + \ No newline at end of file diff --git a/showcase/assets/images/logo/nbb-logo-en.png b/showcase/assets/images/logo/nbb-logo-en.png new file mode 100644 index 0000000000..1cdcbd0288 Binary files /dev/null and b/showcase/assets/images/logo/nbb-logo-en.png differ diff --git a/showcase/assets/images/no-user-image.gif b/showcase/assets/images/no-user-image.gif new file mode 100644 index 0000000000..07136c82f5 Binary files /dev/null and b/showcase/assets/images/no-user-image.gif differ diff --git a/showcase/assets/images/touch/apple-touch-icon.png b/showcase/assets/images/touch/apple-touch-icon.png new file mode 100644 index 0000000000..76c482b49d Binary files /dev/null and b/showcase/assets/images/touch/apple-touch-icon.png differ diff --git a/showcase/assets/images/touch/chrome-touch-icon-192x192.png b/showcase/assets/images/touch/chrome-touch-icon-192x192.png new file mode 100644 index 0000000000..f6ba515101 Binary files /dev/null and b/showcase/assets/images/touch/chrome-touch-icon-192x192.png differ diff --git a/showcase/assets/images/touch/icon-128x128.png b/showcase/assets/images/touch/icon-128x128.png new file mode 100644 index 0000000000..a5c78429a9 Binary files /dev/null and b/showcase/assets/images/touch/icon-128x128.png differ diff --git a/showcase/assets/images/touch/ms-touch-icon-144x144-precomposed.png b/showcase/assets/images/touch/ms-touch-icon-144x144-precomposed.png new file mode 100644 index 0000000000..d7edfab7e1 Binary files /dev/null and b/showcase/assets/images/touch/ms-touch-icon-144x144-precomposed.png differ diff --git a/showcase/assets/images/watermark-sm.gif b/showcase/assets/images/watermark-sm.gif new file mode 100644 index 0000000000..8b17fb0755 Binary files /dev/null and b/showcase/assets/images/watermark-sm.gif differ diff --git a/showcase/assets/translations/en.json b/showcase/assets/translations/en.json new file mode 100644 index 0000000000..8f99a08bd4 --- /dev/null +++ b/showcase/assets/translations/en.json @@ -0,0 +1,7 @@ +{ + "SHOWCASE": { + "HOME": { + "TITLE": "Stark Showcase" + } + } +} diff --git a/showcase/assets/translations/fr.json b/showcase/assets/translations/fr.json new file mode 100644 index 0000000000..0aacc8b205 --- /dev/null +++ b/showcase/assets/translations/fr.json @@ -0,0 +1,7 @@ +{ + "SHOWCASE": { + "HOME": { + "TITLE": "Application de démonstration de Stark" + } + } +} diff --git a/showcase/assets/translations/nl.json b/showcase/assets/translations/nl.json new file mode 100644 index 0000000000..0ed45cf961 --- /dev/null +++ b/showcase/assets/translations/nl.json @@ -0,0 +1,7 @@ +{ + "SHOWCASE": { + "HOME": { + "TITLE": "Stark Showcase applicatie" + } + } +} diff --git a/showcase/base.spec.ts b/showcase/base.spec.ts new file mode 100644 index 0000000000..4d13150ed5 --- /dev/null +++ b/showcase/base.spec.ts @@ -0,0 +1,20 @@ +"use strict"; + +/* tslint:disable:no-import-side-effect */ +import "core-js/es6"; +import "core-js/es7/reflect"; +import "core-js/stage/4"; + +import "zone.js/dist/zone"; +import "zone.js/dist/long-stack-trace-zone"; +import "zone.js/dist/proxy"; // since zone.js 0.6.15 +import "zone.js/dist/sync-test"; +import "zone.js/dist/jasmine-patch"; // put here since zone.js 0.6.14 +import "zone.js/dist/async-test"; +import "zone.js/dist/fake-async-test"; +/* tslint:enable */ + +import { TestBed } from "@angular/core/testing"; +import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from "@angular/platform-browser-dynamic/testing"; + +TestBed.initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting()); diff --git a/showcase/config/webpack-custom-config.dev.json b/showcase/config/webpack-custom-config.dev.json new file mode 100644 index 0000000000..117d7c151b --- /dev/null +++ b/showcase/config/webpack-custom-config.dev.json @@ -0,0 +1,5 @@ +{ + "cspConnectSrc": + "http://localhost:5000 http://localhost:5001 http://localhost:5002 http://localhost:4000 https://nationalbankbelgium.github.io", + "cspFormAction": "http://localhost:5000/myAwesomeUpload" +} diff --git a/showcase/karma.conf.ci.js b/showcase/karma.conf.ci.js new file mode 100644 index 0000000000..932a88e9b6 --- /dev/null +++ b/showcase/karma.conf.ci.js @@ -0,0 +1,4 @@ +/** + * Load karma config from Stark + */ +module.exports = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.ci.js"); diff --git a/showcase/karma.conf.js b/showcase/karma.conf.js new file mode 100644 index 0000000000..591912df55 --- /dev/null +++ b/showcase/karma.conf.js @@ -0,0 +1,4 @@ +/** + * Load karma config from Stark + */ +module.exports = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.js"); diff --git a/showcase/package.json b/showcase/package.json new file mode 100644 index 0000000000..97206c22c8 --- /dev/null +++ b/showcase/package.json @@ -0,0 +1,161 @@ +{ + "name": "stark-showcase", + "version": "0.0.1", + "private": true, + "description": "Stark - Showcase", + "keywords": [ + "angular", + "angular6", + "webpack", + "typescript", + "redux", + "ngrx", + "ui-router" + ], + "author": "Stark Team ", + "contributors": [], + "license": "MIT", + "bugs": "https://github.com/nationalbankbelgium/stark/issues", + "homepage": "https://github.com/nationalbankbelgium/stark", + "repository": { + "type": "git", + "url": "https://github.com/nationalbankbelgium/stark.git" + }, + "engines": { + "node": ">=6.11.0", + "npm": ">=5.3.0" + }, + "scripts": { + "build:aot:prod": "npm run clean:dist && npm run clean:aot && cross-env BUILD_AOT=1 npm run webpack -- --config node_modules/@nationalbankbelgium/stark-build/config/webpack.prod.js --progress --profile --bail", + "build:aot": "npm run build:aot:prod", + "build:aot:dev": "cross-env BUILD_AOT=1 npm run build:dev", + "build:dev": "npm run clean:dist && npm run webpack -- --config node_modules/@nationalbankbelgium/stark-build/config/webpack.dev.js --progress --profile", + "build:dev:monitor": "npx mkdirp reports && npm run build:dev -- --env.monitor", + "build:docker": "npm run build:prod && docker build -t angular2-webpack-start:latest .", + "build:prod": "npm run clean:dist && npm run build:aot:prod", + "build": "npm run build:dev", + "check-deps": "npx npm-check-u", + "ci:aot": "cross-env BUILD_E2E=1 npm run lint && npm run test && npm run build:aot && npm run e2e", + "ci:jit": "cross-env BUILD_E2E=1 npm run lint && npm run test && npm run build:prod && npm run e2e", + "ci:nobuild": "npm run lint && npm test && npm run e2e", + "ci:testall": "cross-env BUILD_E2E=1 npm run lint && npm run test && npm run build:prod && npm run e2e && npm run build:aot && npm run e2e", + "ci:travis": "cross-env BUILD_E2E=1 npm run lint && npm run test && npm run build:aot && npm run e2e:travis", + "ci": "npm run ci:testall", + "clean:dll": "npm run rimraf -- dll", + "clean:aot": "npm run rimraf -- compiled", + "clean:dist": "npm run rimraf -- dist", + "clean:modules": "npm run rimraf -- node_modules package-lock.json", + "clean:install": "npm set progress=false && npm install", + "clean": "npm cache clean --force && npm run rimraf -- node_modules doc coverage reports dist compiled dll", + "compodoc": "compodoc", + "docker": "docker", + "docs": "npm run docs:clean && compodoc src --theme material --tsconfig ./tsconfig.json --output ./reports/api-docs", + "docs:clean": "npx rimraf reports/api-docs", + "docs:coverage": "npm run docs -- --coverageTest --coverageThresholdFail true", + "docs:serve": "npm run docs -- --watch --serve --port 4321", + "e2e:live": "npm-run-all -p -r server:prod:ci protractor:live", + "e2e:travis": "npm-run-all -p -r server:prod:ci protractor:delay", + "e2e": "npm-run-all -p -r server:prod:ci protractor", + "github-deploy:dev": "npm run webpack -- --config node_modules/@nationalbankbelgium/stark-build/config/webpack.github-deploy.js --progress --profile --env.githubDev", + "github-deploy:prod": "npm run webpack -- --config node_modules/@nationalbankbelgium/stark-build/config/webpack.github-deploy.js --progress --profile --env.githubProd", + "github-deploy": "npm run github-deploy:dev", + "karma": "karma", + "lint": "tslint --config tslint.json --project ./tsconfig.json --format codeFrame", + "lint-css": "stylelint \"./src/**/*.?(pc|sc|c|sa)ss\" --formatter \"string\"", + "ngc": "ngc", + "node": "node", + "postinstall": "npm run webdriver:update", + "postversion": "git push && git push --tags", + "preclean:install": "npm run clean", + "precommit": "lint-staged", + "prettier-check": "prettier **/*.{css,js,json,pcss,scss,ts} --write", + "preversion": "npm test", + "protractor": "protractor", + "protractor:delay": "sleep 3 && npm run protractor", + "protractor:live": "protractor --elementExplorer", + "rimraf": "npx rimraf", + "server:dev:hmr": "npm run server:dev -- --hot", + "server:aot:dev": "cross-env BUILD_AOT=1 npm run server:dev", + "server:dev": "npm run clean:dist && npm run webpack-dev-server -- --config node_modules/@nationalbankbelgium/stark-build/config/webpack.dev.js --open --progress --profile --watch --content-base src/", + "server:prod": "http-server dist -c-1 --cors", + "server:prod:ci": "http-server dist -p 3000 -c-1 --cors", + "server": "npm run server:dev", + "start:hmr": "npm run server:dev:hmr", + "start:monitor": "npx mkdirp reports && npm run server:dev -- --env.monitor", + "start": "npm run server:dev", + "start:aot": "npm run server:aot:dev", + "test": "npm run lint && npm run test-fast", + "test:ci": "npm run lint && npm run test-fast:ci", + "test-fast": "karma start", + "test-fast:ci": "karma start karma.conf.ci.js", + "tsc": "tsc", + "tslint": "tslint", + "version": "npm run build", + "watch:dev:hmr": "npm run watch:dev -- --hot", + "watch:dev": "npm run build:dev -- --watch", + "watch:aot:dev": "npm run build:aot:dev -- --watch", + "watch:prod": "npm run build:prod -- --watch", + "watch:aot:prod": "npm run build:aot:prod -- --watch", + "watch:test": "npm run test -- --auto-watch --no-single-run", + "watch": "npm run watch:dev", + "webdriver-manager": "node ./node_modules/protractor/bin/webdriver-manager", + "webdriver:start": "node ./node_modules/protractor/bin/webdriver-manager start", + "webdriver:update": "node ./node_modules/protractor/bin/webdriver-manager update", + "webpack-dev-server": "node --max_old_space_size=4096 node_modules/webpack-dev-server/bin/webpack-dev-server.js", + "webpack": "node --max_old_space_size=4096 node_modules/webpack/bin/webpack.js" + }, + "lint-staged": { + "*.{css,js,json,pcss,scss,ts}": [ + "prettier --write", + "git add" + ] + }, + "dependencies": { + "@angular/animations": "6.0.2", + "@angular/cli": "6.0.3", + "@angular/common": "6.0.2", + "@angular/compiler": "6.0.2", + "@angular/compiler-cli": "6.0.2", + "@angular/core": "6.0.2", + "@angular/forms": "6.0.2", + "@angular/platform-browser": "6.0.2", + "@angular/platform-browser-dynamic": "6.0.2", + "@angular/platform-server": "6.0.2", + "@angular/router": "6.0.2", + "@mdi/angular-material": "2.3.54", + "@nationalbankbelgium/stark-core": "file:../dist/packages-dist/stark-core/nationalbankbelgium-stark-core-10.0.0-alpha.2-b0ec6da.tgz", + "@nationalbankbelgium/stark-ui": "file:../dist/packages-dist/stark-ui/nationalbankbelgium-stark-ui-10.0.0-alpha.2-b0ec6da.tgz", + "@uirouter/visualizer": "6.0.0", + "core-js": "2.5.6", + "eligrey-classlist-js-polyfill": "1.2.20180112", + "event-source-polyfill": "0.0.12", + "http-server": "0.11.1", + "ngrx-store-freeze": "0.2.2", + "ngrx-store-logger": "0.2.1", + "reflect-metadata": "0.1.12", + "rxjs": "6.1.0", + "rxjs-compat": "6.1.0", + "web-animations-js": "2.3.1", + "zone.js": "0.8.26" + }, + "devDependencies": { + "@nationalbankbelgium/stark-build": "file:../dist/packages-dist/stark-build/nationalbankbelgium-stark-build-10.0.0-alpha.2-b0ec6da.tgz", + "@nationalbankbelgium/stark-testing": "file:../dist/packages-dist/stark-testing/nationalbankbelgium-stark-testing-10.0.0-alpha.2-b0ec6da.tgz", + "@types/core-js": "0.9.46", + "@types/hammerjs": "2.0.35", + "@types/node": "8.10.15", + "@compodoc/compodoc": "1.1.3", + "cross-env": "^5.1.5", + "find-root": "^1.1.0", + "gh-pages": "1.1.0", + "husky": "0.14.3", + "lint-staged": "7.1.0", + "npm-run-all": "^4.1.3", + "parse5": "^4.0.0", + "protractor": "^5.3.2", + "rimraf": "2.6.2", + "ts-node": "6.0.3", + "tslib": "1.9.1", + "typescript": "2.7.2" + } +} diff --git a/showcase/src/app/app.component.css b/showcase/src/app/app.component.css new file mode 100644 index 0000000000..f1738fba12 --- /dev/null +++ b/showcase/src/app/app.component.css @@ -0,0 +1,9 @@ +html, +body { + height: 100%; + font-family: Arial, Helvetica, sans-serif; +} + +a.active { + background-color: #888; +} diff --git a/showcase/src/app/app.component.html b/showcase/src/app/app.component.html new file mode 100644 index 0000000000..4fe84b226e --- /dev/null +++ b/showcase/src/app/app.component.html @@ -0,0 +1,5 @@ + + +
+ +
diff --git a/showcase/src/app/app.component.spec.ts b/showcase/src/app/app.component.spec.ts new file mode 100644 index 0000000000..32d1f7f2ab --- /dev/null +++ b/showcase/src/app/app.component.spec.ts @@ -0,0 +1,54 @@ +import { NO_ERRORS_SCHEMA } from "@angular/core"; +import { async, TestBed, ComponentFixture } from "@angular/core/testing"; + +/** + * Load the implementations that should be tested + */ +import { AppComponent } from "./app.component"; +import { AppState } from "./app.service"; + +describe(`App`, () => { + let comp: AppComponent; + let fixture: ComponentFixture; + + /** + * async beforeEach + */ + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [AppComponent], + schemas: [NO_ERRORS_SCHEMA], + providers: [AppState] + }) + /** + * Compile template and css + */ + .compileComponents(); + })); + + /** + * Synchronous beforeEach + */ + beforeEach(() => { + fixture = TestBed.createComponent(AppComponent); + comp = fixture.componentInstance; + + /** + * Trigger initial data binding + */ + fixture.detectChanges(); + }); + + it(`should be readly initialized`, () => { + expect(fixture).toBeDefined(); + expect(comp).toBeDefined(); + }); + + it("should log ngOnInit", () => { + spyOn(console, "log"); + expect(console.log).not.toHaveBeenCalled(); + + comp.ngOnInit(); + expect(console.log).toHaveBeenCalled(); + }); +}); diff --git a/showcase/src/app/app.component.ts b/showcase/src/app/app.component.ts new file mode 100644 index 0000000000..08858eb5ba --- /dev/null +++ b/showcase/src/app/app.component.ts @@ -0,0 +1,37 @@ +/** + * Angular 2 decorators and services + */ +import { Component, OnInit, ViewEncapsulation } from "@angular/core"; +import { AppState } from "./app.service"; + +/** + * App Component + * Top Level Component + */ +@Component({ + selector: "app", + /* tslint:disable:use-view-encapsulation */ + encapsulation: ViewEncapsulation.None, + /* tslint:enable */ + styleUrls: ["./app.component.css"], + templateUrl: "./app.component.html" +}) +export class AppComponent implements OnInit { + public appState: AppState; + + public constructor(appState: AppState) { + this.appState = appState; + } + + public ngOnInit(): void { + console.log("Initial App State", this.appState.state); + } +} + +/** + * Please review the https://github.com/AngularClass/angular2-examples/ repo for + * more angular app examples that you may copy/paste + * (The examples may not be updated as quickly. Please open an issue on github for us to update it) + * For help or questions please contact us at @AngularClass on twitter + * or our chat on Slack at https://AngularClass.com/slack-join + */ diff --git a/showcase/src/app/app.e2e.ts b/showcase/src/app/app.e2e.ts new file mode 100644 index 0000000000..1e2b759016 --- /dev/null +++ b/showcase/src/app/app.e2e.ts @@ -0,0 +1,35 @@ +import { browser, by, element } from "protractor"; +/* tslint:disable */ +import "tslib"; + +describe("App", () => { + beforeEach(async () => { + await browser.get("/"); + }); + + it("should have a title", async () => { + const subject = await browser.getTitle(); + const result = "Stark Showcase"; + expect(subject).toEqual(result); + }); + + it("should have header", async () => { + const subject = await element(by.css("h1")).isPresent(); + const result = true; + expect(subject).toEqual(result); + }); + + it("should have ", async () => { + const subject = await element(by.css("app home")).isPresent(); + const result = true; + expect(subject).toEqual(result); + }); + + it("should have buttons", async () => { + const subject = await element(by.css("button")).getText(); + const result = "Submit Value"; + expect(subject).toEqual(result); + }); +}); + +/* tslint:enable */ diff --git a/showcase/src/app/app.module.ts b/showcase/src/app/app.module.ts new file mode 100644 index 0000000000..d2b9766b2d --- /dev/null +++ b/showcase/src/app/app.module.ts @@ -0,0 +1,174 @@ +import { Inject, NgModule, NgModuleFactoryLoader, SystemJsNgModuleLoader } from "@angular/core"; +import { BrowserModule } from "@angular/platform-browser"; +import { FormsModule } from "@angular/forms"; +import { UIRouterModule } from "@uirouter/angular"; +import { NgIdleModule } from "@ng-idle/core"; +import { NgIdleKeepaliveModule } from "@ng-idle/keepalive"; +import { ActionReducer, ActionReducerMap, MetaReducer, StoreModule } from "@ngrx/store"; +import { storeFreeze } from "ngrx-store-freeze"; +import { storeLogger } from "ngrx-store-logger"; +import { BrowserAnimationsModule } from "@angular/platform-browser/animations"; + +import { + STARK_APP_CONFIG, + STARK_APP_METADATA, + STARK_MOCK_DATA, + STARK_SESSION_SERVICE, + StarkApplicationConfig, + StarkApplicationConfigImpl, + StarkApplicationMetadata, + StarkApplicationMetadataImpl, + StarkHttpModule, + StarkLoggingModule, + StarkMockData, + StarkRoutingModule, + StarkSessionModule, + StarkSessionService, + StarkUser +} from "@nationalbankbelgium/stark-core"; + +import { StarkAppLogoModule } from "@nationalbankbelgium/stark-ui"; +import { routerConfigFn } from "./router.config"; +import { Deserialize } from "cerialize"; +/* + * Translations + */ +import { TranslateModule, TranslateService } from "@ngx-translate/core"; +/* + * Platform and Environment providers/directives/pipes + */ +import { environment } from "../environments/environment"; +import { APP_STATES } from "./app.routes"; +// App is our top level component +import { AppComponent } from "./app.component"; +import { AppState } from "./app.service"; +import { HomeComponent } from "./home"; +import { NoContentComponent } from "./no-content"; + +/* tslint:disable:no-import-side-effect */ +// load PCSS styles +import "../styles/styles.pcss"; +// load SASS styles +import "../styles/styles.scss"; +/* tslint:enable */ + +const translationsEn: object = require("../../assets/translations/en.json"); +const translationsFr: object = require("../../assets/translations/fr.json"); +const translationsNl: object = require("../../assets/translations/nl.json"); + +// Application wide providers +const APP_PROVIDERS: any[] = [AppState]; + +// TODO: where to put this factory function? +export function starkAppConfigFactory(): StarkApplicationConfig { + const config: any = require("../stark-app-config.json"); + + const applicationConfig: StarkApplicationConfig = Deserialize(config, StarkApplicationConfigImpl); + + applicationConfig.rootStateUrl = "home"; + applicationConfig.rootStateName = ""; + applicationConfig.homeStateName = "home"; + applicationConfig.errorStateName = ""; + applicationConfig.angularDebugInfoEnabled = true; //DEVELOPMENT; + applicationConfig.debugLoggingEnabled = true; //DEVELOPMENT; + applicationConfig.routerLoggingEnabled = true; //DEVELOPMENT; + + return applicationConfig; +} + +// TODO: where to put this factory function? +export function starkAppMetadataFactory(): StarkApplicationMetadata { + const metadata: any = require("../stark-app-metadata.json"); + + return Deserialize(metadata, StarkApplicationMetadataImpl); +} + +// TODO: where to put this factory function? +export function starkMockDataFactory(): StarkMockData { + return { + whatever: "dummy prop", + profiles: [] + }; +} + +// Application Redux State +export interface State { + // reducer interfaces +} + +export const reducers: ActionReducerMap = { + // reducers +}; + +export function logger(reducer: ActionReducer): any { + // default, no options + return storeLogger()(reducer); +} + +export const metaReducers: MetaReducer[] = !environment.production ? [logger, storeFreeze] : []; + +/** + * `AppModule` is the main entry point into Angular2's bootstrapping process + */ +@NgModule({ + bootstrap: [AppComponent], + declarations: [AppComponent, HomeComponent, NoContentComponent], + /** + * Import Angular's modules. + */ + imports: [ + BrowserModule, + BrowserAnimationsModule, + FormsModule, + StoreModule.forRoot(reducers, { + metaReducers + }), + UIRouterModule.forRoot({ + states: APP_STATES, + useHash: Boolean(history.pushState) === false, + otherwise: { state: "otherwise" }, + config: routerConfigFn + }), + TranslateModule.forRoot(), + NgIdleModule.forRoot(), + NgIdleKeepaliveModule.forRoot(), // FIXME: disabled in stark-app-config.json for now until json-server is integrated + StarkHttpModule.forRoot(), + StarkLoggingModule.forRoot(), + StarkSessionModule.forRoot(), + StarkRoutingModule.forRoot(), + StarkAppLogoModule + ], + /** + * Expose our Services and Providers into Angular's dependency injection. + */ + providers: [ + environment.ENV_PROVIDERS, + APP_PROVIDERS, + { provide: NgModuleFactoryLoader, useClass: SystemJsNgModuleLoader }, // needed for ui-router + { provide: STARK_APP_CONFIG, useFactory: starkAppConfigFactory }, + { provide: STARK_APP_METADATA, useFactory: starkAppMetadataFactory }, + { provide: STARK_MOCK_DATA, useFactory: starkMockDataFactory } + ] +}) +export class AppModule { + public constructor( + private translateService: TranslateService, + @Inject(STARK_SESSION_SERVICE) private sessionService: StarkSessionService + ) { + this.translateService.addLangs(["en", "fr", "nl"]); + this.translateService.setTranslation("en", translationsEn, true); + this.translateService.setTranslation("fr", translationsFr, true); + this.translateService.setTranslation("nl", translationsNl, true); + this.translateService.setDefaultLang("en"); + this.translateService.use("en"); + + const user: StarkUser = { + uuid: "abc123", + username: "John", + firstName: "Doe", + lastName: "Smith", + roles: ["dummy role"] + }; + this.sessionService.login(user); + } +} diff --git a/showcase/src/app/app.routes.ts b/showcase/src/app/app.routes.ts new file mode 100644 index 0000000000..ef2c9363f5 --- /dev/null +++ b/showcase/src/app/app.routes.ts @@ -0,0 +1,9 @@ +import { HomeComponent } from "./home"; +import { NoContentComponent } from "./no-content"; +import { Ng2StateDeclaration } from "@uirouter/angular"; + +export const APP_STATES: Ng2StateDeclaration[] = [ + { name: "index", url: "/", component: HomeComponent }, + { name: "home", url: "/home", component: HomeComponent }, + { name: "otherwise", url: "/otherwise", component: NoContentComponent } +]; diff --git a/showcase/src/app/app.service.ts b/showcase/src/app/app.service.ts new file mode 100644 index 0000000000..3927d86410 --- /dev/null +++ b/showcase/src/app/app.service.ts @@ -0,0 +1,45 @@ +import { Injectable } from "@angular/core"; + +export interface InternalStateType { + [key: string]: any; +} + +@Injectable() +export class AppState { + public _state: InternalStateType = {}; + + /** + * Already return a clone of the current state. + */ + public get state(): any { + return (this._state = this._clone(this._state)); + } + /** + * Never allow mutation + */ + public set state(value: any) { + throw new Error("do not mutate the `.state` directly" + value); + } + + public get(prop?: any): any { + /** + * Use our state getter for the clone. + */ + const state: any = this.state; + return state.hasOwnProperty(prop) ? state[prop] : state; + } + + public set(prop: string, value: any): any { + /** + * Internally mutate our state. + */ + return (this._state[prop] = value); + } + + private _clone(object: InternalStateType): any { + /** + * Simple object clone. + */ + return JSON.parse(JSON.stringify(object)); + } +} diff --git a/showcase/src/app/home/home.component.html b/showcase/src/app/home/home.component.html new file mode 100644 index 0000000000..ad1d113ede --- /dev/null +++ b/showcase/src/app/home/home.component.html @@ -0,0 +1,8 @@ +
+

SHOWCASE.HOME.TITLE

+ +
+ + Coming soon! + +
diff --git a/showcase/src/app/home/home.component.pcss b/showcase/src/app/home/home.component.pcss new file mode 100644 index 0000000000..f3b33aaced --- /dev/null +++ b/showcase/src/app/home/home.component.pcss @@ -0,0 +1,9 @@ +:root { + --my-color: #00f; +} + +div { + & h4 { + color: var(--my-color); + } +} diff --git a/showcase/src/app/home/home.component.spec.ts b/showcase/src/app/home/home.component.spec.ts new file mode 100644 index 0000000000..50d2c5e157 --- /dev/null +++ b/showcase/src/app/home/home.component.spec.ts @@ -0,0 +1,85 @@ +import { NO_ERRORS_SCHEMA } from "@angular/core"; +import { async, ComponentFixture, TestBed } from "@angular/core/testing"; +import { HttpClientTestingModule } from "@angular/common/http/testing"; +import { StoreModule } from "@ngrx/store"; +import { + STARK_APP_CONFIG, + StarkApplicationConfig, + StarkBackend, + StarkBackendAuthenticationTypes, + StarkLoggingService, + STARK_LOGGING_SERVICE, + STARK_HTTP_SERVICE +} from "@nationalbankbelgium/stark-core"; +import { MockStarkHttpService, MockStarkLoggingService } from "@nationalbankbelgium/stark-core/testing"; +/** + * Load the implementations that should be tested. + */ +import { AppState } from "../app.service"; +import { HomeComponent } from "./home.component"; +import SpyObj = jasmine.SpyObj; + +describe(`Home`, () => { + let comp: HomeComponent; + let fixture: ComponentFixture; + let logger: SpyObj; + + const mockBackend: Partial = { + authenticationType: StarkBackendAuthenticationTypes.PUBLIC, + name: "logging", + url: "dummy/url" + }; + + const mockStarkAppConfig: Partial = { + angularDebugInfoEnabled: true, + debugLoggingEnabled: true, + getBackend: jasmine.createSpy("getBackendSpy").and.returnValue(mockBackend) + }; + + /** + * async beforeEach. + */ + beforeEach(async(() => { + return ( + TestBed.configureTestingModule({ + declarations: [HomeComponent], + schemas: [NO_ERRORS_SCHEMA], + imports: [StoreModule.forRoot({}), HttpClientTestingModule], + providers: [ + AppState, + { provide: STARK_APP_CONFIG, useValue: mockStarkAppConfig }, + { provide: STARK_HTTP_SERVICE, useValue: MockStarkHttpService }, + { provide: STARK_LOGGING_SERVICE, useValue: new MockStarkLoggingService() } + ] + }) + + /** + * Compile template and css. + */ + .compileComponents() + ); + })); + + /** + * Synchronous beforeEach. + */ + beforeEach(() => { + logger = TestBed.get(STARK_LOGGING_SERVICE); + + fixture = TestBed.createComponent(HomeComponent); + comp = fixture.componentInstance; + + /** + * Trigger initial data binding. + */ + fixture.detectChanges(); + logger.debug.calls.reset(); + }); + + it("should log ngOnInit", () => { + expect(logger.debug).not.toHaveBeenCalled(); + + comp.ngOnInit(); + expect(logger.debug).toHaveBeenCalled(); + }); +}); diff --git a/showcase/src/app/home/home.component.ts b/showcase/src/app/home/home.component.ts new file mode 100644 index 0000000000..2200b4d12a --- /dev/null +++ b/showcase/src/app/home/home.component.ts @@ -0,0 +1,48 @@ +import { Component, Inject, OnInit } from "@angular/core"; +import { STARK_LOGGING_SERVICE, StarkErrorImpl, StarkLoggingService } from "@nationalbankbelgium/stark-core"; + +import { AppState } from "../app.service"; + +@Component({ + /** + * The selector is what angular internally uses + * for `document.querySelectorAll(selector)` in our index.html + * where, in this case, selector is the string 'home'. + */ + selector: "home", // + /** + * We need to tell Angular's Dependency Injection which providers are in our app. + */ + providers: [], + /** + * Our list of styles in our component. We may add more to compose many styles together. + */ + styleUrls: ["./home.component.pcss"], + /** + * Every Angular template is first compiled by the browser before Angular runs it's compiler. + */ + templateUrl: "./home.component.html" +}) +export class HomeComponent implements OnInit { + public constructor(public appState: AppState, @Inject(STARK_LOGGING_SERVICE) public loggingService: StarkLoggingService) {} + + public ngOnInit(): void { + this.loggingService.debug("hello from `Home` component"); + } + + public logError(): void { + try { + throw new Error("Invoked error"); + } catch (error) { + this.loggingService.error("Logging the Error", error); + } + } + + public logStarkError(): void { + try { + throw new Error("Invoked error"); + } catch (error) { + this.loggingService.error("Logging the StarkError", new StarkErrorImpl(error)); + } + } +} diff --git a/showcase/src/app/home/home.e2e.ts b/showcase/src/app/home/home.e2e.ts new file mode 100644 index 0000000000..8f7e22ab8e --- /dev/null +++ b/showcase/src/app/home/home.e2e.ts @@ -0,0 +1,14 @@ +/* tslint:disable */ +import { browser } from "protractor"; +import "tslib"; + +describe("Home", () => { + beforeEach(async () => { + /** + * Change hash depending on router LocationStrategy. + */ + await browser.get("/#/home"); + }); +}); + +/* tslint:enable */ diff --git a/showcase/src/app/home/index.ts b/showcase/src/app/home/index.ts new file mode 100644 index 0000000000..d7102cdb5a --- /dev/null +++ b/showcase/src/app/home/index.ts @@ -0,0 +1 @@ +export * from "./home.component"; diff --git a/showcase/src/app/index.ts b/showcase/src/app/index.ts new file mode 100644 index 0000000000..26e916e3a9 --- /dev/null +++ b/showcase/src/app/index.ts @@ -0,0 +1,4 @@ +/** + * App + */ +export * from "./app.module"; diff --git a/showcase/src/app/no-content/index.ts b/showcase/src/app/no-content/index.ts new file mode 100644 index 0000000000..c8166be207 --- /dev/null +++ b/showcase/src/app/no-content/index.ts @@ -0,0 +1 @@ +export * from "./no-content.component"; diff --git a/showcase/src/app/no-content/no-content.component.ts b/showcase/src/app/no-content/no-content.component.ts new file mode 100644 index 0000000000..d9a895a584 --- /dev/null +++ b/showcase/src/app/no-content/no-content.component.ts @@ -0,0 +1,9 @@ +import { Component } from "@angular/core"; + +@Component({ + selector: "no-content", + template: `
+

404: page missing

+
` +}) +export class NoContentComponent {} diff --git a/showcase/src/app/router.config.ts b/showcase/src/app/router.config.ts new file mode 100644 index 0000000000..84a6b7cc6b --- /dev/null +++ b/showcase/src/app/router.config.ts @@ -0,0 +1,28 @@ +import { UIRouter, Category, StateDeclaration } from "@uirouter/core"; +import { Visualizer } from "@uirouter/visualizer"; + +function logRegisteredStates(registeredstates: StateDeclaration[]): void { + let message: string = "============= Registered Ui-Router states: ==============\n"; + + for (const state of registeredstates) { + message += "State : " + state.name; + message += " ["; + message += "parent: " + state.parent; + message += ", url: " + state.url; + message += ", abstract: " + state.abstract; + message += "]\n"; + } + message += "======================================================="; + console.log(message); +} + +export function routerConfigFn(router: UIRouter): void { + router.trace.enable(Category.TRANSITION); + router.plugin(Visualizer); + + logRegisteredStates(router.stateService.get()); +} + +export function routerChildConfigFn(router: UIRouter): void { + logRegisteredStates(router.stateService.get()); +} diff --git a/showcase/src/assets/css/.gitkeep b/showcase/src/assets/css/.gitkeep new file mode 100644 index 0000000000..857ef8c4a8 --- /dev/null +++ b/showcase/src/assets/css/.gitkeep @@ -0,0 +1 @@ +@AngularClass diff --git a/showcase/src/assets/humans.txt b/showcase/src/assets/humans.txt new file mode 100644 index 0000000000..ddb649ddec --- /dev/null +++ b/showcase/src/assets/humans.txt @@ -0,0 +1,24 @@ +# humanstxt.org/ +# The humans responsible & technology colophon + +# TEAM + + National Bank of Belgium - https://www.nbb.be + +# THANKS + + We need great developers! Check out https://jobs.nbb.be + +# TECHNOLOGY COLOPHON + Angular + TypeScript + RxJS + Redux + Material Design + Angular Material + ES20xy + HTML5 + CSS3 + Webpack + NodeJS + NPM diff --git a/showcase/src/assets/icon/android-icon-144x144.png b/showcase/src/assets/icon/android-icon-144x144.png new file mode 100644 index 0000000000..90169cb327 Binary files /dev/null and b/showcase/src/assets/icon/android-icon-144x144.png differ diff --git a/showcase/src/assets/icon/android-icon-192x192.png b/showcase/src/assets/icon/android-icon-192x192.png new file mode 100644 index 0000000000..8d05a1944e Binary files /dev/null and b/showcase/src/assets/icon/android-icon-192x192.png differ diff --git a/showcase/src/assets/icon/android-icon-36x36.png b/showcase/src/assets/icon/android-icon-36x36.png new file mode 100644 index 0000000000..924420f3f1 Binary files /dev/null and b/showcase/src/assets/icon/android-icon-36x36.png differ diff --git a/showcase/src/assets/icon/android-icon-48x48.png b/showcase/src/assets/icon/android-icon-48x48.png new file mode 100644 index 0000000000..d8cf8d4f4e Binary files /dev/null and b/showcase/src/assets/icon/android-icon-48x48.png differ diff --git a/showcase/src/assets/icon/android-icon-72x72.png b/showcase/src/assets/icon/android-icon-72x72.png new file mode 100644 index 0000000000..544b26efed Binary files /dev/null and b/showcase/src/assets/icon/android-icon-72x72.png differ diff --git a/showcase/src/assets/icon/android-icon-96x96.png b/showcase/src/assets/icon/android-icon-96x96.png new file mode 100644 index 0000000000..0a346f6dc3 Binary files /dev/null and b/showcase/src/assets/icon/android-icon-96x96.png differ diff --git a/showcase/src/assets/icon/apple-icon-114x114.png b/showcase/src/assets/icon/apple-icon-114x114.png new file mode 100644 index 0000000000..3a41f51f53 Binary files /dev/null and b/showcase/src/assets/icon/apple-icon-114x114.png differ diff --git a/showcase/src/assets/icon/apple-icon-120x120.png b/showcase/src/assets/icon/apple-icon-120x120.png new file mode 100644 index 0000000000..f652ce9533 Binary files /dev/null and b/showcase/src/assets/icon/apple-icon-120x120.png differ diff --git a/showcase/src/assets/icon/apple-icon-144x144.png b/showcase/src/assets/icon/apple-icon-144x144.png new file mode 100644 index 0000000000..90169cb327 Binary files /dev/null and b/showcase/src/assets/icon/apple-icon-144x144.png differ diff --git a/showcase/src/assets/icon/apple-icon-152x152.png b/showcase/src/assets/icon/apple-icon-152x152.png new file mode 100644 index 0000000000..e4b41cd372 Binary files /dev/null and b/showcase/src/assets/icon/apple-icon-152x152.png differ diff --git a/showcase/src/assets/icon/apple-icon-180x180.png b/showcase/src/assets/icon/apple-icon-180x180.png new file mode 100644 index 0000000000..c0c2f99f14 Binary files /dev/null and b/showcase/src/assets/icon/apple-icon-180x180.png differ diff --git a/showcase/src/assets/icon/apple-icon-57x57.png b/showcase/src/assets/icon/apple-icon-57x57.png new file mode 100644 index 0000000000..627459ab3b Binary files /dev/null and b/showcase/src/assets/icon/apple-icon-57x57.png differ diff --git a/showcase/src/assets/icon/apple-icon-60x60.png b/showcase/src/assets/icon/apple-icon-60x60.png new file mode 100644 index 0000000000..f67e8cc1f6 Binary files /dev/null and b/showcase/src/assets/icon/apple-icon-60x60.png differ diff --git a/showcase/src/assets/icon/apple-icon-72x72.png b/showcase/src/assets/icon/apple-icon-72x72.png new file mode 100644 index 0000000000..544b26efed Binary files /dev/null and b/showcase/src/assets/icon/apple-icon-72x72.png differ diff --git a/showcase/src/assets/icon/apple-icon-76x76.png b/showcase/src/assets/icon/apple-icon-76x76.png new file mode 100644 index 0000000000..d203b63397 Binary files /dev/null and b/showcase/src/assets/icon/apple-icon-76x76.png differ diff --git a/showcase/src/assets/icon/apple-icon-precomposed.png b/showcase/src/assets/icon/apple-icon-precomposed.png new file mode 100644 index 0000000000..dbdc793698 Binary files /dev/null and b/showcase/src/assets/icon/apple-icon-precomposed.png differ diff --git a/showcase/src/assets/icon/apple-icon.png b/showcase/src/assets/icon/apple-icon.png new file mode 100644 index 0000000000..dbdc793698 Binary files /dev/null and b/showcase/src/assets/icon/apple-icon.png differ diff --git a/showcase/src/assets/icon/browserconfig.xml b/showcase/src/assets/icon/browserconfig.xml new file mode 100644 index 0000000000..c554148223 --- /dev/null +++ b/showcase/src/assets/icon/browserconfig.xml @@ -0,0 +1,2 @@ + +#ffffff \ No newline at end of file diff --git a/showcase/src/assets/icon/favicon-16x16.png b/showcase/src/assets/icon/favicon-16x16.png new file mode 100644 index 0000000000..e8eec5d788 Binary files /dev/null and b/showcase/src/assets/icon/favicon-16x16.png differ diff --git a/showcase/src/assets/icon/favicon-32x32.png b/showcase/src/assets/icon/favicon-32x32.png new file mode 100644 index 0000000000..ee12264431 Binary files /dev/null and b/showcase/src/assets/icon/favicon-32x32.png differ diff --git a/showcase/src/assets/icon/favicon-96x96.png b/showcase/src/assets/icon/favicon-96x96.png new file mode 100644 index 0000000000..0a346f6dc3 Binary files /dev/null and b/showcase/src/assets/icon/favicon-96x96.png differ diff --git a/showcase/src/assets/icon/favicon.ico b/showcase/src/assets/icon/favicon.ico new file mode 100644 index 0000000000..2239c6c6d6 Binary files /dev/null and b/showcase/src/assets/icon/favicon.ico differ diff --git a/showcase/src/assets/icon/ms-icon-144x144.png b/showcase/src/assets/icon/ms-icon-144x144.png new file mode 100644 index 0000000000..90169cb327 Binary files /dev/null and b/showcase/src/assets/icon/ms-icon-144x144.png differ diff --git a/showcase/src/assets/icon/ms-icon-150x150.png b/showcase/src/assets/icon/ms-icon-150x150.png new file mode 100644 index 0000000000..ac3301e14d Binary files /dev/null and b/showcase/src/assets/icon/ms-icon-150x150.png differ diff --git a/showcase/src/assets/icon/ms-icon-310x310.png b/showcase/src/assets/icon/ms-icon-310x310.png new file mode 100644 index 0000000000..d7e13f0491 Binary files /dev/null and b/showcase/src/assets/icon/ms-icon-310x310.png differ diff --git a/showcase/src/assets/icon/ms-icon-70x70.png b/showcase/src/assets/icon/ms-icon-70x70.png new file mode 100644 index 0000000000..7686baf5b1 Binary files /dev/null and b/showcase/src/assets/icon/ms-icon-70x70.png differ diff --git a/showcase/src/assets/img/angular.png b/showcase/src/assets/img/angular.png new file mode 100644 index 0000000000..9838bd7e9f Binary files /dev/null and b/showcase/src/assets/img/angular.png differ diff --git a/showcase/src/assets/img/tipe.png b/showcase/src/assets/img/tipe.png new file mode 100644 index 0000000000..4939f07061 Binary files /dev/null and b/showcase/src/assets/img/tipe.png differ diff --git a/showcase/src/assets/manifest.json b/showcase/src/assets/manifest.json new file mode 100644 index 0000000000..71d4fd9f82 --- /dev/null +++ b/showcase/src/assets/manifest.json @@ -0,0 +1,35 @@ +{ + "name": "App", + "icons": [ + { + "src": "/assets/icon/android-icon-36x36.png", + "sizes": "36x36", + "type": "image/png" + }, + { + "src": "/assets/icon/android-icon-48x48.png", + "sizes": "48x48", + "type": "image/png" + }, + { + "src": "/assets/icon/android-icon-72x72.png", + "sizes": "72x72", + "type": "image/png" + }, + { + "src": "/assets/icon/android-icon-96x96.png", + "sizes": "96x96", + "type": "image/png" + }, + { + "src": "/assets/icon/android-icon-144x144.png", + "sizes": "144x144", + "type": "image/png" + }, + { + "src": "/assets/icon/android-icon-192x192.png", + "sizes": "192x192", + "type": "image/png" + } + ] +} diff --git a/showcase/src/assets/mock-data/mock-data.json b/showcase/src/assets/mock-data/mock-data.json new file mode 100644 index 0000000000..a8df43b6e5 --- /dev/null +++ b/showcase/src/assets/mock-data/mock-data.json @@ -0,0 +1 @@ +[{ "res": "data" }] diff --git a/starter/src/meta/robots.txt b/showcase/src/assets/robots.txt similarity index 100% rename from starter/src/meta/robots.txt rename to showcase/src/assets/robots.txt diff --git a/showcase/src/assets/service-worker.js b/showcase/src/assets/service-worker.js new file mode 100644 index 0000000000..d35ce1c74e --- /dev/null +++ b/showcase/src/assets/service-worker.js @@ -0,0 +1 @@ +// This file is intentionally without code. diff --git a/showcase/src/custom-typings.d.ts b/showcase/src/custom-typings.d.ts new file mode 100644 index 0000000000..a0fb47a290 --- /dev/null +++ b/showcase/src/custom-typings.d.ts @@ -0,0 +1,122 @@ +/* + * Custom Type Definitions + * When including 3rd party modules you also need to include the type definition for the module + * if they don't provide one within the module. You can try to install it with @types + +npm install @types/node +npm install @types/lodash + + * If you can't find the type definition in the registry we can make an ambient/global definition in + * this file for now. For example + +declare module 'my-module' { + export function doesSomething(value: string): string; +} + + * If you are using a CommonJS module that is using module.exports then you will have to write your + * types using export = yourObjectOrFunction with a namespace above it + * notice how we have to create a namespace that is equal to the function we're + * assigning the export to + +declare module 'jwt-decode' { + function jwtDecode(token: string): any; + namespace jwtDecode {} + export = jwtDecode; +} + + * + * If you're prototying and you will fix the types later you can also declare it as type any + * + +declare var assert: any; +declare var _: any; +declare var $: any; + + * + * If you're importing a module that uses Node.js modules which are CommonJS you need to import as + * in the files such as main.browser.ts or any file within app/ + * + +import * as _ from 'lodash' + + * You can include your type definitions in this file until you create one for the @types + * + */ + +// support NodeJS modules without type definitions +declare module "*"; + +/* +// for legacy tslint etc to understand rename 'modern-lru' with your package +// then comment out `declare module '*';`. For each new module copy/paste +// this method of creating an `any` module type definition +declare module 'modern-lru' { + let x: any; + export = x; +} +*/ + +// Extra variables that live on Global that will be replaced by webpack DefinePlugin +declare var ENV: string; +declare var HMR: boolean; +declare var System: SystemJS; + +interface SystemJS { + import: (path?: string) => Promise; +} + +interface GlobalEnvironment { + ENV: string; + HMR: boolean; + SystemJS: SystemJS; + System: SystemJS; +} + +type Es6PromiseLoader = (id: string) => (exportName?: string) => Promise; + +type FactoryEs6PromiseLoader = () => Es6PromiseLoader; +type FactoryPromise = () => Promise; + +interface AsyncRoutes { + [component: string]: Es6PromiseLoader | Function | FactoryEs6PromiseLoader | FactoryPromise; +} + +type IdleCallbacks = Es6PromiseLoader | Function | FactoryEs6PromiseLoader | FactoryPromise; + +interface WebpackModule { + hot: { + data?: any; + idle: any; + accept(dependencies?: string | string[], callback?: (updatedDependencies?: any) => void): void; + decline(deps?: any | string | string[]): void; + dispose(callback?: (data?: any) => void): void; + addDisposeHandler(callback?: (data?: any) => void): void; + removeDisposeHandler(callback?: (data?: any) => void): void; + check(autoApply?: any, callback?: (err?: Error, outdatedModules?: any[]) => void): void; + apply(options?: any, callback?: (err?: Error, outdatedModules?: any[]) => void): void; + status(callback?: (status?: string) => void): void | string; + removeStatusHandler(callback?: (status?: string) => void): void; + }; +} + +interface WebpackRequire { + (id: string): any; + (paths: string[], callback: (...modules: any[]) => void): void; + ensure(ids: string[], callback: (req: WebpackRequire) => void, chunkName?: string): void; + context(directory: string, useSubDirectories?: boolean, regExp?: RegExp): WebpackContext; +} + +interface WebpackContext extends WebpackRequire { + keys(): string[]; +} + +interface ErrorStackTraceLimit { + stackTraceLimit: number; +} + +// Extend typings +interface NodeRequire extends WebpackRequire {} +interface ErrorConstructor extends ErrorStackTraceLimit {} +interface NodeRequireFunction extends Es6PromiseLoader {} +interface NodeModule extends WebpackModule {} +interface Global extends GlobalEnvironment {} diff --git a/showcase/src/environments/environment.e2e.prod.ts b/showcase/src/environments/environment.e2e.prod.ts new file mode 100644 index 0000000000..b4a1b69a50 --- /dev/null +++ b/showcase/src/environments/environment.e2e.prod.ts @@ -0,0 +1,22 @@ +/* tslint:disable */ +import { enableProdMode, NgModuleRef } from "@angular/core"; +import { disableDebugTools } from "@angular/platform-browser"; +import { Environment } from "./model"; + +enableProdMode(); + +export const environment: Environment = { + production: true, + hmr: false, + + /** Angular debug tools in the dev console + * https://github.com/angular/angular/blob/86405345b781a9dc2438c0fbe3e9409245647019/TOOLS_JS.md + * @param modRef + * + */ + decorateModuleRef(modRef: NgModuleRef) { + disableDebugTools(); + return modRef; + }, + ENV_PROVIDERS: [] +}; diff --git a/showcase/src/environments/environment.hmr.ts b/showcase/src/environments/environment.hmr.ts new file mode 100644 index 0000000000..c348766e76 --- /dev/null +++ b/showcase/src/environments/environment.hmr.ts @@ -0,0 +1,32 @@ +/* tslint:disable */ + +import { ApplicationRef, NgModuleRef } from "@angular/core"; +import { enableDebugTools } from "@angular/platform-browser"; +import { Environment } from "./model"; + +// Ensure that we get detailed stack tracks during development (useful with node & Webpack) +// Reference: http://stackoverflow.com/questions/7697038/more-than-10-lines-in-a-node-js-stack-error +Error.stackTraceLimit = Infinity; +require("zone.js/dist/long-stack-trace-zone"); + +export const environment: Environment = { + production: false, + hmr: true, + + /** Angular debug tools in the dev console + * https://github.com/angular/angular/blob/86405345b781a9dc2438c0fbe3e9409245647019/TOOLS_JS.md + * @param modRef + * + */ + decorateModuleRef(modRef: NgModuleRef) { + const appRef = modRef.injector.get(ApplicationRef); + const cmpRef = appRef.components[0]; + + let _ng = (window).ng; + enableDebugTools(cmpRef); + (window).ng.probe = _ng.probe; + (window).ng.coreTokens = _ng.coreTokens; + return modRef; + }, + ENV_PROVIDERS: [] +}; diff --git a/showcase/src/environments/environment.prod.ts b/showcase/src/environments/environment.prod.ts new file mode 100644 index 0000000000..b4a1b69a50 --- /dev/null +++ b/showcase/src/environments/environment.prod.ts @@ -0,0 +1,22 @@ +/* tslint:disable */ +import { enableProdMode, NgModuleRef } from "@angular/core"; +import { disableDebugTools } from "@angular/platform-browser"; +import { Environment } from "./model"; + +enableProdMode(); + +export const environment: Environment = { + production: true, + hmr: false, + + /** Angular debug tools in the dev console + * https://github.com/angular/angular/blob/86405345b781a9dc2438c0fbe3e9409245647019/TOOLS_JS.md + * @param modRef + * + */ + decorateModuleRef(modRef: NgModuleRef) { + disableDebugTools(); + return modRef; + }, + ENV_PROVIDERS: [] +}; diff --git a/showcase/src/environments/environment.ts b/showcase/src/environments/environment.ts new file mode 100644 index 0000000000..e9d49c61a2 --- /dev/null +++ b/showcase/src/environments/environment.ts @@ -0,0 +1,31 @@ +/* tslint:disable */ + +import { ApplicationRef, NgModuleRef } from "@angular/core"; +import { enableDebugTools } from "@angular/platform-browser"; +import { Environment } from "./model"; + +Error.stackTraceLimit = Infinity; +require("zone.js/dist/long-stack-trace-zone"); + +// export const ENV_FIREBASE_CONFIG: any = FIREBASE_CONFIG; + +export const environment: Environment = { + production: false, + hmr: false, + + /** Angular debug tools in the dev console + * https://github.com/angular/angular/blob/86405345b781a9dc2438c0fbe3e9409245647019/TOOLS_JS.md + * @param modRef + */ + decorateModuleRef(modRef: NgModuleRef) { + const appRef = modRef.injector.get(ApplicationRef); + const cmpRef = appRef.components[0]; + + let _ng = (window).ng; + enableDebugTools(cmpRef); + (window).ng.probe = _ng.probe; + (window).ng.coreTokens = _ng.coreTokens; + return modRef; + }, + ENV_PROVIDERS: [] +}; diff --git a/showcase/src/environments/model.ts b/showcase/src/environments/model.ts new file mode 100644 index 0000000000..547fb293c7 --- /dev/null +++ b/showcase/src/environments/model.ts @@ -0,0 +1,8 @@ +import { NgModuleRef } from "@angular/core"; + +export interface Environment { + production: boolean; + hmr: boolean; + ENV_PROVIDERS: any; + decorateModuleRef(modRef: NgModuleRef): NgModuleRef; +} diff --git a/showcase/src/hmr.ts b/showcase/src/hmr.ts new file mode 100644 index 0000000000..ca135345ba --- /dev/null +++ b/showcase/src/hmr.ts @@ -0,0 +1,18 @@ +// Config from https://github.com/angular/angular-cli/wiki/stories-configure-hmr +// Maybe we should use this: https://github.com/gdi2290/angular-hmr + +import { NgModuleRef, ApplicationRef, ComponentRef } from "@angular/core"; +import { createNewHosts } from "@angularclass/hmr"; + +export const hmrBootstrap: any = (module: any, bootstrap: () => Promise>) => { + let ngModule: NgModuleRef; + module.hot.accept(); + bootstrap().then((mod: NgModuleRef) => (ngModule = mod)); + module.hot.dispose(() => { + const appRef: ApplicationRef = ngModule.injector.get(ApplicationRef); + const elements: ComponentRef[] = appRef.components.map((c: ComponentRef) => c.location.nativeElement); + const makeVisible: () => void = createNewHosts(elements); + ngModule.destroy(); + makeVisible(); + }); +}; diff --git a/showcase/src/index.html b/showcase/src/index.html new file mode 100644 index 0000000000..772520d8fd --- /dev/null +++ b/showcase/src/index.html @@ -0,0 +1,150 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + <%= htmlWebpackPlugin.options.starkAppMetadata.name %> + + + + + + + <% if (htmlWebpackPlugin.options.metadata.IS_DEV_SERVER && htmlWebpackPlugin.options.metadata.HMR !== true) { %> + + + <% } %> + + + <% if (htmlWebpackPlugin.options.dllFiles) { %> + + <% for (let i = 0; i < htmlWebpackPlugin.options.dllFiles.css.length; ++i) { %> + + <% } %> + <% } %> + + + + + + + + + + + + + + + + + + + + + +Loading... + +<% if (htmlWebpackPlugin.options.dllFiles) { %> + +<% for (let i = 0; i < htmlWebpackPlugin.options.dllFiles.js.length; ++i) { %> + +<% } %> +<% } %> + + + + + + diff --git a/showcase/src/main.browser.ts b/showcase/src/main.browser.ts new file mode 100644 index 0000000000..e917b5a69c --- /dev/null +++ b/showcase/src/main.browser.ts @@ -0,0 +1,61 @@ +/* tslint: disable */ +/** + * Angular bootstrapping + */ +import { platformBrowserDynamic } from "@angular/platform-browser-dynamic"; +import { environment } from "./environments/environment"; + +/** + * App Module + * our top level module that holds all of our components + */ +import { AppModule } from "./app"; + +import { hmrBootstrap } from "./hmr"; + +/** + * Bootstrap our Angular app with a top level NgModule + */ +export function main(): Promise { + return platformBrowserDynamic() + .bootstrapModule(AppModule) + .then(environment.decorateModuleRef) + .catch((err: any) => console.error(err)); +} + +/** + * Needed for hmr + * in prod this is replace for document ready + */ +switch (document.readyState) { + case "loading": + document.addEventListener("DOMContentLoaded", _domReadyHandler, false); + break; + case "interactive": + case "complete": + default: + if (environment.hmr) { + if (module["hot"]) { + hmrBootstrap(module, main); + } else { + console.error("HMR is not enabled for webpack-dev-server!"); + } + } else { + main(); + } +} + +function _domReadyHandler(): void { + document.removeEventListener("DOMContentLoaded", _domReadyHandler, false); + if (environment.hmr) { + if (module["hot"]) { + hmrBootstrap(module, main); + } else { + console.error("HMR is not enabled for webpack-dev-server!"); + } + } else { + main(); + } +} + +/* tslint: enable */ diff --git a/showcase/src/polyfills.browser.ts b/showcase/src/polyfills.browser.ts new file mode 100644 index 0000000000..a2bd5d34b8 --- /dev/null +++ b/showcase/src/polyfills.browser.ts @@ -0,0 +1,80 @@ +/** + * This file includes polyfills needed by Angular and is loaded before the app. + * You can add your own extra polyfills to this file. + * + * This file is divided into 2 sections: + * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. + * 2. Application imports. Files imported after ZoneJS that should be loaded before your main + * file. + * + * The current setup is for so-called "evergreen" browsers; the last versions of browsers that + * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), + * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. + * + * Learn more in https://angular.io/guide/browser-support + */ + +/*************************************************************************************************** + * BROWSER POLYFILLS + * + * See: https://angular.io/guide/browser-support#optional-browser-features-to-polyfill + */ + +/** + * IE11 requires all of the following polyfills. + * + * Polyfill: https://github.com/zloirock/core-js + */ +/* tslint:disable:no-import-side-effect */ +import "core-js/es6"; +import "core-js/es7/reflect"; +import "core-js/stage/4"; + +/** + * IE11 and Edge require this to support Server-sent events + * https://caniuse.com/#feat=eventsource + * + * Polyfill: https://github.com/Yaffle/EventSource + */ +import "event-source-polyfill"; + +/** + * IE11 requires Element.classList for NgClass support on SVG elements + * See: https://caniuse.com/#feat=classlist + * + * https://developer.mozilla.org/en-US/docs/Web/API/Element/classList + * https://angular.io/guide/browser-support#classlist + * Polyfill: https://github.com/eligrey/classList.js + */ +import "eligrey-classlist-js-polyfill"; + +/** + * All but Chrome, Firefox and Opera require this to support Web Animations from + * `@angular/animations` and `@angular/platform-browser/animations`. + * See: http://caniuse.com/#feat=web-animation + * + * Polyfill: https://github.com/web-animations/web-animations-js + */ +import "web-animations-js"; + +/*************************************************************************************************** + * Zone JS is required by Angular itself. + */ +// workaround for IE11 before loading zone.ks (see: https://github.com/angular/zone.js/issues/933) +(window as any).__Zone_enable_cross_context_check = true; +import "zone.js/dist/zone"; +// async stack traces with zone.js included for dev +// import 'zone.js/dist/long-stack-trace-zone' +/* tslint:enable */ + +/*************************************************************************************************** + * APPLICATION IMPORTS + */ + +/* tslint:disable:no-all-duplicated-branches */ +if ("production" === ENV) { + // Production +} else { + // Development +} +/* tslint:enable */ diff --git a/showcase/src/stark-app-config.json b/showcase/src/stark-app-config.json new file mode 100644 index 0000000000..8b30715932 --- /dev/null +++ b/showcase/src/stark-app-config.json @@ -0,0 +1,63 @@ +{ + "rootStateUrl": null, + "rootStateName": null, + "homeStateName": null, + "errorStateName": null, + "defaultLanguage": "en", + "logoutUrl": "http://localhost:5001/logout", + "baseUrl": "/", + "sessionTimeout": 1337, + "sessionTimeoutWarningPeriod": 20, + "keepAliveUrl": "http://localhost:5000/keepalive", + "keepAliveInterval": 20, + "keepAliveDisabled": true, + "angularDebugInfoEnabled": null, + "debugLoggingEnabled": null, + "loggingFlushPersistSize": 50, + "loggingFlushApplicationId": "STARK", + "loggingFlushResourceName": "logging", + "routerLoggingEnabled": null, + "publicApp": false, + "backends": { + "default": { + "mock": "json-server", + "name": "default", + "url": "http://localhost:5000", + "authenticationType": 1, + "fakePreAuthenticationEnabled": true, + "fakePreAuthenticationRolePrefix": "", + "loginResource": "", + "token": "" + }, + "userProfile": { + "mock": "json-server", + "name": "userProfile", + "url": "http://localhost:5000", + "authenticationType": 1, + "fakePreAuthenticationEnabled": false, + "fakePreAuthenticationRolePrefix": "", + "loginResource": "", + "token": "" + }, + "logging": { + "mock": "json-server", + "name": "logging", + "url": "http://localhost:5000", + "authenticationType": 1, + "fakePreAuthenticationEnabled": false, + "fakePreAuthenticationRolePrefix": "", + "loginResource": "", + "token": "" + }, + "rbac": { + "mock": "json-server", + "name": "rbac", + "url": "http://localhost:5000", + "authenticationType": 1, + "fakePreAuthenticationEnabled": false, + "fakePreAuthenticationRolePrefix": "", + "loginResource": "", + "token": "" + } + } +} diff --git a/showcase/src/stark-app-metadata.json b/showcase/src/stark-app-metadata.json new file mode 100644 index 0000000000..5c8f1c0b4f --- /dev/null +++ b/showcase/src/stark-app-metadata.json @@ -0,0 +1,9 @@ +{ + "name": "Stark Showcase", + "description": "Stark Showcase application", + "version": "0.0.1", + "environment": "dummy env", + "buildTimestamp": "dummy buildTimestamp", + "deploymentTimestamp": "dummy deploymentTimestamp", + "supportedLanguages": ["en-US", "fr-BE", "nl-BE"] +} diff --git a/showcase/src/styles/_variables.scss b/showcase/src/styles/_variables.scss new file mode 100644 index 0000000000..c15f26f4e5 --- /dev/null +++ b/showcase/src/styles/_variables.scss @@ -0,0 +1 @@ +// ... diff --git a/showcase/src/styles/styles.pcss b/showcase/src/styles/styles.pcss new file mode 100644 index 0000000000..0f6b671f4a --- /dev/null +++ b/showcase/src/styles/styles.pcss @@ -0,0 +1,9 @@ +/* +IMPORTANT: Stark styles are provided as PostCSS styles so they should be imported in a PCSS file! +*/ + +/* Stark variables */ +@import "../../node_modules/@nationalbankbelgium/stark-ui/assets/styles/_variables.pcss"; + +/* Stark components */ +@import "../../node_modules/@nationalbankbelgium/stark-ui/src/modules/app-logo/components/app-logo.component.pcss"; diff --git a/showcase/src/styles/styles.scss b/showcase/src/styles/styles.scss new file mode 100644 index 0000000000..a6af75293a --- /dev/null +++ b/showcase/src/styles/styles.scss @@ -0,0 +1,4 @@ +/* this file will be extracted to main dist folder and is imported in index.html */ +/* This file is for setting global styles */ + +@import "variables"; diff --git a/showcase/tsconfig.app.json b/showcase/tsconfig.app.json new file mode 100644 index 0000000000..343de0966b --- /dev/null +++ b/showcase/tsconfig.app.json @@ -0,0 +1,5 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": {}, + "exclude": ["node_modules", "dist", "src/**/*.spec.ts", "src/**/*.e2e.ts"] +} diff --git a/showcase/tsconfig.json b/showcase/tsconfig.json new file mode 100644 index 0000000000..c3a3954c47 --- /dev/null +++ b/showcase/tsconfig.json @@ -0,0 +1,15 @@ +{ + "extends": "./node_modules/@nationalbankbelgium/stark-build/tsconfig.json", + "compilerOptions": { + "baseUrl": "./src", + "outDir": "./dist", + "declaration": false, + "lib": ["dom", "dom.iterable", "es2017"], + "typeRoots": ["./node_modules/@types"], + "paths": { + "@angular/*": ["../node_modules/@angular/*"], + "@nationalbankbelgium/*": ["../node_modules/@nationalbankbelgium/*"] + } + }, + "exclude": ["node_modules", "dist"] +} diff --git a/showcase/tsconfig.spec.json b/showcase/tsconfig.spec.json new file mode 100644 index 0000000000..2c7b284162 --- /dev/null +++ b/showcase/tsconfig.spec.json @@ -0,0 +1,6 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "module": "commonjs" + } +} diff --git a/showcase/tslint.json b/showcase/tslint.json new file mode 100644 index 0000000000..2dc06ed489 --- /dev/null +++ b/showcase/tslint.json @@ -0,0 +1,12 @@ +{ + "extends": [ + "tslint:latest", + "tslint-sonarts", + "codelyzer", + "tslint-config-prettier", + "./node_modules/@nationalbankbelgium/stark-build/config/tslint.json" + ], + "rules": { + "component-selector": false + } +} diff --git a/showcase/webpack.config.js b/showcase/webpack.config.js new file mode 100644 index 0000000000..08acced29d --- /dev/null +++ b/showcase/webpack.config.js @@ -0,0 +1,21 @@ +/** + * @author: @Stark + */ + +/** + * Look in ./config folder for webpack.dev.js + */ +switch (process.env.NODE_ENV) { + case "prod": + case "production": + module.exports = require("./config/webpack.prod")({ env: "production" }); + break; + case "test": + case "testing": + module.exports = require("./config/webpack.test")({ env: "test" }); + break; + case "dev": + case "development": + default: + module.exports = require("./config/webpack.dev")({ env: "development" }); +} diff --git a/starter/README.md b/starter/README.md index 05193775a8..8eb85bbf3c 100644 --- a/starter/README.md +++ b/starter/README.md @@ -8,14 +8,14 @@ TODO doc; see #32 ## Configuration Most of the configuration files at the root of the starter either fully reuse or extend Stark's configuration files. -Most of the time you won't need to change these. +Most of the time you won't need to change these, but they allow you to customize things when needed. ## Getting Started ### System configuration What you need to run this app: * `node` and `npm` -* Ensure you're running the latest versions Node `v6.x.x`+ (or `v7.x.x` or `v8.x.x`) and NPM `5.6.x`+ +* Ensure you're running the latest versions Node `v8.x.x`+ and NPM `5.8.x`+ > If you have `nvm` installed, which is highly recommended you can do a `nvm install --lts && nvm use` in `$` to run with the latest Node LTS. You can also have this `zsh` done for you [automatically](https://github.com/creationix/nvm#calling-nvm-use-automatically-in-a-directory-with-a-nvmrc-file) @@ -290,6 +290,3 @@ docker run -e VIRTUAL_HOST=stark-starter.your-domain.com --name stark-starter st * node-pre-gyp ERR in npm install (Windows) * install Python x86 version between 2.5 and 3.0 on windows * or try `--no-optional` - -## Support, Questions, or Feedback -> Contact us anytime for anything about this repo or Angular diff --git a/starter/assets-base/README.md b/starter/assets-base/README.md index bad5c84840..189e356b7c 100644 --- a/starter/assets-base/README.md +++ b/starter/assets-base/README.md @@ -1,4 +1,4 @@ -This folder should contain all static assets that should be copied to the root of the application. +This folder should contain all static assets that will be copied to the root of the application. Note that all the contents of this folder will be copied to the ROOT of the target folder. For example, "robots.txt" will be copied to "dist/robots.txt" diff --git a/starter/assets-base/humans.txt b/starter/assets-base/humans.txt index 3adf50bddd..ddb649ddec 100644 --- a/starter/assets-base/humans.txt +++ b/starter/assets-base/humans.txt @@ -10,17 +10,15 @@ We need great developers! Check out https://jobs.nbb.be # TECHNOLOGY COLOPHON - - HTML5 - CSS3 + Angular + TypeScript + RxJS + Redux Material Design Angular Material - Angular - TypeScript ES20xy - Redux - RxJS + HTML5 + CSS3 + Webpack NodeJS NPM - Webpack - diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-black.woff b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-black.woff deleted file mode 100644 index 4eac7f3717..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-black.woff and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-black.woff2 b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-black.woff2 deleted file mode 100644 index eb414c8f3b..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-black.woff2 and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-bold.woff b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-bold.woff deleted file mode 100644 index d2a06e79bf..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-bold.woff and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-bold.woff2 b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-bold.woff2 deleted file mode 100644 index 1c03c097c9..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-bold.woff2 and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-heavy.woff b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-heavy.woff deleted file mode 100644 index ab4a58d324..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-heavy.woff and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-heavy.woff2 b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-heavy.woff2 deleted file mode 100644 index dee91df8e9..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-heavy.woff2 and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-light.woff b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-light.woff deleted file mode 100644 index ad6e662282..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-light.woff and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-light.woff2 b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-light.woff2 deleted file mode 100644 index 269ac1ac15..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-light.woff2 and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-medium.woff b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-medium.woff deleted file mode 100644 index 9efcdd2519..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-medium.woff and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-medium.woff2 b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-medium.woff2 deleted file mode 100644 index ef3861b570..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-medium.woff2 and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-regular.woff b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-regular.woff deleted file mode 100644 index b8aa210a9e..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-regular.woff and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-regular.woff2 b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-regular.woff2 deleted file mode 100644 index 75760fa00e..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-regular.woff2 and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-semibold.woff b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-semibold.woff deleted file mode 100644 index d8aa686fc1..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-semibold.woff and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-semibold.woff2 b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-semibold.woff2 deleted file mode 100644 index 3a709392f9..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-semibold.woff2 and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-thin.woff b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-thin.woff deleted file mode 100644 index 9f6fbe8e40..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-thin.woff and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-thin.woff2 b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-thin.woff2 deleted file mode 100644 index e0ec63d198..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-thin.woff2 and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-ultralight.woff b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-ultralight.woff deleted file mode 100644 index 5b815cee49..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-ultralight.woff and /dev/null differ diff --git a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-ultralight.woff2 b/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-ultralight.woff2 deleted file mode 100644 index b202e65cc1..0000000000 Binary files a/starter/assets/fonts/sanfrancisco/sanfranciscodisplay-ultralight.woff2 and /dev/null differ diff --git a/starter/assets/translations/en.json b/starter/assets/translations/en.json index afaac352ac..e05b14b923 100644 --- a/starter/assets/translations/en.json +++ b/starter/assets/translations/en.json @@ -214,7 +214,7 @@ "STARTER": { "HOME": { - "YOUR_CONTENT": "Your Content Here" + "TITLE": "Stark Starter" } } } diff --git a/starter/assets/translations/fr.json b/starter/assets/translations/fr.json index 762dfd0dc2..484ebf26a1 100644 --- a/starter/assets/translations/fr.json +++ b/starter/assets/translations/fr.json @@ -214,7 +214,7 @@ "STARTER": { "HOME": { - "YOUR_CONTENT": "Votre Contenu Ici" + "TITLE": "Application de démarrage Stark" } } } diff --git a/starter/assets/translations/nl.json b/starter/assets/translations/nl.json index f3001d649a..91239f5ff6 100644 --- a/starter/assets/translations/nl.json +++ b/starter/assets/translations/nl.json @@ -214,7 +214,7 @@ "STARTER": { "HOME": { - "YOUR_CONTENT": "Uw Inhoud Hier" + "TITLE": "Stark Starter applicatie" } } } diff --git a/starter/config/webpack-custom-config.dev.json b/starter/config/webpack-custom-config.dev.json index bfa827b940..8e7f743958 100644 --- a/starter/config/webpack-custom-config.dev.json +++ b/starter/config/webpack-custom-config.dev.json @@ -1,5 +1,5 @@ { "cspConnectSrc": - "http://localhost:5000 http://localhost:5001 http://localhost:5002 http://localhost:4000 ws://stark.prd.nbb http://stark.prd.nbb http://stark.dev.nbb ws://stark.dev.nbb", + "http://localhost:5000 http://localhost:5001 http://localhost:5002 http://localhost:4000", "cspFormAction": "http://localhost:5000/myAwesomeUpload" } diff --git a/starter/karma.conf.ci.js b/starter/karma.conf.ci.js new file mode 100644 index 0000000000..932a88e9b6 --- /dev/null +++ b/starter/karma.conf.ci.js @@ -0,0 +1,4 @@ +/** + * Load karma config from Stark + */ +module.exports = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.ci.js"); diff --git a/starter/karma.conf.js b/starter/karma.conf.js index 6dac432318..591912df55 100644 --- a/starter/karma.conf.js +++ b/starter/karma.conf.js @@ -1,4 +1,4 @@ /** - * Look in ./config for karma.conf.js + * Load karma config from Stark */ -module.exports = require("./node_modules/@nationalbankbelgium/stark-build/config/karma.conf.js"); +module.exports = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.js"); diff --git a/starter/karma.conf.typescript.ci.js b/starter/karma.conf.typescript.ci.js deleted file mode 100644 index 86d5547bae..0000000000 --- a/starter/karma.conf.typescript.ci.js +++ /dev/null @@ -1,4 +0,0 @@ -/** - * Look in ./config for karma.conf.js - */ -module.exports = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.typescript.ci.js"); diff --git a/starter/karma.conf.typescript.js b/starter/karma.conf.typescript.js deleted file mode 100644 index 9d6718b4a1..0000000000 --- a/starter/karma.conf.typescript.js +++ /dev/null @@ -1,4 +0,0 @@ -/** - * Look in ./config for karma.conf.js - */ -module.exports = require("./node_modules/@nationalbankbelgium/stark-testing/karma.conf.typescript.js"); diff --git a/starter/package.json b/starter/package.json index 2e22d49310..bf793dcba1 100644 --- a/starter/package.json +++ b/starter/package.json @@ -5,7 +5,7 @@ "description": "Stark - Starter", "keywords": [ "angular", - "angular5", + "angular6", "webpack", "typescript", "redux", @@ -84,9 +84,10 @@ "start:monitor": "npx mkdirp reports && npm run server:dev -- --env.monitor", "start": "npm run server:dev", "start:aot": "npm run server:aot:dev", - "test": "npm run lint && karma start", - "test-fast": "karma start karma.conf.typescript.js", - "test-fast:ci": "karma start karma.conf.typescript.ci.js", + "test": "npm run lint && npm run test-fast", + "test:ci": "npm run lint && npm run test-fast:ci", + "test-fast": "karma start", + "test-fast:ci": "karma start karma.conf.ci.js", "tsc": "tsc", "tslint": "tslint", "version": "npm run build", @@ -122,8 +123,8 @@ "@angular/platform-server": "6.0.2", "@angular/router": "6.0.2", "@mdi/angular-material": "2.3.54", - "@nationalbankbelgium/stark-core": "file:../dist/packages-dist/stark-core/nationalbankbelgium-stark-core-10.0.0-alpha.2-9f4cd05.tgz", - "@nationalbankbelgium/stark-ui": "file:../dist/packages-dist/stark-ui/nationalbankbelgium-stark-ui-10.0.0-alpha.2-9f4cd05.tgz", + "@nationalbankbelgium/stark-core": "file:../dist/packages-dist/stark-core/nationalbankbelgium-stark-core-10.0.0-alpha.2-b0ec6da.tgz", + "@nationalbankbelgium/stark-ui": "file:../dist/packages-dist/stark-ui/nationalbankbelgium-stark-ui-10.0.0-alpha.2-b0ec6da.tgz", "@uirouter/visualizer": "6.0.0", "core-js": "2.5.6", "eligrey-classlist-js-polyfill": "1.2.20180112", @@ -138,8 +139,8 @@ "zone.js": "0.8.26" }, "devDependencies": { - "@nationalbankbelgium/stark-build": "file:../dist/packages-dist/stark-build/nationalbankbelgium-stark-build-10.0.0-alpha.2-9f4cd05.tgz", - "@nationalbankbelgium/stark-testing": "file:../dist/packages-dist/stark-testing/nationalbankbelgium-stark-testing-10.0.0-alpha.2-9f4cd05.tgz", + "@nationalbankbelgium/stark-build": "file:../dist/packages-dist/stark-build/nationalbankbelgium-stark-build-10.0.0-alpha.2-b0ec6da.tgz", + "@nationalbankbelgium/stark-testing": "file:../dist/packages-dist/stark-testing/nationalbankbelgium-stark-testing-10.0.0-alpha.2-b0ec6da.tgz", "@types/core-js": "0.9.46", "@types/hammerjs": "2.0.35", "@types/node": "8.10.15", diff --git a/starter/src/app/+dev-module/dev-module.component.ts b/starter/src/app/+dev-module/dev-module.component.ts deleted file mode 100644 index e6e0c4531b..0000000000 --- a/starter/src/app/+dev-module/dev-module.component.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { Component, Inject, OnInit } from "@angular/core"; -import { StarkLoggingService, STARK_LOGGING_SERVICE } from "@nationalbankbelgium/stark-core"; - -@Component({ - selector: "dev-module", - template: ` -

Hello from DevModule Component

- ` -}) -export class DevModuleComponent implements OnInit { - public constructor(@Inject(STARK_LOGGING_SERVICE) public loggingService: StarkLoggingService) {} - - public ngOnInit(): void { - this.loggingService.debug("hello from `DevModule` component"); - } -} diff --git a/starter/src/app/+dev-module/dev-module.module.ts b/starter/src/app/+dev-module/dev-module.module.ts deleted file mode 100644 index 41b341b230..0000000000 --- a/starter/src/app/+dev-module/dev-module.module.ts +++ /dev/null @@ -1,28 +0,0 @@ -import { NgModule } from "@angular/core"; -import { CommonModule } from "@angular/common"; -import { Ng2StateDeclaration, UIRouterModule } from "@uirouter/angular"; - -import { DEV_MODULE_STATES } from "./dev-module.routes"; -import { DevModuleComponent } from "./dev-module.component"; -import { routerChildConfigFn } from "../router.config"; - -/* - Don't leave side-effects outside of classes so this will tree-shake nicely on prod - e.g. `console.log('something')` is a side effect. -*/ -@NgModule({ - declarations: [DevModuleComponent], - imports: [ - CommonModule, - UIRouterModule.forChild({ - states: DEV_MODULE_STATES, - config: routerChildConfigFn - }) - ] -}) -export class DevModuleModule { - public static routes: Ng2StateDeclaration[] = DEV_MODULE_STATES; - public constructor() { - console.log("`DevModuleModule` module initialized"); - } -} diff --git a/starter/src/app/+dev-module/dev-module.routes.ts b/starter/src/app/+dev-module/dev-module.routes.ts deleted file mode 100644 index 8cf74d6797..0000000000 --- a/starter/src/app/+dev-module/dev-module.routes.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { DevModuleComponent } from "./dev-module.component"; -import { Ng2StateDeclaration } from "@uirouter/angular"; - -export const DEV_MODULE_STATES: Ng2StateDeclaration[] = [{ name: "devModuleDefault", url: "/dev-module", component: DevModuleComponent }]; diff --git a/starter/src/app/+dev-module/index.ts b/starter/src/app/+dev-module/index.ts deleted file mode 100644 index 757c4dbaf8..0000000000 --- a/starter/src/app/+dev-module/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { DevModuleModule } from "./dev-module.module"; diff --git a/starter/src/app/app.component.html b/starter/src/app/app.component.html index d595980b73..84d87f39d2 100644 --- a/starter/src/app/app.component.html +++ b/starter/src/app/app.component.html @@ -19,10 +19,6 @@ uiSrefActive="active"> About - - DevModule - @@ -34,10 +30,10 @@ 
this.appState.state = {{ appState.state | json }}
diff --git a/starter/src/app/app.component.spec.ts b/starter/src/app/app.component.spec.ts index 7d35ebd3b1..32d1f7f2ab 100644 --- a/starter/src/app/app.component.spec.ts +++ b/starter/src/app/app.component.spec.ts @@ -44,12 +44,6 @@ describe(`App`, () => { expect(comp).toBeDefined(); }); - it(`should be @TipeIO`, () => { - expect(comp.twitter).toEqual("https://twitter.com/gdi2290"); - expect(comp.tipe).toEqual("assets/img/tipe.png"); - expect(comp.name).toEqual("Angular Starter"); - }); - it("should log ngOnInit", () => { spyOn(console, "log"); expect(console.log).not.toHaveBeenCalled(); diff --git a/starter/src/app/app.component.ts b/starter/src/app/app.component.ts index fc94dd39b5..92ab887fb6 100644 --- a/starter/src/app/app.component.ts +++ b/starter/src/app/app.component.ts @@ -2,7 +2,6 @@ * Angular 2 decorators and services */ import { Component, OnInit, ViewEncapsulation } from "@angular/core"; -import { environment } from "../environments/environment"; import { AppState } from "./app.service"; /** @@ -19,10 +18,7 @@ import { AppState } from "./app.service"; }) export class AppComponent implements OnInit { public name: string = "Angular Starter"; - public tipe: string = "assets/img/tipe.png"; - public twitter: string = "https://twitter.com/gdi2290"; - public url: string = "https://tipe.io"; - public showDevModule: boolean = environment.showDevModule; + public url: string = "https://github.com/NationalBankBelgium/stark"; public appState: AppState; diff --git a/starter/src/app/app.e2e.ts b/starter/src/app/app.e2e.ts index 5a9e32c1fc..1e2b759016 100644 --- a/starter/src/app/app.e2e.ts +++ b/starter/src/app/app.e2e.ts @@ -9,7 +9,7 @@ describe("App", () => { it("should have a title", async () => { const subject = await browser.getTitle(); - const result = "Angular Starter by @gdi2290 from @TipeIO"; + const result = "Stark Showcase"; expect(subject).toEqual(result); }); diff --git a/starter/src/app/app.module.ts b/starter/src/app/app.module.ts index 6b52fbaa53..b76b62ea37 100644 --- a/starter/src/app/app.module.ts +++ b/starter/src/app/app.module.ts @@ -45,8 +45,7 @@ import { AppState } from "./app.service"; import { HomeComponent } from "./home"; import { AboutComponent } from "./about"; import { NoContentComponent } from "./no-content"; -import { XLargeDirective } from "./home/x-large"; -import { DevModuleModule } from "./+dev-module"; + /* tslint:disable:no-import-side-effect */ // load PCSS styles import "../styles/styles.pcss"; @@ -115,7 +114,7 @@ export const metaReducers: MetaReducer[] = !environment.production ? [log */ @NgModule({ bootstrap: [AppComponent], - declarations: [AppComponent, AboutComponent, HomeComponent, NoContentComponent, XLargeDirective], + declarations: [AppComponent, AboutComponent, HomeComponent, NoContentComponent], /** * Import Angular's modules. */ @@ -139,14 +138,7 @@ export const metaReducers: MetaReducer[] = !environment.production ? [log StarkLoggingModule.forRoot(), StarkSessionModule.forRoot(), StarkRoutingModule.forRoot(), - StarkAppLogoModule, - - /** - * This section will import the `DevModuleModule` only in certain build types. - * When the module is not imported it will get tree shaked. - * This is a simple example, a big app should probably implement some logic - */ - ...(environment.showDevModule ? [DevModuleModule] : []) + StarkAppLogoModule ], /** * Expose our Services and Providers into Angular's dependency injection. @@ -165,6 +157,7 @@ export class AppModule { private translateService: TranslateService, @Inject(STARK_SESSION_SERVICE) private sessionService: StarkSessionService ) { + // TODO should use StarkLanguages, StarkLanguage, etc this.translateService.addLangs(["en", "fr", "nl"]); this.translateService.setTranslation("en", translationsEn, true); this.translateService.setTranslation("fr", translationsFr, true); diff --git a/starter/src/app/home/home.component.html b/starter/src/app/home/home.component.html index 40b3a5c4ec..7c704df809 100644 --- a/starter/src/app/home/home.component.html +++ b/starter/src/app/home/home.component.html @@ -1,12 +1,5 @@
-

STARTER.HOME.YOUR_CONTENT

- -
- -
- For hot module reloading run - 
npm run start:hmr
-
+

STARTER.HOME.TITLE

diff --git a/starter/src/app/home/home.component.spec.ts b/starter/src/app/home/home.component.spec.ts index 0d4413a584..aa0396be3f 100644 --- a/starter/src/app/home/home.component.spec.ts +++ b/starter/src/app/home/home.component.spec.ts @@ -17,7 +17,6 @@ import { MockStarkHttpService, MockStarkLoggingService } from "@nationalbankbelg */ import { AppState } from "../app.service"; import { HomeComponent } from "./home.component"; -import { Title } from "./title"; import SpyObj = jasmine.SpyObj; describe(`Home`, () => { @@ -48,7 +47,6 @@ describe(`Home`, () => { imports: [StoreModule.forRoot({}), HttpClientTestingModule], providers: [ AppState, - Title, { provide: STARK_APP_CONFIG, useValue: mockStarkAppConfig }, { provide: STARK_HTTP_SERVICE, useValue: MockStarkHttpService }, { provide: STARK_LOGGING_SERVICE, useValue: new MockStarkLoggingService() } @@ -82,10 +80,6 @@ describe(`Home`, () => { expect(comp.localState).toEqual({ value: " " }); }); - it("should have a title", () => { - expect(!!comp.title).toEqual(true); - }); - it("should log ngOnInit", () => { expect(logger.debug).not.toHaveBeenCalled(); diff --git a/starter/src/app/home/home.component.ts b/starter/src/app/home/home.component.ts index 6bdc107327..1c4d52082e 100644 --- a/starter/src/app/home/home.component.ts +++ b/starter/src/app/home/home.component.ts @@ -18,7 +18,6 @@ import { import { Observable } from "rxjs"; import { AppState } from "../app.service"; -import { Title } from "./title"; import { Request } from "./request.entity"; @Component({ @@ -31,7 +30,7 @@ import { Request } from "./request.entity"; /** * We need to tell Angular's Dependency Injection which providers are in our app. */ - providers: [Title], + providers: [], /** * Our list of styles in our component. We may add more to compose many styles together. */ @@ -52,16 +51,12 @@ export class HomeComponent implements OnInit { */ public constructor( public appState: AppState, - public title: Title, @Inject(STARK_HTTP_SERVICE) public httpService: StarkHttpService, @Inject(STARK_LOGGING_SERVICE) public loggingService: StarkLoggingService ) {} public ngOnInit(): void { this.loggingService.debug("hello from `Home` component"); - /** - * this.title.getData().subscribe(data => this.data = data); - */ } public submitState(value: string): void { diff --git a/starter/src/app/home/home.e2e.ts b/starter/src/app/home/home.e2e.ts index 21c9a1c5ed..8f7e22ab8e 100644 --- a/starter/src/app/home/home.e2e.ts +++ b/starter/src/app/home/home.e2e.ts @@ -1,5 +1,5 @@ /* tslint:disable */ -import { browser, by, element } from "protractor"; +import { browser } from "protractor"; import "tslib"; describe("Home", () => { @@ -9,18 +9,6 @@ describe("Home", () => { */ await browser.get("/#/home"); }); - - it("should have a title", async () => { - const subject = await browser.getTitle(); - const result = "Angular Starter by @gdi2290 from @TipeIO"; - expect(subject).toEqual(result); - }); - - it("should have `your content here` x-large", async () => { - const subject = await element(by.css("[x-large]")).getText(); - const result = "Your Content Here"; - expect(subject).toEqual(result); - }); }); /* tslint:enable */ diff --git a/starter/src/app/home/title/index.ts b/starter/src/app/home/title/index.ts deleted file mode 100644 index 986766929f..0000000000 --- a/starter/src/app/home/title/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "./title.service"; diff --git a/starter/src/app/home/title/title.service.spec.ts b/starter/src/app/home/title/title.service.spec.ts deleted file mode 100644 index 1d32822fde..0000000000 --- a/starter/src/app/home/title/title.service.spec.ts +++ /dev/null @@ -1,33 +0,0 @@ -import { inject, TestBed } from "@angular/core/testing"; -import { HttpClientTestingModule } from "@angular/common/http/testing"; -import { Title } from "./title.service"; - -describe("Title", () => { - beforeEach(() => { - TestBed.configureTestingModule({ - imports: [HttpClientTestingModule], - providers: [Title] - }); - }); - - it( - "should have http", - inject([Title], (title: Title) => { - expect(!!title.http).toEqual(true); - }) - ); - - it( - "should get data from the server", - inject([Title], (title: Title) => { - spyOn(console, "log"); - expect(console.log).not.toHaveBeenCalled(); - - title.getData(); - expect(console.log).toHaveBeenCalled(); - title.getData().subscribe((result: any) => { - expect(result).toEqual({ value: "AngularClass" }); - }); - }) - ); -}); diff --git a/starter/src/app/home/title/title.service.ts b/starter/src/app/home/title/title.service.ts deleted file mode 100644 index 06199786f7..0000000000 --- a/starter/src/app/home/title/title.service.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { Injectable } from "@angular/core"; -import { HttpClient } from "@angular/common/http"; -import { Observable } from "rxjs"; - -@Injectable() -export class Title { - public value: string = "Angular 2"; - public http: HttpClient; - - public constructor(http: HttpClient) { - this.http = http; - } - - public getData(): Observable { - console.log("Title#getData(): Get Data"); - return this.http.get("/assets/data.json"); - } -} diff --git a/starter/src/app/home/x-large/index.ts b/starter/src/app/home/x-large/index.ts deleted file mode 100644 index f132e1fb42..0000000000 --- a/starter/src/app/home/x-large/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "./x-large.directive"; diff --git a/starter/src/app/home/x-large/x-large.directive.spec.ts b/starter/src/app/home/x-large/x-large.directive.spec.ts deleted file mode 100644 index d6fcc65903..0000000000 --- a/starter/src/app/home/x-large/x-large.directive.spec.ts +++ /dev/null @@ -1,39 +0,0 @@ -import { By } from "@angular/platform-browser"; -import { fakeAsync, tick, TestBed } from "@angular/core/testing"; -import { Component } from "@angular/core"; - -/** - * Load the implementations that should be tested. - */ -import { XLargeDirective } from "./x-large.directive"; - -describe("x-large directive", () => { - /** - * Create a test component to test directives. - */ - @Component({ - selector: "test", - template: "
Content
" - }) - class TestComponent {} - - beforeEach(() => { - TestBed.configureTestingModule({ - declarations: [XLargeDirective, TestComponent] - }); - }); - - it( - "should sent font-size to x-large", - fakeAsync(() => { - TestBed.compileComponents().then(() => { - const fixture: any = TestBed.createComponent(TestComponent); - fixture.detectChanges(); - tick(); - const element: any = fixture.debugElement.query(By.css("div")); - - expect(element.nativeElement.style.fontSize).toBe("x-large"); - }); - }) - ); -}); diff --git a/starter/src/app/home/x-large/x-large.directive.ts b/starter/src/app/home/x-large/x-large.directive.ts deleted file mode 100644 index c10ba28cb2..0000000000 --- a/starter/src/app/home/x-large/x-large.directive.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { Directive, ElementRef, Renderer } from "@angular/core"; -/** - * Directive - * XLarge is a simple directive to show how one is made - */ -@Directive({ - selector: "[x-large]" // using [ ] means selecting attributes -}) -export class XLargeDirective { - public constructor(element: ElementRef, renderer: Renderer) { - /** - * Simple DOM manipulation to set font size to x-large - * `nativeElement` is the direct reference to the DOM element - * element.nativeElement.style.fontSize = 'x-large'; - * - * for server/webworker support use the renderer - */ - renderer.setElementStyle(element.nativeElement, "fontSize", "x-large"); - } -} diff --git a/starter/src/assets/data.json b/starter/src/assets/data.json deleted file mode 100644 index b566a0bbd0..0000000000 --- a/starter/src/assets/data.json +++ /dev/null @@ -1,3 +0,0 @@ -{ - "value": "AngularClass" -} diff --git a/starter/src/assets/humans.txt b/starter/src/assets/humans.txt index b2d8794194..ddb649ddec 100644 --- a/starter/src/assets/humans.txt +++ b/starter/src/assets/humans.txt @@ -3,15 +3,22 @@ # TEAM - -- -- + National Bank of Belgium - https://www.nbb.be # THANKS - - PatrickJS -- @gdi2290 - AngularClass -- @AngularClass + We need great developers! Check out https://jobs.nbb.be # TECHNOLOGY COLOPHON - - HTML5, CSS3 - Angular2, TypeScript, Webpack + Angular + TypeScript + RxJS + Redux + Material Design + Angular Material + ES20xy + HTML5 + CSS3 + Webpack + NodeJS + NPM diff --git a/starter/src/environments/environment.e2e.prod.ts b/starter/src/environments/environment.e2e.prod.ts index 047b777a3e..b4a1b69a50 100644 --- a/starter/src/environments/environment.e2e.prod.ts +++ b/starter/src/environments/environment.e2e.prod.ts @@ -8,7 +8,6 @@ enableProdMode(); export const environment: Environment = { production: true, hmr: false, - showDevModule: true, /** Angular debug tools in the dev console * https://github.com/angular/angular/blob/86405345b781a9dc2438c0fbe3e9409245647019/TOOLS_JS.md diff --git a/starter/src/environments/environment.hmr.ts b/starter/src/environments/environment.hmr.ts index 048f61b580..c348766e76 100644 --- a/starter/src/environments/environment.hmr.ts +++ b/starter/src/environments/environment.hmr.ts @@ -4,13 +4,14 @@ import { ApplicationRef, NgModuleRef } from "@angular/core"; import { enableDebugTools } from "@angular/platform-browser"; import { Environment } from "./model"; +// Ensure that we get detailed stack tracks during development (useful with node & Webpack) +// Reference: http://stackoverflow.com/questions/7697038/more-than-10-lines-in-a-node-js-stack-error Error.stackTraceLimit = Infinity; require("zone.js/dist/long-stack-trace-zone"); export const environment: Environment = { production: false, hmr: true, - showDevModule: true, /** Angular debug tools in the dev console * https://github.com/angular/angular/blob/86405345b781a9dc2438c0fbe3e9409245647019/TOOLS_JS.md diff --git a/starter/src/environments/environment.prod.ts b/starter/src/environments/environment.prod.ts index f53ac48a2c..b4a1b69a50 100644 --- a/starter/src/environments/environment.prod.ts +++ b/starter/src/environments/environment.prod.ts @@ -8,7 +8,6 @@ enableProdMode(); export const environment: Environment = { production: true, hmr: false, - showDevModule: false, /** Angular debug tools in the dev console * https://github.com/angular/angular/blob/86405345b781a9dc2438c0fbe3e9409245647019/TOOLS_JS.md diff --git a/starter/src/environments/environment.ts b/starter/src/environments/environment.ts index 90e1540b52..c6103aafa5 100644 --- a/starter/src/environments/environment.ts +++ b/starter/src/environments/environment.ts @@ -4,6 +4,8 @@ import { ApplicationRef, NgModuleRef } from "@angular/core"; import { enableDebugTools } from "@angular/platform-browser"; import { Environment } from "./model"; +// Ensure that we get detailed stack tracks during development (useful with node & Webpack) +// Reference: http://stackoverflow.com/questions/7697038/more-than-10-lines-in-a-node-js-stack-error Error.stackTraceLimit = Infinity; require("zone.js/dist/long-stack-trace-zone"); @@ -12,7 +14,6 @@ require("zone.js/dist/long-stack-trace-zone"); export const environment: Environment = { production: false, hmr: false, - showDevModule: true, /** Angular debug tools in the dev console * https://github.com/angular/angular/blob/86405345b781a9dc2438c0fbe3e9409245647019/TOOLS_JS.md diff --git a/starter/src/environments/model.ts b/starter/src/environments/model.ts index 082b4c2840..547fb293c7 100644 --- a/starter/src/environments/model.ts +++ b/starter/src/environments/model.ts @@ -4,6 +4,5 @@ export interface Environment { production: boolean; hmr: boolean; ENV_PROVIDERS: any; - showDevModule: boolean; decorateModuleRef(modRef: NgModuleRef): NgModuleRef; } diff --git a/starter/src/index.html b/starter/src/index.html index fd23e7b2ac..772520d8fd 100644 --- a/starter/src/index.html +++ b/starter/src/index.html @@ -1,39 +1,150 @@ - + - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - + - <%= htmlWebpackPlugin.options.starkAppMetadata.name %> + + + - <% if (htmlWebpackPlugin.options.metadata.isDevServer && htmlWebpackPlugin.options.metadata.HMR !== true) { %> - - - <% } %> + + + + + + + + + + + + + + + - - + <%= htmlWebpackPlugin.options.starkAppMetadata.name %> + + + + + + <% if (htmlWebpackPlugin.options.metadata.IS_DEV_SERVER && htmlWebpackPlugin.options.metadata.HMR !== true) { %> + + + <% } %> + + + <% if (htmlWebpackPlugin.options.dllFiles) { %> + + <% for (let i = 0; i < htmlWebpackPlugin.options.dllFiles.css.length; ++i) { %> + + <% } %> + <% } %> + + + + + + + + + + + + + + + + + + + - +Loading... - - Loading... - +<% if (htmlWebpackPlugin.options.dllFiles) { %> + +<% for (let i = 0; i < htmlWebpackPlugin.options.dllFiles.js.length; ++i) { %> + +<% } %> +<% } %> - + + + diff --git a/starter/src/meta/humans.txt b/starter/src/meta/humans.txt deleted file mode 100644 index b2d8794194..0000000000 --- a/starter/src/meta/humans.txt +++ /dev/null @@ -1,17 +0,0 @@ -# humanstxt.org/ -# The humans responsible & technology colophon - -# TEAM - - -- -- - -# THANKS - - - PatrickJS -- @gdi2290 - AngularClass -- @AngularClass - -# TECHNOLOGY COLOPHON - - HTML5, CSS3 - Angular2, TypeScript, Webpack diff --git a/starter/src/stark-app-metadata.json b/starter/src/stark-app-metadata.json index 184f8cdba8..feb12a2c2d 100644 --- a/starter/src/stark-app-metadata.json +++ b/starter/src/stark-app-metadata.json @@ -1,6 +1,6 @@ { - "name": "Stark Demo", - "description": "Stark Demo application", + "name": "Stark Starter", + "description": "Stark Starter application", "version": "0.0.1", "environment": "dummy env", "buildTimestamp": "dummy buildTimestamp", diff --git a/starter/src/styles/styles.pcss b/starter/src/styles/styles.pcss index d3bbc0ce2d..0f6b671f4a 100644 --- a/starter/src/styles/styles.pcss +++ b/starter/src/styles/styles.pcss @@ -1,5 +1,5 @@ /* -IMPORTANT: Stark styles are provided was PostCSS styles so they should be imported in a PCSS file! +IMPORTANT: Stark styles are provided as PostCSS styles so they should be imported in a PCSS file! */ /* Stark variables */