ngy-tutorial
Version:
1 lines • 12.6 kB
JSON
{"__symbolic":"module","version":4,"metadata":{"NgyTutorialService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"showTutorial":[{"__symbolic":"method"}],"hideTutorial":[{"__symbolic":"method"}],"addStep":[{"__symbolic":"method"}],"removeStep":[{"__symbolic":"method"}],"nextStep":[{"__symbolic":"method"}],"previousStep":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"NgyTutorialModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":8,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":10,"character":4},{"__symbolic":"reference","module":"@angular/platform-browser/animations","name":"BrowserAnimationsModule","line":11,"character":4}],"declarations":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵb"}],"exports":[{"__symbolic":"reference","name":"ɵa"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":["options"],"defaults":[{}],"value":{"ngModule":{"__symbolic":"reference","name":"NgyTutorialModule"},"providers":[{"__symbolic":"reference","name":"NgyTutorialService"},{"provide":"ngy-tutorial-options","useValue":{"__symbolic":"reference","name":"options"}}]}}}},"IInitializationOptions":{"__symbolic":"interface"},"IStepOption":{"__symbolic":"interface"},"StepPromptPlacement":{"Above":0,"Below":1,"Left":2,"Right":3},"IStepClasses":{"__symbolic":"interface"},"IActionTexts":{"__symbolic":"interface"},"ITutorialStep":{"__symbolic":"interface"},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"lib-ngy-tutorial","template":"<lib-ngy-tutorial-prompt *ngIf=\"enabled\" @fadeAnimation [step]=\"steps[currentStep]\" [stepNumber]=\"currentStep\" [totalSteps]=\"steps.length\" #prompt></lib-ngy-tutorial-prompt>\n<div class=\"window-cover full-width\" #topCover *ngIf=\"enabled\" @fadeAnimation>\n</div>\n<div class=\"window-cover\" #leftCover *ngIf=\"enabled\" @fadeAnimation>\n</div>\n<div class=\"window-cover\" #rightCover *ngIf=\"enabled\" @fadeAnimation>\n</div>\n<div class=\"window-cover full-width\" #bottomCover *ngIf=\"enabled\" @fadeAnimation>\n</div>\n<div class=\"element-cover\" #elementCover>\n\n</div>","styles":[":host{position:fixed;left:0;top:0;width:0;height:0}.window-cover{position:fixed;background:rgba(0,0,0,.8);z-index:998}.window-cover.full-width{width:100vw}.element-cover{position:fixed;z-index:998}lib-ngy-tutorial-prompt{top:0;left:0;position:fixed;z-index:999}"],"animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger","line":24,"character":4},"arguments":["fadeAnimation",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":25,"character":6},"arguments":["void => *",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":26,"character":8},"arguments":[":self",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":27,"character":10},"arguments":["0.3s ease-in-out",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"keyframes","line":27,"character":38},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":28,"character":12},"arguments":[{"opacity":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":29,"character":12},"arguments":[{"opacity":1}]}]]}]},{"optional":true}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":32,"character":6},"arguments":["* => void",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":33,"character":8},"arguments":[":self",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":34,"character":10},"arguments":["0.3s ease-in-out",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"keyframes","line":34,"character":38},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":35,"character":12},"arguments":[{"opacity":1}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":36,"character":12},"arguments":[{"opacity":0}]}]]}]},{"optional":true}]}]]}]]}]}]}],"members":{"topCover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":47,"character":3},"arguments":["topCover"]}]}],"leftCover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":48,"character":3},"arguments":["leftCover"]}]}],"rightCover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":49,"character":3},"arguments":["rightCover"]}]}],"bottomCover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":50,"character":3},"arguments":["bottomCover"]}]}],"elementCover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":51,"character":3},"arguments":["elementCover"]}]}],"prompt":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":52,"character":3},"arguments":["prompt"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":55,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":55,"character":12}]}]],"parameters":[{"__symbolic":"reference","name":"NgyTutorialService"},{"__symbolic":"reference","name":"any"}]}],"ngOnInit":[{"__symbolic":"method"}],"setupUIForStep":[{"__symbolic":"method"}],"coverElement":[{"__symbolic":"method"}],"coverAll":[{"__symbolic":"method"}],"coverShowElement":[{"__symbolic":"method"}],"setPosition":[{"__symbolic":"method"}],"resetCovers":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"lib-ngy-tutorial-prompt","template":"<div class=\"prompt-container smooth-2 ngy-tutorial-prompt-container\" [ngClass]=\"appliedClasses.container\" *ngIf=\"step\"\n #prompt>\n <h2 class=\"title ngy-tutorial-title\" [ngClass]=\"appliedClasses.title\" *ngIf=\"step.title\" [innerHTML]=\"titleSafe\"></h2>\n <p class=\"prompt ngy-tutorial-prompt\" [ngClass]=\"appliedClasses.prompt\" *ngIf=\"step.prompt\" [innerHTML]=\"promptSafe\"></p>\n <div class=\"action-container\">\n <div class=\"actions left\">\n <button id=\"lib-ngy-tutorial-previous-btn\" *ngIf=\"(stepNumber !== 0) && (!step.options.disablePrevious || overrideButtonDisable)\" class=\"ngy-tutorial-previous-btn\"\n (click)=\"previousStep()\" [ngClass]=\"appliedClasses.previousBtn\"><i [ngClass]=\"appliedClasses.previousIcon\"\n *ngIf=\"appliedClasses.previousIcon\"></i> {{appliedTexts.previous ? appliedTexts.previous : \"Previous\"}}</button>\n <button id=\"lib-ngy-tutorial-skip-btn\" [ngClass]=\"appliedClasses.skipBtn\" *ngIf=\"stepNumber===0\" class=\"ngy-tutorial-skip-btn\"\n (click)=\"finishTutorial()\"><i [ngClass]=\"appliedClasses.skipIcon\" *ngIf=\"appliedClasses.skipIcon\"></i>\n {{appliedTexts.skip ? appliedTexts.skip : \"Skip\"}}</button>\n </div>\n <div class=\"actions right\">\n <button id=\"lib-ngy-tutorial-next-btn\" *ngIf=\"(stepNumber !== totalSteps - 1) && (!step.options.disableNext || overrideButtonDisable)\" class=\"ngy-tutorial-next-btn\"\n (click)=\"nextStep()\" [ngClass]=\"appliedClasses.nextBtn\"><i [ngClass]=\"appliedClasses.nextIcon\" *ngIf=\"appliedClasses.nextIcon\"></i>\n {{appliedTexts.next ? appliedTexts.next : \"Next\"}}</button>\n <button id=\"lib-ngy-tutorial-finish-btn\" *ngIf=\"(stepNumber === totalSteps - 1) && (!step.options.disableNext || overrideButtonDisable)\"\n class=\"ngy-tutorial-finish-btn\" (click)=\"finishTutorial()\" [ngClass]=\"appliedClasses.finishBtn\"><i [ngClass]=\"appliedClasses.finishIcon\"\n *ngIf=\"appliedClasses.finishIcon\"></i>\n {{appliedTexts.finish ? appliedTexts.finish : \"Finish\"}}</button>\n </div>\n </div>\n</div>","styles":[".prompt-container{max-width:40vw;border-radius:3px;padding:10px;background:#222;box-shadow:0 0 6px rgba(0,0,0,.6);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}@media screen and (max-width:768px){.prompt-container{max-width:95vw}}@media screen and (max-width:992px) and (min-width:768px){.prompt-container{max-width:85vw}}.prompt-container .title{margin-bottom:10px}.prompt-container .prompt{text-align:center}.prompt-container .action-container{margin-top:10px;display:flex;width:100%;flex-direction:row}.prompt-container .action-container .actions{width:100%;display:flex;padding:10px}.prompt-container .action-container .actions.left{align-items:flex-start}.prompt-container .action-container .actions.right{justify-content:flex-end}.smooth-2{transition:.2s cubic-bezier(.645,.045,.355,1)}"]}]}],"members":{"stepNumber":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"totalSteps":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"step":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3}}]}],"prompt":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":40,"character":3},"arguments":["prompt"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":50,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":50,"character":12}]}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":51,"character":5},"arguments":["ngy-tutorial-options"]}]],"parameters":[{"__symbolic":"reference","name":"NgyTutorialService"},{"__symbolic":"reference","module":"@angular/platform-browser","name":"DomSanitizer","line":49,"character":18},{"__symbolic":"reference","name":"any"},{"__symbolic":"reference","name":"IInitializationOptions"}]}],"ngOnInit":[{"__symbolic":"method"}],"finishTutorial":[{"__symbolic":"method"}],"nextStep":[{"__symbolic":"method"}],"previousStep":[{"__symbolic":"method"}],"setPromptForElement":[{"__symbolic":"method"}],"setPromptPosition":[{"__symbolic":"method"}],"isPromptCoveringElement":[{"__symbolic":"method"}],"isElementOutOfView":[{"__symbolic":"method"}]}}},"origins":{"NgyTutorialService":"./lib/ngy-tutorial.service","NgyTutorialModule":"./lib/ngy-tutorial.module","IInitializationOptions":"./lib/api/i-options","IStepOption":"./lib/api/i-options","StepPromptPlacement":"./lib/api/i-options","IStepClasses":"./lib/api/i-options","IActionTexts":"./lib/api/i-options","ITutorialStep":"./lib/api/i-tutorial-step","ɵa":"./lib/tutorial/tutorial.component","ɵb":"./lib/prompt/prompt.component"},"importAs":"ngy-tutorial"}