@piserve-tech/form-submission 1.3.317 → 1.3.319

package/src/form-fields/terms-and-condition-fields/terms-and-condition-fields.component.html

@@ -1,52 +0,0 @@
-<div [ngClass]="{ 'mb-4': !inLine }" class="px-3" [attr.name]="question.testElementName">
-  <div  class="input-wrapper mb-2" *ngIf="!inLine">
-    <div *ngIf="question.questionNumber" [innerHTML]="question.questionNumber" ></div>
-    <span *ngIf="question.questionNumber" class="space"></span> <label (click)="preview()">{{ question.question }}</label
-    >&nbsp;
-    <span class="text-danger" *ngIf="question?.required">*</span>
-    <div
-      class="svg-wrapper mb-2 hintIcon"
-      [attr.data-title]="hint"
-      *ngIf="hint"
-    >
-      <svg
-        class="hintSvg"
-        viewBox="0 0 30 30"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <path
-          fill-rule="evenodd"
-          clip-rule="evenodd"
-          d="M15 26.25V26.25C8.78625 26.25 3.75 21.2138 3.75 15V15C3.75 8.78625 8.78625 3.75 15 3.75V3.75C21.2138 3.75 26.25 8.78625 26.25 15V15C26.25 21.2138 21.2138 26.25 15 26.25Z"
-          stroke="#323232"
-          stroke-width="1.5"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        />
-        <path
-          d="M15 16.5623V16.2498C15 15.2285 15.6312 14.6748 16.2637 14.2498C16.8812 13.8335 17.5 13.291 17.5 12.291C17.5 10.9098 16.3813 9.79102 15 9.79102C13.6187 9.79102 12.5 10.9098 12.5 12.291"
-          stroke="#323232"
-          stroke-width="1.5"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        />
-        <path
-          d="M14.9988 20C14.8263 20 14.6863 20.14 14.6875 20.3125C14.6875 20.485 14.8275 20.625 15 20.625C15.1725 20.625 15.3125 20.485 15.3125 20.3125C15.3125 20.14 15.1725 20 14.9988 20"
-          stroke="#323232"
-          stroke-width="1.5"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        />
-      </svg>
-    </div>
-  </div>
-  <div class="modal1" *ngIf="visible">
-    <div class="modal-content1">
-      <span class="close" (click)="closeModal()">&times;</span>
-      <div class="imgContiner">
-      <img [src]="imgUrl" alt="Image">
-    </div>
-    </div>
-  </div>
-</div>
-

package/src/form-fields/terms-and-condition-fields/terms-and-condition-fields.component.scss

@@ -1,85 +0,0 @@
-@import '../../styles/shared-style.scss';
-label{
-    color: #084FFF;
-}
-.modal1 {
-    display: flex; /* Show the modal */
-    position: fixed; /* Stay in place */
-    z-index: 1000; /* Sit on top */
-    left: 0;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    background-color: rgb(0, 0, 0); /* Fallback color */
-    background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */
-    align-items: center;
-  }
-  
-  .modal-content1 {
-    background-color: #fefefe;
-    margin: 15% auto; /* 15% from the top and centered */
-    padding: 20px;
-    border: 1px solid #888;
-    width: 80%; /* Could be more or less, depending on screen size */
-    max-width: 877px;
-  }
-  
-  .close {
-    color: #aaa;
-    float: right;
-    font-size: 28px;
-    font-weight: bold;
-    justify-content: flex-end;
-    display: flex;
-    opacity: 1;
-  }
-  
-  .close:hover,
-  .close:focus {
-    color: black;
-    text-decoration: none;
-    cursor: pointer;
-  }
-  .imgContiner{
-    height: 500px;
-    overflow-y: auto;
-    img{
-        max-width: 100%;
-        width: 100%;
-
-    }
-  }
-  div::-webkit-scrollbar,
-main::-webkit-scrollbar,
-ul::-webkit-scrollbar {
-  width: 6px;
-  height: 8px;
-  visibility: hidden;
-}
-div::-webkit-scrollbar-thumb,
-main::-webkit-scrollbar-thumb,
-ul::-webkit-scrollbar-thumb {
-  background-color: var(--scrollBarThumbColor);
-  border-radius: 8px;
-  visibility: hidden;
-}
-
-div:hover::-webkit-scrollbar,
-main:hover::-webkit-scrollbar,
-ul:hover::-webkit-scrollbar {
-  visibility: unset;
-}
-div:hover::-webkit-scrollbar-thumb,
-main:hover::-webkit-scrollbar-thumb,
-ul:hover::-webkit-scrollbar-thumb {
-  visibility: unset;
-}
-
-.invalid-question {
-  border: 2px solid #f44336; /* Material red */
-  border-radius: 4px;
-  padding: 8px;
-  margin-bottom: 4px;
-}
-
-

package/src/form-fields/terms-and-condition-fields/terms-and-condition-fields.component.spec.ts

@@ -1,21 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { TermsAndConditionFieldsComponent } from './terms-and-condition-fields.component';
-
-describe('TermsAndConditionFieldsComponent', () => {
-  let component: TermsAndConditionFieldsComponent;
-  let fixture: ComponentFixture<TermsAndConditionFieldsComponent>;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      declarations: [TermsAndConditionFieldsComponent]
-    });
-    fixture = TestBed.createComponent(TermsAndConditionFieldsComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/form-fields/terms-and-condition-fields/terms-and-condition-fields.component.ts

@@ -1,62 +0,0 @@
-import { Component, Input } from '@angular/core';
-import { FormService } from '../../services/form.service';
-import { DataService } from '../../services/data.service';
-import { HttpClient, HttpHeaders } from '@angular/common/http';
-import { Observable } from 'rxjs';
-@Component({
-  selector: 'lib-terms-and-condition-fields',
-  templateUrl: './terms-and-condition-fields.component.html',
-  styleUrls: ['./terms-and-condition-fields.component.scss'],
-})
-export class TermsAndConditionFieldsComponent {
-  @Input() question: any = {};
-  @Input() inLine: boolean = false;
-  
-  count: number = 0;
-  required: boolean = false;
-  hint: string = '';
-  fileDataUrl:any;
-  private apiUrl: string = '';
-  imgUrl:any
-  header: any = {};
-  visible:boolean=false;
-  constructor(
-    private formService: FormService,
-    private http: HttpClient, 
-    private dataService: DataService
-  ) {
-    this.dataService.apiUrl$.subscribe((data) => {
-      this.apiUrl = data;
-    });
-  }
-  ngOnInit() {
-    this.count = this.question.count;
-    this.required = this.question.required;
-    this.hint = this.question.hint;
-    this.fileDataUrl=this.question.formElement.termsAndConditionType.fileUrl
-    this.question;
-    this.count;
-  }
-  preview(): Observable<any> {
-    const headers = new HttpHeaders({
-      'Content-Type': this.header.contentType,
-      'auth-user': this.header.authUser,
-    });
-    const body = {
-      // Your request body content here
-    };
-    const options = {
-      headers: headers,
-      body: body,
-    };
-    const fileUrl =this.fileDataUrl;
-    const encodedFileUrl = encodeURIComponent(fileUrl);
-    const fullUrl = `?url=${encodedFileUrl}`;
-    this.imgUrl= (this.apiUrl + `/api/cdn/preview${fullUrl}`);
-    this.visible= true;
-    return this.http.get<any>(this.apiUrl + `/api/cdn/preview${fullUrl}`, options);
-  }
-  closeModal() {
-    this.visible = false;
-  }
-}

package/src/form-fields/text-area-fields/text-area-fields.component.html

@@ -1,68 +0,0 @@
-<div
-  [ngClass]="{ 'mb-4': !inLine }"
-  class="px-3"
-  [id]="(inLine || inCard) ? 'question-' + submissionIndex + '-' + question.id : 'question-' + question.id"
-  [attr.name]="question.testElementName"
->
-  <div class="input-wrapper mb-2" *ngIf="!inLine">
-    <div *ngIf="question.questionNumber" [innerHTML]="question.questionNumber"></div>
-    <span *ngIf="question.questionNumber" class="space"></span> <label>{{ question.question }}</label
-    >&nbsp;
-    <span class="text-danger" *ngIf="question?.required">*</span>
-    <div
-      class="svg-wrapper mb-2 hintIcon"
-      [attr.data-title]="hint"
-      *ngIf="hint"
-    >
-      <svg
-        class="hintSvg"
-        viewBox="0 0 30 30"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <path
-          fill-rule="evenodd"
-          clip-rule="evenodd"
-          d="M15 26.25V26.25C8.78625 26.25 3.75 21.2138 3.75 15V15C3.75 8.78625 8.78625 3.75 15 3.75V3.75C21.2138 3.75 26.25 8.78625 26.25 15V15C26.25 21.2138 21.2138 26.25 15 26.25Z"
-          stroke="#323232"
-          stroke-width="1.5"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        />
-        <path
-          d="M15 16.5623V16.2498C15 15.2285 15.6312 14.6748 16.2637 14.2498C16.8812 13.8335 17.5 13.291 17.5 12.291C17.5 10.9098 16.3813 9.79102 15 9.79102C13.6187 9.79102 12.5 10.9098 12.5 12.291"
-          stroke="#323232"
-          stroke-width="1.5"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        />
-        <path
-          d="M14.9988 20C14.8263 20 14.6863 20.14 14.6875 20.3125C14.6875 20.485 14.8275 20.625 15 20.625C15.1725 20.625 15.3125 20.485 15.3125 20.3125C15.3125 20.14 15.1725 20 14.9988 20"
-          stroke="#323232"
-          stroke-width="1.5"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        />
-      </svg>
-    </div>
-  </div>
-  <textarea
-    #textarea
-    class="form-control mb-2"
-    [ngClass]="{ 'no-scroll': numberOfRows }"
-    [rows]="numberOfRows"
-    wrap="hard"
-    (input)="validateInput($event)"
-    (blur)="validateTextarea()"
-    [(ngModel)]="enteredText"
-    [class.invalid]="validationFailed"
-    [class.invalid-question]="isInvalid && (!inLine || !enteredText)"
-    [maxlength]="characterCount"
-    [disabled]="disableEdit"
-  ></textarea>
-  <div *ngIf="isInvalid && (!inLine || !enteredText)" class="error-message">
-    {{ errorMessage }}
-  </div>
-  <div *ngIf="validationFailed && !isInvalid" class="text-danger error-message">
-    {{ validationMessage }}
-  </div>
-</div>

package/src/form-fields/text-area-fields/text-area-fields.component.scss

@@ -1,19 +0,0 @@
-@import '../../styles/shared-style.scss';
-
-.no-scroll {
-    overflow: hidden !important;
-    resize: none; /* Prevents manual resizing */
-    line-height: 1.5; /* Ensuring consistent line spacing */
-    padding: 5px 10px; /* Adjust as needed */
-  }
-
-  .invalid-question {
-    border: 2px solid #f44336; /* Material red */
-    border-radius: 4px;
-    padding: 8px;
-    margin-bottom: 4px;
-  }
-  
-  
-
-

package/src/form-fields/text-area-fields/text-area-fields.component.spec.ts

@@ -1,21 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { TextAreaFieldsComponent } from './text-area-fields.component';
-
-describe('TextAreaFieldsComponent', () => {
-  let component: TextAreaFieldsComponent;
-  let fixture: ComponentFixture<TextAreaFieldsComponent>;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      declarations: [TextAreaFieldsComponent]
-    });
-    fixture = TestBed.createComponent(TextAreaFieldsComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/form-fields/text-area-fields/text-area-fields.component.ts

@@ -1,166 +0,0 @@
-import { Component, Input, ElementRef, ViewChild, AfterViewInit, Output, EventEmitter } from '@angular/core';
-import { ValidationService } from '../../services/validation.service';
-import { ElementTrackerService } from '../../services/element-tracker.service';
-import { WhenClauseService } from '../../services/whenClause.service';
-
-@Component({
-  selector: 'lib-text-area-fields',
-  templateUrl: './text-area-fields.component.html',
-  styleUrls: ['./text-area-fields.component.scss'],
-})
-export class TextAreaFieldsComponent implements AfterViewInit {
-  @Input() question: any = {};
-  @Input() inLine: boolean = false;
-  @Input() inCard: boolean = false;
-  @Input() submissionIndex!: number;
-  @ViewChild('textarea') textarea!: ElementRef<HTMLTextAreaElement>;
-  @Output() answerChange = new EventEmitter<{ answer: any; maxPossibleScore?: number }>();
-
-  answer: string = '';
-  count: number = 0;
-  required: boolean = false;
-  hint: string = '';
-  numberOfRows!: number;
-  limitedCharacters!: boolean;
-  characterCount!: number;
-  validationFailed: boolean = false;
-  validationMessage: string = '';
-  enteredText: string = '';
-  maxHeight!: number;
-  lineHeight!: number;
-  defaultValue: string = '';
-  @Input() disableEdit: boolean = false;
-  private subscribedToWhenClause = false;
-
-  ngOnInit() {
-    this.valueAssigned();
-  }
-  private elementId: string='';
-
- constructor(
-      private validationService: ValidationService,
-      private tracker: ElementTrackerService,
-      private whenClauseService:WhenClauseService
-    )  { }
-
-  ngAfterViewInit() {
-    if (this.textarea?.nativeElement) {
-      this.calculateMaxHeight();
-    }
-
-    this.elementId = `question-${this.question.id}`;
-    this.tracker.registerElement(this.elementId);
-  }
-
-  valueAssigned() {
-    this.count = this.question.count;
-    this.required = this.question.required;
-    this.hint = this.question.hint;
-    this.numberOfRows = this.question.formElement.appearance.numberOfRows;
-    this.limitedCharacters = this.question.formElement.validation.limitedCharacters;
-    this.defaultValue = this.question?.defaultValue;
-    this.disableEdit = this.disableEdit ?? this.question?.disableEdit ?? false;
-    this.enteredText = this.defaultValue;
-    if (this.limitedCharacters) {
-      this.characterCount = this.question.formElement.validation.count;
-    }
-    if(this.question.answer){
-      this.enteredText = this.question?.answer;
-      setTimeout(() => {
-        this.whenClauseService.setQuestionAnswer(this.question.id,this.question.answer,true);
-      });
-    }else if(this.defaultValue && !this.question.answer){
-      this.question.answer = this.defaultValue;
-    } else{
-      setTimeout(() => {
-        this.whenClauseService.setQuestionAnswer(this.question.id,'',true);
-      });
-    }
-  }
-
-  calculateMaxHeight() {
-    const textareaEl = this.textarea.nativeElement;
-    const computedStyles = window.getComputedStyle(textareaEl);
-
-    // Get accurate line height
-    this.lineHeight = parseFloat(computedStyles.lineHeight); // Default fallback to 20px
-
-    // Consider padding and borders
-    const paddingTop = parseFloat(computedStyles.paddingTop) || 0;
-    const paddingBottom = parseFloat(computedStyles.paddingBottom) || 0;
-    const borderTop = parseFloat(computedStyles.borderTopWidth) || 0;
-    const borderBottom = parseFloat(computedStyles.borderBottomWidth) || 0;
-
-    // Correct height calculation
-    this.maxHeight = (this.lineHeight * this.numberOfRows) + paddingTop + paddingBottom + borderTop + borderBottom;
-
-    textareaEl.style.height = `${this.maxHeight}px`; // Set exact height
-  }
-
-  validateInput(event: Event) {
-    const textarea = event.target as HTMLTextAreaElement;
-
-    // Restrict overflow beyond max height
-    while (textarea.scrollHeight > this.maxHeight) {
-      textarea.value = textarea.value.slice(0, -1);
-    }
-
-    this.question.answer = textarea.value;
-    this.answerChange.emit({answer:this.question.answer,maxPossibleScore:0});
-    setTimeout(() => {
-      this.whenClauseService.setQuestionAnswer(this.question.id,this.question.answer,true);
-    });
-    this.validateTextarea();
-  }
-
-  validateTextarea() {
-    this.validationFailed = false;
-    this.validationService.clearInvalid(this.buildElementId());
-    this.validationMessage = '';
-
-    if (!this.enteredText && this.required && this.question.required) {
-      this.validationFailed = true;
-      this.validationMessage = 'This is a required question';
-      this.question.validation = false;
-      this.question.validationMessage = 'This is a required question';
-          if (!this.subscribedToWhenClause) {
-        this.subscribedToWhenClause = true;
-        this.whenClauseService.onQuestionChange().subscribe(change => {
-          this.validateTextarea();
-    });
-  }
-    } else {
-      this.question.validation = true;
-    }
-  }
-
-
-  handleValidation(isValid: boolean, message: string = 'This field is required') {
-    if (isValid) {
-      this.validationService.clearInvalid(this.buildElementId());
-    } else {
-      // this.validationService.setInvalid(this.question.id, message);
-    }
-  }
-
-  private buildElementId(): string {
-    return (this.inLine || this.inCard)
-      ? `${this.submissionIndex}-${this.question.id}`
-      : `${this.question.id}`;
-  }
-
-  get isInvalid(): boolean {
-    return !!this.validationService.getErrorMessage(this.buildElementId());
-  }
-
-  get errorMessage(): string | null {
-    return this.validationService.getErrorMessage(this.buildElementId());
-  }
-
-
-  ngOnDestroy() {
-    if (this.elementId) {
-      this.tracker.unregisterElement(this.elementId);
-    }
-  }
-}

package/src/form-fields/text-fields/text-fields.component.html

@@ -1,67 +0,0 @@
-<div
-  [ngClass]="{ 'mb-4': !inLine }"
-  class="px-3"
-  [id]="(inLine || inCard) ? 'question-' + submissionIndex + '-' + question.id : 'question-' + question.id"
-  [attr.name]="question.testElementName"
->
-  <div class="input-wrapper mb-2" *ngIf="!inLine">
-    <div *ngIf="question.questionNumber" [innerHTML]="question.questionNumber"></div>
-    <span *ngIf="question.questionNumber" class="space"></span> <label>{{ question.question }}</label
-    >&nbsp;
-    <span class="text-danger" *ngIf="question.required">*</span>
-    <div
-      class="svg-wrapper mb-2 hintIcon"
-      [attr.data-title]="hint"
-      *ngIf="hint"
-    >
-      <svg
-        class="hintSvg"
-        viewBox="0 0 30 30"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <path
-          fill-rule="evenodd"
-          clip-rule="evenodd"
-          d="M15 26.25V26.25C8.78625 26.25 3.75 21.2138 3.75 15V15C3.75 8.78625 8.78625 3.75 15 3.75V3.75C21.2138 3.75 26.25 8.78625 26.25 15V15C26.25 21.2138 21.2138 26.25 15 26.25Z"
-          stroke="#323232"
-          stroke-width="1.5"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        />
-        <path
-          d="M15 16.5623V16.2498C15 15.2285 15.6312 14.6748 16.2637 14.2498C16.8812 13.8335 17.5 13.291 17.5 12.291C17.5 10.9098 16.3813 9.79102 15 9.79102C13.6187 9.79102 12.5 10.9098 12.5 12.291"
-          stroke="#323232"
-          stroke-width="1.5"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        />
-        <path
-          d="M14.9988 20C14.8263 20 14.6863 20.14 14.6875 20.3125C14.6875 20.485 14.8275 20.625 15 20.625C15.1725 20.625 15.3125 20.485 15.3125 20.3125C15.3125 20.14 15.1725 20 14.9988 20"
-          stroke="#323232"
-          stroke-width="1.5"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-        />
-      </svg>
-    </div>
-  </div>
-
-  <input
-    type="text"
-    class="form-control mb-2 height"
-    [placeholder]="placeholder"
-    [(ngModel)]="enteredText"
-    (blur)="validatetextField()"
-    (input)="validateInput($event)"
-    [class.invalid]="validationFailed"
-    [class.invalid-question]="isInvalid && (!inLine || !enteredText)"
-    [id]="question.id"
-    [disabled]="disableEdit"
-  />
-  <div *ngIf="isInvalid && (!inLine || !enteredText)" class="error-message">
-    {{ errorMessage }}
-  </div>
-  <div *ngIf="validationFailed && !isInvalid" class="text-danger error-message">
-    {{ validationMessage }}
-  </div>
-</div>

package/src/form-fields/text-fields/text-fields.component.scss

@@ -1,26 +0,0 @@
-@import '../../styles/shared-style.scss';
-
-
-
-
-.form-control:not(:placeholder-shown).bold {
-  font-weight: bold;
-}
-
-.form-control:not(:placeholder-shown).underline {
-  text-decoration: underline;
-}
-
-.form-control:not(:placeholder-shown).italics {
-  font-style: italic;
-}
-
-.invalid-question {
-  border: 2px solid #f44336; /* Material red */
-  border-radius: 4px;
-  padding: 8px;
-  margin-bottom: 4px;
-}
-
-
-

package/src/form-fields/text-fields/text-fields.component.spec.ts

@@ -1,21 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { TextFieldsComponent } from './text-fields.component';
-
-describe('TextFieldsComponent', () => {
-  let component: TextFieldsComponent;
-  let fixture: ComponentFixture<TextFieldsComponent>;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      declarations: [TextFieldsComponent]
-    });
-    fixture = TestBed.createComponent(TextFieldsComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});