{"__symbolic":"module","version":4,"metadata":{"EventLibraryService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":4,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":12,"character":5},"arguments":["urlConfig"]}]],"parameters":[{"__symbolic":"reference","name":"any"}]}]},"statics":{"ɵprov":{}}},"EventLibraryComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"sb-event-library","template":"\n    <p>\n      event-library works!\n    </p>\n  ","styles":[]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"EventLibraryModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":21,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"EventLibraryComponent"}],"imports":[{"__symbolic":"reference","name":"EventsModule"},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClientModule","line":25,"character":4}],"exports":[{"__symbolic":"reference","name":"EventsModule"}],"providers":[{"__symbolic":"reference","name":"EventDetailService"},{"__symbolic":"reference","name":"EventCreateService"},{"__symbolic":"reference","name":"EventListService"},{"__symbolic":"reference","name":"EventFilterService"},{"__symbolic":"reference","name":"SbToastService"},{"__symbolic":"reference","name":"TimezoneCal"},{"__symbolic":"reference","name":"UserConfigService"},{"__symbolic":"reference","name":"DataService"},{"__symbolic":"reference","name":"EventService"}]}]}],"members":{},"statics":{"forChild":{"__symbolic":"function","parameters":["config"],"value":{"ngModule":{"__symbolic":"reference","name":"EventLibraryModule"},"providers":[{"__symbolic":"reference","name":"EventLibraryService"},{"provide":"urlConfig","useValue":{"__symbolic":"reference","name":"config"}}]}}}},"EventsModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":53,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"EventDetailComponent"},{"__symbolic":"reference","name":"EventCreateComponent"},{"__symbolic":"reference","name":"JoinEventComponent"},{"__symbolic":"reference","name":"AdvanceEventDetailComponent"},{"__symbolic":"reference","name":"CoverEventDetailComponent"},{"__symbolic":"reference","name":"EventFilterComponent"},{"__symbolic":"reference","name":"CollectionIconComponent"},{"__symbolic":"reference","name":"AssetBrowserComponent"},{"__symbolic":"reference","name":"EnrollEventUsersComponent"},{"__symbolic":"reference","name":"LibEventComponent"},{"__symbolic":"reference","name":"UserDetailedAttendanceComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":72,"character":4},{"__symbolic":"reference","module":"common-form-elements-event","name":"EventCommonFormElementsModule","line":74,"character":4},{"__symbolic":"reference","module":"common-form-elements-v9","name":"CommonFormElementsModule","line":75,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":76,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":77,"character":4},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","module":"ngx-izitoast","name":"NgxIziToastModule","line":79,"character":4},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClientModule","line":80,"character":4},{"__symbolic":"reference","module":"ngx-pagination","name":"NgxPaginationModule","line":81,"character":4},{"__symbolic":"reference","module":"ng2-semantic-ui-v9","name":"SuiModule","line":82,"character":4},{"__symbolic":"reference","module":"ngx-infinite-scroll","name":"InfiniteScrollModule","line":83,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":85,"character":4},{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":86,"character":4},{"__symbolic":"reference","module":"@angular/material/form-field","name":"MatFormFieldModule","line":87,"character":4},{"__symbolic":"reference","module":"@angular/material/input","name":"MatInputModule","line":88,"character":4},{"__symbolic":"reference","module":"@angular/material/select","name":"MatSelectModule","line":89,"character":4},{"__symbolic":"reference","module":"@angular/material/core","name":"MatOptionModule","line":90,"character":4},{"__symbolic":"reference","module":"@angular/material/datepicker","name":"MatDatepickerModule","line":91,"character":4},{"__symbolic":"reference","module":"@angular/material/core","name":"MatNativeDateModule","line":92,"character":4},{"__symbolic":"reference","module":"@angular/material/autocomplete","name":"MatAutocompleteModule","line":94,"character":4},{"__symbolic":"reference","module":"@angular/material/chips","name":"MatChipsModule","line":95,"character":4},{"__symbolic":"reference","module":"ngx-slick-carousel","name":"SlickCarouselModule","line":99,"character":4},{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":108,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":109,"character":4},{"__symbolic":"reference","module":"@ng-bootstrap/ng-bootstrap","name":"NgbModalModule","line":110,"character":4},{"__symbolic":"reference","module":"@ng-select/ng-select","name":"NgSelectModule","line":116,"character":4}],"exports":[{"__symbolic":"reference","name":"EventDetailComponent"},{"__symbolic":"reference","name":"EventCreateComponent"},{"__symbolic":"reference","name":"JoinEventComponent"},{"__symbolic":"reference","name":"AdvanceEventDetailComponent"},{"__symbolic":"reference","name":"CoverEventDetailComponent"},{"__symbolic":"reference","name":"EventFilterComponent"},{"__symbolic":"reference","name":"EnrollEventUsersComponent"},{"__symbolic":"reference","name":"LibEventComponent"},{"__symbolic":"reference","name":"UserDetailedAttendanceComponent"}],"providers":[]}]}],"members":{}},"httpTranslateLoader":{"__symbolic":"function"},"EventDetailComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"sb-event-detail","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":10,"character":17},"member":"None"},"template":"<div class=\"event-wrapper\">\n    <sb-cover-event-detail [eventDetailItem]=\"eventDetailItem\"></sb-cover-event-detail>\n    <sb-join-event-button [eventDetailItem]=\"eventDetailItem\" [canUnenroll]=\"canUnenroll\"></sb-join-event-button>\n    <sb-advance-event-detail [eventDetailItem]=\"eventDetailItem\"></sb-advance-event-detail>\n\n</div>","styles":[""]}]}],"members":{"eventDetailItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"canUnenroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":26,"character":28},{"__symbolic":"reference","name":"EventDetailService"},{"__symbolic":"reference","name":"LibEventService"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"EventCreateComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":52,"character":1},"arguments":[{"selector":"sb-event-create","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":56,"character":17},"member":"None"},"template":"<div class=\"sb-bg-lightBlue bb-1 event-design-form\">\n  <div class=\"d-flex flex-jc-space-between flex-ai-center py-20 ui container\">\n    <div>\n      <div class=\"practical-header__title font-weight-bold pl-20 fs-0-92\">\n        Create Event\n      </div>\n    </div>\n  </div>\n</div>\n<!-- <h5>\n  Note: You cannot create an event for today. Please select a future date for\n  your event.\n</h5> -->\n\n<div class=\"p-40 event-form\">\n  <lib-collection-icon\n    *ngIf=\"showAppIcon && ImageConfig\"\n    [appIcon]=\"eventImage || appIcon\"\n    [appIconConfig]=\"appIconConfig\"\n    (iconEmitter)=\"appIconDataHandler($event)\"\n    [libEventServicesData]=\"ImageConfig\"\n  ></lib-collection-icon>\n  <ng-container *ngIf=\"isNew; then New; else Edit\"></ng-container>\n  <ng-template #New>\n    <div\n      *ngIf=\"\n        formFieldProperties != undefined && formFieldProperties?.length > 0\n      \"\n    >\n      <sb-event-dynamic-form\n        class=\"label-1\"\n        [config]=\"formFieldProperties\"\n        (initialize)=\"output($event)\"\n        (statusChanges)=\"onStatusChanges($event)\"\n        (valueChanges)=\"valueChanges($event)\"\n      >\n      </sb-event-dynamic-form>\n    </div>\n  </ng-template>\n  <ng-template #Edit>\n    <div *ngIf=\"formFieldData != undefined && formFieldData?.length > 0\">\n      <sb-event-dynamic-form\n        class=\"label-1\"\n        [config]=\"formFieldData\"\n        (valueChanges)=\"valueChanges($event)\"\n      >\n      </sb-event-dynamic-form>\n    </div>\n  </ng-template>\n\n  <div class=\"autocomplete-container\" *ngIf=\"isPrivateEvent()\">\n    <!-- User Chips Displayed Above Input -->\n    <!-- Input Field with Autocomplete -->\n    <div class=\"example-full-width\">\n      <label>Select Users <span class=\"sb-color-red\">*</span></label>\n      <div class=\"select-box\">\n        <input\n          type=\"text\"\n          placeholder=\"Select Users\"\n          matInput\n          [formControl]=\"searchControl\"\n          [matAutocomplete]=\"auto\"\n          #userInput\n        />\n        <mat-autocomplete\n          #auto=\"matAutocomplete\"\n          (optionSelected)=\"onOptionSelected($event)\"\n        >\n          <ng-container *ngIf=\"filteredUsers.length > 0; else noUsersFound\">\n            <mat-option\n              *ngFor=\"let user of filteredUsers\"\n              [value]=\"user.userId\"\n            >\n              {{ user.firstName }} {{ user.lastName }}\n            </mat-option>\n          </ng-container>\n          <ng-template #noUsersFound>\n            <mat-option disabled>No users found</mat-option>\n          </ng-template>\n        </mat-autocomplete>\n        <div class=\"selected-users\">\n          <mat-chip-list>\n            <mat-chip\n              *ngFor=\"let user of selectedUsers\"\n              [removable]=\"true\"\n              (removed)=\"removeUser(user)\"\n            >\n              {{ user.firstName }} {{ user.lastName }}\n              <mat-icon matChipRemove>close</mat-icon>\n            </mat-chip>\n          </mat-chip-list>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"autocomplete-container\" *ngIf=\"isAttachCertificate()\">\n    <div class=\"example-full-width\">\n      <label>Select Certificate <span class=\"sb-color-red\">*</span></label>\n      <div class=\"select-box\">\n        <mat-form-field class=\"full-width\">\n          <mat-select\n            [(value)]=\"selectedCertificate\"\n            placeholder=\"Select Certificate\"\n          >\n            <mat-option\n              *ngFor=\"let certificate of certificateList\"\n              [value]=\"certificate\"\n            >\n              {{ certificate.name }}\n            </mat-option>\n            <mat-option *ngIf=\"certificateList.length === 0\" disabled>\n              No Certificate found\n            </mat-option>\n          </mat-select>\n        </mat-form-field>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"d-flex my-24 flex-jc-flex-end\">\n    <button\n      type=\"button\"\n      class=\"sb-btn sb-btn-outline-primary sb-btn-md ripple\"\n      (click)=\"cancel()\"\n    >\n      Cancel\n    </button>\n    <!-- //@TODO - Added [ngClass] in below button-->\n    <button\n      [disabled]=\"isDisabled\"\n      type=\"button\"\n      class=\"sb-btn sb-btn-md ripple ml-12\"\n      [ngClass]=\"{\n        'sb-btn-success': !isDisabled,\n        'sb-btn-outline-disabled': isDisabled\n      }\"\n      (click)=\"openPopup(true)\"\n    >\n      Save To Publish\n    </button>\n    <button\n      [disabled]=\"isDisabled\"\n      type=\"button\"\n      class=\"sb-btn sb-btn-md ripple ml-12\"\n      [ngClass]=\"{\n        'sb-btn-primary': !isDisabled,\n        'sb-btn-outline-disabled': isDisabled\n      }\"\n      (click)=\"postData(false)\"\n    >\n      Save As Draft\n    </button>\n  </div>\n\n  <p class=\"d-flex my-24 flex-jc-flex-end\" *ngIf=\"this.isDisabled\">\n    Publish events cannot be saved as draft and save to publish.\n  </p>\n</div>\n\n<div\n  class=\"modal\"\n  *ngIf=\"isPopupOpen\"\n  style=\"\n    position: fixed;\n    top: -150px;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    z-index: 11111;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  \"\n>\n  <div\n    style=\"\n      background: white;\n      padding: 20px;\n      border-radius: 8px;\n      width: 400px;\n      box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;\n    \"\n  >\n    <h3>Enter Email and Consent</h3>\n\n    <!-- Email Input -->\n    <div class=\"required mb-16\">\n      <label for=\"popup-email\" class=\"mb-8 font-weight-bold\">\n        Email <span class=\"sb-color-red\">*</span>\n      </label>\n      <input\n        id=\"popup-email\"\n        class=\"sb-form-control\"\n        type=\"email\"\n        [(ngModel)]=\"email\"\n        placeholder=\"Enter your email\"\n        #emailInput=\"ngModel\"\n        required\n        email\n        pattern=\"^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$\"\n      />\n    </div>\n    <div\n      *ngIf=\"emailInput.invalid && (emailInput.dirty || emailInput.touched)\"\n      style=\"color: red\"\n    >\n      <div *ngIf=\"emailInput.errors?.required\">Email is required.</div>\n      <div *ngIf=\"emailInput.errors?.email || emailInput.errors?.pattern\">\n        Please enter a valid email address.\n      </div>\n      <!-- <div *ngIf=\"emailInput.errors?.pattern\">\n      Please enter a valid email address.\n    </div> -->\n    </div>\n\n    <!-- Consent Checkbox -->\n    <div class=\"mb-16\">\n      <label>\n        <input type=\"checkbox\" [(ngModel)]=\"consent\" />\n        We value your privacy and are committed to protecting your personal\n        data. Please read the following information carefully and provide your\n        consent.Purpose of Collection: We are collecting your emailID for the\n        following purposes: Sending details about the event. Your email ID will\n        be used solely for the purposes stated above and will not be shared with\n        third parties without your explicit consent.You have the right to\n        withdraw your consent at any time. To withdraw your consent, please\n        contact us at nulp@nulp.niua.org. The process for withdrawing consent is\n        as simple as providing it.Your email ID will be retained for as long as\n        necessary to fulfill the purposes for which it was collected or as\n        required by law. By providing your email ID and ticking the box below,\n        you consent to the collection and use of your email ID for the purposes\n        stated above.\n      </label>\n    </div>\n\n    <!-- Modal Actions -->\n    <div class=\"d-flex justify-content-end\">\n      <button\n        class=\"sb-btn sb-btn-outline-primary sb-btn-md\"\n        (click)=\"closePopup()\"\n      >\n        Cancel\n      </button>\n      <button\n        class=\"sb-btn sb-btn-success sb-btn-md ml-12\"\n        [disabled]=\"\n          !email ||\n          !consent ||\n          emailInput.errors?.email ||\n          emailInput.errors?.pattern\n        \"\n        (click)=\"submitPopup()\"\n      >\n        Submit\n      </button>\n    </div>\n  </div>\n</div>\n","styles":[".two-column-grid{-moz-column-gap:1.5rem;border-bottom:1px solid var(--gray-100);column-gap:1.5rem;display:grid;grid-template-columns:repeat(2,1fr)}.two-column-grid:last-child{border-bottom:none}.two-column-grid.formSection:first-child .sb-g-col-lg-1:nth-child(2n) .sb-textarea-container{margin:0!important}.formSection{padding:1.5rem 0}.formSection:first-child{padding:0 0 1.5rem}.multi-select-section-app label{margin-bottom:.3rem!important}.list-border{height:2.8rem!important}.list-border ul{padding:0!important}.list-border ul span{font-size:.785rem;font-weight:500!important}.multi-select-container .sb-modal-dropdown-web ul{border:none!important}.list-border,.sb-textarea,.sb-textbox,.topic-picker-selector,select{border:1px solid rgba(34,36,38,.15)!important;border-radius:.28571429rem;font-size:.785rem!important;font-weight:500!important;padding:.85rem .5rem!important;width:100%!important}select:disabled{background-color:#efefef!important;opacity:.6}.sb-modal-dropdown-web ul{border:2px solid #eeeeef;color:#333;font-size:12px!important;font-weight:500;margin:0!important;opacity:1!important;padding:0}.sb-keywordbox{border:1px solid rgba(34,36,38,.15)!important;border-radius:.28571429rem;font-size:.785rem!important;font-weight:500;padding:0!important}.sb-keywordbox .ng2-tag-input{padding:0}.sb-keywordbox .ng2-tag-input tag{margin-left:.5rem}.sb-keywordbox .ng2-tags-container{margin-top:.2rem}.sb-keywordbox .tag-wrapper,.sb-keywordbox delete-icon svg{height:24px!important;line-height:24px}label{color:rgba(18,18,19,.8784313725490196);font-size:12px!important;font-weight:500;margin-bottom:.5rem!important}.multi-select-container .list-border ul{color:#333;font-size:12px!important;font-weight:500;font-weight:500!important;margin:0!important;opacity:1!important;padding:0}.sb-dropdown label{padding:0!important}.sb-textarea-container .sb-textarea{color:#000}.sb-textarea-container label{padding:0!important}.sb-checkbox{margin-top:3.2rem;padding:1.5rem 0}textarea-container .sb-textarea{height:2.9rem;padding-top:.5rem!important}textarea-container label{padding:0!important}sb-icon-dropdown{right:6px!important;top:10px!important}.sb-dropdown,.sb-textarea-container{margin:1rem 0!important}.dynamic-form .sb-search-input::-webkit-input-placeholder{padding-left:1.4rem!important}.dynamic-form .required label:after{color:#db2828;content:\"*\";margin:-.2em 0 0 .2em}.search-container{margin-left:1rem}.w-85{max-width:85%;width:85%}.w-96{max-width:96%;width:96%}.required{color:red}.ui.modal{display:block!important;max-width:45rem}.event-form{background:var(--white);position:relative;z-index:999!important}.chat_bot,lib-chat-window{display:none}.sb-keywords input{width:100%}.event-design-form{background:#e5edf5;border-bottom:1px solid #d8d8d8}.email-box{background:rgba(134,192,215,.1803921568627451);border:1px solid #000;border-radius:10px solid #000;padding:2rem!important}.autocomplete-container{display:flex;flex-direction:column;width:100%}.selected-users{margin-bottom:40px}.mat-form-field{width:100%}.select-box input{border:1px solid rgba(34,36,38,.15)!important;border-radius:.28571429rem;font-size:.785rem!important;font-weight:500;margin-bottom:25px;padding:15px!important;width:100%}"]}]}],"members":{"formFieldProperties":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":59,"character":3}}]}],"matAutocomplete":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":61,"character":3},"arguments":["auto"]}]}],"userInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":62,"character":3},"arguments":["userInput"]}]}],"closeSaveForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":85,"character":3}}]}],"navAfterSave":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":86,"character":3}}]}],"selectedUserIds":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":163,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":174,"character":28},{"__symbolic":"reference","name":"EventCreateService"},{"__symbolic":"reference","name":"EventDetailService"},{"__symbolic":"reference","name":"EventService"},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":178,"character":20},{"__symbolic":"reference","module":"@angular/common","name":"Location","line":179,"character":22},{"__symbolic":"reference","name":"SbToastService"},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":181,"character":25},{"__symbolic":"reference","name":"TimezoneCal"},{"__symbolic":"reference","name":"UserConfigService"},{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"LibEventService"}]}],"setAppIconData":[{"__symbolic":"method"}],"isReviewMode":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"fetchAndMapExistingUsers":[{"__symbolic":"method"}],"getCertificateList":[{"__symbolic":"method"}],"getUsers":[{"__symbolic":"method"}],"updateUserMap":[{"__symbolic":"method"}],"isUserSelected":[{"__symbolic":"method"}],"onOptionSelected":[{"__symbolic":"method"}],"removeUser":[{"__symbolic":"method"}],"filterUsers":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"isPrivateEvent":[{"__symbolic":"method"}],"isAttachCertificate":[{"__symbolic":"method"}],"openPopup":[{"__symbolic":"method"}],"closePopup":[{"__symbolic":"method"}],"submitPopup":[{"__symbolic":"method"}],"prepareFormConfiguration":[{"__symbolic":"method"}],"setEventTypeDependentFields":[{"__symbolic":"method"}],"clearEventTypeFieldsOnSwitch":[{"__symbolic":"method"}],"output":[{"__symbolic":"method"}],"onStatusChanges":[{"__symbolic":"method"}],"initializeFormFields":[{"__symbolic":"method"}],"valueChanges":[{"__symbolic":"method"}],"setOnlineProviderDependentFields":[{"__symbolic":"method"}],"onValueChangeUpdateFieldBehaviour":[{"__symbolic":"method"}],"postData":[{"__symbolic":"method"}],"dataSubmitted":[{"__symbolic":"method"}],"createEventBatch":[{"__symbolic":"method"}],"cancel":[{"__symbolic":"method"}],"updateEventWithGmeetLink":[{"__symbolic":"method"}],"timeValidation":[{"__symbolic":"method"}],"dateValidation":[{"__symbolic":"method"}],"appIconDataHandler":[{"__symbolic":"method"}]}},"CoverEventDetailComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":16,"character":1},"arguments":[{"selector":"sb-cover-event-detail","template":"<!-- <div>\n    <div class=\"d-flex sb-bg-color-gray-0 w-100\">\n        <div *ngIf=\"eventDetailItem?.appIcon\" class=\"w-30 coverImg\">\n            <img src=\"{{eventDetailItem?.appIcon}}\"width=\"100%\" height=\"100%\">\n        </div>\n        <div *ngIf=\"!eventDetailItem?.appIcon\" class=\"w-30 coverImg\">\n            <img src=\"./assets/images/eventcover.jpg\"  width=\"300\" height=\"250\">\n        </div>\n\n        <div class=\"ml-20\">\n            <h2 class=\"fs-1.3\">{{eventDetailItem?.name}}</h2>\n            <div class=\"mt-12\" *ngIf=\"eStart\">\n                <div>\n                    <i class=\"fa fa-calendar fs-1\"></i> <span class=\"fs-0-92\"> &nbsp; {{eStart}} - {{eEnd}} ({{timezoneshort}})</span>\n                </div>\n\n                <div *ngIf=\"isOwner\">\n                    <button type=\"button\" class=\"sb-btn sb-btn-primary sb-btn-normal mt-20 mr-12\" (click)=\"dashboard();\">View Dashboard</button>\n                </div>\n            </div>\n        </div>\n        <div *ngIf=\"eventDetailItem?.eventType == 'Online'\" class=\"sb-label-status sb-label-status-success ml-auto mr-20 p-12 mt-10\">\n            <span class=\"sb-label-status-indicator sb-label-status-indicator-success\"></span><span class=\"text-capitalize \">{{eventDetailItem?.eventType}}</span>\n        </div>\n        <div *ngIf=\"eventDetailItem?.eventType == 'Offline'\" class=\"sb-label-status sb-label-status-error ml-auto mr-20 p-12 mt-10\">\n            <span class=\"sb-label-status-indicator sb-label-status-indicator-error\"></span><span class=\"text-capitalize \">{{eventDetailItem?.eventType}}</span>\n        </div>\n        <div *ngIf=\"eventDetailItem?.eventType == 'OnlineAndOffline'\" class=\"sb-label-status sb-label-primary-100 ml-auto mr-20 p-12 mt-10\">\n            <span class=\"sb-label-status-indicator sb-label-status-indicator-primary\"></span><span class=\"text-capitalize \">{{eventDetailItem?.eventType}}</span>\n        </div>\n\n    </div>\n</div> -->\n\n<!-- <div class=\"ml-30\"> -->\n<div class=\"\">\n  <!-- <div class=\"d-flex sb-bg-color-gray-0 w-100 mt-40\"> -->\n  <!-- <div class=\"sb-g sb-g--gap24 sb-bg-color-gray-0 training-relevant\"> -->\n  <div class=\"sb-g sb-g--gap24 sb-bg-color-white p-15 sb-bg-secondary\">\n    <!-- <div *ngIf=\"eventDetailItem?.appIcon\" class=\"ml-30 w-30 coverImg\"> -->\n    <div\n      *ngIf=\"eventDetailItem?.appIcon\"\n      class=\"coverImg mr-10 sb-g-col-xs-12 sb-g-col-md-3 sb-g-col-lg-1 sb-g-col-xxxl-4 relative9\"\n    >\n      <!-- <div _ngcontent-yhb-c64=\"\" class=\"sb--card__type\">Virtual Event</div> -->\n      <span\n        *ngIf=\"eventDetailItem?.eventType == 'Online'\"\n        class=\"sb--card__type\"\n        >{{ \"Virtual Event\" }}</span\n      >\n      <span\n        *ngIf=\"eventDetailItem?.eventType == 'Offline'\"\n        class=\"sb--card__type\"\n        >{{ \"Classroom Event\" }}</span\n      >\n      <span\n        *ngIf=\"eventDetailItem?.eventType == 'OnlineAndOffline'\"\n        class=\"sb--card__type\"\n        >{{ \"Hybrid Event\" }}</span\n      >\n      <img src=\"{{ eventDetailItem?.appIcon }}\" />\n    </div>\n    <!-- <div *ngIf=\"!eventDetailItem?.appIcon\" class=\"ml-30 w-30 coverImg\"> -->\n    <div\n      *ngIf=\"!eventDetailItem?.appIcon\"\n      class=\"coverImg mr-10 sb-g-col-xs-12 sb-g-col-md-3 sb-g-col-lg-1 sb-g-col-xxxl-4 relative9\"\n    >\n      <span\n        *ngIf=\"eventDetailItem?.eventType == 'Online'\"\n        class=\"sb--card__type\"\n        >{{ \"Virtual Event\" }}</span\n      >\n      <span\n        *ngIf=\"eventDetailItem?.eventType == 'Offline'\"\n        class=\"sb--card__type\"\n        >{{ \"Classroom Event\" }}</span\n      >\n      <span\n        *ngIf=\"eventDetailItem?.eventType == 'OnlineAndOffline'\"\n        class=\"sb--card__type\"\n        >{{ \"Hybrid Event\" }}</span\n      >\n      <img src=\"./assets/images/eventcover.png\" />\n    </div>\n    <!-- <div class=\"ml-20 w-60\"> -->\n    <div\n      class=\"sb-g-col-xs-12 sb-g-col-md-9 sb-g-col-lg-9 sb-g-col-xxxl-12 relative9\"\n    >\n      <div class=\"d-flex\">\n        <b\n          ><h1\n            *ngIf=\"!isTruncate\"\n            class=\"fs-1 font-weight-bold sb-color-primary\"\n          >\n            {{ eventDetailItem?.name | slice : 0 : 36 }}\n            <h6>\n              <a\n                class=\"SeeMore sb-btn-link-primary\"\n                *ngIf=\"eventDetailItem?.name.length > 36\"\n                (click)=\"truncateData(true)\"\n                class=\"sb-color-primary\"\n              >\n                {{ \"See More\" }}\n              </a>\n            </h6>\n          </h1></b\n        >\n        <b\n          ><h1 *ngIf=\"isTruncate\">\n            {{ eventDetailItem?.name }}\n            <h6>\n              <a\n                class=\"SeeMore sb-btn-link-primary\"\n                (click)=\"truncateData(false)\"\n                class=\"sb-color-primary\"\n              >\n                {{ \"See Less\" }}\n              </a>\n            </h6>\n          </h1></b\n        >\n        &nbsp;&nbsp;\n      </div>\n      <div *ngIf=\"this.eventConfig.organisations[0].orgName\">\n        <b>{{ eventDetailItem?.description }}</b>\n      </div>\n      <!-- <div *ngIf=\"this.eventConfig.organisations[0].orgName\">\n        <b>{{ this.eventConfig.organisations[0].orgName }}</b>\n      </div> -->\n      <!-- <div class=\"mt-12\">\n                    <i *ngIf=\"eventDetailItem?.gradeLevel\" class=\"fa fa fa-star fs-1\"></i> <span *ngIf=\"eventDetailItem?.gradeLevel\" class=\"fs-0-92\"> &nbsp; {{eventDetailItem?.gradeLevel}}</span>&nbsp;&nbsp;&nbsp;\n\n                    <i *ngIf=\"eventDetailItem?.board\" class=\"fa fa fa-graduation-cap fs-1\"></i>\n                    <span *ngIf=\"eventDetailItem?.board\" class=\"fs-0-92\"> &nbsp; {{eventDetailItem?.board}}</span>&nbsp;&nbsp;&nbsp;\n\n                    <i *ngIf=\"eventDetailItem?.medium\" class=\"fa fa fa-globe fs-1\"></i> <span *ngIf=\"eventDetailItem?.medium\" class=\"fs-0-92\"> &nbsp; {{eventDetailItem?.medium}}</span>&nbsp;&nbsp;&nbsp;\n\n                    <i *ngIf=\"eventDetailItem?.subject\" class=\"fa fa fa-book fs-1\"></i> <span class=\"fs-0-92\"> &nbsp;{{eventDetailItem?.subject}}</span>&nbsp;&nbsp;&nbsp;\n                </div> -->\n      <div class=\"mt-12 d-flex-wrap sb-color-gray-400 fnormal\">\n        <i *ngIf=\"eventDetailItem?.gradeLevel\" class=\"fa fa fa-star fs-1\"></i>\n        <span *ngIf=\"eventDetailItem?.gradeLevel\" class=\"pr-10\">\n          &nbsp; {{ eventDetailItem?.gradeLevel }}</span\n        >\n\n        <i\n          *ngIf=\"eventDetailItem?.board\"\n          class=\"fa fa fa-graduation-cap fs-1\"\n        ></i>\n        <span *ngIf=\"eventDetailItem?.board\" class=\"pr-10\">\n          &nbsp; {{ eventDetailItem?.board }}</span\n        >\n\n        <i *ngIf=\"eventDetailItem?.medium\" class=\"fa fa fa-globe fs-1\"></i>\n        <span *ngIf=\"eventDetailItem?.medium\" class=\"pr-10\">\n          &nbsp; {{ eventDetailItem?.medium }}</span\n        >\n\n        <i *ngIf=\"eventDetailItem?.subject\" class=\"fa fa fa-book fs-1\"></i>\n        <span> &nbsp;{{ eventDetailItem?.subject }}</span>\n      </div>\n      <div class=\"mt-12\" *ngIf=\"eStart\">\n        <div>\n          <i class=\"fa fa-calendar\"></i>\n          <span> &nbsp; {{ eStart }} - {{ eEnd }}</span>\n        </div>\n        &nbsp;\n        <!-- <div  *ngIf=\"eventDetailItem['venue']['name']\">\n                        <i class=\"fa fa-map-marker fs-1\" aria-hidden=\"true\"></i><span class=\"fs-0-92\"> &nbsp; {{this.eventDetailItem['venue']['name']}}</span>\n                    </div> -->\n        <div *ngIf=\"eventDetailItem['venue']['name']\">\n          <i class=\"fa fa-map-marker\" aria-hidden=\"true\"></i\n          ><span> &nbsp; {{ this.eventDetailItem[\"venue\"][\"name\"] }}</span>\n        </div>\n        <div *ngIf=\"isDetalPage\">\n          <sb-join-event-button\n            *ngIf=\"eventDetailItem\"\n            [eventDetailItem]=\"eventDetailItem\"\n            [canUnenroll]=\"true\"\n          ></sb-join-event-button>\n        </div>\n      </div>\n    </div>\n    <div\n      class=\"sb-g-col-lg-2 sb-g-col-xs-12 sb-g-col-md-9 sb-g-col-xxxl-12 z-index-9\"\n    >\n      <div *ngIf=\"eventDetailItem?.eventType != 'Offline'\">\n        <div *ngIf=\"isOwner\" class=\"mr-10\">\n          <button\n            type=\"button\"\n            class=\"sb-color-primary btn-link fs-0-925 mt-10\"\n            (click)=\"dashboard()\"\n          >\n            <i class=\"fad fa-file-chart-line\"></i>View Dashboard\n          </button>\n        </div>\n        <div class=\"d-flex mt-10\" *ngIf=\"isEnrolled || isOwner\">\n          <button\n            *ngIf=\"\n              this.key &&\n              this.eventDetailItem.onlineProviderData['recordings'].length > 1\n            \"\n            type=\"button\"\n            class=\"sb-btn sb-btn-sm sb-btn-link sb-btn-link-primary pl-0\"\n            (click)=\"openRecordingDetailModal()\"\n          >\n            <i class=\"play circle icon\"></i>Play recordings\n          </button>\n          <button\n            type=\"button\"\n            *ngIf=\"\n              this.key &&\n              this.key &&\n              this.eventDetailItem.onlineProviderData['recordings'].length == 1\n            \"\n            class=\"sb-btn sb-btn-sm sb-btn-link sb-btn-link-primary pl-0\"\n          >\n            <a\n              href=\"{{\n                this.eventDetailItem.onlineProviderData['recordings']['0'][\n                  'recordingUrl'\n                ]\n              }}\"\n              target=\"_blank\"\n              ><i class=\"play circle icon\"></i>Play recording</a\n            >\n          </button>\n          <div *ngIf=\"!key\" class=\"d-flex mt-10 sb-color-primary\">\n            <i class=\"play circle icon\"></i><b>Recording not available</b>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n<sui-modal\n  *ngIf=\"\n    openRecordingModal &&\n    this.eventDetailItem.onlineProviderData['recordings'].length > 1\n  \"\n  [mustScroll]=\"true\"\n  [isClosable]=\"true\"\n  [transitionDuration]=\"0\"\n  [size]=\"'large'\"\n  class=\"sb-modal container\"\n  appBodyScroll\n  infiniteScroll\n  [infiniteScrollDistance]=\"2\"\n  [infiniteScrollThrottle]=\"500\"\n  [scrollWindow]=\"false\"\n  (dismissed)=\"openRecordingModal = !openRecordingModal\"\n  #modal\n>\n  <div class=\"sb-modal-header\">\n    {{ this.eventDetailItem.name }}\n  </div>\n  <div class=\"sb-modal-content container\">\n    <table\n      class=\"sb-table sb-table-striped sb-table-sortable sb-table-fixed sb-table-course-dashboard\"\n    >\n      <thead>\n        <tr>\n          <th class=\"w-10\">Recordings</th>\n          <th class=\"w-15\">Start Date Time</th>\n          <th class=\"w-15\">End Date Time</th>\n          <th class=\"w-10\">Duration</th>\n        </tr>\n      </thead>\n      <tbody *ngFor=\"let data of RecordingUrls; index as i\">\n        <tr>\n          <td>\n            <a\n              href=\"{{ data.recordingUrl }}\"\n              target=\"_blank\"\n              suiPopup\n              popupText=\"{{ this.eventDetailItem.name }}\"\n              popupPlacement=\"top\"\n              >{{ this.eventDetailItem.name }}</a\n            >\n          </td>\n          <td>{{ data.eventStartDateTime }}</td>\n          <td>{{ data.eventEndDateTime }}</td>\n          <td>{{ data.durations }}</td>\n        </tr>\n      </tbody>\n    </table>\n  </div>\n</sui-modal>\n","styles":[".coverImg{-o-object-fit:cover;object-fit:cover}.border{border:ridge}.container{background-color:#a1a1a1;height:300px;margin-bottom:8px;overflow-y:scroll}ui.dimmer[_nghost-lso-c9]:not(.hidden){display:\"\";overflow-y:auto;transition:none}.sb-label-status{align-items:center;display:flex;font-size:.875rem;height:1rem;justify-content:center;padding:.3125rem;position:relative;width:13.25rem;z-index:2}.sb--card__type{background:var(--cc-sbcard-type-bg);background-color:#000;color:#fff;font-size:.6875rem;margin-left:-1rem;margin-top:56px;padding-left:8px;position:absolute}h1{line-height:2;margin-bottom:5px}.btn-link{background:none;border:none;font-weight:600}.z-index-9{z-index:9!important}"]}]}],"members":{"eventDetailItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"eventCreatorInfo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"EditEventId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":25,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":49,"character":19},{"__symbolic":"reference","name":"EventService"},{"__symbolic":"reference","name":"TimezoneCal"},{"__symbolic":"reference","name":"DataService"},{"__symbolic":"reference","name":"LibEventService"},{"__symbolic":"reference","module":"@angular/common","name":"DatePipe","line":54,"character":21}]}],"retireEventId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":58,"character":3}}]}],"isDetalPage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":59,"character":3}}]}],"navToDashbord":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":60,"character":3}}]}],"ngOnInit":[{"__symbolic":"method"}],"setDateTimeOnCover":[{"__symbolic":"method"}],"update_old":[{"__symbolic":"method"}],"dashboard":[{"__symbolic":"method"}],"update":[{"__symbolic":"method"}],"retireEvent":[{"__symbolic":"method"}],"truncateData":[{"__symbolic":"method"}],"openRecordingDetailModal":[{"__symbolic":"method"}],"isEnrollEvent":[{"__symbolic":"method"}]}},"AdvanceEventDetailComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":13,"character":1},"arguments":[{"selector":"sb-advance-event-detail","template":"<!-- <div class=\"\">\n    <div>\n        <span *ngIf=\"eventDetailItem?.description\">\n            <p *ngIf=\"!isTruncate\"> {{eventDetailItem?.description | slice:0:300}}\n                <a *ngIf=\"eventDetailItem?.description.length > 300\"\n                    (click)=\"truncateData(true)\">\n                        {{'See More'}}\n                </a>\n            </p>\n            <p *ngIf=\"isTruncate\">{{eventDetailItem?.description}}\n                <a (click)=\"truncateData(false)\">\n                    {{'See Less'}}\n                </a>\n            </p>\n        </span>\n\n        <div>\n            <table class=\"w-100 fs-0-92\" *ngIf=\"eventDetailItem?.eventType != 'Online'\">\n                <tr *ngIf=\"eventDetailItem?.venue\">\n                    <td class=\"w-17-5\"> <span class=\"fs-0-92 font-weight-bold\"> {{'venue'}} </span>\n                    </td>\n                    <td class=\"w-80\"> <span class=\"mr-12\">{{eventDetailItem?.venue.name}}</span></td>\n                </tr>\n\n                <tr *ngIf=\"eventDetailItem?.registrationStartDate\">\n                    <td class=\"w-17-5\"> <span class=\"fs-0-92 font-weight-bold\">\n                            {{'registration Start Date'}} </span></td>\n                    <td class=\"w-80\"> <span class=\"mr-12\">{{eventDetailItem?.registrationStartDate}}&nbsp;({{timezoneshort}})</span></td>\n                </tr>\n\n                <tr *ngIf=\"eventDetailItem?.registrationEndDate\">\n                    <td class=\"w-17-5\"> <span class=\"fs-0-92 font-weight-bold\">\n                            {{'registration End Date'}} </span></td>\n                    <td class=\"w-80\"><span class=\"mr-12\">{{eventDetailItem?.registrationEndDate}}&nbsp;({{timezoneshort}})</span></td>\n                </tr>\n            </table>\n\n            <table class=\"w-100\" *ngIf=\"eventDetailItem?.eventType != 'Offline'\">\n                <tr *ngIf=\"eventDetailItem?.onlineProvider\">\n                    <td class=\"w-17-5\"> <span class=\"fs-0-92 font-weight-bold\"> {{'online provider'}} </span></td>\n                    <td class=\"w-80\"><span class=\"fs-0-92 mr-12\"> {{\n                            eventDetailItem?.onlineProvider}}</span></td>\n                </tr>\n\n                <tr *ngIf=\"eventDetailItem?.code\">\n                    <td class=\"w-17-5\"> <span *ngIf=\"eventDetailItem?.code\" class=\"fs-0-92 font-weight-bold\"> {{'code'}}\n                        </span></td>\n                    <td class=\"w-80\"><span class=\"fs-0-92 mr-12\">\n                            {{eventDetailItem?.code}}</span></td>\n                </tr>\n\n\n            </table>\n\n            <table class=\"w-100\">\n                <tr *ngIf=\"eventDetailItem?.language\">\n                    <td class=\"w-17-5\"><span class=\"fs-0-92 font-weight-bold\"> {{'languages'}}\n                        </span></td>\n                    <td class=\"w-80\"><span class=\"fs-0-92 mr-12\">\n                            {{eventDetailItem?.language}}</span></td>\n                </tr>\n\n                <tr *ngIf=\"eventDetailItem?.keyword\">\n                    <td class=\"w-17-5\"><span class=\"fs-0-92 font-weight-bold\"> {{'keywords'}}\n                        </span></td>\n                    <td class=\"w-80\"><span class=\"fs-0-92 mr-12\">\n                            {{eventDetailItem?.keyword}}</span></td>\n                </tr>\n\n                <tr *ngIf=\"eventDetailItem?.createdFor\">\n                    <td class=\"w-17-5\"> <span class=\"fs-0-92 font-weight-bold\"> {{'created For'}}\n                        </span> </td>\n                    <td class=\"w-80\"><span class=\"fs-0-92 mr-12\">\n                            {{eventDetailItem?.createdFor}}</span></td>\n                </tr>\n\n                <tr *ngIf=\"eventDetailItem?.source\">\n                    <td class=\"w-17-5\"> <span class=\"fs-0-92 font-weight-bold\"> {{'source'}}\n                        </span></td>\n                    <td class=\"w-80\"><span class=\"fs-0-92 mr-12\">\n                            {{eventDetailItem?.source}}</span></td>\n                </tr>\n\n                <tr *ngIf=\"eventDetailItem?.audience\">\n                    <td class=\"w-17-5\"> <span class=\"fs-0-92 font-weight-bold w-90\"> {{'audience'}}\n                        </span></td>\n                    <td class=\"w-80\"><span class=\"fs-0-92 mr-12\">\n                            {{eventDetailItem?.audience[0]}}</span></td>\n                </tr>\n\n                <tr *ngIf=\"eventDetailItem?.collaborators\">\n                    <td class=\"w-17-5\"><span class=\"fs-0-92 font-weight-bold\"> {{'collaborators'}} </span></td>\n                    <td class=\"w-80\"><span class=\"fs-0-92 mr-12\"\n                            *ngFor=\"let collaborator of eventDetailItem?.collaborators;let i = index\"> {{i + 1}}.\n                            {{collaborator.name}}</span></td>\n                </tr>\n\n\n            </table>\n\n\n        </div> -->\n\n\n\n<!-- <div class=\"ml-30\"> -->\n    <div class=\"\">\n        <!-- <div class=\"d-flex sb-bg-color-gray-0 w-100 mt-20\"> -->\n        <div class=\"sb-g sb-g--gap24 py-16\">\n            <!-- <div class=\"detail w-60 pl-10 ml-30 b-bl mt-20\"> -->\n            <!-- <div class=\"sb-g-col-xs-12 sb-g-col-md-9 sb-g-col-lg-8 sb-g-col-xxxl-12 relative9 sb-bg-color-gray-0 pr-20 training-relevant\"> -->\n            <div class=\"sb-course-details__training sb-g-col-xs-12 sb-g-col-md-9 sb-g-col-lg-9 sb-g-col-xxxl-12\">\n                <div *ngIf=\"eventDetailItem?.description\" class=\"description training-relevant sb-bg-color-white p-15\">\n                    <span *ngIf=\"eventDetailItem?.description\">\n                        <h3 class=\"fsmall mb-8 font-weight-bold\">Description</h3>\n                        <p class= \"relative9 sb-color-gray-400 fnormal\" *ngIf=\"!isTruncate\"> {{eventDetailItem?.description | slice:0:800}}\n                            <a class=\"SeeMore sb-btn-link-primary\" *ngIf=\"eventDetailItem?.description.length > 800\"\n                                (click)=\"truncateData(true)\" style=\"color: blue\">\n                                    {{'... See More'}}\n                            </a>\n                        </p>\n                        <p *ngIf=\"isTruncate\">{{eventDetailItem?.description}}\n                            <a class=\"SeeMore sb-btn-link-primary\" (click)=\"truncateData(false)\" style=\"color: blue\">\n                                {{'See Less'}}\n                            </a>\n                        </p>\n                    </span>\n                </div>\n\n                <div class=\"mt-30 my-16 training-relevant\" *ngIf=\"similarEventList.length>=1\">\n                    <span><h3 class=\"fs-1\"><b>Similar Events</b></h3></span>\n                    <ngx-slick-carousel class=\"carousel\" #slickModal=\"slick-carousel\" [config]=\"slideConfig\" (init)=\"slickInit($event)\">\n                        <div ngxSlickItem class=\"slide masonry-item mr-16\" *ngFor=\"let event of similarEventList;let i = index;\" >\n                            <!-- <sb-event-card\n                                [indexToDisplay]=\"i\"\n                                [layoutConfig]=\"layoutConfig\"\n                                (cardClick)=\"playContent(event)\"\n                                [content]=\"event\"\n                                [cardImg]=\"event?.appIcon || 'assets/images/eventcover.png'\">\n                            </sb-event-card> -->\n                            <!-- <div class=\"sb-card\" (click)=\"navToEventDetail(event)\" tabindex=\"0\">\n                                <div class=\"sb-card-body\">\n                                    <div class=\"sb-card-metas\"> -->\n                                        <!-- <div class=\"sb-card-image mr-16\">\n                                            <img src=\"./assets/images/eventcover.jpg\">\n                                        </div> -->\n                                        <!-- <div *ngIf=\"event?.appIcon\" class=\"sb-card-image mr-16\">\n                                            <img src=\"{{event?.appIcon}}\">\n                                        </div>\n                                        <div *ngIf=\"!event?.appIcon\" class=\"sb-card-image mr-16\">\n                                            <img src=\"./assets/images/eventcover.jpg\">\n                                        </div>\n                                        <div class=\"sb-card-meta course\">\n                                            <div *ngIf=\"event?.audience\" class=\"sb-card-meta-item ellipsis mt-4\">\n                                                {{'audience' }}: {{event?.audience}}\n                                            </div>\n                                            <div *ngIf=\"event?.onlineProvider\" class=\"sb-card-meta-item ellipsis mt-4\">\n                                                {{'eventtype' }}: {{event?.onlineProvider}}\n                                            </div>\n                                            <div *ngIf=\"event?.eventStatus\" class=\"sb-card-meta-item ellipsis mt-4\">\n                                                {{'Status' }}: {{event?.eventStatus}}\n                                            </div>\n                                            <div *ngIf=\"event?.showDate\" class=\"sb-card-meta-item ellipsis mt-4\">\n                                                {{event?.showDate}}\n                                            </div>\n                                        </div>\n                                    </div>\n                                    <h4 *ngIf=\"event?.name\" class=\"sb-card-title\">\n                                        {{event?.name}}\n                                    </h4>\n                                    <div class=\"sb-label-status sb-label-status-success ml-auto mr-15 p-10 mt-8\">\n                                        <span class=\"sb-label-status-indicator sb-label-status-indicator-success\"></span> {{event?.eventType}}\n                                    </div>\n                                </div>\n                            </div> -->\n\n                        </div>\n                    </ngx-slick-carousel>\n                </div>\n\n            </div>\n            <!-- <div class=\"detail w-40 pl-10 ml-30 b-bl mt-20 ml-20\"> -->\n            <!-- <div class=\"sb-g-col-xs-12 sb-g-col-md-3 sb-g-col-lg-4 sb-g-col-xxxl-4 sb-bg-color-gray-0 pl-20 pr-20 training-relevant\"> -->\n            <div class=\"sb-g-col-xs-12 sb-g-col-md-3 sb-g-col-lg-3 sb-g-col-xxxl-4\">\n                <div class=\"training-relevant sb-bg-color-white p-15\" *ngIf=\"this.eventConfig.id\">\n                    <div>\n                        <h3 class=\"fs-1\"><b>Speakers</b></h3>\n                    </div>\n                    <div class=\"d-flex flex-w-wrap flex-ai-center speaker mr-20 relative9\">\n                        <div class=\"pl-20 mt-10\" >\n                            <!-- new code -->\n                            <div _ngcontent-klo-c24=\"\" class=\"avatar-content ng-star-inserted\" style=\"text-align: center; border-radius: 50%; border: 1px solid rgb(232, 232, 232); text-transform: uppercase; color: rgb(51, 51, 51); background-color: rgb(255, 255, 255); font-style: normal; font-variant: normal; font-weight: normal; font-stretch: normal; font-size: 24px; line-height: 48px; font-family: inherit; height: 48px; width: 48px;\">{{this.eventCreatorInfo.firstName[0]}}</div>\n                        </div>\n                        <div class=\"sb-card-image info mr-10 ml-20 mt-20 mu-20 mb-20\" >\n                            <b><p class=\"mb-2\">{{this.eventCreatorInfo.firstName}}</p></b>\n                            <p class=\"mb-2 fs-6\">Designation</p>\n                            <p class=\"mb-2 fs-6\">{{this.roleList.toString()}}</p>\n                        </div>\n                    </div>\n                </div>\n\n                <div class=\"mt-30 my-16 training-relevant sb-bg-color-white p-15\" *ngIf=\"this.attendanceList\">\n                    <sui-accordion *ngIf=\"this.attendanceList\" class=\"fluid sb-accordion sb-new-theme-accordion pr-20 relative9\">\n                        <sui-accordion-panel [isOpen]=\"false\" [attr.aria-expanded]=\"isOpen\" (click)=\"isOpen = !isOpen\">\n                            <div title class=\"sb-accordion-title fsmall d-flex flex-ai-center flex-jc-space-between pl-10\" tabindex=\"0\" (click)=\"isOpen = !isOpen\" [attr.aria-expanded]=\"isOpen\">\n                                <h3><b>Attendees</b></h3>\n                                <i class=\"chevron down icon\" role=\"img\" title=\"expand\"></i>\n                            </div>\n                            <div content class=\"pt-0 pb-8\"  role=\"region\" id=\"creditsLicenceInfo\" aria-labelledby=\"creditsLicenceInfo\">\n                                <div class=\"pb-24\">\n                                    <div #container class=\"container\">\n                                        <ul>\n                                            <li *ngFor=\"let i of this.attendanceList\">\n                                                <div class=\"d-flex\">\n                                                    <div _ngcontent-klo-c24=\"\" class=\"avatar-content ng-star-inserted mt-20\" style=\"text-align: center; border-radius: 50%; border: 1px solid rgb(232, 232, 232); text-transform: uppercase; color: rgb(51, 51, 51); background-color: rgb(255, 255, 255); font-style: normal; font-variant: normal; font-weight: normal; font-stretch: normal; font-size: 24px; line-height: 48px; font-family: inherit; height: 48px; width: 48px;\">{{i.fullName[0]}}</div>\n                                                    <div class=\"sb-card-image mr-10 ml-20 mt-20 mu-20 mb-20\" >\n                                                        <b><p class=\"mb-2\">{{i.fullName}}</p></b>\n                                                        <p class=\"mb-2 fs-6\">{{i.role}}</p>\n                                                    </div>\n                                                </div>\n                                            </li>\n                                        </ul>\n                                    </div>\n                                    <button class=\"sb-btn sb-btn-sm sb-btn-link sb-btn-link-primary pl-0 mb-20\" (click)=\"container.scrollTop = 0\">Scroll to Top</button>\n                                </div>\n                            </div>\n                        </sui-accordion-panel>\n                    </sui-accordion>                \n                </div>     \n\n            </div>\n        </div>\n    </div>\n\n","styles":[".detail{padding-left:20px}.container{height:350px;margin-bottom:8px;overflow-y:scroll}.SeeMore{color:#00008b}.description{text-align:justify}.info{overflow:auto}"]}]}],"members":{"eventDetailItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"eventCreatorInfo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"layoutConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"eventDetailData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":22,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"EventListService"},{"__symbolic":"reference","name":"SbToastService"},{"__symbolic":"reference","name":"EventService"},{"__symbolic":"reference","name":"LibEventService"},{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":47,"character":20},{"__symbolic":"reference","name":"TimezoneCal"}]}],"ngOnInit":[{"__symbolic":"method"}],"scrollToTop":[{"__symbolic":"method"}],"truncateData":[{"__symbolic":"method"}],"switchLang":[{"__symbolic":"method"}],"similarEvents":[{"__symbolic":"method"}],"playContent":[{"__symbolic":"method"}],"navToEventDetail":[{"__symbolic":"method"}],"slickInit":[{"__symbolic":"method"}],"getSpeakersList":[{"__symbolic":"method"}],"getAttendeeList":[{"__symbolic":"method"}]}},"AssetBrowserComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":15,"character":1},"arguments":[{"selector":"lib-asset-browser","template":"<sui-modal [isClosable]=\"true\" class=\"sb-modal overflow-modal\" [isInverted]=\"false\" (dismissed)=\"dismissImagePicker()\"\n  *ngIf=\"showImagePicker\" [size]=\"'normal'\" [isFullScreen]=\"false\" [mustScroll]=\"true\" #modal>\n  <div class=\"sb-modal-header\">\n    Select Image\n  </div>\n  <div class=\"sb-modal-content p-0\">\n    <sui-tabset>\n      <div class=\"sb-tabset-menu\">\n        <a class=\"sb-item\" (activate)=\"getMyImages(0)\" suiTabHeader=\"1\">My Images</a>\n        <a class=\"sb-item\" (activate)=\"getAllImages(0)\" suiTabHeader=\"2\">All Images</a>\n      </div>\n      <div class=\"ui segment sb-tabset-segment m-0 pt-15\" infiniteScroll [infiniteScrollDistance]=\"2\"\n        [infiniteScrollThrottle]=\"500\" [scrollWindow]=\"false\" (scrolled)=\"lazyloadMyImages()\" suiTabContent=\"1\">\n        <div class=\"ui  pb-16 d-flex pl-0\">\n          <div class=\"sb-search-box small no-btn\">\n            <div class=\"input-div relative\">\n              <i class=\"search icon\" aria-hidden=\"true\"></i>\n              <input (change)=\"searchImages($event, 'myImages')\" class=\"sb-search-input\" [(ngModel)]=\"searchAllInput\"\n                type=\"text\" placeholder=Search/>\n              <i class=\"close icon\" aria-hidden=\"true\" (click)=\"searchImages('clearInput', 'myImages')\"></i>\n            </div>\n            <!-- <button class=\"sb-btn sb-btn-normal\">{{configService.labelConfig?.button_labels?.search_btn_label}}</button> -->\n            <button class=\"sb-btn sb-btn-normal\">Searching this</button>\n\n          </div>\n          </div>\n        <div *ngIf=\"!myImages?.length && searchMyInput\" class=\"fs-0785 my-10\"> {{emptySearchMessage}}  </div>\n        <div class=\"sb-grid-layout image\">\n          <div class=\"sb-video-content\" *ngFor=\"let data of myImages\">\n            <div class=\"sb-image-section relative position\">\n              <img (click)=\"addImageInEditor(data.downloadUrl, data.identifier)\" alt=\"\" [src]=\"data.downloadUrl\">\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"ui segment sb-tabset-segment m-0 pt-15\" infiniteScroll [infiniteScrollDistance]=\"2\"\n        [infiniteScrollThrottle]=\"500\" [scrollWindow]=\"false\" (scrolled)=\"lazyloadAllImages()\" suiTabContent=\"2\">\n        <div class=\"ui  pb-16 d-flex pl-0\">\n          <div class=\"sb-search-box small no-btn\">\n            <div class=\"input-div relative\">\n              <i class=\"search icon\" aria-hidden=\"true\"></i>\n              <input (change)=\"searchImages($event, 'allImages')\" class=\"sb-search-input\" [(ngModel)]=\"searchAllInput\"\n                type=\"text\" placeholder='Search'/>\n              <i class=\"close icon\" aria-hidden=\"true\" (click)=\"searchImages('clearInput', 'allImages')\"></i>\n            </div>\n            <!-- <button class=\"sb-btn sb-btn-normal\">{{configService.labelConfig?.button_labels?.search_btn_label}}</button> -->\n            <button class=\"sb-btn sb-btn-normal\">Searching</button>\n          </div>\n        </div>\n        <div *ngIf=\"!allImages?.length && searchAllInput\" class=\"fs-0785\"> {{emptySearchMessage}} </div>\n        <div class=\"sb-grid-layout image\">\n          <div class=\"sb-video-content\" *ngFor=\"let data of allImages\">\n            <div class=\"sb-image-section\">\n              <img (click)=\"addImageInEditor(data.downloadUrl, data.identifier)\" alt=\"\" [src]=\"data.downloadUrl\">\n            </div>\n          </div>\n        </div>\n      </div>\n    </sui-tabset>\n  </div>\n  <div class=\"sb-modal-actions flex-jc-space-end\">\n    <button (click)=\"openImageUploadModal();\" class=\"sb-btn sb-btn-primary sb-btn-normal\">Upload And Use</button>\n    <!-- <button (click)=\"dismissPops(modal);\" class=\"mr-10 sb-btn sb-btn-primary sb-btn-normal\">Cancel</button> -->\n  </div>\n</sui-modal>\n\n<sui-modal class=\"sb-modal overflow-modal uploadPopup\" [isClosable]=\"true\" [isInverted]=\"false\"\n  (dismissed)=\"dismissImageUploadModal()\" *ngIf=\"showImageUploadModal\" [size]=\"'large'\" [isFullScreen]=\"false\"\n  [mustScroll]=\"true\" appBodyScroll #modal>\n  <div class=\"sb-modal-header\">Upload And Use</div>\n  <div class=\"p-10 sb-bg-white\">\n    <div class=\"d-flex\">\n      <div class=\"w-50\">\n        <div class=\"content\">\n          <h6 class=\"mb-8 fs-normal\">Choose or drag and drop your image here*<span class=\"red\">*</span></h6>\n          <div class=\"upload-image-modal-section d-flex flex-ai-center flex-jc-center flex-dc\">\n            <ng-container>\n              <button class=\"upload-input-button sb-btn sb-btn-success sb-btn-normal\">Upload from Computer\n                <input (change)=\"uploadImage($event)\" type=\"file\" [accept]=\"acceptImageType\" name=\"assetfile\">\n              </button>\n              <div class=\"py-10 fs-0-785 sb-color-primary\" *ngIf=\"imageUploadLoader\"> {{assetName}} </div>\n              <span class=\"fsmall mt-8\">Upload png, jpeg (Max File size: 1MB)</span>\n              <div *ngIf=\"showErrorMsg\" class=\"sb-color-error fsmall mt-8\">\n                <p>{{errorMsg}}</p>\n              </div>\n            </ng-container>\n          </div>\n          <div class=\"ui info message sb-info-bx\">\n            <ul class=\"list\">\n              <li class=\"fs-0785\">Allowed file types are: png, jpeg\n              </li>\n              <li class=\"fs-0785\">Maximum allowed file size: 1MB\n              </li>\n            </ul>\n          </div>\n          <h6 class=\"fs-0785\">Copyright & License*<span class=\"red\">*</span></h6>\n          <p class=\"fsmall mt-8 terms-and-condition\">I understand and confirm that all resources and assets created through the content editor or uploaded on the platform shall be available for free and public use without limitations on the platform (web portal, applications and any other end user interface that the platform would enable) and will be licensed under terms & conditions and policy guidelines of the platform. In doing so, the copyright and license of the original author is not infringed.</p>\n        </div>\n      </div>\n      <div class=\"w-50 pl-10 ml-10 b-bl\">\n        <div class=\"ui info message sb-info-bx mb-0\">\n          <ul class=\"list\">\n            <li class=\"fs-0785 font-weight-bold\">\n              <i class=\"icon info circle\" aria-hidden=\"true\"></i>\n              Drop or choose file to upload before entering the details\n            </li>\n          </ul>\n        </div>\n        <div class=\"sb-form-fields\">\n          <div class=\"form-container upload-form\">\n            <sb-event-dynamic-form [config]=\"formConfig\"\n              (statusChanges)=\"onStatusChanges($event)\" (valueChanges)=\"valueChanges($event)\"></sb-event-dynamic-form>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"sb-modal-actions flex-jc-space-between p-0\">\n      <div>\n        <!-- <button (click)=\"dismissPops(modal);\" class=\"mr-10 sb-btn sb-btn-primary sb-btn-normal\">Cancel</button> -->\n        <button (click)=\"uploadAndUseImage(modal);\" [disabled]=\"!imageFormValid\"\n        [ngClass]=\"{'sb-btn-primary': imageFormValid, 'sb-btn-disabled': !imageFormValid}\"\n        class=\"sb-btn  sb-btn-normal text-left\">Upload And Use</button>\n      </div>\n      <div>\n        <button (click)=\"dismissImageUploadModal();\" class=\" sb-btn sb-btn-primary sb-btn-normal\">Back</button>\n      </div>\n    </div>\n  </div>\n</sui-modal>\n","styles":[".editorWrapper{border:0 solid #fff}.editorWrapper.hasError{border:0 solid red}.characterCount{border-top:0;font-size:11px;font-weight:700;margin-top:-16px;padding-right:7px;position:relative;text-align:right}.custom-image img{border:1px dotted;cursor:pointer;margin:6px;padding:7px}.resource-image{height:180px!important}.asset_container{max-height:300px!important;min-height:300px!important;overflow-x:hidden;overflow-y:auto;padding:5px}.insert-image-btn{background-color:transparent;left:315px;margin-left:6px;padding:12px 14px!important;position:absolute;z-index:1}.insert-image-btn>.icon{opacity:1}.insert-image-btn:active{background-color:transparent}.upload-file-description p{color:#999}.upload-file-description ul{list-style:disc;margin:0}.upload-file-description ul li{margin-bottom:8px}.upload-file-description ul li a{cursor:pointer;font-size:12px}.sb-grid-layout{display:grid;grid-gap:16px;grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}.sb-grid-layout.image{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}.sb-grid-layout.video{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.sb-grid-layout .sb-video-content .sb-image-section{border-radius:4px;box-shadow:inset 0 1px 3px 0 rgba(0,0,0,.5);height:96px;overflow:hidden}.overlay-image,.sb-grid-layout .sb-video-content .sb-image-section img{cursor:pointer;height:100%;width:100%}.overlay-image{background:rgba(0,0,0,.3);left:0;position:absolute;right:0}.overlay-image .play.icon{color:hsla(0,0%,100%,.6);cursor:pointer;font-size:32px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.upload-image-modal-section{background:#f5f9fc;border:1px dashed #024f9d;border-radius:4px;min-height:140px;width:100%}.upload-file-section{align-items:center;background-color:#f5f9fc;border:1px dashed #80a7ce;display:flex;flex-direction:column;height:240px;justify-content:center;margin:0 auto;max-width:800px;width:100%}.qq-uploader.qq-uploader-selector.custom-qq-uploader{align-items:center;background:inherit;border:none;display:flex;height:240px;justify-content:center;max-height:inherit;min-height:inherit;overflow-y:inherit;width:688px}.terms-and-condition{line-height:14px}.red{color:red}.b-bl{border-left:1px solid #e4e1e1}.sb-color-grey{color:#666}.flex-jc-space-end{justify-content:flex-end!important}.fs-0785{font-size:.785rem!important}.ui.info.message{color:#276f86!important}.sb-textbox[disabled=true]{font-weight:500!important;opacity:.3!important}.sb-tabset-segment{max-height:288px;min-height:288px;overflow-y:auto}input:focus-visible{border:none!important}"]}]}],"members":{"modal":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":22,"character":3},"arguments":["modal",{"static":false}]}]}],"showImagePicker":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"assetBrowserEmitter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":24,"character":3}}]}],"modalDismissEmitter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":25,"character":3}}]}],"UsarConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"SbToastService"},{"__symbolic":"reference","name":"LibEventService"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"getMyImages":[{"__symbolic":"method"}],"addImageInEditor":[{"__symbolic":"method"}],"getAllImages":[{"__symbolic":"method"}],"lazyloadMyImages":[{"__symbolic":"method"}],"lazyloadAllImages":[{"__symbolic":"method"}],"uploadImage":[{"__symbolic":"method"}],"resetFormData":[{"__symbolic":"method"}],"populateFormData":[{"__symbolic":"method"}],"uploadAndUseImage":[{"__symbolic":"method"}],"generateAssetCreateRequest":[{"__symbolic":"method"}],"dismissImageUploadModal":[{"__symbolic":"method"}],"openImageUploadModal":[{"__symbolic":"method"}],"dismissPops":[{"__symbolic":"method"}],"dismissImagePicker":[{"__symbolic":"method"}],"searchImages":[{"__symbolic":"method"}],"onStatusChanges":[{"__symbolic":"method"}],"valueChanges":[{"__symbolic":"method"}]}},"CollectionIconComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"lib-collection-icon","template":"<ng-container>\n    <div (click)=\"showImagePicker = true\"\n     class=\"mb-20 w-15\">\n        <div class=\"app-icon-label\" >Icon</div>\n        <div *ngIf='!appIcon' class=\"sb-centericon\">\n            <div>\n                <i id=\"icon_appIcon\" name=\"icon_appIcon\" class=\"icon image outline\" ></i>\n            </div>\n            <div class=\"addImageText\">Add Image</div>\n        </div>\n        <img *ngIf=\"appIcon\" \n        class=\"ui image sb-appicon\" \n        src=\"{{appIcon}}\"/>\n    </div>\n    <lib-asset-browser *ngIf=\"showImagePicker && UsarConfig\" [UsarConfig] =\"UsarConfig\"[showImagePicker]=\"showImagePicker\" (assetBrowserEmitter)=\"collectionIconHandler($event)\" (modalDismissEmitter)=\"handleModalDismiss($event)\" ></lib-asset-browser>\n</ng-container>\n","styles":[".sb-appicon{padding:5px}.sb-appicon,.sb-centericon{border:1px solid #ccc;height:110px;width:120px}.sb-centericon{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:10px}.addImageText{font-size:.8rem!important}.w-15{max-width:15%;width:15%}.app-icon-label{color:rgba(18,18,19,.8784313725490196);font-size:12px!important;font-weight:600;margin-bottom:.5rem!important}.ui.modal{display:block!important}"]}]}],"members":{"libEventServicesData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"iconEmitter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":12,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"appIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"appIconConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":3}}]}],"initializeImagePicker":[{"__symbolic":"method"}],"collectionIconHandler":[{"__symbolic":"method"}],"handleModalDismiss":[{"__symbolic":"method"}]}},"EventFilterComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":15,"character":1},"arguments":[{"selector":"sb-event-filter","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":19,"character":17},"member":"None"},"template":"<div class=\"sb-prominent-filter sb-bg-header-blue horizontal-view\" *ngIf=\"newLayout == 'horizontal-view'\">\n    <div class=\"ui container pt-10 pb-20\" >\n        <div class=\"d-flex flex-w-wrap flex-jc-space-between flex-ai-center\">\n            <div class=\"sb-search-box  search-container small no-btn\">\n                <div class=\"input-div relative\">\n                    <i class=\"search icon\"></i>\n                    <input class=\"sb-search-input \" [(ngModel)]=\"searchQuery\" type=\"text\" (keyup.enter)=\"onQueryEnter($event);\" placeholder=\"Search Event\" />\n                </div>\n                <button class=\"sb-btn sb-btn-normal\">Search</button>\n            </div>\n\n            <div class=\"horizontal-view\" *ngIf=\"newLayout == 'horizontal-view'\">\n                <div class=\"fs-0-785 cursor-pointer\" (click)=\"showfilter()\">\n                    <i class=\"icon filter\"></i>\n                    Filters\n                    <i *ngIf=\"isFilterShow\" class=\"caret up icon\"></i>\n                    <i *ngIf=\"!isFilterShow\" class=\"caret down icon\"></i>\n                </div>\n            </div>\n<!-- ======= -->\n            <div *ngIf = \"isSorting\" class=\"three wide column pt-5\">\n                <div class=\"twelve wide column\">\n                  <div class=\"field\">\n                    <div class=\"content dropdown-content\">\n                     <span class=\"ShowFilterSubTitle\">sort by:&nbsp;</span>\n                      <div class=\"ui inline dropdown search-dropdown content-filter-sort\" id=\"sortByDropDown\">\n                        <sui-select class=\"inline\" (selectedOptionChange)= \"applySorting($event)\" [(ngModel)]=\"sortByOption\" [options]=\"sortingOptions\"\n                        valueField=\"field\"\n                    labelField=\"name\"  #selectSort>\n                          <sui-select-option *ngFor=\"let option of selectSort.filteredOptions\" [value]=\"option\" >\n                          </sui-select-option>\n                        </sui-select>\n                      </div>\n                      <i *ngIf=\"sortByOption && sortByOption.length > 0\" [ngClass]=\" sortIcon === false ? 'sort content ascending icon' : 'sort content descending icon' \"\n                        class=\"link\" tabindex=\"0\" (click)=\"applySorting(sortByOption)\">\n                      </i>\n                    </div>\n                  </div>\n                </div>\n              </div>\n     <!-- ======= -->\n        </div>\n        <div class=\"horizontal-view\" *ngIf=\"newLayout == 'horizontal-view'\">\n            <div class=\"library-filter search-container pt-16\" *ngIf=\"isFilterShow\">\n                <hr class=\"mb-20\">\n                <ng-container *ngIf=\"filterConfig\">\n                    <sb-form [config]=\"filterConfig\" (initialize)=\"outputData($event)\" (statusChanges)=\"onStatusChanges($event)\" (valueChanges)=\"valueChanges($event)\"></sb-form>\n                </ng-container>\n                <div class=\"d-flex flex-as-center pt-10 sb-btn-cover flex-jc-space-end\">\n                    <button type=\"button\" class=\"sb-btn sb-btn-normal sb-btn-outline-primary ml-5\" (click)=\"resetFilter();\">{{'Reset' }}</button>\n                    <!-- <button type=\"button\" class=\"sb-btn sb-btn-normal sb-btn-primary ml-15\" (click)=\"applyFilter();\">{{'apply' }}</button> -->\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n<!-- @TODO - Using serch butn also text serch need to be work -->\n\n<!-- <div class=\"vertical-view sbt-search-bar-panel\" *ngIf=\"newLayout == 'vertical-view'\">\n    <div class=\"sbt-search-box large\">\n        <div class=\"input-div relative\">\n            <i class=\"search icon\"></i>\n            <input class=\"sb-search-input\" [(ngModel)]=\"searchQuery\" type=\"text\" (keyup.enter)=\"onQueryEnter($event);\" placeholder=\"Search Event\" />\n        </div> -->\n        <!-- <button class=\"sb-btn sb-btn-md disabled\" (click)=\"applyFilter();\">Search</button> -->\n    <!-- </div>\n</div> -->\n<div class=\"vertical-view sbt-filter\" *ngIf=\"newLayout == 'vertical-view'\">\n    <div class=\"sb-search-box  search-container small no-btn\">\n        <div class=\"input-div relative\">\n            <i class=\"search icon\"></i>\n            <input class=\"sb-search-input\" [(ngModel)]=\"searchQuery\" type=\"text\" (keyup.enter)=\"onQueryEnter($event);\" placeholder=\"Search Event\" />\n        </div>\n        <!-- @TODO - Using serch butn also text serch need to be work -->\n        <!-- <button class=\"sb-btn sb-btn-md disabled\" (click)=\"applyFilter();\">Search</button> -->\n    </div>\n</div>\n<div class=\"vertical-view sbt-filter\" *ngIf=\"newLayout == 'vertical-view'\">\n    <div class=\"sbt-filter-switcher-container cursor-pointer mobile only\" (click)=\"isOpen = !isOpen\" tabindex=\"0\">\n        <div class=\"sbt-filter-switcher\"><i class=\"sliders horizontal icon\"></i></div>\n        <div class=\"sbt-filter-text\">Filters</div>\n    </div>\n    <div class=\"sbt-filter-switcher-container cursor-pointer computer only\">\n        <div class=\"sbt-filter-switcher\"><i class=\"sliders horizontal icon\"></i></div>\n        <div class=\"sbt-filter-text\">Filters</div>\n    </div>\n    <sui-accordion class=\"sbt-filter-accordion\">\n        <sui-accordion-panel [isOpen]=\"isOpen\" [isDisabled]=\"true\">\n            <ng-container content>\n                <div class=\"sbt-filter-bar mr-16 pl-24\">\n                    <div class=\"sbt-reset-bar d-flex flex-ai-center flex-ai-jc-center\" tabindex=\"0\">\n                        <button (click)=\"resetFilter();\" tabindex=\"0\"\n                            class=\"sb-btn sb-btn-xs sb-btn-link-primary pull-right sbt-btn-reset cursor-pointer\">\n                            Reset\n                            <i class=\"icon undo\"></i>\n                        </button>\n\n                        <span class=\"sbt-filter-close\"><i class=\"icon-svg icon-svg--xxs icon-close cursor-pointer\"\n                                (click)=\"isOpen = !isOpen\" tabindex=\"0\" attr.aria-label=\"Close\">\n                                <svg class=\"icon icon-svg--red\">\n                                    <use xlink:href=\"./assets/images/sprite.svg#close\"></use>\n                                </svg>\n                            </i>\n                        </span>\n                    </div>\n                    <div class=\"sbt-filter-scrollable pr-24\">\n                        <!-- <div class=\"sb-search-box  search-container small no-btn\">\n                            <div class=\"input-div relative\">\n                                <i class=\"search icon\"></i>\n                                <input class=\"sb-search-input \" [(ngModel)]=\"searchQuery\" type=\"text\" (keyup.enter)=\"onQueryEnter($event);\" placeholder=\"Search Event\" />\n                            </div>\n                            <button class=\"sb-btn sb-btn-normal\">Search</button>\n                        </div> -->\n                        <ng-container *ngIf=\"filterConfig\">\n                            <sb-form\n                                *ngIf=\"filterConfig\"\n                                [config]=\"filterConfig\"\n                                (initialize)=\"outputData($event)\"\n                                (valueChanges)=\"valueChanges($event)\"\n                                (statusChanges)=\"onStatusChanges($event)\" >\n                            </sb-form>\n                            <!-- <sb-dynamic-form\n                                [config]=\"filterConfig\"\n                                (initialize)=\"outputData($event)\"\n                                (statusChanges)=\"onStatusChanges($event)\"\n                                (valueChanges)=\"valueChanges($event)\">\n                            </sb-dynamic-form> -->\n                        </ng-container>\n                        <!-- <div class=\"d-flex flex-as-center pt-10 sb-btn-cover flex-jc-space-end\">\n                            <button type=\"button\" class=\"sb-btn sb-btn-normal sb-btn-primary ml-15\" (click)=\"applyFilter();\">{{'apply' }}</button>\n                        </div> -->\n\n                    </div>\n                </div>\n            </ng-container>\n        </sui-accordion-panel>\n    </sui-accordion>\n</div>\n","styles":[":root{--alpha0:0;--alpha25:0.25;--alpha50:0.5;--alpha75:0.75;--base-block-space:0.5rem;--base-font-size:0.875rem;--bg-body:var(--primary-0);--black:#000;--blue:#024f9d;--body-background-color:var(--primary-0);--body-color:var(--gray-800);--cyan:#17a2b8;--danger-color:var(--red);--default-text-color:var(--gray-800);--fade-grey:#e8e8e8;--font-default-size:0.875rem;--font-size-base:var(--font-default-size);--font-size-lg:var(--h4-font-size);--font-size-md:var(--h5-font-size);--font-size-normal:var(--font-size-base);--font-size-sm:0.75rem;--font-size-xs:0.625rem;--font-stack-en:\"Noto Sans\",\"Noto Sans Devanagari\",\"Noto Sans Tamil\",\"Noto Sans Bengali\",\"Noto Sans Malayalam\",\"Noto Sans Gurmukhi\",\"Noto Sans Gujarati\",\"Noto Sans Telugu\",\"Noto Sans Kannada\",\"Noto Sans Oriya\",\"Noto Nastaliq Urdu\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Oxygen-Sans,Ubuntu,Cantarell,\"Helvetica Neue\",sans-serif;--font-stack-hi:\"Noto Sans Devanagari\",\"Noto Sans\",\"Noto Sans Tamil\",\"Noto Sans Bengali\",\"Noto Sans Malayalam\",\"Noto Sans Gurmukhi\",\"Noto Sans Gujarati\",\"Noto Sans Telugu\",\"Noto Sans Kannada\",\"Noto Sans Oriya\",\"Noto Nastaliq Urdu\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Oxygen-Sans,Ubuntu,Cantarell,\"Helvetica Neue\",sans-serif;--font-stack-ur:\"Noto Sans\",\"Noto Nastaliq Urdu\",\"Noto Sans Devanagari\",\"Noto Sans Tamil\",\"Noto Sans Bengali\",\"Noto Sans Malayalam\",\"Noto Sans Gurmukhi\",\"Noto Sans Gujarati\",\"Noto Sans Telugu\",\"Noto Sans Kannada\",\"Noto Sans Oriya\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Oxygen-Sans,Ubuntu,Cantarell,\"Helvetica Neue\",sans-serif;--font-weight-base:var(--font-weight-normal);--font-weight-bold:700;--font-weight-light:300;--font-weight-normal:400;--gray:hsl(var(--gray-hs),20%);--gray-0:hsl(var(--gray-hs),95%);--gray-100:hsl(var(--gray-hs),80%);--gray-200:hsl(var(--gray-hs),60%);--gray-300:hsl(var(--gray-hs),59%);--gray-400:hsl(var(--gray-hs),40%);--gray-800:var(--gray);--gray-hs:0,0%;--green:#008840;--grey-nuance-darker:#ddd;--grey-nuance-lighter:#eee;--h1-font-size:2rem;--h2-font-size:1.75rem;--h3-font-size:1.5rem;--h4-font-size:1.2rem;--h5-font-size:1rem;--h6-font-size:var(--font-size-base);--icon-svg-lg:calc(var(--base-block-space)*5);--icon-svg-md:calc(var(--base-block-space)*4);--icon-svg-sm:calc(var(--base-block-space)*3);--icon-svg-xl:calc(var(--base-block-space)*6);--icon-svg-xs:calc(var(--base-block-space)*2);--icon-svg-xxs:0.75rem;--indigo:#6610f2;--info-color:var(--blue);--lazyload-bg:#f6f7f8;--line-height-base:calc(var(--font-size-base)*1.61803);--orange:#e55a28;--p-font-size:var(--font-size-base);--pink:#e83e8c;--primary-0:#f3f7fa;--primary-100:#edf4f9;--primary-200:#80a7ce;--primary-250:#d3e7f4;--primary-300:#7ab4ee;--primary-400:var(--primary-color);--primary-600:#005391;--primary-800:#002e50;--primary-color:#024f9d;--primary-theme:#ffd954;--purple:#6f42c1;--rc-0076FE:#0076fe;--rc-007AFF:#007aff;--rc-009D53:#009d53;--rc-00BD7F:#00bd7f;--rc-00abc7:#00abc7;--rc-042D55:#042d55;--rc-0fbad6:#0fbad6;--rc-196DAB:#196dab;--rc-1B4785:#1b4785;--rc-1b1c1d:#1b1c1d;--rc-2361ff:#2361ff;--rc-252525:#252525;--rc-289fd9:#289fd9;--rc-2972a4:#2972a4;--rc-2ca58d:#2ca58d;--rc-2dadc2:#2dadc2;--rc-2f4272:#2f4272;--rc-33B6CC:#33b6cc;--rc-424242:#424242;--rc-4a4a4a:#4a4a4a;--rc-565c70:#565c70;--rc-5c8db7:#5c8db7;--rc-66c7f4:#66c7f4;--rc-7b86f4:#7b86f4;--rc-7c7b7b:#7c7b7b;--rc-80A7CE:#80a7ce;--rc-866A6A:#866a6a;--rc-88B7E6:#88b7e6;--rc-91aecc:#91aecc;--rc-96C8DA:#96c8da;--rc-979797:#979797;--rc-9F9F9F:#9f9f9f;--rc-9b9b9b:#9b9b9b;--rc-BCBEC0:#bcbec0;--rc-C8D6EA:#c8d6ea;--rc-D3DED1:#d3ded1;--rc-D9E4F2:#d9e4f2;--rc-DECACA:#decaca;--rc-E0EFFF:#e0efff;--rc-E0F1FD:#e0f1fd;--rc-E5EDF5:#e5edf5;--rc-EBF6E0:#ebf6e0;--rc-F3F8FF:#f3f8ff;--rc-F5D7D7:#f5d7d7;--rc-F5F9FC:#f5f9fc;--rc-F6F6F6:#f6f6f6;--rc-F7FFF5:#f7fff5;--rc-FAFAFA:#fafafa;--rc-FCE6E6:#fce6e6;--rc-a9a9a9:#a9a9a9;--rc-aaaaaa:#aaa;--rc-add8e6:#add8e6;--rc-afd9e7:#afd9e7;--rc-bbbbbb:#bbb;--rc-bdbdbd:#bdbdbd;--rc-bfe1cf:#bfe1cf;--rc-c2c2c2:#c2c2c2;--rc-c3c3c3:#c3c3c3;--rc-c4c4c4:#c4c4c4;--rc-cecece:#cecece;--rc-d0d0d0:#d0d0d0;--rc-d2ddc7:#d2ddc7;--rc-d4d3d3:#d4d3d3;--rc-d4d4d5:#d4d4d5;--rc-d4d8da:#d4d8da;--rc-d8d8d8:#d8d8d8;--rc-d8dee2:#d8dee2;--rc-dc523d:#dc523d;--rc-dddddd:#ddd;--rc-dedede:#dedede;--rc-dededf:#dededf;--rc-e0e0e0:#e0e0e0;--rc-e0e1e2:#e0e1e2;--rc-e2e3e5:#e2e3e5;--rc-e5e5e5:#e5e5e5;--rc-e65c47:#e65c47;--rc-e68900:#e68900;--rc-e6c8c8:#e6c8c8;--rc-e9e5e5:#e9e5e5;--rc-eeeeee:#eee;--rc-f56b56:#f56b56;--rc-f5f5f5:#f5f5f5;--rc-f7f7f7:#f7f7f7;--rc-f7ffec:#f7ffec;--rc-f9f9f9:#f9f9f9;--rc-fcf2d6:#fcf2d6;--rc-fdfdfd:#fdfdfd;--rc-ffb300:#ffb300;--rc-ffe1e1:#ffe1e1;--rc-fff6f6:#fff6f6;--rc-rgba-7b86f4:123,134,244;--rc-rgba-866a6a:134,106,106;--rc-rgba-C8D6EA:200,214,234;--rc-rgba-black:0,0,0;--rc-rgba-d0d0d0:208,208,208;--rc-rgba-gray:51,51,51;--rc-rgba-gray-300:34,36,38;--rc-rgba-primary:2,79,157;--rc-rgba-primary-300:41,114,164;--rc-rgba-white:255,255,255;--red:#ff4558;--red-0:#fbccd1;--red-100:#ff6979;--red-400:var(--red);--sbt-body-bg:#f2f2ea;--sbt-body-bg2:#e9e8d9;--sbt-border-chapter:#e4e8ee;--sbt-header-bg:var(--primary-theme);--sbt-primary-bg:var(--primary-theme);--sbt-theme-bg:var(--primary-theme);--secondary-0:#e1ffdf;--secondary-100:#00c786;--secondary-200:#07bc81;--secondary-400:var(--secondary-color);--secondary-color:#008840;--success-color:var(--green);--teal:#20c997;--tertiary-0:#feedd7;--tertiary-100:#ffa11d;--tertiary-400:var(--tertiary-color);--tertiary-color:#e55a28;--warning-color:var(--orange);--white:#fff;--yellow:#ffc107}.horizontal-view .library-filter .ng-untouched{-moz-column-gap:.5rem;border-bottom:1px solid var(--gray-100);column-gap:.5rem;display:grid;grid-template-columns:repeat(3,1fr)}.horizontal-view .library-filter .ng-untouched:last-child{border-bottom:none}.multi-select-container .sb-modal-dropdown-web ul{border:none!important}label{color:rgba(18,18,19,.8784313725490196);font-size:12px!important;font-weight:500;margin-bottom:.5rem!important}.search-container{margin-left:1rem}select{height:100%!important}.vertical-view .list-border{border:0 solid rgba(34,36,38,.15)!important}.vertical-view .multi-select-container .caret-down{top:3px!important}.vertical-view .two-column-grid{grid-template-columns:repeat(1,1fr)!important}.vertical-view .sb-search-box.small{max-width:231px!important}.vertical-view .sbt-reset-bar{position:absolute;right:.5rem;top:.5rem}.vertical-view .sbt-filter{position:relative;z-index:9}.vertical-view .sbt-filter-overlay,.vertical-view .sbt-filter-text{display:none}.vertical-view .sbt-filter-close{align-items:center;background:var(--white);border-radius:50%;box-shadow:var(--sbt-box-shadow-3px);display:flex;height:24px;justify-content:center;width:24px}@media (min-width:992px){.vertical-view .sbt-filter-close{display:none}}.vertical-view .sbt-filter-switcher{--primary-color:#024f9d;align-items:center;background-color:var(--sbt-filter-switcher-bg);border-radius:100%;box-shadow:var(--sbt-box-shadow-3px);color:var(--primary-color);cursor:pointer;display:flex;height:2.5rem;justify-content:center;left:2rem;margin-top:-1.25rem;position:absolute;top:240px;width:2.5rem;z-index:999}html[dir=rtl] .vertical-view .sbt-filter-switcher{right:1.5rem}.vertical-view .sbt-filter-switcher i{font-size:1.25rem;margin-left:.1875rem;margin-top:-.625rem}@media (min-width:992px){.vertical-view .sbt-filter{margin-top:-4rem}}@media (max-width:991px){.vertical-view .sbt-filter-text{align-items:center;background:var(--white);border-radius:1.25rem;box-shadow:var(--sbt-box-shadow-3px);display:flex;font-size:.75rem;font-weight:700;height:2.5rem;justify-content:center;left:2.5rem;margin-top:-1.25rem;padding:0 1rem 0 3rem;position:absolute;top:185px;z-index:3}html[dir=rtl] .vertical-view .sbt-filter-text{padding:0 3rem 0 1rem;right:1.5rem}}@media (min-width:768px) and (max-width:991px){.vertical-view .sbt-filter{position:fixed;top:12rem}.vertical-view .sbt-filter-overlay{background:rgba(0,0,0,.5);height:100%;left:0;position:fixed;top:0;width:100%;z-index:1111}.vertical-view .sbt-filter-switcher-container{cursor:pointer;position:absolute;z-index:1113}.vertical-view .sbt-filter-switcher{box-shadow:none}}.vertical-view .sbt-filter-bar{background:var(--sbt-filter-bar-bg);border-radius:1.5rem;box-shadow:var(--sbt-box-shadow-6px);height:calc(100% - 8px);left:0;margin:0;min-width:14.5rem;padding:2rem 0 1rem 1.5rem;position:fixed;right:0;top:0;width:calc(100% - 8px);z-index:9999}@media (min-width:768px) and (max-width:991px){.vertical-view .sbt-filter-bar{height:auto;position:absolute;top:0;width:17rem;z-index:1112}}@media (min-width:992px){.vertical-view .sbt-filter-bar{height:auto;position:relative;width:auto;z-index:auto}}.vertical-view .sbt-filter-scrollable{height:calc(100vh - 95px);overflow-y:auto;padding-bottom:.5rem;position:relative}@media (min-width:768px) and (max-width:991px){.vertical-view .sbt-filter-scrollable{height:calc(100vh - 280px)}}@media (min-width:992px){.vertical-view .sbt-filter-scrollable{height:auto;overflow:initial}}.vertical-view .sbt-filter-noscrollable{overflow-y:inherit!important}.vertical-view .sbt-filter .state-medium-container{position:relative;z-index:999}.vertical-view .sbt-filter .state-medium-container__dropdown{z-index:1}.vertical-view .sbt-filter .state-medium-container__separator{background-color:var(--gray-200);height:1.5rem;margin:0 1rem;width:.0625rem}@media (max-width:767px){.vertical-view .sbt-filter .state-medium-container__separator{margin:0 .5rem}}.vertical-view .sbt-filter .state-medium-container__medium{height:4rem;overflow-x:auto;overflow-y:hidden}@media (max-width:575px){.vertical-view .sbt-filter .state-medium-container__medium{flex:0 0 50%}}.vertical-view .cfe-multiselect-container{margin-bottom:1rem}.vertical-view .cfe-multiselect-container li,.vertical-view .cfe-multiselect-container ul{list-style:none;margin:0;padding:0}.vertical-view .cfe-multiselect-container .cfe-multiselect-label{color:var(--sbfield-label-text)!important;display:flex!important;font-size:var(--font-size-normal)!important;font-weight:700!important;margin:.5rem 0!important}.vertical-view .cfe-multiselect-container .cfe-multiselect-field{-webkit-tap-highlight-color:transparent;align-items:center;background:var(--sbt-theme-purple-selectbox-lbg);border:none;border-color:var(--gray-200);border-radius:var(--sbt-bradius-24)!important;box-shadow:var(--sbt-box-shadow-3px);box-sizing:border-box;color:var(--sbt-theme-purple-selectbox);cursor:pointer;display:flex;flex-wrap:nowrap;font-size:.75rem;font-weight:700;height:2.5rem;justify-content:space-between;line-height:2.5rem;min-height:2rem;min-width:14em;outline:0;padding:0 1.25rem;position:relative;text-align:left;transition:box-shadow .1s ease,width .1s ease;white-space:normal;width:100%;word-wrap:break-word}.vertical-view .cfe-multiselect-container .cfe-multiselect-field .cfe-multiselect-field-label-container{flex-grow:1;height:100%;order:1;overflow:hidden;width:100%}.vertical-view .cfe-multiselect-container .cfe-multiselect-field .cfe-multiselect-field-label-container ul{height:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.vertical-view .cfe-multiselect-container .cfe-multiselect-field .cfe-multiselect-field-label-container .cfe-multiselect-field-label{display:inline}.vertical-view .cfe-multiselect-container .cfe-multiselect-field .cfe-multiselect-field-caret{box-sizing:border-box;flex-shrink:0;order:2;padding-left:1rem;padding-top:.2rem}.vertical-view .cfe-multiselect-container .cfe-multiselect-dropdown{animation-duration:.3s;animation-fill-mode:both;animation-iteration-count:1;animation-timing-function:ease;background:var(--sbt-theme-purple-selectbox-lbg);border-radius:var(--sbt-bradius-24);left:0;margin-top:-2.75rem;max-height:200px;opacity:0;position:absolute;top:100%;transform:scaleY(0);width:100%;z-index:10000}.vertical-view .cfe-multiselect-container .cfe-multiselect-dropdown[hidden]{display:block}.vertical-view .cfe-multiselect-container .cfe-multiselect-dropdown::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3);background-color:#f5f5f5}.vertical-view .cfe-multiselect-container .cfe-multiselect-dropdown::-webkit-scrollbar{background-color:#f5f5f5;width:4px}.vertical-view .cfe-multiselect-container .cfe-multiselect-dropdown::-webkit-scrollbar-thumb{background-color:#999}.vertical-view .cfe-multiselect-container .cfe-multiselect-dropdown li{cursor:pointer;display:flex;padding:0 1.25rem;position:relative}.vertical-view .cfe-multiselect-container .cfe-multiselect-dropdown li>div{display:block;text-transform:capitalize;width:100%}.vertical-view .cfe-multiselect-container .cfe-multiselect-dropdown li.selected-option{background:rgba(0,0,0,.05);color:var(--sbt-theme-purple-selectbox);font-weight:700}.vertical-view .cfe-multiselect-container .cfe-multiselect-dropdown .cfe-multiselect-dropdown-item{flex-grow:1}.vertical-view .cfe-multiselect-container.closed .cfe-multiselect-dropdown{animation-name:slideOutY;transform-origin:top center}.vertical-view .cfe-multiselect-container.open .cfe-multiselect-field{box-shadow:0 2px 3px 0 rgba(34,36,38,.15)}.vertical-view .cfe-multiselect-container.open .cfe-multiselect-dropdown{animation-name:slideInY;transform-origin:top center}.cfe-multiselect-container .cfe-multiselect-pills-container{align-items:center;box-sizing:border-box;display:flex;flex-wrap:wrap;justify-content:flex-start;margin:0 -.5rem 0 0}.cfe-multiselect-container .cfe-multiselect-pills-container .cfe-multiselect-pills-item{-webkit-appearance:none;background-color:var(--sbt-pill-bg);border-radius:1rem;cursor:pointer;display:unset;flex-basis:100px;flex-grow:1;font-size:12px;font-stretch:normal;font-style:normal;font-weight:400;margin:0 .5rem .5rem 0;padding:.5rem 1rem;text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:capitalize;transition:.25s ease-in-out;white-space:normal;width:100px}.cfe-multiselect-container .cfe-multiselect-pills-container .cfe-multiselect-pills-item.selected-option{background-color:var(--sbt-pill-bg-active);box-shadow:var(--sbt-box-shadow-3px);color:var(--sbt-pill-text-hover)}.cfe-multiselect-container .cfe-multiselect-pills-container .cfe-multiselect-pills-item.selected-option:hover{background-color:var(--gray-100);color:var(--black)}@keyframes slideInY{0%{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}@keyframes slideOutY{0%{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(0)}}.vertical-view .sbt-search-box{align-items:center;border-radius:1.75rem;box-shadow:var(--sbt-box-shadow-6px);display:flex;margin:-1.5rem 0 1rem;width:100%}@media (min-width:768px){.vertical-view .sbt-search-box{margin:0 1.5rem}}@media (min-width:768px){.vertical-view .sbt-search-box.large{max-width:30.75rem}.vertical-view .sbt-search-box.medium{max-width:24.5rem}.vertical-view .sbt-search-box.small{max-width:17.625rem}}.vertical-view .sbt-search-box:focus-within{border-radius:inherit;box-shadow:none}.vertical-view .sbt-search-box.no-btn .input-div{width:100%}.vertical-view .sbt-search-box.no-btn .sb-search-input{border:0;border-radius:.1875rem;padding-right:.5rem}.vertical-view .sbt-search-box.no-btn .sb-btn{display:none}.vertical-view .sbt-search-box.disabled{cursor:pointer;opacity:.3}.vertical-view .sbt-search-box.disabled .icon,.vertical-view .sbt-search-box.disabled button,.vertical-view .sbt-search-box.disabled input{pointer-events:none}.vertical-view .sbt-search-box.disabled:focus-within{box-shadow:0 0 .125rem .0625rem var(--primary-300)}.vertical-view .sbt-search-box .input-div{flex:2 1 auto}.vertical-view .sbt-search-box .sb-search-input{background:var(--sb-search-input-bg);border:0;border-radius:1.75rem;color:#545454;font-size:var(--font-size-sm);line-height:normal;min-height:2.5rem;outline:0;padding:.25rem 5.5rem .25rem 2.5rem;width:100%}html[dir=rtl] .vertical-view .sbt-search-box .sb-search-input{padding:.25rem 2.5rem .25rem 5.5rem}.vertical-view .sbt-search-box .sb-search-input:hover{box-shadow:var(--sbt-box-shadow-6px)}.vertical-view .sbt-search-box .sb-search-input:focus{outline:0}.vertical-view .sbt-search-box .sb-btn{background:var(--sb-search-btn-bg);border:0;border-radius:1.75rem;box-shadow:none!important;color:var(--sb-search-btn-text);font-size:var(--font-size-sm);left:272px;margin:0!important;min-width:auto;position:absolute;top:68px;transform:translateY(-50%);white-space:nowrap}html[dir=rtl] .vertical-view .sbt-search-box .sb-btn{left:8px;right:inherit}.vertical-view .sbt-search-box .sb-btn-md{height:2rem}.vertical-view .sbt-search-box .icon{height:1rem;line-height:normal;margin:0;position:absolute;width:1rem}.vertical-view .sbt-search-box .icon.search{left:.75rem;top:50%;transform:translateY(-50%);z-index:5}html[dir=rtl] .vertical-view .sbt-search-box .icon.search{left:unset;right:.75rem}html[dir=rtl] .vertical-view .sbt-search-box .icon.close{left:.5rem;right:unset;top:.5rem}.vertical-view .sbt-search-box.close{background:var(--primary-color);border-radius:50%;color:var(--white);cursor:pointer;font-size:var(--font-size-sm);padding:.125rem 0 0 .0625rem;right:.5rem;top:.5rem}.vertical-view .multi-select-container .list-border{padding:0!important}.vertical-view .multi-select-container .sb-modal-dropdown-web{margin-top:.25rem!important}.vertical-view .multi-select-container .sb-modal-dropdown-web ul{background:inherit!important;border:none!important;border-radius:1.5rem!important;box-shadow:none!important;overflow:auto!important;position:inherit!important;top:0!important}.vertical-view .multi-select-container .sb-modal-dropdown-web ul li{margin:0!important;padding:0 1.25rem!important}.vertical-view .multi-select-container .sb-modal-dropdown-web ul li.selected-option{background:#6841b3}"]}]}],"members":{"filterValues":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":3}}]}],"filterLayout":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3}}]}],"filterOpenStatus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"isOpen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3}}]}],"isSorting":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"filterConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"filterChangeEvent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":30,"character":3}}]}],"filterSearchData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":31,"character":3}}]}],"sortingQuery":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":32,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"initializeForm":[{"__symbolic":"method"}],"showfilter":[{"__symbolic":"method"}],"applySorting":[{"__symbolic":"method"}],"resetFilter":[{"__symbolic":"method"}],"applyFilter":[{"__symbolic":"method"}],"emitApplyFilter":[{"__symbolic":"method"}],"outputData":[{"__symbolic":"method"}],"onStatusChanges":[{"__symbolic":"method"}],"valueChanges":[{"__symbolic":"method"}],"onQueryEnter":[{"__symbolic":"method"}],"checkForWindowSize":[{"__symbolic":"method"}]}},"JoinEventComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"sb-join-event-button","template":"<div class=\"mt-20\">\n  <div class=\"wl-30\"></div>\n  <!-- <div  class=\"w-50 d-flex  join-btn my-12\"> -->\n  <div class=\"d-flex join-btn align-items-center\">\n    <!-- <button type=\"button\" class=\"sb-btn w-30 sb-btn-primary  sb-btn-normal ml-8\" (click)=\"navtoedit();\">{{'Edit'}}</button> -->\n    <button\n      *ngIf=\"eventDetailItem?.eventType != 'Offline'\"\n      type=\"button\"\n      [ngClass]=\"{\n        'sb-btn-secondary': !toShowCounter,\n        'sb-btn-outline-disabled': toShowCounter\n      }\"\n      class=\"sb-custom-btn sb-btn w-10 sb-btn-normal mr-10\"\n      id=\"join\"\n      (click)=\"checkEventProvider()\"\n    >\n      {{ \"Join\" }}\n    </button>\n    <div\n      *ngIf=\"\n        !isEnrolled && canRegister && registrationStarted && !this.eventEnded\n      \"\n      class=\"d-flex w-100 align-items-center\"\n    >\n      <button\n        type=\"button\"\n        *ngIf=\"!isEnrolled && canRegister && registrationStarted\"\n        class=\"sb-btn w-10 sb-btn-primary sb-btn-normal ml-8\"\n        (click)=\"enrollToEvent('enroll')\"\n      >\n        {{ \"Enroll\" }}\n      </button>\n      <b class=\"ml-20 w-100\"\n        >Enroll till {{ this.eventRegistrationEndDate | date : \"fullDate\" }}</b\n      >\n    </div>\n    <div\n      *ngIf=\"!isEnrolled && canRegister && !registrationStarted\"\n      class=\"d-flex w-100 align-items-center\"\n    >\n      *Enrollment will start from &nbsp;\n      <b>{{ this.registrationStartDate | date : \"fullDate\" }}</b>\n    </div>\n    <!-- <button type=\"button\" *ngIf=\"this.eventEnded\" class=\"w-50 sb-btn sb-btn-error  sb-btn-normal pl-15\">{{'Event Expired'}}</button> -->\n    <i *ngIf=\"this.eventEnded\" class=\"fa fa-check-circle color mt-5 fs-1\"></i>\n    <h5\n      _ngcontent-klo-c19=\"\"\n      *ngIf=\"this.eventEnded\"\n      class=\"textbook__title sb-color-error font-weight-bold mb-0 pl-5\"\n      tabindex=\"0\"\n    >\n      {{ \"Event Expired\" }}\n    </h5>\n    <!-- <button type=\"button\" *ngIf=\"isEnrolled && isStartDate2 && !isStartDate1\" class=\"sb-btn w-50 sb-btn-primary  sb-btn-normal pl-20 mr-10\"  [ngClass]=\"{'sb-btn-secondary': !isDisabled, 'sb-btn-outline-disabled': isDisabled}\"\n        [disabled]=\"true\">Starts in 2 days</button> -->\n    <!-- <button type=\"button\" *ngIf=\"isEnrolled && isStartDate1 && !isStartDate2\" class=\"sb-btn w-50 sb-btn-primary  sb-btn-normal mr-20\"  [ngClass]=\"{'sb-btn-secondary': !isDisabled, 'sb-btn-outline-disabled': isDisabled}\"\n        [disabled]=\"true\">Starts in 1 day</button> -->\n    <button\n      type=\"button\"\n      *ngIf=\"isEnrolled && isStartDate2 && !isStartDate1\"\n      class=\"sb-btn sb-btn-disabled sb-btn-normal mr-15\"\n    >\n      Starts in 2 days\n    </button>\n    <button\n      type=\"button\"\n      *ngIf=\"isEnrolled && isStartDate1 && !isStartDate2\"\n      class=\"sb-btn sb-btn-disabled sb-btn-normal mr-15\"\n    >\n      Starts in 1 day\n    </button>\n    <button\n      type=\"button\"\n      *ngIf=\"\n        isEnrolled &&\n        canUnenroll &&\n        canRegister &&\n        !this.eventEnded &&\n        isCreatorAbleToUnenroll\n      \"\n      class=\"sb-btn sb-btn-primary sb-btn-normal mx-10\"\n      (click)=\"enrollToEvent('unenroll')\"\n    >\n      {{ \"Unenroll\" }}\n    </button>\n    <h5\n      _ngcontent-klo-c19=\"\"\n      *ngIf=\"isEnrolled && !this.eventEnded && !isCreatorAbleToUnenroll\"\n      class=\"textbook__title sb-color-tertiary font-weight-bold mb-0 pl-0 pr-2\"\n      tabindex=\"0\"\n    >\n      {{ \"Unenrollment for creator is restricted\" }}\n    </h5>\n    &nbsp;\n\n    <!-- <button type=\"button\" *ngIf=\"!isEnrolled && !canRegister && !this.eventEnded\" class=\"w-50 sb-btn sb-btn-error  sb-btn-normal pl-20\">{{'Registration Closed'}}</button> -->\n    <h5\n      _ngcontent-klo-c19=\"\"\n      *ngIf=\"!isEnrolled && !canRegister && !this.eventEnded\"\n      class=\"textbook__title sb-color-error font-weight-bold mb-0 pl-0\"\n      tabindex=\"0\"\n    >\n      {{ \"Registration Closed\" }}\n    </h5>\n    &nbsp;\n    <div\n      *ngIf=\"isEnrolled && this.isUserAbleToJoin && toShowCounter\"\n      class=\"mt-12 w-70 ml-20\"\n    >\n      <b>\n        Starts in\n        <!-- <countdown-timer\n          (zeroTrigger)=\"myTriggerFunction()\"\n          [endDate]=\"someDate\"\n          [alwaysShowHours]=\"true\"\n        ></countdown-timer> -->\n        mins</b\n      >\n    </div>\n    <!-- Add the iframe here -->\n    <!-- <iframe\n      id=\"contentFrame\"\n      width=\"100%\"\n      height=\"500px\"\n      *ngIf=\"showIframe\"\n      src=\"{{ eventDetailItem?.eventUrl }}\"\n      frameborder=\"0\"\n    ></iframe> -->\n    <!-- <div *ngIf=\"!isEnrolled && canRegister\" class=\"w-80 ml-20\">\n           <b>Enroll till {{this.eventRegistrationEndDate | date:'fullDate'}}</b>     \n        </div> -->\n  </div>\n  <div *ngIf=\"!this.userData\" class=\"detail w-50 d-flex join-btn my-12\">\n    <button\n      type=\"button\"\n      class=\"sb-btn w-50 sb-btn-error sb-btn-normal\"\n      (click)=\"enrollToEvent('enroll')\"\n    >\n      {{ \"Register Now\" }}\n    </button>\n  </div>\n</div>\n<sui-modal\n  *ngIf=\"muteUserPopUp\"\n  [mustScroll]=\"true\"\n  [isClosable]=\"true\"\n  [transitionDuration]=\"0\"\n  [size]=\"'small'\"\n  class=\"sb-modal modal-height-sm\"\n  appBodyScroll\n  (dismissed)=\"muteUserPopUp = !muteUserPopUp\"\n  #modal\n>\n  <!-- <div class=\"sb-modal-header\">\n    Modal Heading\n  </div> -->\n  <div class=\"sb-modal-content\">\n    Do you want to mute all users when they join?\n  </div>\n  <div class=\"sb-modal-actions\">\n    <button\n      class=\"sb-btn sb-btn-normal sb-btn-primary\"\n      (click)=\"letModaratorJoinBBB(true)\"\n    >\n      Yes\n    </button>\n    <button\n      class=\"sb-btn sb-btn-normal sb-btn-outline-primary\"\n      (click)=\"letModaratorJoinBBB(false)\"\n    >\n      No\n    </button>\n  </div>\n</sui-modal>\n","styles":[".color{color:green}"]}]}],"members":{"eventDetailItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"canUnenroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"EventService"},{"__symbolic":"reference","name":"TimezoneCal"},{"__symbolic":"reference","name":"SbToastService"},{"__symbolic":"reference","name":"LibEventService"},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":54,"character":20},{"__symbolic":"reference","name":"UserConfigService"}]}],"ngOnInit":[{"__symbolic":"method"}],"joinEvent":[{"__symbolic":"method"}],"isEnrollEvent":[{"__symbolic":"method"}],"enrollToEvent":[{"__symbolic":"method"}],"checkEventProvider":[{"__symbolic":"method"}],"letModaratorJoinBBB":[{"__symbolic":"method"}],"openProviderLink":[{"__symbolic":"method"}],"myTriggerFunction":[{"__symbolic":"method"}],"navtoedit":[{"__symbolic":"method"}]}},"EnrollEventUsersComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"sb-enroll-event-users","template":"<div class=\"d-flex flex-jc-space-between mb-20\">\n    <!-- <button (click)=\"goBack()\" class=\"sb-btn sb-btn-normal sb-btn-gray ripple my-16\" style=\"margin-right: 13px;\">\n        Back\n    </button> -->\n    <ng-container *ngIf=\"eventDetailItem && showCard\">\n      <sb-cover-event-detail\n      [eventDetailItem]=\"eventDetailItem\"  >\n    </sb-cover-event-detail>\n    </ng-container>\n    <ng-container *ngIf=\"eventDetailItem && !showCard\">\n      <div>\n      <div  *ngIf=\"eventDetailItem?.name\" class=\"sb--sb--card__moreinfo sb__ellipsis\">\n        <h4 class=\"sb--card__title sb__ellipsis sb__ellipsis--two mr-5 ml-10 text-left flex-basis-1 fs-1 font-weight-bold sb-color-primary\" title=\"{{eventDetailItem?.name}}\"><bdi>{{eventDetailItem?.name}}</bdi></h4>\n        <!-- <a *ngIf=\"isMenu\" role=\"button\" aria-label=\"View more actions menu\" class=\"menu\" tabindex=\"0\"></a> -->\n      </div>\n      <div  *ngIf=\"eventDetailItem?.showDate\" class=\"sb--sb--card__moreinfo sb__ellipsis sb-color-gray-400 fnormal mb-10\"\n        title=\"{{eventDetailItem?.showDate}}: {{eventDetailItem?.showDate}}\">\n        <span><i class=\"fa fa-calendar mr-5 ml-10\"></i></span>\n        <span title=\"{{eventDetailItem?.showDate}}\">{{eventDetailItem?.showDate}}</span>\n      </div>\n        <div class=\"sb--card__tags sb-color-gray-400 fnormal\">\n            <span class=\"sb--card__badge\" *ngIf=\"eventDetailItem?.badgeAssertions\">\n              <img [src]=\"eventDetailItem?.badgeAssertions[0]?.badgeClassImage\" alt=\"\" title=\"\" />\n            </span>\n            <!-- <span class=\"sb--card__type\" *ngIf=\"eventDetailItem?.eventDetailItemType\">{{eventDetailItem?.eventDetailItemType}}</span> -->\n            <span class=\"sb--card__type mr-5 ml-10 mb-10 d-block\" *ngIf=\"eventDetailItem?.eventType == 'Online'\">Virtual Event</span>\n            <span class=\"sb--card__type mr-5 ml-10 mb-10 d-block\" *ngIf=\"eventDetailItem?.eventType == 'Offline'\">Classroom Event</span>\n            <span class=\"sb--card__type mr-5 ml-10 mb-10 d-block\" *ngIf=\"eventDetailItem?.eventType == 'OnlineAndOffline'\">Hybrid Event</span>\n        </div>\n  \n        <div  *ngIf=\"this.eventDetailItem['venue']['name'] && eventDetailItem?.eventType == 'Offline' || eventDetailItem?.eventType == 'OnlineAndOffline'\" class=\"sb--sb--card__moreinfo sb__ellipsis sb-color-gray-400 fnormal mb-10\"\n          title=\"this.eventDetailItem['venue']['name']: this.eventDetailItem['venue']['name']\">\n          <span><i class=\"fa fa-map-marker mr-5 ml-10\"></i></span>\n          <span title=\"this.eventDetailItem['venue']['name']\">{{ this.eventDetailItem['venue']['name'] }}</span>\n        </div>\n        <div *ngIf=\"eventDetailItem?.venue && eventDetailItem?.eventType == 'Online' || eventDetailItem?.eventType == 'OnlineAndOffline'\" class=\"sb--sb--card__moreinfo sb__ellipsis sb-color-gray-400 fnormal mb-10\"\n          title=\"{{eventDetailItem?.onlineProvider}}: {{eventDetailItem?.onlineProvider}}\">\n          <span><i class=\"fa fa-microphone mr-5 ml-10\"></i></span>\n          <span title=\"{{eventDetailItem?.onlineProvider}}\">{{eventDetailItem?.onlineProvider}}</span>\n        </div>\n      </div>\n    </ng-container>\n    <span *ngIf=\"showDownloadCodeBtn && arrayEnrollUsersData?.length > 0\" >\n        <button class=\"sb-btn sb-btn-normal sb-btn-secondary sb-btn-download my-16\" (click)=getEnrollDataCsv();>\n            Download CSV\n        </button>\n    </span>\n</div>\n\n  <!-- <ng-container *ngIf=\"eventDetailItem\">\n    <sb-cover-event-detail\n    [eventDetailItem]=\"eventDetailItem\"\n    (navToDashbord)=\"navToDashbord($event);\"\n    [isDetalPage]=\"true\"  >\n  </sb-cover-event-detail>\n  </ng-container> -->\n\n<div class=\"table-responsive\" *ngIf=\"arrayEnrollUsersData?.length > 0\">\n     <table class=\"sb-table sb-table-sortable sb-table-blue-strip\">\n        <thead>\n            <tr class=\"sb-table-head\">\n                <th class=\"w-10\">User Name</th>\n                <th class=\"w-10\">Email</th>\n                <th class=\"w-10\">Join Time</th>\n                <th class=\"w-10\">Leave Time</th>\n                <th class=\"w-10\">Duration</th>\n                <th class=\"w-10\">Enrollment Date</th>\n                <th class=\"w-10\">Attendance Status</th>\n            </tr>\n        </thead>\n        <tbody>\n            <tr *ngFor=\"let user of arrayEnrollUsersData | paginate: { itemsPerPage: paginateLimit, currentPage: p } let i = index \">\n                <!-- <td>{{i + 1}}</td> -->\n                <td *ngIf=\"user?.fullName\" class=\"white-space-inherit\">{{user?.fullName}}</td>\n                <td *ngIf=\"!user?.fullName\" class=\"white-space-inherit\">-</td>\n                <td *ngIf=\"user?.email\" class=\"white-space-inherit\">{{user?.email}}</td>\n                <td *ngIf=\"!user?.email\" class=\"white-space-inherit\">-</td>\n                <td *ngIf=\"user?.joinedDateTime\" class=\"white-space-inherit\">{{user?.joinedDateTime}}</td>\n                <td *ngIf=\"!user?.joinedDateTime\" class=\"white-space-inherit\">-</td>\n                <td *ngIf=\"user?.leftDateTime\" class=\"white-space-inherit\">{{user?.leftDateTime}}</td>\n                <td *ngIf=\"!user?.leftDateTime\" class=\"white-space-inherit\">-</td>\n                <td *ngIf=\"user?.duration\" class=\"white-space-inherit\" ><a class=\"ui label mt-8 mr-8\" (click)=\"navToUserAttendanceDetail(user)\">{{user?.duration}}</a></td>\n                <td *ngIf=\"!user?.duration\" class=\"white-space-inherit\">-</td>\n                <td *ngIf=\"user?.enrolledDate\" class=\"white-space-inherit\">{{user.enrolledDate | date: 'dd-MM-yyyy'}}</td>\n                <td *ngIf=\"!user?.enrolledDate\" class=\"white-space-inherit\"> - </td>\n                <td class=\"white-space-inherit ml-auto mr-15 p-10 mt-8\">\n                    <span class=\"sb-label-status sb-label-status-success\" *ngIf=\"user?.status == '2'\">\n                            <span class=\"sb-label-status-indicator sb-label-status-indicator-success\">\n                            </span>\n                            Present\n                    </span>\n                    <span class=\"sb-label-status sb-label-status-error\" *ngIf=\"user?.status != '2'\">\n                            <span class=\"sb-label-status-indicator sb-label-status-indicator-error\">\n                            </span>\n                            Absent\n                    </span>\n                </td>\n                <!-- <td *ngIf=\"!user?.status\" class=\"white-space-inherit\">-</td> -->\n            </tr>\n        </tbody>\n    </table>\n    <div class=\"d-flex my-24 flex-jc-flex-end\">\n        <pagination-controls (pageChange)=\"p = $event\" *ngIf=\"arrayEnrollUsersData\">\n        </pagination-controls>\n    </div>\n</div>\n","styles":[".sb-table-head{background:#f9fafb;border-bottom:1px solid rgba(34,36,38,.1);border-left:none;color:rgba(0,0,0,.87);cursor:auto;font-style:none;font-weight:700;padding:.92857143em .78571429em;text-align:inherit;text-transform:none;vertical-align:inherit}"]}]}],"members":{"enrollEventDetails":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"paginateLimit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"redirection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"eventDetailItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"showCard":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"detailedReport":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":21,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common","name":"DatePipe","line":31,"character":21},{"__symbolic":"reference","name":"TimezoneCal"},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":34,"character":20},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"EventService"},{"__symbolic":"reference","module":"@angular/common","name":"Location","line":37,"character":22}]}],"ngOnInit":[{"__symbolic":"method"}],"getEnrollDataCsv":[{"__symbolic":"method"}],"goBack":[{"__symbolic":"method"}],"navToUserAttendanceDetail":[{"__symbolic":"method"}]}},"LibEventComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"lib-event","template":"","styles":[""]}]}],"members":{"libEventConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"LibEventService"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"UserDetailedAttendanceComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"lib-user-detailed-attendance","template":"\n<!-- <ng-container *ngIf=\"eventDetailItem\">\n    <div  *ngIf=\"eventDetailItem?.name\" class=\"sb--sb--card__moreinfo sb__ellipsis\">\n      <h4 class=\"sb--card__title sb__ellipsis sb__ellipsis--two mr-5 ml-10 text-left flex-basis-1\" title=\"{{eventDetailItem?.name}}\"><bdi>{{eventDetailItem?.name}}</bdi></h4>\n    </div>\n</ng-container> -->\n<ng-container *ngIf=\"eventDetailItem && showCard\">\n    <sb-cover-event-detail\n    [eventDetailItem]=\"eventDetailItem\" >\n  </sb-cover-event-detail>\n  </ng-container>\n  <div class=\"d-flex flex-jc-flex-end\">\n    <span *ngIf=\"showDownloadCodeBtn && finalUserEnrollEventDetails?.length > 0\" >\n        <button class=\"sb-btn sb-btn-normal sb-btn-secondary sb-btn-download my-16\" (click)=getEnrollDataCsv();>\n            Download CSV\n        </button>\n    </span>\n  </div>\n<ng-container *ngIf=\"userEnrollEventDetails && eventDetailItem && !showCard\">\n  <div  *ngIf=\"eventDetailItem?.name\" class=\"sb--sb--card__moreinfo sb__ellipsis\">\n    <h4 class=\"sb--card__title sb__ellipsis sb__ellipsis--two mr-5 ml-10 text-left flex-basis-1\" title=\"{{eventDetailItem?.name}}\"><bdi>{{eventDetailItem?.name}}</bdi></h4>\n  </div>\n    <div  *ngIf=\"userEnrollEventDetails?.fullName\" class=\"sb--sb--card__moreinfo sb__ellipsis\"\n      title=\"{{userEnrollEventDetails?.fullName}}: {{userEnrollEventDetails?.fullName}}\">\n      <span class=\"fa mr-5 ml-10\"  title=\"{{userEnrollEventDetails?.fullName}}\">User: {{userEnrollEventDetails?.fullName}}</span>\n    </div>\n    <div  *ngIf=\"userEnrollEventDetails?.email\" class=\"sb--sb--card__moreinfo sb__ellipsis\"\n      title=\"{{userEnrollEventDetails?.email}}: {{userEnrollEventDetails?.email}}\">\n      <!-- <span><i class=\"fa fa-map-marker mr-5 ml-10\"></i></span> -->\n      <span class=\"fa mr-5 ml-10\" title=\"{{userEnrollEventDetails?.email}}\">Email: {{userEnrollEventDetails?.email}}</span>\n    </div>\n    <div *ngIf=\"userEnrollEventDetails?.duration\" class=\"sb--sb--card__moreinfo sb__ellipsis\"\n      title=\"{{userEnrollEventDetails?.duration}}: {{userEnrollEventDetails?.duration}}\">\n      <span class=\"fa mr-5 ml-10\" title=\"{{userEnrollEventDetails?.duration}}\">Total Duration: {{userEnrollEventDetails?.duration}}</span>\n    </div>\n  </ng-container>\n\n<div class=\"table-responsive\" *ngIf=\"arrayEnrollUsers?.length > 0\">\n     <table class=\"sb-table sb-table-sortable sb-table-blue-strip\">\n        <thead>\n            <tr class=\"sb-table-head\">\n\n                <th class=\"w-10\">Join Time</th>\n                <th class=\"w-10\">Leave Time</th>\n                <th class=\"w-10\" >Duration</th>\n\n            </tr>\n        </thead>\n        <tbody>\n            <tr *ngFor=\"let user of arrayEnrollUsers | paginate: { itemsPerPage: paginateLimit, currentPage: p } let i = index \">\n              {{user}}\n                <td *ngIf=\"user?.joinedDateTime\" class=\"white-space-inherit\">{{user?.joinedDateTime}}</td>\n                <td *ngIf=\"!user?.joinedDateTime\" class=\"white-space-inherit\">-</td>\n                <td *ngIf=\"user?.leftDateTime\" class=\"white-space-inherit\">{{user?.leftDateTime}}</td>\n                <td *ngIf=\"!user?.leftDateTime\" class=\"white-space-inherit\">-</td>\n                <td *ngIf=\"user?.duration\" class=\"white-space-inherit\">{{user?.duration}}</td>\n                <td *ngIf=\"!user?.duration\" class=\"white-space-inherit\">-</td>\n            </tr>\n        </tbody>\n    </table>\n    <div class=\"d-flex my-24 flex-jc-flex-end\">\n        <pagination-controls (pageChange)=\"p = $event\" *ngIf=\"finalUserEnrollEventDetails\">\n        </pagination-controls>\n    </div>\n</div>\n","styles":[".sb-table-head{background:#f9fafb;border-bottom:1px solid rgba(34,36,38,.1);border-left:none;color:rgba(0,0,0,.87);cursor:auto;font-style:none;font-weight:700;padding:.92857143em .78571429em;text-align:inherit;text-transform:none;vertical-align:inherit}"]}]}],"members":{"userEnrollEventDetails":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"paginateLimit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"redirection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"eventDetailItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"showCard":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common","name":"DatePipe","line":25,"character":21},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":26,"character":20},{"__symbolic":"reference","name":"TimezoneCal"},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"EventService"},{"__symbolic":"reference","module":"@angular/common","name":"Location","line":30,"character":22}]}],"ngOnInit":[{"__symbolic":"method"}],"getEnrollDataCsv":[{"__symbolic":"method"}],"goBack":[{"__symbolic":"method"}],"navToDashbord":[{"__symbolic":"method"}]}},"EventDetailService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":6,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"UserConfigService"},{"__symbolic":"reference","name":"DataService"}]}],"getEvent":[{"__symbolic":"method"}],"enrollUser":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"EventCreateService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":6,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"UserConfigService"},{"__symbolic":"reference","name":"DataService"},{"__symbolic":"reference","name":"SbToastService"}]}],"getEventFormConfig_old":[{"__symbolic":"method"}],"getUserData":[{"__symbolic":"method"}],"getEventFormConfig":[{"__symbolic":"method"}],"createEvent":[{"__symbolic":"method"}],"createGmeetEvent":[{"__symbolic":"method"}],"updateEvent":[{"__symbolic":"method"}],"getGmeetLink":[{"__symbolic":"method"}],"updateEventwithGmeetLink":[{"__symbolic":"method"}],"publishEvent":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"EventListService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"UserConfigService"},{"__symbolic":"reference","name":"DataService"}]}],"getEventList":[{"__symbolic":"method"}],"getFilteredEventList":[{"__symbolic":"method"}],"getFilterFormConfig":[{"__symbolic":"method"}],"getMyEventsFilterFormConfig":[{"__symbolic":"method"}],"getMyEventList":[{"__symbolic":"method"}],"getCalenderlist":[{"__symbolic":"method"}],"retireEvent":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"EventFilterService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"UserConfigService"},{"__symbolic":"reference","name":"DataService"},{"__symbolic":"reference","name":"SbToastService"}]}],"getFilterFormConfig":[{"__symbolic":"method"}],"filterEvent":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"SbToastService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":3,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"ngx-izitoast","name":"NgxIzitoastService","line":7,"character":32}]}],"showIziToastMsg":[{"__symbolic":"method"}],"destroyIzitoast":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"LibEventService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":4,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"initialize":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"DataService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":15,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"UserConfigService"},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":26,"character":18}]}],"getHeader":[{"__symbolic":"method"}],"post":[{"__symbolic":"method"}],"get":[{"__symbolic":"method"}],"patch":[{"__symbolic":"method"}],"delete":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"TimezoneCal":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":3,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"calcTime":[{"__symbolic":"method"}],"getTimeOffset":[{"__symbolic":"method"}],"pad":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"UserConfigService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":3,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"EventLibraryService"}]}],"getConfigUrl":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"EventService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":9,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"UserConfigService"},{"__symbolic":"reference","name":"DataService"},{"__symbolic":"reference","name":"TimezoneCal"},{"__symbolic":"reference","module":"@angular/common","name":"DatePipe","line":29,"character":21}]}],"getAttendanceList_old":[{"__symbolic":"method"}],"getAttendanceList":[{"__symbolic":"method"}],"getParticipantsList":[{"__symbolic":"method"}],"getEnrollEvents":[{"__symbolic":"method"}],"creatorEnroll":[{"__symbolic":"method"}],"getUserData":[{"__symbolic":"method"}],"costomUserEnroll":[{"__symbolic":"method"}],"enrollToEventPost":[{"__symbolic":"method"}],"sendEmailNotification":[{"__symbolic":"method"}],"getBatches":[{"__symbolic":"method"}],"createBatch":[{"__symbolic":"method"}],"getCertificateList":[{"__symbolic":"method"}],"attchCertificate":[{"__symbolic":"method"}],"getBBBURl":[{"__symbolic":"method"}],"convertDate":[{"__symbolic":"method"}],"getBBBURlModerator":[{"__symbolic":"method"}],"getBBBURlAttendee":[{"__symbolic":"method"}],"getEventStatus":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":7,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"UserConfigService"},{"__symbolic":"reference","name":"DataService"}]}],"getEditMode":[{"__symbolic":"method"}],"getMyImages":[{"__symbolic":"method"}],"createMediaAsset":[{"__symbolic":"method"}],"uploadMedia":[{"__symbolic":"method"}],"getAssetMedia":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":4,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"UserConfigService"},{"__symbolic":"reference","name":"DataService"}]}],"getUser":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":2,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"downloadFile":[{"__symbolic":"method"}],"ConvertToCSV":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":20,"character":1},"arguments":[{"imports":[{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":21,"character":12},"member":"forChild"},"arguments":[[{"path":"event","component":{"__symbolic":"reference","name":"EventDetailComponent"}},{"path":"event-post","component":{"__symbolic":"reference","name":"EventCreateComponent"}},{"path":"event-filter","component":{"__symbolic":"reference","name":"EventFilterComponent"}},{"path":"detailed-attendance","component":{"__symbolic":"reference","name":"UserDetailedAttendanceComponent"}},{"path":"explore-events/report","component":{"__symbolic":"reference","name":"EnrollEventUsersComponent"}}]]}],"exports":[{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":22,"character":12}]}]}],"members":{}}},"origins":{"EventLibraryService":"./lib/event-library.service","EventLibraryComponent":"./lib/event-library.component","EventLibraryModule":"./lib/event-library.module","EventsModule":"./lib/events/events.module","httpTranslateLoader":"./lib/events/events.module","EventDetailComponent":"./lib/events/components/event-detail/event-detail.component","EventCreateComponent":"./lib/events/components/event-create/event-create.component","CoverEventDetailComponent":"./lib/events/components/cover-event-detail/cover-event-detail.component","AdvanceEventDetailComponent":"./lib/events/components/advance-event-detail/advance-event-detail.component","AssetBrowserComponent":"./lib/events/components/asset-browser/asset-browser.component","CollectionIconComponent":"./lib/events/components/collection-icon/collection-icon.component","EventFilterComponent":"./lib/events/components/event-filter/event-filter.component","JoinEventComponent":"./lib/events/components/join-event-button/join-event-button.component","EnrollEventUsersComponent":"./lib/events/components/enroll-event-users/enroll-event-users.component","LibEventComponent":"./lib/events/components/lib-event/lib-event.component","UserDetailedAttendanceComponent":"./lib/events/components/user-detailed-attendance/user-detailed-attendance.component","EventDetailService":"./lib/events/services/event-detail/event-detail.service","EventCreateService":"./lib/events/services/event-create/event-create.service","EventListService":"./lib/events/services/event-list/event-list.service","EventFilterService":"./lib/events/services/event-filters/event-filters.service","SbToastService":"./lib/events/services/iziToast/izitoast.service","LibEventService":"./lib/events/services/lib-event/lib-event.service","DataService":"./lib/events/services/data-request/data-request.service","TimezoneCal":"./lib/events/services/timezone/timezone.service","UserConfigService":"./lib/events/services/userConfig/user-config.service","EventService":"./lib/events/services/event/event.service","ɵa":"./lib/events/services/image-search/image-search.service","ɵb":"./lib/events/services/users/users.service","ɵc":"./lib/events/services/download/csv-download.service","ɵd":"./lib/events/event-routing.module"},"importAs":"ngtek-event-library"}