File

widgets/implementations/datapoints-table/datapoints-table-view/datapoints-reload/datapoints-reload.component.ts

Extends

IntervalBasedReload

Implements

OnChanges AfterViewInit OnDestroy

Metadata

selector	`c8y-datapoints-reload`
standalone	`true`
imports	`CommonModule` `CountdownIntervalModule` `ListGroupModule` `TooltipModule`
templateUrl	`./datapoints-reload.component.html`

Index

Constructor

constructor(cdRef: ChangeDetectorRef, translateService: TranslateService, widgetGlobalAutoRefreshService: WidgetGlobalAutoRefreshService)

Parameters :

Name	Type	Optional
cdRef	`ChangeDetectorRef`	No
translateService	`TranslateService`	No
widgetGlobalAutoRefreshService	`WidgetGlobalAutoRefreshService`	No

Inputs

isAutoRefreshEnabled

Type : boolean

isExportModalOpen

Type : boolean

isLoading

Type : BehaviorSubject<boolean>

isRefreshDisabled

Type : boolean

Default value : false

isScrolling

Type : boolean

refreshInterval

Type : number

widgetInstanceGlobalAutoRefreshContext

Type : boolean

Outputs

onCountdownEnded

Type : EventEmitter

Methods

countdownEnded

countdownEnded()

Returns : void

enableCountdown

enableCountdown()

Returns : void

ngAfterViewInit

ngAfterViewInit()

Returns : void

ngOnChanges

ngOnChanges(changes: SimpleChanges)

Parameters :

Name	Type	Optional
changes	`SimpleChanges`	No

Returns : void

ngOnDestroy

ngOnDestroy()

Returns : void

reload

reload()

Returns : void

Protected updateCountdownButtonTooltipText

updateCountdownButtonTooltipText()

Returns : void

autoRefreshList

autoRefreshList()

Stops the countdown and triggers a refresh action. This function is responsible for halting the countdown interval component's operation. After stopping the countdown, it emits an onCountdownEnded event. This event is used to inform external components that the countdown has ended, typically prompting them to reload or refresh their data.

Returns : void

disableCountdown

disableCountdown()

Disables and hides the countdown timer.

This method stops the ongoing countdown process by stopping the countdownIntervalComponent if it exists. It then hides the countdown timer by setting hideCountdown to true. This method encapsulates the logic required to halt and conceal the countdown timer.

Returns : void

handleScrolling

handleScrolling()

Manages the countdown timer's visibility and state in response to user scrolling.

This method toggles the countdown timer based on the user's scrolling behavior. It uses the disableCountdown and enableCountdown methods for handling the countdown state.

If the user is scrolling down while the countdown is visible (isScrolling is true and hideCountdown is false), disableCountdown is called to stop and hide the countdown, and isIntervalRefreshToggleOn is set to false.
If the user has stopped scrolling, the countdown subscription is closed, and the countdown is hidden (!isScrolling, countdownSubscription?.closed, hideCountdown), enableCountdown is called to show and restart the countdown, and isIntervalRefreshToggleOn is set to true.

Returns : void

onToggleCountdownButtonState

onToggleCountdownButtonState($event: MouseEvent)

Handles the toggle state of the countdown on button click.

This method is triggered by a mouse event, typically a click on the countdown toggle button. It toggles isIntervalRefreshToggleOn to reflect the current state of the countdown timer.

If isIntervalRefreshToggleOn is set to false, indicating that the countdown should be stopped, disableCountdown is called, and manuallyDisabledCountdown is set to true.
If isIntervalRefreshToggleOn is true and the countdown subscription is closed, indicating that the countdown can be started, enableCountdown is called, and manuallyDisabledCountdown is set to false.

Parameters :

Name	Type	Optional	Description
$event	`MouseEvent`	No	The MouseEvent that triggered this method.

Returns : void

startCountdown

startCountdown()

This function listens for changes in the isLoading observable, filtering out any truthy values. Once a falsy value is detected (indicating that loading has finished), it attempts to start the countdown.

IMPORTANT: If the widget's configuration (refreshInterval, check template) is not set prior to executing countdownIntervalComponent?.start, the countdown interval will not start!

Example :

              within the `runInInjectionContext`.

Returns : void

Properties

countdownIntervalComponent

Type : CountdownIntervalComponent

Decorators :


                            @ViewChild(CountdownIntervalComponent, {static: false})

Protected destroy$

Default value : new Subject<void>()

Protected hideCountdown

Type : boolean

isIntervalRefreshToggleOn

Type : boolean

Protected manuallyDisabledCountdown

Default value : false

toggleCountdownButtonTooltipText

Type : string

Protected countdownSubscription

Type : Subscription

Holds the subscription to a countdown observable.

isAutoRefreshEnabled

Type : boolean

Indicates whether auto-refresh is enabled for the datapoints reload component that is set in widget config.

Abstract isLoading

Type : BehaviorSubject<boolean>

Current isLoading state. Based on it next countdown cycle is being started.

Abstract isRefreshDisabled

Type : boolean

Indicates whether refreshing should be enabled or disabled. It's 'true' when user is not allowed to view a measurement.

Abstract isScrolling

Type : boolean

Indicates whether the alarm list is being scrolled or not.

Abstract onCountdownEnded

Type : EventEmitter<void>

Indicates that a countdown cycle has ended.

Abstract refreshInterval

Type : number

Current refresh interval set in a widget config.

<ng-container *ngIf="!widgetInstanceGlobalAutoRefreshContext">
  <div class="a-i-center input-group p-t-4 p-b-4 max-width-fit m-l-auto">
    <label
      class="m-b-0 m-r-8 text-label-small text-truncate flex-no-shrink"
      title=" {{ 'Auto refresh' | translate }}"
      *ngIf="refreshInterval && isAutoRefreshEnabled"
    >
      {{ 'Auto refresh' | translate }}
    </label>
    <div class="input-group">
      <label
        class="toggle-countdown"
        [class.toggle-countdown-disabled]="isRefreshDisabled"
        [attr.aria-label]="toggleCountdownButtonTooltipText"
        [tooltip]="toggleCountdownButtonTooltipText"
        placement="bottom"
        *ngIf="refreshInterval && isAutoRefreshEnabled"
        [adaptivePosition]="false"
        [container]="'body'"
        [delay]="500"
      >
        <input
          type="checkbox"
          [checked]="isIntervalRefreshToggleOn"
          [disabled]="isRefreshDisabled"
          data-cy="c8y-data-points-table-widget--interval-toggle-button"
          (click)="onToggleCountdownButtonState($event)"
        />

        <c8y-countdown-interval
          *ngIf="isIntervalRefreshToggleOn"
          [countdownInterval]="refreshInterval"
          (countdownEnded)="countdownEnded()"
        ></c8y-countdown-interval>
        <i
          c8yIcon="pause"
          *ngIf="!isIntervalRefreshToggleOn"
        ></i>
      </label>

      <div class="input-group-btn">
        <button
          class="btn btn-default"
          [attr.aria-label]="'Refresh' | translate"
          [tooltip]="'Refresh' | translate"
          placement="bottom"
          type="button"
          [adaptivePosition]="false"
          [container]="'body'"
          [delay]="500"
          [disabled]="isRefreshDisabled || (isLoading | async)"
          (click)="reload()"
          data-cy="c8y-data-points-table-widget--reload-button"
        >
          <i
            c8yIcon="refresh"
            [ngClass]="{ 'icon-spin': isLoading | async }"
          ></i>
        </button>
      </div>
    </div>
  </div>
</ng-container>

File

Extends

Implements

Metadata

Index

Properties

Methods

Inputs

Outputs

Constructor

Inputs

Outputs

Methods

Properties

results matching ""

No results matching ""