@ -14,26 +14,23 @@
/// limitations under the License.
/// limitations under the License.
///
///
import { Component , EventEmitter , Input , OnInit , Output , ViewChild , View Encapsulation } from '@angular/core' ;
import { Component , EventEmitter , Input , OnInit , Output , ViewEncapsulation } from '@angular/core' ;
import { AllMeasures , isNotEmptyTbUnits , TbUnit , UnitInfo , UnitSystem } from '@shared/models/unit.models' ;
import { AllMeasures , TbUnit , UnitInfo , UnitSystem } from '@shared/models/unit.models' ;
import { TbPopoverComponent } from '@shared/components/popover.component' ;
import { TbPopoverComponent } from '@shared/components/popover.component' ;
import { FormBuilder , Validators } from '@angular/forms' ;
import { FormBuilder , Validators } from '@angular/forms' ;
import { takeUntilDestroyed } from '@angular/core/rxjs-interop' ;
import { takeUntilDestroyed } from '@angular/core/rxjs-interop' ;
import { UnitService } from '@core/services/unit.service' ;
import { UnitService } from '@core/services/unit.service' ;
import { debounceTime , first } from 'rxjs/operators' ;
import { debounceTime } from 'rxjs/operators' ;
import { isUndefinedOrNull } from '@core/utils' ;
import { isUndefinedOrNull } from '@core/utils' ;
import type { UnitInputComponent } from '@shared/components/unit-input.component' ;
@Component ( {
@Component ( {
selector : 'tb-covert-unit-settings-panel' ,
selector : 'tb-covert-unit-settings-panel' ,
templateUrl : './convert- unit-settings-panel.component.html' ,
templateUrl : './unit-settings-panel.component.html' ,
styleUrls : [ './convert- unit-settings-panel.component.scss' ] ,
styleUrls : [ './unit-settings-panel.component.scss' ] ,
providers : [ ] ,
providers : [ ] ,
encapsulation : ViewEncapsulation.None
encapsulation : ViewEncapsulation.None
} )
} )
export class ConvertUnitSettingsPanelComponent implements OnInit {
export class UnitSettingsPanelComponent implements OnInit {
@ViewChild ( 'unitFrom' , { static : true } ) unitFrom : UnitInputComponent ;
@Input ( )
@Input ( )
unit : TbUnit ;
unit : TbUnit ;
@ -57,7 +54,7 @@ export class ConvertUnitSettingsPanelComponent implements OnInit {
targetMeasure : AllMeasures ;
targetMeasure : AllMeasures ;
convertUnit Form = this . fb . group ( {
unitSetting Form = this . fb . group ( {
from : [ '' ] ,
from : [ '' ] ,
convertUnit : [ true ] ,
convertUnit : [ true ] ,
METRIC : [ '' ] ,
METRIC : [ '' ] ,
@ -66,32 +63,32 @@ export class ConvertUnitSettingsPanelComponent implements OnInit {
} )
} )
constructor (
constructor (
private popover : TbPopoverComponent < Convert UnitSettingsPanelComponent> ,
private popover : TbPopoverComponent < UnitSettingsPanelComponent > ,
private fb : FormBuilder ,
private fb : FormBuilder ,
private unitService : UnitService
private unitService : UnitService
) {
) {
this . convertUnit Form. get ( 'from' ) . valueChanges . pipe (
this . unitSetting Form. get ( 'from' ) . valueChanges . pipe (
debounceTime ( 200 ) ,
debounceTime ( 200 ) ,
takeUntilDestroyed ( )
takeUntilDestroyed ( )
) . subscribe ( unit = > {
) . subscribe ( unit = > {
const unitDescription = this . unitService . getUnitInfo ( unit ) ;
const unitDescription = this . unitService . getUnitInfo ( unit ) ;
const units = unitDescription ? this . unitService . getUnits ( unitDescription . measure ) : [ ] ;
const units = unitDescription ? this . unitService . getUnits ( unitDescription . measure ) : [ ] ;
if ( unitDescription && units . length > 1 ) {
if ( unitDescription && units . length > 1 ) {
this . convertUnit Form. get ( 'convertUnit' ) . enable ( { emitEvent : true } ) ;
this . unitSetting Form. get ( 'convertUnit' ) . enable ( { emitEvent : true } ) ;
this . targetMeasure = unitDescription . measure ;
this . targetMeasure = unitDescription . measure ;
if ( unitDescription . system === UnitSystem . IMPERIAL ) {
if ( unitDescription . system === UnitSystem . IMPERIAL ) {
this . convertUnit Form. get ( 'METRIC' ) . setValue ( this . unitService . getDefaultUnit ( this . targetMeasure , UnitSystem . METRIC ) , { emitEvent : false } ) ;
this . unitSetting Form. get ( 'METRIC' ) . setValue ( this . unitService . getDefaultUnit ( this . targetMeasure , UnitSystem . METRIC ) , { emitEvent : false } ) ;
this . convertUnit Form. get ( 'IMPERIAL' ) . setValue ( unit , { emitEvent : false } ) ;
this . unitSetting Form. get ( 'IMPERIAL' ) . setValue ( unit , { emitEvent : false } ) ;
this . convertUnit Form. get ( 'HYBRID' ) . setValue ( unit , { emitEvent : false } ) ;
this . unitSetting Form. get ( 'HYBRID' ) . setValue ( unit , { emitEvent : false } ) ;
} else {
} else {
this . convertUnit Form. get ( 'METRIC' ) . setValue ( unit , { emitEvent : false } ) ;
this . unitSetting Form. get ( 'METRIC' ) . setValue ( unit , { emitEvent : false } ) ;
this . convertUnit Form. get ( 'IMPERIAL' ) . setValue ( this . unitService . getDefaultUnit ( this . targetMeasure , UnitSystem . IMPERIAL ) , { emitEvent : false } ) ;
this . unitSetting Form. get ( 'IMPERIAL' ) . setValue ( this . unitService . getDefaultUnit ( this . targetMeasure , UnitSystem . IMPERIAL ) , { emitEvent : false } ) ;
this . convertUnit Form. get ( 'HYBRID' ) . setValue ( unit , { emitEvent : false } ) ;
this . unitSetting Form. get ( 'HYBRID' ) . setValue ( unit , { emitEvent : false } ) ;
}
}
} else {
} else {
this . convertUnit Form. get ( 'convertUnit' ) . setValue ( false , { onlySelf : true } ) ;
this . unitSetting Form. get ( 'convertUnit' ) . setValue ( false , { onlySelf : true } ) ;
this . convertUnit Form. get ( 'convertUnit' ) . disable ( { emitEvent : false } ) ;
this . unitSetting Form. get ( 'convertUnit' ) . disable ( { emitEvent : false } ) ;
this . convertUnit Form. patchValue ( {
this . unitSetting Form. patchValue ( {
METRIC : '' ,
METRIC : '' ,
IMPERIAL : '' ,
IMPERIAL : '' ,
HYBRID : ''
HYBRID : ''
@ -99,17 +96,17 @@ export class ConvertUnitSettingsPanelComponent implements OnInit {
}
}
} )
} )
this . convertUnit Form. get ( 'convertUnit' ) . valueChanges . pipe (
this . unitSetting Form. get ( 'convertUnit' ) . valueChanges . pipe (
takeUntilDestroyed ( )
takeUntilDestroyed ( )
) . subscribe ( value = > {
) . subscribe ( value = > {
if ( value ) {
if ( value ) {
this . convertUnit Form. get ( 'METRIC' ) . enable ( { emitEvent : false } ) ;
this . unitSetting Form. get ( 'METRIC' ) . enable ( { emitEvent : false } ) ;
this . convertUnit Form. get ( 'IMPERIAL' ) . enable ( { emitEvent : false } ) ;
this . unitSetting Form. get ( 'IMPERIAL' ) . enable ( { emitEvent : false } ) ;
this . convertUnit Form. get ( 'HYBRID' ) . enable ( { emitEvent : false } ) ;
this . unitSetting Form. get ( 'HYBRID' ) . enable ( { emitEvent : false } ) ;
} else {
} else {
this . convertUnit Form. get ( 'METRIC' ) . disable ( { emitEvent : false } ) ;
this . unitSetting Form. get ( 'METRIC' ) . disable ( { emitEvent : false } ) ;
this . convertUnit Form. get ( 'IMPERIAL' ) . disable ( { emitEvent : false } ) ;
this . unitSetting Form. get ( 'IMPERIAL' ) . disable ( { emitEvent : false } ) ;
this . convertUnit Form. get ( 'HYBRID' ) . disable ( { emitEvent : false } ) ;
this . unitSetting Form. get ( 'HYBRID' ) . disable ( { emitEvent : false } ) ;
}
}
} ) ;
} ) ;
}
}
@ -117,27 +114,27 @@ export class ConvertUnitSettingsPanelComponent implements OnInit {
ngOnInit() {
ngOnInit() {
let unitDescription : UnitInfo ;
let unitDescription : UnitInfo ;
if ( this . required ) {
if ( this . required ) {
this . convertUnit Form. get ( 'from' ) . setValidators ( Validators . required ) ;
this . unitSetting Form. get ( 'from' ) . setValidators ( Validators . required ) ;
}
}
if ( typeof this . unit === 'string' ) {
if ( typeof this . unit === 'string' ) {
this . convertUnit Form. get ( 'convertUnit' ) . setValue ( false , { onlySelf : true } ) ;
this . unitSetting Form. get ( 'convertUnit' ) . setValue ( false , { onlySelf : true } ) ;
this . convertUnit Form. get ( 'from' ) . setValue ( this . unit ) ;
this . unitSetting Form. get ( 'from' ) . setValue ( this . unit ) ;
unitDescription = this . unitService . getUnitInfo ( this . unit ) ;
unitDescription = this . unitService . getUnitInfo ( this . unit ) ;
} else if ( isUndefinedOrNull ( this . unit ) ) {
} else if ( isUndefinedOrNull ( this . unit ) ) {
this . convertUnit Form. get ( 'convertUnit' ) . setValue ( false , { onlySelf : true } ) ;
this . unitSetting Form. get ( 'convertUnit' ) . setValue ( false , { onlySelf : true } ) ;
this . convertUnit Form. get ( 'from' ) . setValue ( null ) ;
this . unitSetting Form. get ( 'from' ) . setValue ( null ) ;
} else {
} else {
this . convertUnit Form. patchValue ( this . unit , { emitEvent : false } ) ;
this . unitSetting Form. patchValue ( this . unit , { emitEvent : false } ) ;
unitDescription = this . unitService . getUnitInfo ( this . unit . from ) ;
unitDescription = this . unitService . getUnitInfo ( this . unit . from ) ;
}
}
if ( unitDescription ? . measure ) {
if ( unitDescription ? . measure ) {
this . targetMeasure = unitDescription . measure ;
this . targetMeasure = unitDescription . measure ;
} else {
} else {
this . convertUnit Form. get ( 'convertUnit' ) . disable ( { emitEvent : false } ) ;
this . unitSetting Form. get ( 'convertUnit' ) . disable ( { emitEvent : false } ) ;
}
}
if ( this . disabled ) {
if ( this . disabled ) {
this . convertUnit Form. disable ( { emitEvent : false } ) ;
this . unitSetting Form. disable ( { emitEvent : false } ) ;
}
}
}
}
@ -150,12 +147,12 @@ export class ConvertUnitSettingsPanelComponent implements OnInit {
}
}
applyUnitSettings() {
applyUnitSettings() {
if ( this . convertUnit Form. value . convertUnit ) {
if ( this . unitSetting Form. value . convertUnit ) {
const formValue = this . convertUnit Form. value ;
const formValue = this . unitSetting Form. value ;
delete formValue . convertUnit ;
delete formValue . convertUnit ;
this . unitSettingsApplied . emit ( formValue as TbUnit ) ;
this . unitSettingsApplied . emit ( formValue as TbUnit ) ;
} else {
} else {
this . unitSettingsApplied . emit ( this . convertUnit Form. value . from ) ;
this . unitSettingsApplied . emit ( this . unitSetting Form. value . from ) ;
}
}
}
}
}
}