From 61d4139956eca33fbdcd26eb9b073f6a9540e29d Mon Sep 17 00:00:00 2001 From: Dmitry Nehaychik <4dmitr@gmail.com> Date: Thu, 14 Jun 2018 15:09:51 +0300 Subject: [PATCH] feat(docs): use path-location instead of hash --- angular.json | 93 +------------------ docs/404.html | 20 ++++ .../components/footer/footer.component.html | 2 +- docs/app/app.module.ts | 5 +- .../components-overview-block.component.html | 2 +- .../live-example-block.component.html | 2 +- .../live-example-block.component.ts | 29 +++--- docs/assets/ghspa.js | 54 +++++++++++ docs/environments/environment.prod.ts | 1 - docs/environments/environment.ts | 1 - docs/index.html | 2 +- package.json | 5 +- 12 files changed, 101 insertions(+), 115 deletions(-) create mode 100644 docs/404.html create mode 100644 docs/assets/ghspa.js diff --git a/angular.json b/angular.json index d927a8f5d2..0d34d7df60 100644 --- a/angular.json +++ b/angular.json @@ -258,6 +258,7 @@ "polyfills": "docs/polyfills.ts", "assets": [ "docs/assets", + "docs/404.html", "docs/favicon.ico", "docs/favicon.png", "docs/google46533d2e7a851062.html" @@ -345,98 +346,6 @@ } } }, - "examples": { - "root": "", - "sourceRoot": "docs", - "projectType": "application", - "architect": { - "build": { - "builder": "@angular-devkit/build-angular:browser", - "options": { - "outputPath": "docs/dist/run", - "index": "docs/index.html", - "main": "docs/main.ts", - "tsConfig": "docs/tsconfig.app.json", - "polyfills": "docs/polyfills.ts", - "assets": [ - "docs/favicon.ico", - "docs/favicon.png" - ], - "styles": [ - "node_modules/bootstrap/scss/bootstrap-reboot.scss", - "node_modules/nebular-icons/scss/nebular-icons.scss", - "docs/app/@theme/styles/styles.scss" - ] - }, - "configurations": { - "production": { - "optimization": true, - "outputHashing": "all", - "sourceMap": false, - "extractCss": true, - "namedChunks": false, - "aot": true, - "extractLicenses": true, - "vendorChunk": false, - "buildOptimizer": true, - "fileReplacements": [ - { - "replace": "docs/environments/environment.ts", - "with": "docs/environments/environment.prod.ts" - } - ] - } - } - }, - "serve": { - "builder": "@angular-devkit/build-angular:dev-server", - "options": { - "browserTarget": "docs:build" - }, - "configurations": { - "production": { - "browserTarget": "docs:build:production" - } - } - }, - "extract-i18n": { - "builder": "@angular-devkit/build-angular:extract-i18n", - "options": { - "browserTarget": "docs:build" - } - }, - "test": { - "builder": "@angular-devkit/build-angular:karma", - "options": { - "main": "docs/test.ts", - "karmaConfig": "./karma.conf.js", - "polyfills": "docs/polyfills.ts", - "tsConfig": "docs/tsconfig.spec.json", - "scripts": [ - ], - "styles": [ - "node_modules/bootstrap/scss/bootstrap-reboot.scss", - "node_modules/nebular-icons/scss/nebular-icons.scss", - "docs/app/@theme/styles/styles.scss" - ], - "assets": [ - "docs/favicon.ico", - "docs/favicon.png" - ] - } - }, - "lint": { - "builder": "@angular-devkit/build-angular:tslint", - "options": { - "tsConfig": [ - "docs/tsconfig.spec.json", - "docs/tsconfig.app.json" - ], - "exclude": [] - } - } - } - }, "docs-e2e": { "root": "", "sourceRoot": "", diff --git a/docs/404.html b/docs/404.html new file mode 100644 index 0000000000..bc245d0534 --- /dev/null +++ b/docs/404.html @@ -0,0 +1,20 @@ + + + + + + 404 + + + + + + + +              +              +              +              + + + diff --git a/docs/app/@theme/components/footer/footer.component.html b/docs/app/@theme/components/footer/footer.component.html index d34bd09286..50adcd49df 100644 --- a/docs/app/@theme/components/footer/footer.component.html +++ b/docs/app/@theme/components/footer/footer.component.html @@ -1,5 +1,5 @@
- +
diff --git a/docs/app/blocks/components/live-example-block/live-example-block.component.ts b/docs/app/blocks/components/live-example-block/live-example-block.component.ts index 97fbe006b8..ddcc968f03 100644 --- a/docs/app/blocks/components/live-example-block/live-example-block.component.ts +++ b/docs/app/blocks/components/live-example-block/live-example-block.component.ts @@ -10,12 +10,12 @@ import { HostBinding, Output, EventEmitter, + AfterViewInit, } from '@angular/core'; -import { DomSanitizer, SafeUrl } from '@angular/platform-browser'; +import { Location } from '@angular/common'; import { takeWhile } from 'rxjs/operators'; import { NgdIframeCommunicatorService } from '../../../@theme/services'; import { NgdExampleView } from '../../enum.example-view'; -import { environment } from '../../../../environments/environment'; @Component({ selector: 'ngd-live-example-block', @@ -23,7 +23,7 @@ import { environment } from '../../../../environments/environment'; templateUrl: './live-example-block.component.html', changeDetection: ChangeDetectionStrategy.OnPush, }) -export class NgdLiveExampleBlockComponent implements OnInit, OnDestroy { +export class NgdLiveExampleBlockComponent implements OnInit, AfterViewInit, OnDestroy { @ViewChild('iframe') iframe: ElementRef; @Input() content: any; @@ -51,9 +51,8 @@ export class NgdLiveExampleBlockComponent implements OnInit, OnDestroy { currentTheme: string = 'default'; loading = true; - get url(): SafeUrl { - return this.sanitizer - .bypassSecurityTrustResourceUrl(`${environment.examplesUrl}#/example/${this.content.id}`); + get url(): string { + return this.location.prepareExternalUrl(`example/${this.content.id}`); } get iframeWindow(): Window { @@ -61,12 +60,11 @@ export class NgdLiveExampleBlockComponent implements OnInit, OnDestroy { } constructor(private changeDetection: ChangeDetectorRef, - private sanitizer: DomSanitizer, - private communicator: NgdIframeCommunicatorService, - ) { + private location: Location, + private communicator: NgdIframeCommunicatorService) { } - ngOnInit(): void { + ngOnInit() { this.communicator.receive(this.content.id) .pipe(takeWhile(() => this.alive)) .subscribe(it => { @@ -76,7 +74,16 @@ export class NgdLiveExampleBlockComponent implements OnInit, OnDestroy { }); } - ngOnDestroy(): void { + ngAfterViewInit() { + // we cannot set src using angular binding + // as it will trigger change detection and reload iframe + // which in its turn will send a new height + // and we would need to set the height and trigger change detection again + // resulting in infinite loop + this.iframe.nativeElement.src = this.url; + } + + ngOnDestroy() { this.alive = false; } diff --git a/docs/assets/ghspa.js b/docs/assets/ghspa.js new file mode 100644 index 0000000000..225b4811b1 --- /dev/null +++ b/docs/assets/ghspa.js @@ -0,0 +1,54 @@ +/** + * + * ____ _ ___ _ _ _ _ ___ ___ ____ ____ ____ ____ ____ ___ ____ + * | __ | | |__| | | |__] |__] |__| | __ |___ [__ [__ |__] |__| + * |__] | | | | |__| |__] | | | |__] |___ ___] ___] | | | + * + * Easy way to enable Single Page Applications for GitHub Pages + * + * This project was released under MIT license. + * + * @link https://github.com/rafrex/spa-github-pages + * @author Rafael Pedicini + * @link http://websemantics.ca + * @author Adnan M.Sagar, PhD. + * + * @param {Object} l, the document current location + * @param {Boolean} projectPages, true by default, https://help.github.com/articles/user-organization-and-project-pages + * + */ + +;(function(l, projectPages) { + + var repo = projectPages ? '/' + l.pathname.split('/')[1] : ''; + + /* redirect all 404 trafic to index.html */ + function redirect() { + l.replace(l.protocol + '//' + l.hostname + (l.port ? ':' + l.port : '') + repo + '/?' + + (l.pathname ? 'p=' + l.pathname.replace(/&/g, '~and~').replace(repo, '') : '') + + (l.search ? '&q=' + l.search.slice(1).replace(/&/g, '~and~') : '') + + (l.hash)) + } + + /* resolve 404 redirects into internal routes */ + function resolve() { + if (l.search) { + var q = {}; + l.search.slice(1).split('&').forEach(function(v) { + var a = v.split('='); + q[a[0]] = a.slice(1).join('=').replace(/~and~/g, '&') + }); + if (q.p !== undefined) { + window.history.replaceState(null, null, + repo + (q.p || '') + + (q.q ? ('?' + q.q) : '') + + l.hash + ) + } + } + } + + /* if current document is 404 page page, redirect to index.html otherwise resolve */ + document.title === '404' ? redirect() : resolve() + +}(window.location, window.projectPages || true )); diff --git a/docs/environments/environment.prod.ts b/docs/environments/environment.prod.ts index fddede5d78..803f39ed23 100644 --- a/docs/environments/environment.prod.ts +++ b/docs/environments/environment.prod.ts @@ -11,5 +11,4 @@ export const environment = { production: true, - examplesUrl: 'run/', }; diff --git a/docs/environments/environment.ts b/docs/environments/environment.ts index 775d27d7ec..53d82519dd 100644 --- a/docs/environments/environment.ts +++ b/docs/environments/environment.ts @@ -11,5 +11,4 @@ export const environment = { production: false, - examplesUrl: '', }; diff --git a/docs/index.html b/docs/index.html index fcba78ed73..0eb970592b 100644 --- a/docs/index.html +++ b/docs/index.html @@ -12,7 +12,7 @@ - +