import { ChangeDetectorRef , Component , OnDestroy , OnInit } from '@angular/core' ; import { GadgetInstanceService } from '../../grid/grid.service' ; import { RuntimeService } from '../../services/runtime.service' ; import { GadgetPropertyService } from '../_common/gadget-property.service' ; import { EndPointService } from '../../configuration/tab-endpoint/endpoint.service' ; import { GadgetBase } from '../_common/gadget-base' ; import { timer } from 'rxjs' ; import { ObservableWebSocketService } from '../../services/websocket-service' ; import { ErrorHandler } from '../../error/error-handler' ; import { CPUChartMetric } from './cpu.model' ; import { Series } from '../_common/base-chart-models/series.model' ; import { OptionsService } from "../../configuration/tab-options/service" ; @ Component ( { selector : 'app-dynamic-component' , moduleId : module . id , templateUrl : './view.html' , styleUrls : [ '../_common/styles-gadget.css' ] } ) export class CPUMGadgetComponent extends GadgetBase implements OnDestroy , OnInit { gradient = true ; legend = false ; xAxis = true ; yAxis = true ; showGridLines = true ; showXAxisLabel = true ; showYAxisLabel = false ; xAxisLabel = 'Available CPUs' ; yAxisLabel = 'Percent Utilization' ; view : any [ ] ; chartData : any [ ] = [ ] ; colorScheme : any = { domain : [ '#0AFF16' , '#0d5481' ] } ; webSocket : any ; waitForConnectionDelay = 2000 ; constructor ( protected _runtimeService , protected _gadgetInstanceService , protected _propertyService , protected _endPointService , private _changeDetectionRef , private _webSocketService , protected _optionsService ) { super ( _runtimeService , _gadgetInstanceService , _propertyService , _endPointService , _changeDetectionRef , _optionsService ) ; } public preRun ( ) { } public run ( ) { this . initializeRunState ( false ) ; this . webSocket = this . _webSocketService . createObservableWebSocket ( this . getEndPoint ( ) . address ) . subscribe ( data => { const dataObject = JSON . parse ( data ) ; this . updateGraph ( dataObject ) ; } , error => { type { { status : string ; statusText : string ; resource : string } } const errMsg = { status : error . code + '' , statusText : ErrorHandler . getWebSocketErrorReason ( error ) , resource : this . getEndPoint ( ) . address } ; this . handleError ( ErrorHandler . getErrorObject ( errMsg ) ) ; } , ( ) => { if ( this . inRun ) { type { { status : string ; statusText : string ; resource : string } } const errMsg = { status : 'disconnected' , statusText : 'Service was interrupted while the gadget was running!' , resource : this . getEndPoint ( ) . address } ; this . handleError ( ErrorHandler . getErrorObject ( errMsg ) ) ; } } ) ; type { Observable < number > } const _timer = timer ( this . waitForConnectionDelay ) ; _timer . subscribe ( t => { this . _webSocketService . sendMessage ( 'start' ) ; this . setInRunState ( ) ; } ) ; } public stop ( ) { this . setStopState ( true ) ; try { this . _webSocketService . sendMessage ( 'stop' ) ; this . webSocket . unsubscribe ( ) ; this . updateGraph ( null ) ; } catch ( error ) { this . handleError ( error ) ; } this . actionInitiated = false ; } public updateGraph ( cpus ) { /** todo
         * i18n
         */ const chartData = [ ] ; let id = 0 ; if ( cpus ) { cpus . forEach ( cpuData => { const value = cpuData [ 'utilPct' ] ; const series = [ ] ; series . push ( new Series ( 'used' , value ) ) ; series . push ( new Series ( 'available' , 100 - value ) ) ; type { CPUChartMetric } const cpuChartMetric = new CPUChartMetric ( cpuData , 'CPU ' + id ++ , series ) ; chartData . push ( cpuChartMetric ) ; } ) ; } Object . assign ( this , { chartData } ) ; } public updateData ( data ) { } public updateProperties ( updatedProperties ) { /**
         * todo
         *  A similar operation exists on the procmman-config-service
         *  whenever the property page form is saved, the in memory board model
         *  is updated as well as the gadget instance properties
         *  which is what the code below does. This can be eliminated with code added to the
         *  config service or the property page service.
         *
         * **/ const updatedPropsObject = JSON . parse ( updatedProperties ) ; this . propertyPages . forEach ( function ( propertyPage ) { for ( let x = 0 ; x < propertyPage . properties . length ; x ++ ) { for ( const prop in updatedPropsObject ) { if ( updatedPropsObject . hasOwnProperty ( prop ) ) { if ( prop === propertyPage . properties [ x ] . key ) { propertyPage . properties [ x ] . value = updatedPropsObject [ prop ] ; } } } } } ) ; this . title = updatedPropsObject . title ; this . gradient = updatedPropsObject . gradient ; this . legend = updatedPropsObject . legend ; this . xAxis = updatedPropsObject . xAxis ; this . yAxis = updatedPropsObject . yAxis ; this . showGridLines = updatedPropsObject . showGridLines ; this . showXAxisLabel = updatedPropsObject . showXAxisLabel ; this . showYAxisLabel = updatedPropsObject . showYAxisLabel ; this . setEndPoint ( updatedPropsObject . endpoint ) ; this . showOperationControls = true ; } public ngOnDestroy ( ) { this . stop ( ) ; } }