survey-creator-angular
Version:
Use SurveyJS Creator to create or edit JSON for SurveyJS Form Library.
65 lines • 13.1 kB
JavaScript
import { Component, ElementRef, Input, ViewChild } from "@angular/core";
import { AngularComponentFactory } from "survey-angular-ui";
import { PageAdorner } from "survey-creator-core";
import { CreatorModelComponent } from "./creator-model.component";
import * as i0 from "@angular/core";
import * as i1 from "./page-element-content.component";
import * as i2 from "survey-angular-ui";
import * as i3 from "@angular/common";
export class PageDesignerComponent extends CreatorModelComponent {
createModel() {
if (this.adorner) {
this.adorner.dispose();
}
if (this.model) {
this.adorner = new PageAdorner(this.creator, this.model);
this.adorner.isGhost = this.isGhost;
}
}
ngDoCheck() {
super.ngDoCheck();
if (this.adorner) {
this.adorner.isGhost = this.isGhost;
}
}
getModel() {
return this.adorner;
}
getPropertiesToTrack() {
return ["creator", "model"];
}
ngAfterViewChecked() {
var _a;
super.ngAfterViewChecked();
if (this.adorner && ((_a = this.container) === null || _a === void 0 ? void 0 : _a.nativeElement)) {
this.adorner.setRootElement(this.container.nativeElement);
}
}
ngOnDestroy() {
super.ngOnDestroy();
this.adorner.dispose();
}
}
PageDesignerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PageDesignerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
PageDesignerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PageDesignerComponent, selector: "svc-page", inputs: { model: "model", survey: "survey", creator: "creator", isGhost: "isGhost" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n<div *ngIf=\"model && adorner\" class=\"svc-page__content\" [class]=\"adorner.css\" [key2click]\n (click)=\"adorner.select(adorner, $event)\" (dblclick)=\"adorner.dblclick($event)\"\n (mouseover)=\"adorner.hover($event, $event.currentTarget)\" (mouseleave)=\"adorner.hover($event, $event.target)\"\n [id]=\"adorner.page.id\" [attr.data-sv-drop-target-survey-page]=\"adorner.dropTargetName\" #container>\n <div class=\"svc-question__drop-indicator svc-question__drop-indicator--top\"></div>\n <div class=\"svc-question__drop-indicator svc-question__drop-indicator--bottom\"></div>\n <svc-page-element-content\n *ngIf=\"adorner.needRenderContent\" \n [model]=\"adorner.page\" \n [survey]=\"survey\">\n </svc-page-element-content>\n <div *ngIf=\"!adorner.needRenderContent\" class=\"svc-page__loading-content\">\n <sv-ng-loading-indicator></sv-ng-loading-indicator>\n </div>\n <div *ngIf=\"adorner.showPlaceholder\" class=\"svc-page__placeholder_frame\">\n <div class=\"svc-panel__placeholder_frame\">\n <div class=\"svc-panel__placeholder\">{{adorner.placeholderText}}</div>\n </div>\n </div>\n <div *ngIf=\"adorner.allowDragging && !adorner.isGhost\" class=\"svc-question__drag-area\"\n (pointerdown)=\"adorner.onPointerDown($event)\">\n <svg class=\"svc-question__drag-element\" [iconName]=\"'icon-drag-area-indicator_24x16'\" [size]=\"'auto'\"\n sv-ng-svg-icon></svg>\n <div class=\"svc-page__content-actions\">\n <sv-action-bar [model]=\"adorner.actionContainer\" #container></sv-action-bar>\n <sv-action-bar *ngIf=\"adorner.topActionContainer.hasActions\" [model]=\"adorner.topActionContainer\"></sv-action-bar>\n </div>\n </div>\n <div *ngIf=\"!adorner.allowDragging || adorner.isGhost\" class=\"svc-page__content-actions\">\n <sv-action-bar [model]=\"adorner.actionContainer\"></sv-action-bar>\n <sv-action-bar *ngIf=\"adorner.topActionContainer.hasActions\" [model]=\"adorner.topActionContainer\"></sv-action-bar>\n </div>\n <sv-action-bar [model]=\"adorner.footerActionsBar\"></sv-action-bar>\n</div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1.PageElementContentComponent, selector: "svc-page-element-content", inputs: ["model", "survey"] }, { type: i2.LoadingIndicatorComponent, selector: "sv-ng-loading-indicator" }, { type: i2.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: i2.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PageDesignerComponent, decorators: [{
type: Component,
args: [{
selector: "svc-page",
templateUrl: "./page.component.html",
styles: [":host { display: none; }"]
}]
}], propDecorators: { model: [{
type: Input
}], survey: [{
type: Input
}], creator: [{
type: Input
}], isGhost: [{
type: Input
}], container: [{
type: ViewChild,
args: ["container", { read: ElementRef }]
}] } });
AngularComponentFactory.Instance.registerComponent("svc-page", PageDesignerComponent);
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvcGFnZS5jb21wb25lbnQudHMiLCIuLi8uLi9zcmMvcGFnZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQXFCLFNBQVMsRUFBRSxVQUFVLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBb0IsTUFBTSxlQUFlLENBQUM7QUFDN0csT0FBTyxFQUFFLHVCQUF1QixFQUE2QyxNQUFNLG1CQUFtQixDQUFDO0FBRXZHLE9BQU8sRUFBc0IsV0FBVyxFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFDdEUsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sMkJBQTJCLENBQUM7Ozs7O0FBT2xFLE1BQU0sT0FBTyxxQkFBc0IsU0FBUSxxQkFBa0M7SUFPakUsV0FBVztRQUNuQixJQUFJLElBQUksQ0FBQyxPQUFPLEVBQUU7WUFDaEIsSUFBSSxDQUFDLE9BQU8sQ0FBQyxPQUFPLEVBQUUsQ0FBQztTQUN4QjtRQUNELElBQUksSUFBSSxDQUFDLEtBQUssRUFBRTtZQUNkLElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxXQUFXLENBQUMsSUFBSSxDQUFDLE9BQU8sRUFBRSxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7WUFDekQsSUFBSSxDQUFDLE9BQU8sQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQztTQUNyQztJQUNILENBQUM7SUFDUSxTQUFTO1FBQ2hCLEtBQUssQ0FBQyxTQUFTLEVBQUUsQ0FBQztRQUNsQixJQUFJLElBQUksQ0FBQyxPQUFPLEVBQUU7WUFDaEIsSUFBSSxDQUFDLE9BQU8sQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQztTQUNyQztJQUNILENBQUM7SUFDUyxRQUFRO1FBQ2hCLE9BQU8sSUFBSSxDQUFDLE9BQU8sQ0FBQztJQUN0QixDQUFDO0lBQ1Msb0JBQW9CO1FBQzVCLE9BQU8sQ0FBQyxTQUFTLEVBQUUsT0FBTyxDQUFDLENBQUM7SUFDOUIsQ0FBQztJQUNlLGtCQUFrQjs7UUFDaEMsS0FBSyxDQUFDLGtCQUFrQixFQUFFLENBQUM7UUFDM0IsSUFBSSxJQUFJLENBQUMsT0FBTyxLQUFJLE1BQUEsSUFBSSxDQUFDLFNBQVMsMENBQUUsYUFBYSxDQUFBLEVBQUU7WUFDakQsSUFBSSxDQUFDLE9BQU8sQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxhQUFhLENBQUMsQ0FBQztTQUMzRDtJQUNILENBQUM7SUFDUSxXQUFXO1FBQ2xCLEtBQUssQ0FBQyxXQUFXLEVBQUUsQ0FBQztRQUNwQixJQUFJLENBQUMsT0FBTyxDQUFDLE9BQU8sRUFBRSxDQUFDO0lBQ3pCLENBQUM7O21IQXJDVSxxQkFBcUI7dUdBQXJCLHFCQUFxQix5TkFLQSxVQUFVLG9EQ2hCNUMsMGtFQW1DYzs0RkR4QkQscUJBQXFCO2tCQUxqQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxVQUFVO29CQUNwQixXQUFXLEVBQUUsdUJBQXVCO29CQUNwQyxNQUFNLEVBQUUsQ0FBQywwQkFBMEIsQ0FBQztpQkFDckM7OEJBRVUsS0FBSztzQkFBYixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLO2dCQUN3QyxTQUFTO3NCQUF0RCxTQUFTO3VCQUFDLFdBQVcsRUFBRSxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUU7O0FBbUM5Qyx1QkFBdUIsQ0FBQyxRQUFRLENBQUMsaUJBQWlCLENBQUMsVUFBVSxFQUFFLHFCQUFxQixDQUFDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3RvclJlZiwgQ29tcG9uZW50LCBFbGVtZW50UmVmLCBJbnB1dCwgVmlld0NoaWxkLCBWaWV3Q29udGFpbmVyUmVmIH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IEFuZ3VsYXJDb21wb25lbnRGYWN0b3J5LCBCYXNlQW5ndWxhciwgRW1iZWRkZWRWaWV3Q29udGVudENvbXBvbmVudCB9IGZyb20gXCJzdXJ2ZXktYW5ndWxhci11aVwiO1xuaW1wb3J0IHsgUGFnZU1vZGVsLCBTdXJ2ZXlNb2RlbCB9IGZyb20gXCJzdXJ2ZXktY29yZVwiO1xuaW1wb3J0IHsgU3VydmV5Q3JlYXRvck1vZGVsLCBQYWdlQWRvcm5lciB9IGZyb20gXCJzdXJ2ZXktY3JlYXRvci1jb3JlXCI7XG5pbXBvcnQgeyBDcmVhdG9yTW9kZWxDb21wb25lbnQgfSBmcm9tIFwiLi9jcmVhdG9yLW1vZGVsLmNvbXBvbmVudFwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwic3ZjLXBhZ2VcIixcbiAgdGVtcGxhdGVVcmw6IFwiLi9wYWdlLmNvbXBvbmVudC5odG1sXCIsXG4gIHN0eWxlczogW1wiOmhvc3QgeyBkaXNwbGF5OiBub25lOyB9XCJdXG59KVxuZXhwb3J0IGNsYXNzIFBhZ2VEZXNpZ25lckNvbXBvbmVudCBleHRlbmRzIENyZWF0b3JNb2RlbENvbXBvbmVudDxQYWdlQWRvcm5lcj4ge1xuICBASW5wdXQoKSBtb2RlbCE6IFBhZ2VNb2RlbDtcbiAgQElucHV0KCkgc3VydmV5ITogU3VydmV5TW9kZWw7XG4gIEBJbnB1dCgpIGNyZWF0b3IhOiBTdXJ2ZXlDcmVhdG9yTW9kZWw7XG4gIEBJbnB1dCgpIGlzR2hvc3QhOiBib29sZWFuO1xuICBAVmlld0NoaWxkKFwiY29udGFpbmVyXCIsIHsgcmVhZDogRWxlbWVudFJlZiB9KSBjb250YWluZXIhOiBFbGVtZW50UmVmPEhUTUxEaXZFbGVtZW50PjtcbiAgcHVibGljIGFkb3JuZXIhOiBQYWdlQWRvcm5lcjtcbiAgcHJvdGVjdGVkIGNyZWF0ZU1vZGVsKCk6IHZvaWQge1xuICAgIGlmICh0aGlzLmFkb3JuZXIpIHtcbiAgICAgIHRoaXMuYWRvcm5lci5kaXNwb3NlKCk7XG4gICAgfVxuICAgIGlmICh0aGlzLm1vZGVsKSB7XG4gICAgICB0aGlzLmFkb3JuZXIgPSBuZXcgUGFnZUFkb3JuZXIodGhpcy5jcmVhdG9yLCB0aGlzLm1vZGVsKTtcbiAgICAgIHRoaXMuYWRvcm5lci5pc0dob3N0ID0gdGhpcy5pc0dob3N0O1xuICAgIH1cbiAgfVxuICBvdmVycmlkZSBuZ0RvQ2hlY2soKTogdm9pZCB7XG4gICAgc3VwZXIubmdEb0NoZWNrKCk7XG4gICAgaWYgKHRoaXMuYWRvcm5lcikge1xuICAgICAgdGhpcy5hZG9ybmVyLmlzR2hvc3QgPSB0aGlzLmlzR2hvc3Q7XG4gICAgfVxuICB9XG4gIHByb3RlY3RlZCBnZXRNb2RlbCgpOiBQYWdlQWRvcm5lciB7XG4gICAgcmV0dXJuIHRoaXMuYWRvcm5lcjtcbiAgfVxuICBwcm90ZWN0ZWQgZ2V0UHJvcGVydGllc1RvVHJhY2soKTogc3RyaW5nW10ge1xuICAgIHJldHVybiBbXCJjcmVhdG9yXCIsIFwibW9kZWxcIl07XG4gIH1cbiAgcHVibGljIG92ZXJyaWRlIG5nQWZ0ZXJWaWV3Q2hlY2tlZCgpOiB2b2lkIHtcbiAgICBzdXBlci5uZ0FmdGVyVmlld0NoZWNrZWQoKTtcbiAgICBpZiAodGhpcy5hZG9ybmVyICYmIHRoaXMuY29udGFpbmVyPy5uYXRpdmVFbGVtZW50KSB7XG4gICAgICB0aGlzLmFkb3JuZXIuc2V0Um9vdEVsZW1lbnQodGhpcy5jb250YWluZXIubmF0aXZlRWxlbWVudCk7XG4gICAgfVxuICB9XG4gIG92ZXJyaWRlIG5nT25EZXN0cm95KCk6IHZvaWQge1xuICAgIHN1cGVyLm5nT25EZXN0cm95KCk7XG4gICAgdGhpcy5hZG9ybmVyLmRpc3Bvc2UoKTtcbiAgfVxufVxuXG5Bbmd1bGFyQ29tcG9uZW50RmFjdG9yeS5JbnN0YW5jZS5yZWdpc3RlckNvbXBvbmVudChcInN2Yy1wYWdlXCIsIFBhZ2VEZXNpZ25lckNvbXBvbmVudCk7XG5cbiIsIjxuZy10ZW1wbGF0ZSAjdGVtcGxhdGU+XG48ZGl2ICpuZ0lmPVwibW9kZWwgJiYgYWRvcm5lclwiIGNsYXNzPVwic3ZjLXBhZ2VfX2NvbnRlbnRcIiBbY2xhc3NdPVwiYWRvcm5lci5jc3NcIiBba2V5MmNsaWNrXVxuICAoY2xpY2spPVwiYWRvcm5lci5zZWxlY3QoYWRvcm5lciwgJGV2ZW50KVwiIChkYmxjbGljayk9XCJhZG9ybmVyLmRibGNsaWNrKCRldmVudClcIlxuICAobW91c2VvdmVyKT1cImFkb3JuZXIuaG92ZXIoJGV2ZW50LCAkZXZlbnQuY3VycmVudFRhcmdldClcIiAobW91c2VsZWF2ZSk9XCJhZG9ybmVyLmhvdmVyKCRldmVudCwgJGV2ZW50LnRhcmdldClcIlxuICBbaWRdPVwiYWRvcm5lci5wYWdlLmlkXCIgW2F0dHIuZGF0YS1zdi1kcm9wLXRhcmdldC1zdXJ2ZXktcGFnZV09XCJhZG9ybmVyLmRyb3BUYXJnZXROYW1lXCIgI2NvbnRhaW5lcj5cbiAgPGRpdiBjbGFzcz1cInN2Yy1xdWVzdGlvbl9fZHJvcC1pbmRpY2F0b3Igc3ZjLXF1ZXN0aW9uX19kcm9wLWluZGljYXRvci0tdG9wXCI+PC9kaXY+XG4gIDxkaXYgY2xhc3M9XCJzdmMtcXVlc3Rpb25fX2Ryb3AtaW5kaWNhdG9yIHN2Yy1xdWVzdGlvbl9fZHJvcC1pbmRpY2F0b3ItLWJvdHRvbVwiPjwvZGl2PlxuICA8c3ZjLXBhZ2UtZWxlbWVudC1jb250ZW50XG4gICAgKm5nSWY9XCJhZG9ybmVyLm5lZWRSZW5kZXJDb250ZW50XCIgXG4gICAgW21vZGVsXT1cImFkb3JuZXIucGFnZVwiIFxuICAgIFtzdXJ2ZXldPVwic3VydmV5XCI+XG4gIDwvc3ZjLXBhZ2UtZWxlbWVudC1jb250ZW50PlxuICA8ZGl2ICpuZ0lmPVwiIWFkb3JuZXIubmVlZFJlbmRlckNvbnRlbnRcIiBjbGFzcz1cInN2Yy1wYWdlX19sb2FkaW5nLWNvbnRlbnRcIj5cbiAgICA8c3YtbmctbG9hZGluZy1pbmRpY2F0b3I+PC9zdi1uZy1sb2FkaW5nLWluZGljYXRvcj5cbiAgPC9kaXY+XG4gIDxkaXYgKm5nSWY9XCJhZG9ybmVyLnNob3dQbGFjZWhvbGRlclwiIGNsYXNzPVwic3ZjLXBhZ2VfX3BsYWNlaG9sZGVyX2ZyYW1lXCI+XG4gICAgPGRpdiBjbGFzcz1cInN2Yy1wYW5lbF9fcGxhY2Vob2xkZXJfZnJhbWVcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJzdmMtcGFuZWxfX3BsYWNlaG9sZGVyXCI+e3thZG9ybmVyLnBsYWNlaG9sZGVyVGV4dH19PC9kaXY+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuICA8ZGl2ICpuZ0lmPVwiYWRvcm5lci5hbGxvd0RyYWdnaW5nICYmICFhZG9ybmVyLmlzR2hvc3RcIiBjbGFzcz1cInN2Yy1xdWVzdGlvbl9fZHJhZy1hcmVhXCJcbiAgICAocG9pbnRlcmRvd24pPVwiYWRvcm5lci5vblBvaW50ZXJEb3duKCRldmVudClcIj5cbiAgICA8c3ZnIGNsYXNzPVwic3ZjLXF1ZXN0aW9uX19kcmFnLWVsZW1lbnRcIiBbaWNvbk5hbWVdPVwiJ2ljb24tZHJhZy1hcmVhLWluZGljYXRvcl8yNHgxNidcIiBbc2l6ZV09XCInYXV0bydcIlxuICAgICAgc3Ytbmctc3ZnLWljb24+PC9zdmc+XG4gICAgPGRpdiBjbGFzcz1cInN2Yy1wYWdlX19jb250ZW50LWFjdGlvbnNcIj5cbiAgICAgIDxzdi1hY3Rpb24tYmFyIFttb2RlbF09XCJhZG9ybmVyLmFjdGlvbkNvbnRhaW5lclwiICNjb250YWluZXI+PC9zdi1hY3Rpb24tYmFyPlxuICAgICAgPHN2LWFjdGlvbi1iYXIgKm5nSWY9XCJhZG9ybmVyLnRvcEFjdGlvbkNvbnRhaW5lci5oYXNBY3Rpb25zXCIgW21vZGVsXT1cImFkb3JuZXIudG9wQWN0aW9uQ29udGFpbmVyXCI+PC9zdi1hY3Rpb24tYmFyPlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbiAgPGRpdiAqbmdJZj1cIiFhZG9ybmVyLmFsbG93RHJhZ2dpbmcgfHwgYWRvcm5lci5pc0dob3N0XCIgY2xhc3M9XCJzdmMtcGFnZV9fY29udGVudC1hY3Rpb25zXCI+XG4gICAgPHN2LWFjdGlvbi1iYXIgW21vZGVsXT1cImFkb3JuZXIuYWN0aW9uQ29udGFpbmVyXCI+PC9zdi1hY3Rpb24tYmFyPlxuICAgIDxzdi1hY3Rpb24tYmFyICpuZ0lmPVwiYWRvcm5lci50b3BBY3Rpb25Db250YWluZXIuaGFzQWN0aW9uc1wiIFttb2RlbF09XCJhZG9ybmVyLnRvcEFjdGlvbkNvbnRhaW5lclwiPjwvc3YtYWN0aW9uLWJhcj5cbiAgPC9kaXY+XG4gIDxzdi1hY3Rpb24tYmFyIFttb2RlbF09XCJhZG9ybmVyLmZvb3RlckFjdGlvbnNCYXJcIj48L3N2LWFjdGlvbi1iYXI+XG48L2Rpdj5cbjwvbmctdGVtcGxhdGU+Il19