/*! * devextreme-angular-test * Version: 17.2.8 * Build date: Mon Feb 05 2018 * * Copyright (c) 2012 - 2018 Developer Express Inc. ALL RIGHTS RESERVED * * This software may be modified and distributed under the terms * of the MIT license. See the LICENSE file in the root of the project for details. * * https://github.com/DevExpress/devextreme-angular */ import { Component, NgModule, ElementRef, NgZone, Input, Output, OnDestroy, Injector, EventEmitter, OnChanges, DoCheck, SimpleChanges } from '@angular/core'; import DevExpress from 'devextreme/bundles/dx.all'; import DxBarGauge from 'devextreme/viz/bar_gauge'; import { DxComponent } from '../core/component'; import { DxTemplateHost } from '../core/template-host'; import { DxTemplateModule } from '../core/template'; import { EventsRegistrator } from '../core/events-strategy'; import { NestedOptionHost } from '../core/nested-option'; import { WatcherHelper } from '../core/watcher-helper'; import { IterableDifferHelper } from '../core/iterable-differ-helper'; import { DxoAnimationModule } from './nested/animation'; import { DxoExportModule } from './nested/export'; import { DxoGeometryModule } from './nested/geometry'; import { DxoLabelModule } from './nested/label'; import { DxoFontModule } from './nested/font'; import { DxoFormatModule } from './nested/format'; import { DxoLoadingIndicatorModule } from './nested/loading-indicator'; import { DxoMarginModule } from './nested/margin'; import { DxoSizeModule } from './nested/size'; import { DxoSubtitleModule } from './nested/subtitle'; import { DxoTitleModule } from './nested/title'; import { DxoTooltipModule } from './nested/tooltip'; import { DxoBorderModule } from './nested/border'; import { DxoShadowModule } from './nested/shadow'; /** * The BarGauge widget contains several circular bars that each indicates a single value. */ @Component({ selector: 'dx-bar-gauge', template: '', styles: [ ' :host { display: block; }'], providers: [ DxTemplateHost, WatcherHelper, NestedOptionHost, IterableDifferHelper ] }) export class DxBarGaugeComponent extends DxComponent implements OnDestroy, OnChanges, DoCheck { instance: DxBarGauge; /** * Specifies animation options. */ @Input() get animation(): any { return this._getOption('animation'); } set animation(value: any) { this._setOption('animation', value); } /** * Specifies a color for the remaining segment of the bar's track. */ @Input() get backgroundColor(): string { return this._getOption('backgroundColor'); } set backgroundColor(value: string) { this._setOption('backgroundColor', value); } /** * Specifies a distance between bars in pixels. */ @Input() get barSpacing(): number { return this._getOption('barSpacing'); } set barSpacing(value: number) { this._setOption('barSpacing', value); } /** * Specifies a base value for bars. */ @Input() get baseValue(): number { return this._getOption('baseValue'); } set baseValue(value: number) { this._setOption('baseValue', value); } /** * Specifies the attributes to be attached to the widget's root element. */ @Input() get elementAttr(): any { return this._getOption('elementAttr'); } set elementAttr(value: any) { this._setOption('elementAttr', value); } /** * Specifies an end value for the gauge's invisible scale. */ @Input() get endValue(): number { return this._getOption('endValue'); } set endValue(value: number) { this._setOption('endValue', value); } /** * Configures the exporting and printing features. */ @Input() get export(): any { return this._getOption('export'); } set export(value: any) { this._setOption('export', value); } /** * Defines the shape of the gauge's arc. */ @Input() get geometry(): any { return this._getOption('geometry'); } set geometry(value: any) { this._setOption('geometry', value); } /** * Specifies the options of the labels that accompany gauge bars. */ @Input() get label(): any { return this._getOption('label'); } set label(value: any) { this._setOption('label', value); } /** * Configures the loading indicator. */ @Input() get loadingIndicator(): any { return this._getOption('loadingIndicator'); } set loadingIndicator(value: any) { this._setOption('loadingIndicator', value); } /** * Generates space around the widget. */ @Input() get margin(): any { return this._getOption('margin'); } set margin(value: any) { this._setOption('margin', value); } /** * Sets the name of the palette or an array of colors to be used for coloring the gauge range container. */ @Input() get palette(): string| Array { return this._getOption('palette'); } set palette(value: string| Array) { this._setOption('palette', value); } /** * Notifies the widget that it is embedded into an HTML page that uses a tag modifying the path. */ @Input() get pathModified(): boolean { return this._getOption('pathModified'); } set pathModified(value: boolean) { this._setOption('pathModified', value); } /** * Specifies whether to redraw the widget when the size of the parent browser window changes or a mobile device rotates. */ @Input() get redrawOnResize(): boolean { return this._getOption('redrawOnResize'); } set redrawOnResize(value: boolean) { this._setOption('redrawOnResize', value); } /** * Defines the radius of the bar that is closest to the center relatively to the radius of the topmost bar. */ @Input() get relativeInnerRadius(): number { return this._getOption('relativeInnerRadius'); } set relativeInnerRadius(value: number) { this._setOption('relativeInnerRadius', value); } /** * Switches the widget to a right-to-left representation. */ @Input() get rtlEnabled(): boolean { return this._getOption('rtlEnabled'); } set rtlEnabled(value: boolean) { this._setOption('rtlEnabled', value); } /** * Specifies the widget's size in pixels. */ @Input() get size(): any { return this._getOption('size'); } set size(value: any) { this._setOption('size', value); } /** * Specifies a start value for the gauge's invisible scale. */ @Input() get startValue(): number { return this._getOption('startValue'); } set startValue(value: number) { this._setOption('startValue', value); } /** * Use the title.subtitle option instead. */ @Input() get subtitle(): string| { font?: DevExpress.viz.Font, text?: string } { return this._getOption('subtitle'); } set subtitle(value: string| { font?: DevExpress.viz.Font, text?: string }) { this._setOption('subtitle', value); } /** * Sets the name of the theme the widget uses. */ @Input() get theme(): string { return this._getOption('theme'); } set theme(value: string) { this._setOption('theme', value); } /** * Configures the widget's title. */ @Input() get title(): string| { font?: DevExpress.viz.Font, horizontalAlignment?: string, margin?: number| { bottom?: number, left?: number, right?: number, top?: number }, placeholderSize?: number, position?: string, subtitle?: string| { font?: DevExpress.viz.Font, text?: string }, text?: string, verticalAlignment?: string } { return this._getOption('title'); } set title(value: string| { font?: DevExpress.viz.Font, horizontalAlignment?: string, margin?: number| { bottom?: number, left?: number, right?: number, top?: number }, placeholderSize?: number, position?: string, subtitle?: string| { font?: DevExpress.viz.Font, text?: string }, text?: string, verticalAlignment?: string }) { this._setOption('title', value); } /** * Configures tooltips. */ @Input() get tooltip(): any { return this._getOption('tooltip'); } set tooltip(value: any) { this._setOption('tooltip', value); } /** * Specifies the array of values to be indicated on a bar gauge. */ @Input() get values(): Array { return this._getOption('values'); } set values(value: Array) { this._setOption('values', value); } /** * A handler for the disposing event. Executed when the widget is removed from the DOM using the remove(), empty(), or html() jQuery methods only. */ @Output() onDisposing: EventEmitter; /** * A handler for the drawn event. Executed when the widget has finished drawing itself. */ @Output() onDrawn: EventEmitter; /** * A handler for the exported event. Executed after data from the widget is exported. */ @Output() onExported: EventEmitter; /** * A handler for the exporting event. Executed before data from the widget is exported. */ @Output() onExporting: EventEmitter; /** * A handler for the fileSaving event. Executed before a file with exported data is saved on the user's local storage. */ @Output() onFileSaving: EventEmitter; /** * A handler for the incidentOccurred event. Executed when an error or warning appears in the widget. */ @Output() onIncidentOccurred: EventEmitter; /** * A handler for the initialized event. Executed only once, after the widget is initialized. */ @Output() onInitialized: EventEmitter; /** * A handler for the optionChanged event. Executed after an option of the widget is changed. */ @Output() onOptionChanged: EventEmitter; /** * A handler for the tooltipHidden event. */ @Output() onTooltipHidden: EventEmitter; /** * A handler for the tooltipShown event. */ @Output() onTooltipShown: EventEmitter; /** * A handler for the animationChange event. */ @Output() animationChange: EventEmitter; /** * A handler for the backgroundColorChange event. */ @Output() backgroundColorChange: EventEmitter; /** * A handler for the barSpacingChange event. */ @Output() barSpacingChange: EventEmitter; /** * A handler for the baseValueChange event. */ @Output() baseValueChange: EventEmitter; /** * A handler for the elementAttrChange event. */ @Output() elementAttrChange: EventEmitter; /** * A handler for the endValueChange event. */ @Output() endValueChange: EventEmitter; /** * A handler for the exportChange event. */ @Output() exportChange: EventEmitter; /** * A handler for the geometryChange event. */ @Output() geometryChange: EventEmitter; /** * A handler for the labelChange event. */ @Output() labelChange: EventEmitter; /** * A handler for the loadingIndicatorChange event. */ @Output() loadingIndicatorChange: EventEmitter; /** * A handler for the marginChange event. */ @Output() marginChange: EventEmitter; /** * A handler for the paletteChange event. */ @Output() paletteChange: EventEmitter>; /** * A handler for the pathModifiedChange event. */ @Output() pathModifiedChange: EventEmitter; /** * A handler for the redrawOnResizeChange event. */ @Output() redrawOnResizeChange: EventEmitter; /** * A handler for the relativeInnerRadiusChange event. */ @Output() relativeInnerRadiusChange: EventEmitter; /** * A handler for the rtlEnabledChange event. */ @Output() rtlEnabledChange: EventEmitter; /** * A handler for the sizeChange event. */ @Output() sizeChange: EventEmitter; /** * A handler for the startValueChange event. */ @Output() startValueChange: EventEmitter; /** * A handler for the subtitleChange event. */ @Output() subtitleChange: EventEmitter; /** * A handler for the themeChange event. */ @Output() themeChange: EventEmitter; /** * A handler for the titleChange event. */ @Output() titleChange: EventEmitter; /** * A handler for the tooltipChange event. */ @Output() tooltipChange: EventEmitter; /** * A handler for the valuesChange event. */ @Output() valuesChange: EventEmitter>; constructor(elementRef: ElementRef, ngZone: NgZone, templateHost: DxTemplateHost, injector: Injector, private _watcherHelper: WatcherHelper, private _idh: IterableDifferHelper, optionHost: NestedOptionHost) { super(elementRef, ngZone, templateHost, _watcherHelper); injector.get(EventsRegistrator); this._createEventEmitters([ { subscribe: 'disposing', emit: 'onDisposing' }, { subscribe: 'drawn', emit: 'onDrawn' }, { subscribe: 'exported', emit: 'onExported' }, { subscribe: 'exporting', emit: 'onExporting' }, { subscribe: 'fileSaving', emit: 'onFileSaving' }, { subscribe: 'incidentOccurred', emit: 'onIncidentOccurred' }, { subscribe: 'initialized', emit: 'onInitialized' }, { subscribe: 'optionChanged', emit: 'onOptionChanged' }, { subscribe: 'tooltipHidden', emit: 'onTooltipHidden' }, { subscribe: 'tooltipShown', emit: 'onTooltipShown' }, { emit: 'animationChange' }, { emit: 'backgroundColorChange' }, { emit: 'barSpacingChange' }, { emit: 'baseValueChange' }, { emit: 'elementAttrChange' }, { emit: 'endValueChange' }, { emit: 'exportChange' }, { emit: 'geometryChange' }, { emit: 'labelChange' }, { emit: 'loadingIndicatorChange' }, { emit: 'marginChange' }, { emit: 'paletteChange' }, { emit: 'pathModifiedChange' }, { emit: 'redrawOnResizeChange' }, { emit: 'relativeInnerRadiusChange' }, { emit: 'rtlEnabledChange' }, { emit: 'sizeChange' }, { emit: 'startValueChange' }, { emit: 'subtitleChange' }, { emit: 'themeChange' }, { emit: 'titleChange' }, { emit: 'tooltipChange' }, { emit: 'valuesChange' } ]); this._idh.setHost(this); optionHost.setHost(this); } protected _createInstance(element, options) { return new DxBarGauge(element, options); } ngOnDestroy() { this._destroyWidget(); } ngOnChanges(changes: SimpleChanges) { super.ngOnChanges(changes); this.setupChanges('palette', changes); this.setupChanges('values', changes); } setupChanges(prop: string, changes: SimpleChanges) { if (!(prop in this._optionsToUpdate)) { this._idh.setup(prop, changes); } } ngDoCheck() { this._idh.doCheck('palette'); this._idh.doCheck('values'); this._watcherHelper.checkWatchers(); super.ngDoCheck(); } _setOption(name: string, value: any) { let isSetup = this._idh.setupSingle(name, value); let isChanged = this._idh.getChanges(name, value) !== null; if (isSetup || isChanged) { super._setOption(name, value); } } } @NgModule({ imports: [ DxoAnimationModule, DxoExportModule, DxoGeometryModule, DxoLabelModule, DxoFontModule, DxoFormatModule, DxoLoadingIndicatorModule, DxoMarginModule, DxoSizeModule, DxoSubtitleModule, DxoTitleModule, DxoTooltipModule, DxoBorderModule, DxoShadowModule, DxTemplateModule ], declarations: [ DxBarGaugeComponent ], exports: [ DxBarGaugeComponent, DxoAnimationModule, DxoExportModule, DxoGeometryModule, DxoLabelModule, DxoFontModule, DxoFormatModule, DxoLoadingIndicatorModule, DxoMarginModule, DxoSizeModule, DxoSubtitleModule, DxoTitleModule, DxoTooltipModule, DxoBorderModule, DxoShadowModule, DxTemplateModule ], providers: [EventsRegistrator] }) export class DxBarGaugeModule { }