From d4b5191d6448b96f721c053685763480f2020c09 Mon Sep 17 00:00:00 2001 From: Chris Veilleux Date: Thu, 20 Dec 2018 13:54:15 -0600 Subject: [PATCH] added a library application to build a standard 404 (page not found) page --- frontend/internet/angular.json | 85 +++++++++++++------ .../market/src/app/app-routing.module.ts | 2 +- .../market/src/app/app.component.scss | 6 -- .../projects/market/src/app/app.module.ts | 2 + .../projects/page-not-found/karma.conf.js | 31 +++++++ .../projects/page-not-found/ng-package.json | 8 ++ .../projects/page-not-found/package.json | 8 ++ .../src/lib/mycroft-not-found-logo.svg | 1 + .../src/lib/page-not-found.component.html | 9 ++ .../src/lib/page-not-found.component.scss | 22 +++++ .../src/lib/page-not-found.component.ts | 16 ++++ .../src/lib/page-not-found.module.ts | 19 +++++ .../src/lib/page-not-found.service.ts | 9 ++ .../projects/page-not-found/src/public_api.ts | 7 ++ .../projects/page-not-found/src/test.ts | 22 +++++ .../projects/page-not-found/tsconfig.lib.json | 32 +++++++ .../page-not-found/tsconfig.spec.json | 17 ++++ .../projects/page-not-found/tslint.json | 17 ++++ .../sso/src/app/app-routing.module.ts | 4 +- .../projects/sso/src/app/app.module.ts | 2 + frontend/internet/tsconfig.json | 6 ++ 21 files changed, 291 insertions(+), 34 deletions(-) create mode 100644 frontend/internet/projects/page-not-found/karma.conf.js create mode 100644 frontend/internet/projects/page-not-found/ng-package.json create mode 100644 frontend/internet/projects/page-not-found/package.json create mode 100644 frontend/internet/projects/page-not-found/src/lib/mycroft-not-found-logo.svg create mode 100644 frontend/internet/projects/page-not-found/src/lib/page-not-found.component.html create mode 100644 frontend/internet/projects/page-not-found/src/lib/page-not-found.component.scss create mode 100644 frontend/internet/projects/page-not-found/src/lib/page-not-found.component.ts create mode 100644 frontend/internet/projects/page-not-found/src/lib/page-not-found.module.ts create mode 100644 frontend/internet/projects/page-not-found/src/lib/page-not-found.service.ts create mode 100644 frontend/internet/projects/page-not-found/src/public_api.ts create mode 100644 frontend/internet/projects/page-not-found/src/test.ts create mode 100644 frontend/internet/projects/page-not-found/tsconfig.lib.json create mode 100644 frontend/internet/projects/page-not-found/tsconfig.spec.json create mode 100644 frontend/internet/projects/page-not-found/tslint.json diff --git a/frontend/internet/angular.json b/frontend/internet/angular.json index 6317d168..bbd80c9d 100644 --- a/frontend/internet/angular.json +++ b/frontend/internet/angular.json @@ -30,9 +30,9 @@ "src/styles.scss" ], "stylePreprocessorOptions": { - "includePaths": [ - "./src/stylesheets" - ] + "includePaths": [ + "./src/stylesheets" + ] }, "scripts": [] }, @@ -91,9 +91,9 @@ "src/styles.scss" ], "stylePreprocessorOptions": { - "includePaths": [ - "./src/stylesheets" - ] + "includePaths": [ + "./src/stylesheets" + ] }, "scripts": [], "assets": [ @@ -190,9 +190,9 @@ "src/styles.scss" ], "stylePreprocessorOptions": { - "includePaths": [ - "./src/stylesheets" - ] + "includePaths": [ + "./src/stylesheets" + ] }, "scripts": [] }, @@ -267,9 +267,9 @@ "src/styles.scss" ], "stylePreprocessorOptions": { - "includePaths": [ - "./src/stylesheets" - ] + "includePaths": [ + "./src/stylesheets" + ] }, "scripts": [], "assets": [ @@ -366,9 +366,9 @@ "src/styles.scss" ], "stylePreprocessorOptions": { - "includePaths": [ - "./src/stylesheets" - ] + "includePaths": [ + "./src/stylesheets" + ] }, "scripts": [] }, @@ -443,9 +443,9 @@ "src/styles.scss" ], "stylePreprocessorOptions": { - "includePaths": [ - "./src/stylesheets" - ] + "includePaths": [ + "./src/stylesheets" + ] }, "scripts": [], "assets": [ @@ -577,9 +577,9 @@ "src/styles.scss" ], "stylePreprocessorOptions": { - "includePaths": [ - "./src/stylesheets" - ] + "includePaths": [ + "./src/stylesheets" + ] }, "scripts": [] }, @@ -638,9 +638,9 @@ "src/styles.scss" ], "stylePreprocessorOptions": { - "includePaths": [ - "./src/stylesheets" - ] + "includePaths": [ + "./src/stylesheets" + ] }, "scripts": [], "assets": [ @@ -690,7 +690,42 @@ } } } + }, + "page-not-found": { + "root": "projects/page-not-found", + "sourceRoot": "projects/page-not-found/src", + "projectType": "library", + "prefix": "lib", + "architect": { + "build": { + "builder": "@angular-devkit/build-ng-packagr:build", + "options": { + "tsConfig": "projects/page-not-found/tsconfig.lib.json", + "project": "projects/page-not-found/ng-package.json" + } + }, + "test": { + "builder": "@angular-devkit/build-angular:karma", + "options": { + "main": "projects/page-not-found/src/test.ts", + "tsConfig": "projects/page-not-found/tsconfig.spec.json", + "karmaConfig": "projects/page-not-found/karma.conf.js" + } + }, + "lint": { + "builder": "@angular-devkit/build-angular:tslint", + "options": { + "tsConfig": [ + "projects/page-not-found/tsconfig.lib.json", + "projects/page-not-found/tsconfig.spec.json" + ], + "exclude": [ + "**/node_modules/**" + ] + } + } + } } }, "defaultProject": "internet" -} +} \ No newline at end of file diff --git a/frontend/internet/projects/market/src/app/app-routing.module.ts b/frontend/internet/projects/market/src/app/app-routing.module.ts index 89a3a989..81b3ef9c 100644 --- a/frontend/internet/projects/market/src/app/app-routing.module.ts +++ b/frontend/internet/projects/market/src/app/app-routing.module.ts @@ -1,7 +1,7 @@ import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; -import { PageNotFoundComponent } from './page-not-found/page-not-found.component'; +import { PageNotFoundComponent } from 'page-not-found'; const routes: Routes = [ { path: '', redirectTo: '/skills', pathMatch: 'full' }, diff --git a/frontend/internet/projects/market/src/app/app.component.scss b/frontend/internet/projects/market/src/app/app.component.scss index 9065c29c..f2a75187 100644 --- a/frontend/internet/projects/market/src/app/app.component.scss +++ b/frontend/internet/projects/market/src/app/app.component.scss @@ -1,9 +1,3 @@ -#app-body { - margin-left: 3vw; - margin-right: 3vw; - margin-top: 30px; -} - img { height: 20px; margin-top: -7px; diff --git a/frontend/internet/projects/market/src/app/app.module.ts b/frontend/internet/projects/market/src/app/app.module.ts index 3b3f8e99..ad89267d 100644 --- a/frontend/internet/projects/market/src/app/app.module.ts +++ b/frontend/internet/projects/market/src/app/app.module.ts @@ -7,6 +7,7 @@ import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { AppService } from './app.service'; import { GlobalnavModule } from 'globalnav'; +import { PageNotFoundModule } from 'page-not-found'; import { MaterialModule } from './shared/material.module'; import { SkillsModule } from './skills/skills.module'; import { PageNotFoundComponent } from './page-not-found/page-not-found.component'; @@ -20,6 +21,7 @@ import { PageNotFoundComponent } from './page-not-found/page-not-found.component GlobalnavModule, HttpClientModule, MaterialModule, + PageNotFoundModule, SkillsModule, AppRoutingModule ], diff --git a/frontend/internet/projects/page-not-found/karma.conf.js b/frontend/internet/projects/page-not-found/karma.conf.js new file mode 100644 index 00000000..4c5f8d03 --- /dev/null +++ b/frontend/internet/projects/page-not-found/karma.conf.js @@ -0,0 +1,31 @@ +// Karma configuration file, see link for more information +// https://karma-runner.github.io/1.0/config/configuration-file.html + +module.exports = function (config) { + config.set({ + basePath: '', + frameworks: ['jasmine', '@angular-devkit/build-angular'], + plugins: [ + require('karma-jasmine'), + require('karma-chrome-launcher'), + require('karma-jasmine-html-reporter'), + require('karma-coverage-istanbul-reporter'), + require('@angular-devkit/build-angular/plugins/karma') + ], + client: { + clearContext: false // leave Jasmine Spec Runner output visible in browser + }, + coverageIstanbulReporter: { + dir: require('path').join(__dirname, '../../coverage'), + reports: ['html', 'lcovonly'], + fixWebpackSourcePaths: true + }, + reporters: ['progress', 'kjhtml'], + port: 9876, + colors: true, + logLevel: config.LOG_INFO, + autoWatch: true, + browsers: ['Chrome'], + singleRun: false + }); +}; diff --git a/frontend/internet/projects/page-not-found/ng-package.json b/frontend/internet/projects/page-not-found/ng-package.json new file mode 100644 index 00000000..f9a5f621 --- /dev/null +++ b/frontend/internet/projects/page-not-found/ng-package.json @@ -0,0 +1,8 @@ +{ + "$schema": "../../node_modules/ng-packagr/ng-package.schema.json", + "dest": "../../dist/page-not-found", + "lib": { + "entryFile": "src/public_api.ts", + "cssUrl": "inline" + } +} diff --git a/frontend/internet/projects/page-not-found/package.json b/frontend/internet/projects/page-not-found/package.json new file mode 100644 index 00000000..f84228d5 --- /dev/null +++ b/frontend/internet/projects/page-not-found/package.json @@ -0,0 +1,8 @@ +{ + "name": "page-not-found", + "version": "0.0.1", + "peerDependencies": { + "@angular/common": "^7.0.0", + "@angular/core": "^7.0.0" + } +} \ No newline at end of file diff --git a/frontend/internet/projects/page-not-found/src/lib/mycroft-not-found-logo.svg b/frontend/internet/projects/page-not-found/src/lib/mycroft-not-found-logo.svg new file mode 100644 index 00000000..7d4747a6 --- /dev/null +++ b/frontend/internet/projects/page-not-found/src/lib/mycroft-not-found-logo.svg @@ -0,0 +1 @@ +Artboard 4 \ No newline at end of file diff --git a/frontend/internet/projects/page-not-found/src/lib/page-not-found.component.html b/frontend/internet/projects/page-not-found/src/lib/page-not-found.component.html new file mode 100644 index 00000000..ca3db4a9 --- /dev/null +++ b/frontend/internet/projects/page-not-found/src/lib/page-not-found.component.html @@ -0,0 +1,9 @@ +
+
+
PAGE NOT FOUND
+ +
+ +
+
+
diff --git a/frontend/internet/projects/page-not-found/src/lib/page-not-found.component.scss b/frontend/internet/projects/page-not-found/src/lib/page-not-found.component.scss new file mode 100644 index 00000000..660fb39f --- /dev/null +++ b/frontend/internet/projects/page-not-found/src/lib/page-not-found.component.scss @@ -0,0 +1,22 @@ +#page-not-found-bg { + background-color: #22a7f0; + height: 100vh; +} + +#page-not-found-fg { + .mat-h1 { + font-size: 32px; + font-weight: bold; + } + .page-not-found-logo { + background: url("mycroft-not-found-logo.svg") no-repeat; + height: 200px; + width: 200px; + } + + .back-button { + background-color: #2c3e50; + color: white; + } +} + diff --git a/frontend/internet/projects/page-not-found/src/lib/page-not-found.component.ts b/frontend/internet/projects/page-not-found/src/lib/page-not-found.component.ts new file mode 100644 index 00000000..11db797e --- /dev/null +++ b/frontend/internet/projects/page-not-found/src/lib/page-not-found.component.ts @@ -0,0 +1,16 @@ +import { Component} from '@angular/core'; + +@Component({ + selector: 'lib-page-not-found', + templateUrl: './page-not-found.component.html', + styleUrls: ['./page-not-found.component.scss'] +}) +export class PageNotFoundComponent { + + constructor() { } + + navigateBack() { + window.history.back(); + } + +} diff --git a/frontend/internet/projects/page-not-found/src/lib/page-not-found.module.ts b/frontend/internet/projects/page-not-found/src/lib/page-not-found.module.ts new file mode 100644 index 00000000..81a5d6e8 --- /dev/null +++ b/frontend/internet/projects/page-not-found/src/lib/page-not-found.module.ts @@ -0,0 +1,19 @@ +import { NgModule } from '@angular/core'; +import { FlexLayoutModule } from '@angular/flex-layout'; +import { MatButtonModule } from '@angular/material'; + +import { PageNotFoundComponent } from './page-not-found.component'; + +@NgModule({ + imports: [ + FlexLayoutModule, + MatButtonModule + ], + declarations: [ + PageNotFoundComponent + ], + exports: [ + PageNotFoundComponent + ] +}) +export class PageNotFoundModule { } diff --git a/frontend/internet/projects/page-not-found/src/lib/page-not-found.service.ts b/frontend/internet/projects/page-not-found/src/lib/page-not-found.service.ts new file mode 100644 index 00000000..f5ec6691 --- /dev/null +++ b/frontend/internet/projects/page-not-found/src/lib/page-not-found.service.ts @@ -0,0 +1,9 @@ +import { Injectable } from '@angular/core'; + +@Injectable({ + providedIn: 'root' +}) +export class PageNotFoundService { + + constructor() { } +} diff --git a/frontend/internet/projects/page-not-found/src/public_api.ts b/frontend/internet/projects/page-not-found/src/public_api.ts new file mode 100644 index 00000000..bf866994 --- /dev/null +++ b/frontend/internet/projects/page-not-found/src/public_api.ts @@ -0,0 +1,7 @@ +/* + * Public API Surface of page-not-found + */ + +export * from './lib/page-not-found.service'; +export * from './lib/page-not-found.component'; +export * from './lib/page-not-found.module'; diff --git a/frontend/internet/projects/page-not-found/src/test.ts b/frontend/internet/projects/page-not-found/src/test.ts new file mode 100644 index 00000000..e11ff1c9 --- /dev/null +++ b/frontend/internet/projects/page-not-found/src/test.ts @@ -0,0 +1,22 @@ +// This file is required by karma.conf.js and loads recursively all the .spec and framework files + +import 'core-js/es7/reflect'; +import 'zone.js/dist/zone'; +import 'zone.js/dist/zone-testing'; +import { getTestBed } from '@angular/core/testing'; +import { + BrowserDynamicTestingModule, + platformBrowserDynamicTesting +} from '@angular/platform-browser-dynamic/testing'; + +declare const require: any; + +// First, initialize the Angular testing environment. +getTestBed().initTestEnvironment( + BrowserDynamicTestingModule, + platformBrowserDynamicTesting() +); +// Then we find all the tests. +const context = require.context('./', true, /\.spec\.ts$/); +// And load the modules. +context.keys().map(context); diff --git a/frontend/internet/projects/page-not-found/tsconfig.lib.json b/frontend/internet/projects/page-not-found/tsconfig.lib.json new file mode 100644 index 00000000..3fe337fc --- /dev/null +++ b/frontend/internet/projects/page-not-found/tsconfig.lib.json @@ -0,0 +1,32 @@ +{ + "extends": "../../tsconfig.json", + "compilerOptions": { + "outDir": "../../out-tsc/lib", + "target": "es2015", + "module": "es2015", + "moduleResolution": "node", + "declaration": true, + "sourceMap": true, + "inlineSources": true, + "emitDecoratorMetadata": true, + "experimentalDecorators": true, + "importHelpers": true, + "types": [], + "lib": [ + "dom", + "es2018" + ] + }, + "angularCompilerOptions": { + "annotateForClosureCompiler": true, + "skipTemplateCodegen": true, + "strictMetadataEmit": true, + "fullTemplateTypeCheck": true, + "strictInjectionParameters": true, + "enableResourceInlining": true + }, + "exclude": [ + "src/test.ts", + "**/*.spec.ts" + ] +} diff --git a/frontend/internet/projects/page-not-found/tsconfig.spec.json b/frontend/internet/projects/page-not-found/tsconfig.spec.json new file mode 100644 index 00000000..16da33db --- /dev/null +++ b/frontend/internet/projects/page-not-found/tsconfig.spec.json @@ -0,0 +1,17 @@ +{ + "extends": "../../tsconfig.json", + "compilerOptions": { + "outDir": "../../out-tsc/spec", + "types": [ + "jasmine", + "node" + ] + }, + "files": [ + "src/test.ts" + ], + "include": [ + "**/*.spec.ts", + "**/*.d.ts" + ] +} diff --git a/frontend/internet/projects/page-not-found/tslint.json b/frontend/internet/projects/page-not-found/tslint.json new file mode 100644 index 00000000..73f120b7 --- /dev/null +++ b/frontend/internet/projects/page-not-found/tslint.json @@ -0,0 +1,17 @@ +{ + "extends": "../../tslint.json", + "rules": { + "directive-selector": [ + true, + "attribute", + "lib", + "camelCase" + ], + "component-selector": [ + true, + "element", + "lib", + "kebab-case" + ] + } +} diff --git a/frontend/internet/projects/sso/src/app/app-routing.module.ts b/frontend/internet/projects/sso/src/app/app-routing.module.ts index 5b43cc38..fee4d789 100644 --- a/frontend/internet/projects/sso/src/app/app-routing.module.ts +++ b/frontend/internet/projects/sso/src/app/app-routing.module.ts @@ -3,13 +3,13 @@ import { Routes, RouterModule } from '@angular/router'; import { LoginComponent } from './login/login.component'; import { LogoutComponent } from './logout/logout.component'; -// import { PageNotFoundComponent } from './page-not-found/page-not-found.component'; +import { PageNotFoundComponent } from 'page-not-found'; const routes: Routes = [ { path: 'login', component: LoginComponent }, { path: 'logout', component: LogoutComponent }, { path: '', redirectTo: '/login', pathMatch: 'full' }, - // { path: '**', component: PageNotFoundComponent } + { path: '**', component: PageNotFoundComponent } ]; @NgModule({ diff --git a/frontend/internet/projects/sso/src/app/app.module.ts b/frontend/internet/projects/sso/src/app/app.module.ts index d3bea46f..2f80fc07 100644 --- a/frontend/internet/projects/sso/src/app/app.module.ts +++ b/frontend/internet/projects/sso/src/app/app.module.ts @@ -8,6 +8,7 @@ import { AppRoutingModule } from './app-routing.module'; import { BackgroundModule } from './background/background.module'; import { LoginModule } from './login/login.module'; import { LogoutModule } from './logout/logout.module'; +import { PageNotFoundModule } from 'page-not-found'; @NgModule({ declarations: [ AppComponent ], @@ -18,6 +19,7 @@ import { LogoutModule } from './logout/logout.module'; FlexLayoutModule, LoginModule, LogoutModule, + PageNotFoundModule, AppRoutingModule ], providers: [ ], diff --git a/frontend/internet/tsconfig.json b/frontend/internet/tsconfig.json index b15f9d7e..a3b524ac 100644 --- a/frontend/internet/tsconfig.json +++ b/frontend/internet/tsconfig.json @@ -23,6 +23,12 @@ ], "globalnav/*": [ "dist/globalnav/*" + ], + "page-not-found": [ + "dist/page-not-found" + ], + "page-not-found/*": [ + "dist/page-not-found/*" ] } }