-
Notifications
You must be signed in to change notification settings - Fork 28
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
32 changed files
with
852 additions
and
7 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,44 @@ | ||
| { | ||
| "extends": "../../.eslintrc.json", | ||
| "ignorePatterns": [ | ||
| "!**/*" | ||
| ], | ||
| "overrides": [ | ||
| { | ||
| "files": [ | ||
| "*.ts" | ||
| ], | ||
| "parserOptions": { | ||
| "project": [ | ||
| "projects/ngx-ui-tour-tui-hint/tsconfig.lib.json", | ||
| "projects/ngx-ui-tour-tui-hint/tsconfig.spec.json" | ||
| ], | ||
| "createDefaultProgram": true | ||
| }, | ||
| "rules": { | ||
| "@angular-eslint/directive-selector": [ | ||
| "error", | ||
| { | ||
| "type": "attribute", | ||
| "prefix": "tour", | ||
| "style": "camelCase" | ||
| } | ||
| ], | ||
| "@angular-eslint/component-selector": [ | ||
| "error", | ||
| { | ||
| "type": "element", | ||
| "prefix": "tour", | ||
| "style": "kebab-case" | ||
| } | ||
| ] | ||
| } | ||
| }, | ||
| { | ||
| "files": [ | ||
| "*.html" | ||
| ], | ||
| "rules": {} | ||
| } | ||
| ] | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| <a name="1.0.0"></a> | ||
|
|
||
| # [1.0.0](https://github.com/hakimio/ngx-ui-tour) (2021-09-22) | ||
|
|
||
| ### Features | ||
|
|
||
| - Initial release! |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,20 @@ | ||
| # Ngx-UI-Tour Taiga UI Hint | ||
|
|
||
| ## About | ||
|
|
||
| > UI tour library for Angular 9+ | ||
| `ngx-ui-tour` is a fork of __Isaac Mann's__ `ngx-tour`. The project had to be forked since the original is no longer | ||
| maintained. | ||
|
|
||
| ## Demo | ||
|
|
||
| [hakimio.github.io/ngx-ui-tour](https://hakimio.github.io/ngx-ui-tour) | ||
|
|
||
| ## Homepage | ||
|
|
||
| [github.com/hakimio/ngx-ui-tour](https://github.com/hakimio/ngx-ui-tour) | ||
|
|
||
| ## License | ||
|
|
||
| MIT |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,44 @@ | ||
| // 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'), | ||
| require('@angular-devkit/build-angular/plugins/karma') | ||
| ], | ||
| client: { | ||
| jasmine: { | ||
| // you can add configuration options for Jasmine here | ||
| // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html | ||
| // for example, you can disable the random execution with `random: false` | ||
| // or set a specific seed with `seed: 4321` | ||
| }, | ||
| clearContext: false // leave Jasmine Spec Runner output visible in browser | ||
| }, | ||
| jasmineHtmlReporter: { | ||
| suppressAll: true // removes the duplicated traces | ||
| }, | ||
| coverageReporter: { | ||
| dir: require('path').join(__dirname, '../../coverage/ngx-ui-tour-tui-hint'), | ||
| subdir: '.', | ||
| reporters: [ | ||
| { type: 'html' }, | ||
| { type: 'text-summary' } | ||
| ] | ||
| }, | ||
| reporters: ['progress', 'kjhtml'], | ||
| port: 9876, | ||
| colors: true, | ||
| logLevel: config.LOG_INFO, | ||
| autoWatch: true, | ||
| browsers: ['Chrome'], | ||
| singleRun: false, | ||
| restartOnFileChange: true | ||
| }); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,12 @@ | ||
| { | ||
| "$schema": "../../node_modules/ng-packagr/ng-package.schema.json", | ||
| "dest": "../../dist/ngx-ui-tour-tui-hint", | ||
| "lib": { | ||
| "entryFile": "src/public_api.ts", | ||
| "umdModuleIds": { | ||
| "ngx-ui-tour-core": "ngxUiTourCore", | ||
| "@taiga-ui/core": "taigaUiCore", | ||
| "@taiga-ui/cdk": "taigaUiCdk" | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,30 @@ | ||
| { | ||
| "name": "ngx-ui-tour-tui-hint", | ||
| "description": "UI tour library for Angular 9+", | ||
| "keywords": [ | ||
| "angular", | ||
| "ngx", | ||
| "taiga-ui", | ||
| "tour", | ||
| "product-tour", | ||
| "ui-tour", | ||
| "onboarding", | ||
| "onboarding-tour" | ||
| ], | ||
| "repository": "https://github.com/hakimio/ngx-ui-tour.git", | ||
| "author": "Tomas Rimkus <[email protected]>", | ||
| "license": "MIT", | ||
| "version": "1.0.0", | ||
| "peerDependencies": { | ||
| "@angular/common": ">=9.0.0 <13.0.0", | ||
| "@angular/core": ">=9.0.0 <13.0.0", | ||
| "@taiga-ui/core": "^2.15.0", | ||
| "@taiga-ui/cdk": "^2.15.0", | ||
| "@taiga-ui/icons": "^2.15.0", | ||
| "ngx-ui-tour-core": "7.0.1", | ||
| "typescript": ">=3.8.0" | ||
| }, | ||
| "dependencies": { | ||
| "tslib": "^2.3.0" | ||
| } | ||
| } |
6 changes: 6 additions & 0 deletions
6
projects/ngx-ui-tour-tui-hint/src/lib/step-option.interface.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,6 @@ | ||
| import {IStepOption} from 'ngx-ui-tour-core'; | ||
| import {TuiDirection} from '@taiga-ui/core'; | ||
|
|
||
| export interface ITuiHintStepOption extends IStepOption { | ||
| placement?: TuiDirection; | ||
| } |
75 changes: 75 additions & 0 deletions
75
projects/ngx-ui-tour-tui-hint/src/lib/tour-anchor.directive.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,75 @@ | ||
| import {Directive, ElementRef, HostBinding, Input, OnDestroy, OnInit} from '@angular/core'; | ||
| import {TuiManualHintDirective} from '@taiga-ui/core'; | ||
| import {ScrollingUtil, TourAnchorDirective, TourBackdropService, TourState} from 'ngx-ui-tour-core'; | ||
| import {TourTuiHintService} from './tour-tui-hint.service'; | ||
| import {ITuiHintStepOption} from './step-option.interface'; | ||
| import {TourStepTemplateService} from './tour-step-template.service'; | ||
|
|
||
| @Directive({ | ||
| selector: '[tourAnchor]', | ||
| providers: [ | ||
| TuiManualHintDirective | ||
| ] | ||
| }) | ||
| export class TourAnchorTuiHintDirective implements OnInit, OnDestroy, TourAnchorDirective { | ||
|
|
||
| @Input() | ||
| tourAnchor: string; | ||
|
|
||
| @HostBinding('class.touranchor--is-active') | ||
| isActive: boolean; | ||
|
|
||
| constructor( | ||
| private readonly tourService: TourTuiHintService, | ||
| private readonly tourBackdropService: TourBackdropService, | ||
| private readonly tourStepTemplateService: TourStepTemplateService, | ||
| private readonly tuiHint: TuiManualHintDirective, | ||
| private elementRef: ElementRef | ||
| ) {} | ||
|
|
||
| ngOnInit(): void { | ||
| this.tourService.register(this.tourAnchor, this); | ||
| } | ||
|
|
||
| public ngOnDestroy(): void { | ||
| this.tourService.unregister(this.tourAnchor); | ||
| } | ||
|
|
||
| showTourStep(step: ITuiHintStepOption) { | ||
| const htmlElement: HTMLElement = this.elementRef.nativeElement, | ||
| templateComponent = this.tourStepTemplateService.templateComponent; | ||
|
|
||
| templateComponent.step = step; | ||
| this.isActive = true; | ||
|
|
||
| if (!step.disableScrollToAnchor) { | ||
| ScrollingUtil.ensureVisible(htmlElement); | ||
| } | ||
|
|
||
| this.tuiHint.direction = step.placement || 'bottom-right'; | ||
| this.tuiHint.content = templateComponent.template; | ||
| this.tuiHint.mode = 'onDark'; | ||
|
|
||
| if (step.enableBackdrop) { | ||
| this.tourBackdropService.show(this.elementRef); | ||
| } else { | ||
| this.tourBackdropService.close(); | ||
| } | ||
|
|
||
| step.prevBtnTitle = step.prevBtnTitle || 'Prev'; | ||
| step.nextBtnTitle = step.nextBtnTitle || 'Next'; | ||
| step.endBtnTitle = step.endBtnTitle || 'End'; | ||
|
|
||
| this.tuiHint.tuiManualHintShow = true; | ||
| } | ||
|
|
||
| hideTourStep() { | ||
| this.isActive = false; | ||
| this.tuiHint.tuiManualHintShow = false; | ||
|
|
||
| if (this.tourService.getStatus() === TourState.OFF) { | ||
| this.tourBackdropService.close(); | ||
| } | ||
| } | ||
|
|
||
| } |
9 changes: 9 additions & 0 deletions
9
projects/ngx-ui-tour-tui-hint/src/lib/tour-step-template.service.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| import {Injectable} from '@angular/core'; | ||
| import {TourStepTemplateComponent} from './tour-step-template/tour-step-template.component'; | ||
|
|
||
| @Injectable() | ||
| export class TourStepTemplateService { | ||
|
|
||
| public templateComponent: TourStepTemplateComponent; | ||
|
|
||
| } |
Oops, something went wrong.