@tripetto/runner-autoscroll
Version:
Autoscroll UI for running Tripetto forms and surveys.
502 lines (496 loc) • 14.9 kB
JavaScript
import * as i0 from "@angular/core";
import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, NgModule } from "@angular/core";
import { isPromise } from "@tripetto/runner";
import { run } from "@tripetto/runner-autoscroll";
class TripettoAutoscrollComponent {
/** Retrieves a reference to the runner instance. */
get controller() {
return this.runnerController;
}
/** Retrieves the running definition. */
get definition() {
return this.runnerController?.definition || this.initialDefinition;
}
/** Specifies the definition to run. */
set definition(definition) {
if (this.runnerController && definition) {
this.zone.runOutsideAngular(() => {
if (isPromise(definition)) {
definition.then((value) => {
if (value) {
this.runnerController.definition = value;
}
});
} else if (definition) {
this.runnerController.l10n = definition;
}
});
return;
}
this.initialDefinition = definition;
}
/** Retrieves the view mode of the runner. */
get view() {
return this.runnerController?.view || this.initialView || "live";
}
/** Specifies the view mode of the runner. */
set view(view) {
if (this.runnerController) {
this.zone.runOutsideAngular(() => {
this.runnerController.view = view;
});
return;
}
this.initialView = view;
}
/** Retrieves the styles (colors, font, size, etc.) for the runner. */
get styles() {
return this.runnerController?.styles || this.initialStyles;
}
/** Specifies the styles (colors, font, size, etc.) for the runner. */
set styles(styles) {
if (this.runnerController) {
this.zone.runOutsideAngular(() => {
if (isPromise(styles)) {
styles.then((value) => {
if (value) {
this.runnerController.styles = value;
}
});
} else if (styles) {
this.runnerController.styles = styles;
}
});
return;
}
this.initialStyles = styles;
}
/** Retrieves the localization (locale and translation) information. */
get l10n() {
return this.runnerController?.l10n || this.initialL10n;
}
/** Specifies the localization (locale and translation) information. */
set l10n(l10n) {
if (this.runnerController) {
this.zone.runOutsideAngular(() => {
if (isPromise(l10n)) {
l10n.then((value) => {
if (value) {
this.runnerController.l10n = value;
}
});
} else if (l10n) {
this.runnerController.l10n = l10n;
}
});
return;
}
this.initialL10n = l10n;
}
/** Reference to a builder instance to enable live preview for the builder. */
set builder(ref) {
if (!ref) {
this.builderController = undefined;
} else {
new Promise((resolve) => {
const fnAwait = () => {
if (typeof ref === "function") {
const builder = ref();
if (builder) {
return resolve(builder.controller);
}
} else if (ref.controller) {
return resolve(ref.controller);
}
requestAnimationFrame(fnAwait);
};
fnAwait();
}).then((controller) => {
this.builderController = controller;
controller.hook("OnChange", "synchronous", (changeEvent) => {
if (this.runnerController) {
this.runnerController.definition = changeEvent.definition;
}
});
controller.hook("OnEdit", "synchronous", (editEvent) => {
this.runnerController?.doPreview(editEvent.data);
});
});
}
}
get builder() {
return (
this.builderController && {
controller: this.builderController,
}
);
}
constructor(element, zone) {
this.element = element;
this.zone = zone;
/** Invoked when the runner is ready. */
this.onReady = new EventEmitter();
/** Invoked when the runner processed a change. */
this.onChange = new EventEmitter();
/** Invoked when data can be imported into the instance. */
this.onImport = new EventEmitter();
/** Invoked when the data in the runner is changed. */
this.onData = new EventEmitter();
/** Specifies a function that is invoked when the user performs an action. */
this.onAction = new EventEmitter();
/** Invoked when the runner is about to end and submits data. */
this.onSubmit = new EventEmitter();
/** Invoked when the runner is completed (after the data is submitted). */
this.onComplete = new EventEmitter();
/** Specifies a function that is invoked when an edit action is requested. */
this.onEdit = new EventEmitter();
/** Specifies a function that is invoked when the runner is "touched" by a user. */
this.onTouch = new EventEmitter();
/** Invoked when the runner is destroyed. */
this.onDestroy = new EventEmitter();
}
ngOnInit() {
this.zone.runOutsideAngular(async () => {
this.runnerController = await run({
element: this.element.nativeElement,
definition: this.definition,
view: this.initialView,
display: this.display,
snapshot: this.snapshot,
styles: this.styles,
persistent: this.persistent,
license: this.license,
removeBranding: this.removeBranding,
attachments: this.attachments,
className: this.className,
customStyle: this.customStyle,
customCSS: this.customCSS,
l10n: this.l10n,
language: this.language,
locale: this.locale,
translations: this.translations,
onReady: (instance) => this.onReady.emit(instance),
onChange: (instance) => this.onChange.emit(instance),
onImport: (instance) => this.onImport.emit(instance),
onData: (instance) => this.onData.emit(instance),
onAction: (type, definition, block) =>
this.onAction.emit({
type,
definition,
block,
}),
onSubmit: (instance, language, locale, namespace) =>
this.onSubmit.emit({
instance,
language,
locale,
namespace,
}),
onComplete: (instance, id) =>
this.onComplete.emit({
instance,
id,
}),
onEdit: (type, id) => {
if (this.builderController) {
switch (type) {
case "prologue":
this.builderController.edit("prologue");
break;
case "epilogue":
this.builderController.edit("epilogue", id);
break;
case "block":
if (id) {
this.builderController.edit("node", id);
}
break;
}
}
this.onEdit.emit({
type,
id,
});
},
onReload: this.onReload,
onPause: this.onPause,
onTouch: () => this.onTouch.emit(),
onDestroy: () => this.onDestroy.emit(),
});
});
}
ngOnDestroy() {
if (this.runnerController) {
this.runnerController.destroy();
this.runnerController = this.builderController = undefined;
}
}
}
TripettoAutoscrollComponent.ɵfac = i0.ɵɵngDeclareFactory({
minVersion: "12.0.0",
version: "15.2.1",
ngImport: i0,
type: TripettoAutoscrollComponent,
deps: [{ token: i0.ElementRef }, { token: i0.NgZone }],
target: i0.ɵɵFactoryTarget.Component,
});
TripettoAutoscrollComponent.ɵcmp = i0.ɵɵngDeclareComponent({
minVersion: "14.0.0",
version: "15.2.1",
type: TripettoAutoscrollComponent,
selector: "tripetto-runner-autoscroll",
inputs: {
definition: "definition",
view: "view",
styles: "styles",
l10n: "l10n",
display: "display",
snapshot: "snapshot",
persistent: "persistent",
license: "license",
removeBranding: "removeBranding",
attachments: "attachments",
className: "className",
customStyle: "customStyle",
customCSS: "customCSS",
language: "language",
locale: "locale",
translations: "translations",
onReload: "onReload",
onPause: "onPause",
builder: "builder",
},
outputs: {
onReady: "onReady",
onChange: "onChange",
onImport: "onImport",
onData: "onData",
onAction: "onAction",
onSubmit: "onSubmit",
onComplete: "onComplete",
onEdit: "onEdit",
onTouch: "onTouch",
onDestroy: "onDestroy",
},
ngImport: i0,
template: "",
isInline: true,
changeDetection: i0.ChangeDetectionStrategy.OnPush,
});
i0.ɵɵngDeclareClassMetadata({
minVersion: "12.0.0",
version: "15.2.1",
ngImport: i0,
type: TripettoAutoscrollComponent,
decorators: [
{
type: Component,
args: [
{
selector: "tripetto-runner-autoscroll",
template: "",
changeDetection: ChangeDetectionStrategy.OnPush,
},
],
},
],
ctorParameters: function () {
return [{ type: i0.ElementRef }, { type: i0.NgZone }];
},
propDecorators: {
definition: [
{
type: Input,
},
],
view: [
{
type: Input,
},
],
styles: [
{
type: Input,
},
],
l10n: [
{
type: Input,
},
],
display: [
{
type: Input,
},
],
snapshot: [
{
type: Input,
},
],
persistent: [
{
type: Input,
},
],
license: [
{
type: Input,
},
],
removeBranding: [
{
type: Input,
},
],
attachments: [
{
type: Input,
},
],
className: [
{
type: Input,
},
],
customStyle: [
{
type: Input,
},
],
customCSS: [
{
type: Input,
},
],
language: [
{
type: Input,
},
],
locale: [
{
type: Input,
},
],
translations: [
{
type: Input,
},
],
onReady: [
{
type: Output,
},
],
onChange: [
{
type: Output,
},
],
onImport: [
{
type: Output,
},
],
onData: [
{
type: Output,
},
],
onAction: [
{
type: Output,
},
],
onSubmit: [
{
type: Output,
},
],
onComplete: [
{
type: Output,
},
],
onEdit: [
{
type: Output,
},
],
onTouch: [
{
type: Output,
},
],
onDestroy: [
{
type: Output,
},
],
onReload: [
{
type: Input,
},
],
onPause: [
{
type: Input,
},
],
builder: [
{
type: Input,
},
],
},
});
class TripettoAutoscrollModule {}
TripettoAutoscrollModule.ɵfac = i0.ɵɵngDeclareFactory({
minVersion: "12.0.0",
version: "15.2.1",
ngImport: i0,
type: TripettoAutoscrollModule,
deps: [],
target: i0.ɵɵFactoryTarget.NgModule,
});
TripettoAutoscrollModule.ɵmod = i0.ɵɵngDeclareNgModule({
minVersion: "14.0.0",
version: "15.2.1",
ngImport: i0,
type: TripettoAutoscrollModule,
declarations: [TripettoAutoscrollComponent],
exports: [TripettoAutoscrollComponent],
});
TripettoAutoscrollModule.ɵinj = i0.ɵɵngDeclareInjector({
minVersion: "12.0.0",
version: "15.2.1",
ngImport: i0,
type: TripettoAutoscrollModule,
});
i0.ɵɵngDeclareClassMetadata({
minVersion: "12.0.0",
version: "15.2.1",
ngImport: i0,
type: TripettoAutoscrollModule,
decorators: [
{
type: NgModule,
args: [
{
declarations: [TripettoAutoscrollComponent],
imports: [],
exports: [TripettoAutoscrollComponent],
},
],
},
],
});
/*
* Public API Surface of runner
*/
/**
* Generated bundle index. Do not edit.
*/
export { TripettoAutoscrollComponent, TripettoAutoscrollModule };
//# sourceMappingURL=runner.mjs.map